/* BPYC Mobile UX M3 - complete public-facing mobile experience.
   Desktop presentation remains authoritative above the phone breakpoint. */
/* BEGIN bpyc-public-mobile-m3 */

@media(max-width:760px){
    /* The share modal is portaled to body. Bind its shell/backdrop to the real
       viewport so no document-width or scrollbar gutter can expose a side strip. */
    .public-share-modal{
        left:0!important;
        right:0!important;
        width:auto!important;
        max-width:none!important;
        min-width:0!important;
        margin:0!important;
        box-sizing:border-box;
    }

    .public-share-backdrop{
        position:fixed!important;
        inset:0!important;
        width:auto!important;
        height:auto!important;
        max-width:none!important;
        margin:0!important;
    }

    body.public-site{
        overflow-x:hidden;
    }

    .public-site .public-shell{
        min-width:0;
    }

    .public-site :where(
        .section-page-hero,
        .section-page-body,
        .figma-section,
        .section-auth-page,
        .legal-page-body
    ){
        overflow-x:clip;
    }

    /* Shared public hero/detail system */
    .section-page-hero{
        padding-top:28px;
        padding-bottom:28px;
    }

    .section-page-hero-detail{
        padding-top:20px;
        padding-bottom:24px;
    }

    .section-page-hero-inner,
    .section-page-detail-heading,
    .fundraising-detail-hero-grid{
        display:grid;
        grid-template-columns:1fr;
        gap:18px;
    }

    .section-page-hero-copy,
    .section-page-detail-heading>div,
    .fundraising-detail-hero-grid>div{
        min-width:0;
    }

    .section-page-hero-copy h1,
    .section-page-detail-heading h1,
    .fundraising-detail-hero-grid h1{
        max-width:none;
        font-size:clamp(34px,10vw,46px);
        line-height:1.02;
        overflow-wrap:anywhere;
    }

    .section-page-hero-copy>p,
    .section-page-detail-heading>div>p{
        max-width:none;
        font-size:15px;
        line-height:1.65;
    }

    .section-page-hero-card,
    .about-page-hero-card,
    .fundraising-detail-total-card{
        width:100%;
        max-width:none;
        padding:17px;
        border-radius:18px;
    }

    .section-page-hero-chips{
        display:flex;
        gap:7px;
        max-width:100%;
        margin-inline:-2px;
        padding:2px 2px 5px;
        overflow-x:auto;
        scroll-snap-type:x proximity;
        overscroll-behavior-inline:contain;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:none;
    }

    .section-page-hero-chips::-webkit-scrollbar{
        display:none;
    }

    .section-page-hero-chips>span{
        flex:0 0 auto;
        min-height:34px;
        display:inline-flex;
        align-items:center;
        scroll-snap-align:start;
        white-space:nowrap;
    }

    .section-page-back{
        min-height:44px;
        display:inline-flex;
        align-items:center;
        margin-bottom:8px;
    }

    .section-page-body{
        padding-top:22px;
        padding-bottom:38px;
    }

    .section-page-toolbar,
    .section-page-toolbar-simple{
        align-items:flex-start;
        flex-direction:column;
        gap:10px;
        margin-bottom:16px;
    }

    .section-page-toolbar>div,
    .section-page-toolbar-simple>div{
        width:100%;
        min-width:0;
    }

    .section-page-filters{
        width:calc(100% + 24px);
        margin-inline:-12px;
        padding-inline:12px;
    }

    .section-page-empty{
        padding:34px 18px;
        border-radius:18px;
    }

    .section-page-pagination{
        margin-top:20px;
    }

    .section-detail-layout,
    .fundraising-detail-layout,
    .legal-page-shell,
    .section-feed-layout{
        display:grid;
        grid-template-columns:1fr;
        gap:16px;
    }

    .section-detail-main,
    .section-detail-side,
    .fundraising-detail-main,
    .fundraising-donation-side,
    .section-feed-side{
        min-width:0;
    }

    .section-content-card,
    .section-info-card,
    .section-action-card,
    .section-article-card,
    .legal-page-card{
        padding:17px;
        border-radius:18px;
    }

    .section-action-buttons{
        display:grid;
        grid-template-columns:1fr;
        gap:8px;
    }

    .section-action-buttons>*{
        width:100%;
        min-height:48px;
    }

    .section-prose,
    .section-prose-article,
    .legal-page-prose{
        font-size:15px;
        line-height:1.75;
    }

    .section-prose :where(img,video,iframe),
    .section-prose-article :where(img,video,iframe),
    .legal-page-prose :where(img,video,iframe){
        max-width:100%;
        height:auto;
    }

    .section-article-wrap,
    .section-article-shell{
        width:100%;
        max-width:none;
    }

    .section-article-featured-media{
        border-radius:16px;
        overflow:hidden;
    }

    .section-article-share-row,
    .section-share-row{
        width:100%;
    }

    /* Home */
    .figma-context-strip{
        height:40px;
        overflow:hidden;
    }

    .figma-context-inner{
        width:min(100% - 28px,1232px);
        max-width:1232px;
        height:40px;
        min-height:40px;
        margin-inline:auto;
        padding:0;
        align-items:center;
        display:block;
    }

    .figma-context-static{
        display:none;
    }

    .figma-context-marquee{
        display:block;
        width:100%;
        height:40px;
        overflow:hidden;
    }

    .figma-context-marquee-track,
    .figma-context-marquee-run{
        display:flex;
        align-items:center;
        width:max-content;
    }

    .figma-context-marquee-track{
        height:40px;
        animation:bpyc-context-ticker 24s linear infinite;
        will-change:transform;
    }

    .figma-context-marquee-run{
        flex:none;
        gap:28px;
        padding-right:28px;
    }

    .figma-context-welcome,
    .figma-next-gathering{
        min-width:0;
        max-width:none;
        font-size:11px;
        white-space:nowrap;
    }

    .figma-next-gathering>a{
        overflow:visible;
        text-overflow:clip;
    }

    @keyframes bpyc-context-ticker{
        from{transform:translateX(0)}
        to{transform:translateX(-50%)}
    }

    .figma-hero{
        padding-top:28px;
        padding-bottom:30px;
    }

    .figma-hero-grid{
        grid-template-columns:1fr;
        gap:24px;
    }

    .figma-display-title{
        font-size:clamp(45px,14vw,66px);
        line-height:.94;
    }

    .figma-hero-intro{
        font-size:15px;
        line-height:1.7;
    }

    .figma-chip-row{
        max-width:100%;
        overflow-x:auto;
        scroll-snap-type:x proximity;
        scrollbar-width:none;
    }

    .figma-chip-row::-webkit-scrollbar{
        display:none;
    }

    .figma-chip{
        flex:0 0 auto;
        scroll-snap-align:start;
    }

    .figma-hero-actions{
        display:grid;
        grid-template-columns:1fr;
        gap:9px;
    }

    .figma-hero-actions>*{
        width:100%;
        min-height:48px;
        justify-content:center;
    }

    .figma-scripture-card{
        padding:14px;
        border-radius:16px;
    }

    .figma-hero-visual{
        width:100%;
        max-width:440px;
        margin-inline:auto;
    }

    .figma-polaroid{
        max-width:100%;
    }

    .figma-metrics{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:9px;
    }

    .figma-metric{
        min-width:0;
        padding:14px 10px;
    }

    .figma-metric-number{
        font-size:27px;
    }

    .figma-section{
        padding-top:36px;
        padding-bottom:36px;
    }

    .figma-section-head,
    .figma-events-head,
    .resources-head,
    .figma-centered-head{
        align-items:flex-start;
        flex-direction:column;
        gap:9px;
        margin-bottom:16px;
    }

    .figma-section-copy h2,
    .figma-centered-head h2,
    .resources-head h2{
        font-size:clamp(30px,9vw,40px);
        line-height:1.05;
    }

    .figma-round-link{
        min-height:44px;
        display:inline-flex;
        align-items:center;
    }

    .home-about-story-grid,
    .public-about-preview-grid,
    .figma-feed-grid,
    .figma-join-grid{
        grid-template-columns:1fr;
        gap:18px;
    }

    .home-about-story-copy,
    .home-about-story-visual,
    .public-about-preview-card{
        min-width:0;
    }

    .home-about-story-actions,
    .figma-registration-actions{
        display:grid;
        grid-template-columns:1fr;
        gap:8px;
    }

    .home-about-story-actions>*,
    .figma-registration-actions>*{
        width:100%;
        min-height:48px;
    }

    .home-about-story-facts,
    .home-about-mini-grid{
        grid-template-columns:1fr;
        gap:8px;
    }

    /* Swipe rails on the home page communicate that more content is available. */
    .figma-landing-page .figma-event-grid,
    .figma-landing-page .home-gallery-album-grid{
        display:flex;
        gap:12px;
        width:calc(100% + 24px);
        margin-inline:-12px;
        padding:2px 12px 10px;
        overflow-x:auto;
        scroll-snap-type:x mandatory;
        overscroll-behavior-inline:contain;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:none;
    }

    .figma-landing-page .figma-event-grid::-webkit-scrollbar,
    .figma-landing-page .home-gallery-album-grid::-webkit-scrollbar{
        display:none;
    }

    .figma-landing-page .figma-event-card,
    .figma-landing-page .home-gallery-album-card{
        flex:0 0 min(84vw,330px);
        scroll-snap-align:start;
    }

    .figma-ministry-grid,
    .figma-resource-grid{
        grid-template-columns:1fr;
        gap:11px;
    }

    .figma-ministry-card,
    .figma-resource-card,
    .figma-announcement-card{
        min-width:0;
        border-radius:17px;
    }

    .figma-registration-card{
        padding:18px;
        border-radius:20px;
    }

    /* About */
    .about-page-jump-section{
        padding-block:18px;
    }

    .about-homepage-jump-grid{
        display:flex;
        gap:11px;
        width:calc(100% + 24px);
        margin-inline:-12px;
        padding:2px 12px 9px;
        overflow-x:auto;
        scroll-snap-type:x mandatory;
        overscroll-behavior-inline:contain;
        scrollbar-width:none;
    }

    .about-homepage-jump-grid::-webkit-scrollbar{
        display:none;
    }

    .about-homepage-jump{
        flex:0 0 min(82vw,320px);
        min-height:150px;
        scroll-snap-align:start;
    }

    .about-homepage-story-grid,
    .about-homepage-priest-card{
        grid-template-columns:1fr;
        gap:20px;
    }

    .about-homepage-story-visual,
    .about-homepage-story-copy,
    .about-homepage-priest-visual,
    .about-homepage-priest-copy{
        min-width:0;
    }

    .about-homepage-story-copy h2,
    .about-homepage-council-head h2,
    .about-homepage-priest-copy h2{
        font-size:clamp(31px,9vw,40px);
        line-height:1.05;
    }

    .about-homepage-facts{
        grid-template-columns:1fr;
        gap:8px;
    }

    .about-homepage-council-head{
        align-items:flex-start;
        flex-direction:column;
        gap:10px;
    }

    .about-homepage-count-pill{
        align-self:flex-start;
    }

    /* Mobile officer roster behaves as a discoverable snap slider. */
    .about-officer-grid,
    .about-homepage-officer-grid{
        display:flex;
        gap:12px;
        width:calc(100% + 24px);
        margin-inline:-12px;
        padding:3px 12px 12px;
        overflow-x:auto;
        scroll-snap-type:x mandatory;
        overscroll-behavior-inline:contain;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:none;
    }

    .about-officer-grid::-webkit-scrollbar,
    .about-homepage-officer-grid::-webkit-scrollbar{
        display:none;
    }

    .about-officer-card{
        flex:0 0 min(82vw,315px);
        min-width:0;
        scroll-snap-align:center;
    }

    .about-homepage-priest-card{
        padding:17px;
        border-radius:20px;
    }

    /* Event index/detail */
    .section-page-event-grid{
        grid-template-columns:1fr;
        gap:13px;
    }

    .section-page-event-card{
        min-width:0;
    }

    .figma-event-image{
        min-height:190px;
    }

    .figma-event-footer{
        align-items:flex-start;
        flex-direction:column;
        gap:9px;
    }

    .figma-event-footer .public-card-actions{
        width:100%;
    }

    .section-volunteer-grid{
        grid-template-columns:1fr;
        gap:11px;
    }

    .section-volunteer-card{
        min-width:0;
        padding:15px;
    }

    .section-volunteer-action,
    .section-text-button{
        min-height:44px;
    }

    /* Announcements */
    .section-feed-pastoral{
        position:static;
    }

    .section-announcement-list{
        gap:11px;
    }

    .section-announcement-card,
    .section-announcement-card.has-media{
        grid-template-columns:1fr;
        gap:12px;
        padding:15px;
    }

    .section-announcement-card-media{
        width:100%;
        order:-1;
    }

    .section-inline-featured-media{
        width:100%;
        aspect-ratio:16/10;
    }

    .section-announcement-card .public-card-actions{
        width:100%;
    }

    /* Gallery */
    .section-album-grid{
        grid-template-columns:1fr;
        gap:13px;
    }

    .section-album-card{
        min-width:0;
        border-radius:18px;
    }

    .section-album-cover{
        min-height:210px;
    }

    .section-album-body .public-card-actions{
        width:100%;
    }

    .section-gallery-context{
        align-items:flex-start;
        flex-direction:column;
        gap:6px;
        margin-bottom:14px;
    }

    .section-media-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:9px;
    }

    .section-media-card{
        min-width:0;
        border-radius:14px;
        overflow:hidden;
    }

    .section-media-frame{
        aspect-ratio:1/1;
    }

    .section-media-frame :where(img,video){
        width:100%;
        height:100%;
        object-fit:cover;
    }

    .section-media-card figcaption{
        padding:9px 10px 4px;
        font-size:12px;
        line-height:1.45;
    }

    .section-media-share{
        padding:7px 9px 10px;
    }

    .section-media-share .public-share-trigger{
        width:100%;
        min-height:42px;
        justify-content:center;
    }

    /* GLightbox: keep controls reachable around phone safe areas. */
    .glightbox-container .gslide-description{
        max-height:30dvh;
        overflow:auto;
    }

    .glightbox-container .gclose{
        top:max(8px,env(safe-area-inset-top));
        right:max(8px,env(safe-area-inset-right));
        width:44px;
        height:44px;
    }

    .glightbox-container .gnext,
    .glightbox-container .gprev{
        width:44px;
        height:52px;
    }

    /* Resources */
    .section-resource-grid{
        grid-template-columns:1fr;
        gap:11px;
    }

    .section-resource-card{
        min-width:0;
    }

    .figma-resource-footer{
        align-items:flex-start;
        flex-direction:column;
        gap:9px;
    }

    .figma-resource-footer>a{
        min-height:44px;
        display:inline-flex;
        align-items:center;
    }

    /* Fundraising */
    .fundraising-campaign-grid,
    .fundraising-step-grid,
    .fundraising-payment-grid{
        grid-template-columns:1fr;
        gap:12px;
    }

    .fundraising-campaign-card{
        min-width:0;
        border-radius:18px;
    }

    .fundraising-campaign-media{
        min-height:205px;
    }

    .fundraising-detail-cover{
        border-radius:18px;
        overflow:hidden;
    }

    .fundraising-progress-copy{
        align-items:flex-start;
        flex-direction:column;
        gap:4px;
    }

    .fundraising-payment-card,
    .fundraising-donation-card,
    .fundraising-verification-guide{
        padding:16px;
        border-radius:18px;
    }

    .fundraising-field-row{
        grid-template-columns:1fr;
        gap:11px;
    }

    .fundraising-donation-card input:not([type="checkbox"]):not([type="radio"]),
    .fundraising-donation-card select,
    .fundraising-donation-card textarea{
        width:100%;
        min-width:0;
    }

    .fundraising-proof-upload{
        padding:14px;
    }

    .fundraising-submit{
        width:100%;
        min-height:50px;
    }

    .fundraising-side-trust{
        position:static;
    }

    /* Public meeting */
    .section-page-hero-detail+.section-page-body .section-info-list{
        min-width:0;
    }

    /* Legal and generic CMS pages */
    .legal-page-hero{
        padding-top:22px;
        padding-bottom:22px;
    }

    .legal-page-hero-inner{
        gap:10px;
    }

    .legal-page-heading{
        font-size:clamp(34px,10vw,44px);
        line-height:1.05;
    }

    .legal-page-aside{
        order:2;
    }

    .legal-page-aside-card{
        position:static;
        padding:16px;
    }

    .section-article-card{
        overflow:hidden;
    }

    /* Authentication / registration */
    .section-auth-page{
        padding-top:26px;
        padding-bottom:38px;
    }

    .section-auth-grid,
    .section-signup-grid{
        grid-template-columns:1fr;
        gap:20px;
    }

    .section-auth-story{
        min-width:0;
    }

    .section-auth-story h1{
        font-size:clamp(36px,11vw,48px);
        line-height:1.02;
    }

    .section-auth-scripture,
    .section-auth-points{
        margin-top:14px;
    }

    .section-auth-card,
    .section-signup-card{
        width:100%;
        max-width:none;
        padding:18px;
        border-radius:20px;
    }

    .section-auth-card-head{
        align-items:flex-start;
        gap:11px;
    }

    .section-auth-form,
    .section-auth-form-grid{
        grid-template-columns:1fr;
        gap:12px;
    }

    .section-auth-form-grid .wide,
    .section-auth-form-grid>*{
        grid-column:auto;
    }

    .section-auth-submit,
    .section-google-auth-button{
        min-height:50px;
    }

    .section-auth-verification-actions{
        display:grid;
        grid-template-columns:1fr;
        gap:8px;
    }

    .section-auth-verification-actions>*{
        width:100%;
        min-height:48px;
    }

    .section-auth-compact-shell{
        width:100%;
        max-width:520px;
    }

    /* Footer */

    /* Compact footer: preserve every important destination without a very tall phone footer. */
    .formal-footer:before{
        display:none;
    }

    .formal-footer .figma-footer-inner{
        padding-top:24px;
    }

    .formal-footer-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:18px 16px;
    }

    .formal-footer-brand{
        grid-column:1/-1!important;
    }

    .formal-footer .figma-footer-brand{
        gap:10px;
    }

    .formal-footer .figma-footer-logo{
        width:42px;
        height:42px;
        border-radius:12px;
    }

    .formal-footer-wordmark strong{
        font-size:14px;
        line-height:18px;
    }

    .formal-footer-wordmark small{
        font-size:10px;
    }

    .formal-footer-brand>p{
        max-width:none;
        margin:10px 0 4px;
        font-size:11px;
        line-height:17px;
    }

    .formal-footer-location{
        font-size:9px;
        line-height:14px;
    }

    .formal-footer-socials{
        gap:7px;
        margin-top:10px;
    }

    .formal-footer-socials a{
        width:34px;
        height:34px;
        border-radius:10px;
    }

    .formal-footer-column{
        gap:4px;
    }

    .formal-footer-column h2{
        margin:0 0 5px;
        font-size:10px;
        line-height:15px;
    }

    .formal-footer-column>a{
        font-size:10px;
        line-height:16px;
    }

    .formal-footer-contact{
        grid-column:1/-1;
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:6px 14px;
    }

    .formal-footer-contact h2{
        grid-column:1/-1;
    }

    .formal-footer-contact>a,
    .formal-footer-hours{
        grid-template-columns:18px minmax(0,1fr);
        gap:6px;
        font-size:10px;
        line-height:15px;
    }

    .formal-footer-contact>a>span:first-child,
    .formal-footer-hours>span:first-child{
        width:18px;
        height:18px;
    }

    .formal-footer-legal{
        grid-column:auto!important;
    }

    .formal-footer-legal a{
        padding:4px 0;
    }

    .formal-footer-bottom{
        gap:3px;
        margin-top:18px;
        padding:12px 0 max(14px,env(safe-area-inset-bottom));
    }

    .formal-footer-bottom>div{
        gap:1px;
    }

    .formal-footer-bottom strong{
        font-size:9px;
    }

    .formal-footer-note{
        display:none;
    }

    .formal-footer-column{
        min-width:0;
    }

    .formal-footer-socials{
        flex-wrap:wrap;
    }

    .formal-footer-bottom{
        align-items:flex-start;
        flex-direction:column;
        gap:8px;
        padding-bottom:max(16px,env(safe-area-inset-bottom));
    }
}

