/* Shared across the native and legacy public pages. */
.cogmers-mobile-shell { display: none; }
.cogmers-mobile-panel[hidden], .cogmers-mobile-backdrop[hidden] { display: none !important; }
@media (max-width: 1024px) {
    html { --cogmers-mobile-header-height: 64px; scroll-padding-top: calc(var(--cogmers-mobile-header-height) + 16px); }
    body .about-header, body .mobile-header, body .zmm-wrapper,
    body .page-wrapper header > .header-inner { display: none !important; }
    /* Keep hero content below the translucent bar; its background extends behind it. */
    body.about-page main > :first-child { border-top: var(--cogmers-mobile-header-height) solid transparent; }
    body.about-page .media-hero__photos, body.about-page .media-hero__wash { top: calc(0px - var(--cogmers-mobile-header-height)); }
    body:not(.about-page) .page-title-wrap { border-top: var(--cogmers-mobile-header-height) solid transparent; }
    .cogmers-mobile-shell { display: block; font-family: Arial, Helvetica, sans-serif; font-size: 17px; line-height: 1.4; color: #fff; }
    .cogmers-mobile-shell *, .cogmers-mobile-shell *::before, .cogmers-mobile-shell *::after { box-sizing: border-box; }
    .cogmers-mobile-shell a { color: #fff; text-decoration: none; }
    .cogmers-mobile-bar {
        position: fixed; inset: 0 0 auto; z-index: 1102; height: var(--cogmers-mobile-header-height);
        display: flex; align-items: center; justify-content: space-between; gap: 16px;
        padding: 8px max(20px, env(safe-area-inset-right)) 8px max(20px, env(safe-area-inset-left));
        background: linear-gradient(110deg, rgba(3, 24, 54, .34), rgba(5, 40, 70, .2));
        border-bottom: 1px solid rgba(185, 223, 255, .16);
        -webkit-backdrop-filter: none; backdrop-filter: none;
    }
    .cogmers-mobile-brand { display: flex; align-items: center; }
    .cogmers-mobile-brand img { display: block; width: auto; height: 48px; max-width: calc(100vw - 104px); object-fit: contain; }
    .cogmers-mobile-toggle {
        display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px;
        margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; color: #fff; cursor: pointer;
    }
    .cogmers-mobile-toggle span, .cogmers-mobile-toggle span::before, .cogmers-mobile-toggle span::after {
        display: block; position: relative; width: 29px; height: 3px; border-radius: 3px; background: currentColor; transition: transform .2s, background .2s;
    }
    .cogmers-mobile-toggle span::before, .cogmers-mobile-toggle span::after { content: ""; position: absolute; left: 0; }
    .cogmers-mobile-toggle span::before { top: -9px; }
    .cogmers-mobile-toggle span::after { top: 9px; }
    .cogmers-mobile-toggle[aria-expanded="true"] span { background: transparent; }
    .cogmers-mobile-toggle[aria-expanded="true"] span::before { transform: translateY(9px) rotate(45deg); }
    .cogmers-mobile-toggle[aria-expanded="true"] span::after { transform: translateY(-9px) rotate(-45deg); }
    .cogmers-mobile-backdrop { position: fixed; inset: var(--cogmers-mobile-header-height) 0 0; z-index: 1100; background: rgba(0, 10, 28, .2); }
    .cogmers-mobile-panel {
        position: fixed; top: calc(var(--cogmers-mobile-header-height) + 8px); right: max(10px, env(safe-area-inset-right)); bottom: max(12px, env(safe-area-inset-bottom)); z-index: 1101;
        width: 50vw; padding: 14px 14px 16px; overflow-y: auto; overscroll-behavior: contain;
        background: linear-gradient(140deg, rgba(17, 57, 98, .74), rgba(3, 22, 50, .8));
        border: 1px solid rgba(113, 198, 255, .45); border-radius: 20px;
        box-shadow: 0 12px 32px rgba(0, 8, 28, .24), inset 0 1px 0 rgba(255, 255, 255, .12);
        transform: translateX(calc(100% + 20px)); opacity: 0; transition: transform .24s ease-out, opacity .2s;
        scrollbar-width: thin; scrollbar-color: #4183b1 transparent;
    }
    .cogmers-mobile-shell.is-open .cogmers-mobile-panel { transform: translateX(0); opacity: 1; }
    .cogmers-mobile-link, .cogmers-mobile-groups > summary {
        display: flex; align-items: center; gap: 14px; min-height: 55px; padding: 12px 10px; margin: 0;
        border: 0; border-bottom: 1px solid rgba(152, 204, 248, .2); border-radius: 0;
        font-size: 17px; font-weight: 500; line-height: 1.4; cursor: pointer; list-style: none;
    }
    .cogmers-mobile-link > .fa:first-child, .cogmers-mobile-groups > summary > .fa:first-child { flex: 0 0 28px; text-align: center; font-size: 24px; }
    .cogmers-mobile-chevron { margin-left: auto; font-size: 24px; }
    .cogmers-mobile-link[aria-current="page"] {
        margin: 5px 0; color: #0ee3ff; font-weight: 700; border: 1px solid #00caff; border-radius: 13px;
        background: linear-gradient(110deg, rgba(0, 176, 255, .35), rgba(0, 106, 233, .22)); box-shadow: inset 0 0 14px rgba(0, 193, 255, .14);
    }
    .cogmers-mobile-groups { margin: 0; padding: 0; }
    .cogmers-mobile-groups > summary::-webkit-details-marker { display: none; }
    .cogmers-mobile-groups[open] { margin-top: 5px; border: 1px solid rgba(0, 200, 255, .65); border-radius: 14px; background: rgba(4, 44, 84, .5); }
    .cogmers-mobile-groups[open] > summary { color: #0ee3ff; border-bottom: 0; }
    .cogmers-mobile-groups[open] .cogmers-mobile-chevron { transform: rotate(180deg); }
    .cogmers-mobile-group-links { padding: 0 12px 8px 38px; }
    .cogmers-mobile-group-links a { display: flex; align-items: center; justify-content: space-between; min-height: 44px; padding: 10px; border-bottom: 1px solid rgba(152, 204, 248, .18); font-size: 15px; }
    .cogmers-mobile-group-links a:last-child { border-bottom: 0; }
    .cogmers-mobile-group-links a[aria-current="page"] { color: #0ee3ff; font-weight: 700; }
    .cogmers-mobile-search { position: relative; margin: 18px 0 12px; }
    .cogmers-mobile-search input {
        display: block; width: 100%; height: 50px; margin: 0; padding: 10px 14px 10px 49px;
        border: 1px solid #92bee7; border-radius: 28px; background: rgba(126, 178, 225, .14); color: #fff;
        font: inherit; font-size: 16px; box-shadow: none;
    }
    .cogmers-mobile-search input::placeholder { color: #bed2e9; opacity: 1; }
    .cogmers-mobile-search button { position: absolute; top: 0; left: 0; display: grid; place-items: center; width: 48px; height: 50px; margin: 0; padding: 0; border: 0; border-radius: 28px; background: transparent; color: #fff; font-size: 22px; cursor: pointer; }
    .cogmers-mobile-donate { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; border: 1px solid rgba(187, 213, 238, .35); border-radius: 10px; background: rgba(255, 255, 255, .035); font-size: 15px; font-weight: 500; text-transform: none; box-shadow: none; }
    .cogmers-mobile-donate .fa { font-size: 18px; }
    .cogmers-mobile-donate:hover, .cogmers-mobile-donate:focus-visible { background: rgba(255, 255, 255, .1); }
    .cogmers-mobile-social { display: flex; align-items: center; justify-content: center; margin-top: 17px; }
    .cogmers-mobile-social a { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; flex: 1; font-size: 16px; }
    .cogmers-mobile-social a + a { border-left: 1px solid rgba(152, 204, 248, .35); }
    .cogmers-mobile-social .fa { font-size: 24px; }
    .cogmers-mobile-social a:last-child { flex: 1.5; }
    .cogmers-mobile-shell :focus-visible { outline: 2px solid #42dfff; outline-offset: 3px; }
    .cogmers-mobile-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
}
@media (max-width: 650px) {
    /* Keep icons, labels and search usable inside the half-screen drawer. */
    .cogmers-mobile-panel { padding: 10px 8px 12px; border-radius: 16px; }
    .cogmers-mobile-link, .cogmers-mobile-groups > summary { gap: 6px; min-height: 48px; padding: 10px 6px; font-size: 15px; }
    .cogmers-mobile-link > span, .cogmers-mobile-groups > summary > span { min-width: 0; overflow-wrap: break-word; }
    .cogmers-mobile-link > .fa:first-child, .cogmers-mobile-groups > summary > .fa:first-child { flex-basis: 20px; font-size: 20px; }
    .cogmers-mobile-chevron { flex-shrink: 0; font-size: 18px; }
    .cogmers-mobile-group-links { padding: 0 4px 6px 18px; }
    .cogmers-mobile-group-links a { gap: 6px; padding: 8px 4px; font-size: 13px; }
    .cogmers-mobile-search { margin-top: 14px; }
    .cogmers-mobile-search input { height: 44px; min-width: 0; padding: 8px 6px 8px 34px; border-radius: 14px; font-size: 14px; }
    .cogmers-mobile-search button { width: 34px; height: 44px; font-size: 18px; }
    .cogmers-mobile-social { flex-wrap: wrap; margin-top: 10px; }
    .cogmers-mobile-social .fa { font-size: 20px; }
    .cogmers-mobile-social a:last-child { flex: 0 0 100%; margin-top: 4px; border-left: 0; border-top: 1px solid rgba(152, 204, 248, .2); }
}
@media (prefers-reduced-motion: reduce) {
    .cogmers-mobile-panel, .cogmers-mobile-toggle span, .cogmers-mobile-toggle span::before, .cogmers-mobile-toggle span::after { transition: none; }
}
