.kp-mobile-donate-bar { display:none; }

/* The header remains in normal flow, then stays pinned as phone content scrolls. */
@media(max-width:768px){
    html:has(body.kp-floating-mobile-header){scroll-padding-top:calc(var(--kp-mobile-header-height,134px) + 16px)}
    body.kp-floating-mobile-header #masthead.site-header{
        position:sticky;
        top:0;
        z-index:1000;
        background:rgb(255 249 243 / 94%);
        -webkit-backdrop-filter:blur(14px);
        backdrop-filter:blur(14px);
        box-shadow:0 5px 16px rgb(64 45 37 / 7%);
    }
    body.kp-floating-mobile-header #masthead .inside-header{
        display:grid;
        grid-template-columns:minmax(0,1fr) 44px;
        align-items:center;
        gap:16px 12px;
        width:100%;
        max-width:none;
        padding:calc(8px + env(safe-area-inset-top,0px)) 14px 12px;
    }
    body.kp-floating-mobile-header #masthead .site-logo{
        grid-area:1 / 1;
        margin:0;
        min-width:0;
        text-align:left;
    }
    body.kp-floating-mobile-header #masthead .header-image{
        width:170px;
        max-width:100%;
        max-height:64px;
        height:auto;
        object-fit:contain;
    }
    body.kp-floating-mobile-header #masthead .main-navigation{
        grid-area:1 / 2;
        position:static;
        justify-self:end;
        width:44px;
        min-width:0;
        margin:0;
        background:transparent;
    }
    body.kp-floating-mobile-header #masthead .inside-navigation{position:static;display:block}
    body.kp-floating-mobile-header #masthead .menu-toggle{
        display:flex;
        align-items:center;
        justify-content:center;
        width:44px;
        height:44px;
        min-height:44px;
        padding:0;
        line-height:44px;
        background:transparent;
        color:var(--kp-ink,#402d25);
        font-size:24px;
    }
    body.kp-floating-mobile-header #masthead .menu-toggle .mobile-menu{display:none}
    body.kp-floating-mobile-header #masthead .main-navigation.toggled .main-nav{
        position:absolute;
        top:100%;
        left:0;
        right:0;
        width:100%;
        max-height:calc(100dvh - var(--kp-mobile-header-height,134px) - var(--kp-admin-offset,0px));
        box-sizing:border-box;
        overflow-y:auto;
        overscroll-behavior:contain;
        padding:8px 14px 12px;
        background:var(--kp-cream,#fff9f3);
        box-shadow:0 8px 16px rgb(64 45 37 / 8%);
    }
    body.kp-floating-mobile-header #masthead .main-navigation.toggled .main-nav>ul>li>a{
        min-height:44px;
        padding:10px 14px;
        line-height:24px;
        box-sizing:border-box;
    }
    body.kp-floating-mobile-header #masthead .kp-mobile-donate-bar{
        grid-column:1 / -1;
        grid-row:2;
        display:block;
        margin:0;
        padding:0;
        width:100%;
    }
    .kp-mobile-donate-bar__button{
        display:flex;
        align-items:center;
        justify-content:center;
        gap:10px;
        box-sizing:border-box;
        min-height:44px;
        width:100%;
        padding:10px 20px;
        border-radius:999px;
        background:var(--kp-primary-color,#f58220);
        color:var(--kp-ink,#402d25);
        font-size:17px;
        font-weight:700;
        line-height:24px;
        text-decoration:none;
    }
    .kp-mobile-donate-bar__button:visited{color:var(--kp-ink,#402d25)}
    .kp-mobile-donate-bar__button:hover,.kp-mobile-donate-bar__button:focus{color:var(--kp-ink,#402d25);background:#ed7916;text-decoration:none}
    .kp-mobile-donate-bar__button:focus-visible{outline:3px solid #93430a;outline-offset:3px}
    .kp-mobile-donate-bar__heart{color:#c62828;font-size:22px;font-weight:400;line-height:1}
    body.kp-floating-mobile-header #page :is(input,select,textarea,button,[id]){scroll-margin-top:16px}
}
@media(min-width:601px) and (max-width:768px){
    body.admin-bar.kp-floating-mobile-header{--kp-admin-offset:46px}
    body.admin-bar.kp-floating-mobile-header #masthead.site-header{top:46px}
    html:has(body.admin-bar.kp-floating-mobile-header){scroll-padding-top:calc(var(--kp-mobile-header-height,134px) + 62px)}
}

/* GeneratePress provides a separate mobile toggle in its flex header. */
@media(max-width:768px){
    body.kp-floating-mobile-header #masthead:has(#mobile-menu-control-wrapper) #site-navigation .menu-toggle{display:none}
}