@media(max-width:520px){

    .formal-footer-brand>p{
        display:none;
    }

    .formal-footer-location{
        margin-top:7px;
    }

    .formal-footer-hours{
        display:none;
    }

    .formal-footer-contact{
        grid-template-columns:1fr;
        gap:5px;
    }

    .formal-footer-contact h2{
        margin-bottom:1px;
    }
    .section-page-hero{
        padding-top:24px;
        padding-bottom:24px;
    }

    .section-page-hero-copy h1,
    .section-page-detail-heading h1,
    .fundraising-detail-hero-grid h1{
        font-size:36px;
    }

    .section-page-hero-card,
    .about-page-hero-card,
    .fundraising-detail-total-card,
    .section-content-card,
    .section-info-card,
    .section-action-card,
    .section-article-card,
    .legal-page-card{
        padding:15px;
    }

    .figma-display-title{
        font-size:48px;
    }

    .figma-metrics{
        gap:7px;
    }

    .figma-metric{
        padding:12px 8px;
    }

    .figma-landing-page .figma-event-card,
    .figma-landing-page .home-gallery-album-card,
    .about-homepage-jump,
    .about-officer-card{
        flex-basis:86vw;
    }

    .figma-event-image{
        min-height:175px;
    }

    .section-media-grid{
        gap:7px;
    }

    .section-media-card figcaption{
        font-size:11px;
    }

    .section-auth-card,
    .section-signup-card{
        padding:16px;
    }

    .section-auth-story h1{
        font-size:38px;
    }
}

@media(max-width:390px){
    .section-media-grid{
        grid-template-columns:1fr;
        gap:11px;
    }

    .section-media-frame{
        aspect-ratio:4/3;
    }

    .figma-metrics{
        grid-template-columns:1fr 1fr;
    }

    .section-page-hero-chips>span{
        font-size:11px;
    }

    .fundraising-payment-card,
    .fundraising-donation-card,
    .fundraising-verification-guide{
        padding:14px;
    }

    .public-card-actions{
        display:grid;
        grid-template-columns:1fr;
        width:100%;
    }

    .public-card-actions>*{
        width:100%;
    }
}

@media(max-width:340px){
    .figma-display-title{
        font-size:43px;
    }

    .section-page-hero-copy h1,
    .section-page-detail-heading h1,
    .legal-page-heading,
    .fundraising-detail-hero-grid h1{
        font-size:32px;
    }

    .figma-metric-number{
        font-size:24px;
    }

    .about-homepage-jump,
    .about-officer-card{
        flex-basis:90vw;
    }
}

@media(prefers-reduced-motion:reduce){
    .figma-landing-page .figma-event-grid,
    .figma-landing-page .home-gallery-album-grid,
    .about-homepage-jump-grid,
    .about-officer-grid,
    .about-homepage-officer-grid{
        scroll-behavior:auto;
    }
}

@media(max-width:760px) and (prefers-reduced-motion:reduce){
    .figma-context-marquee-track{
        animation-duration:48s;
    }
}
/* END bpyc-public-mobile-m3 */
