/* Keep the original navy palette, with concentrated teal, blue and gold accents.
   The existing layer keeps shared typography and reduced motion authoritative. */
@layer public-premium {
    html body.public-site { --public-polish-ease: cubic-bezier(.22, 1, .36, 1); }

    html body.public-site .public-hero::before {
        background: radial-gradient(ellipse at 12% 34%, rgba(0, 193, 163, .23), transparent 44%),
            radial-gradient(ellipse at 84% 28%, rgba(40, 102, 232, .22), transparent 40%),
            radial-gradient(ellipse at 66% 12%, rgba(211, 156, 49, .14), transparent 30%) !important;
    }
    html body.public-site .public-hero::after { opacity: .14 !important; }
    html body.public-site .public-hero .public-eyebrow {
        color: #a1f2df !important;
        border-color: rgba(61, 215, 187, .62) !important;
        background: linear-gradient(115deg, #195654d9, #082c3aed) !important;
    }
    html body.public-site .public-hero .public-float-card.is-top {
        border-color: rgba(225, 177, 73, .72) !important;
        background: linear-gradient(130deg, #2e4146, #0d2937) !important;
    }
    html body.public-site .public-hero .public-float-card.is-bottom {
        border-color: rgba(58, 221, 184, .68) !important;
        background: linear-gradient(130deg, #164947, #082c3a) !important;
    }
    html body.public-site .public-hero-visual figure {
        border-color: rgba(106, 219, 201, .8) !important;
    }
    html body.public-site .public-hero-visual figure > img {
        filter: saturate(1.09) contrast(1.04) !important;
    }
    html body.public-site .public-hero-actions .public-button-light {
        border-color: #c39e4f99 !important;
    }
    html body.public-site .public-hero-actions .public-button-light i { color: #ecc871 !important; }
    html body.public-site .public-trust-row span:first-child { border-color: #529cdf66 !important; }
    html body.public-site .public-trust-row span:first-child i { color: #85c2ff !important; }
    html body.public-site .public-trust-row span:last-child { border-color: #30c5ad66 !important; }
    html body.public-site .public-trust-row span:last-child i { color: #65e4c6 !important; }

    /* PUBLIC_HEADER_AUTHORITY_V2: calm institutional navigation, without extra menus. */
    @media (min-width: 981px) {
        html body.public-site .public-nav {
            position: relative !important;
            isolation: isolate !important;
            gap: 2px !important;
            min-height: 58px !important;
            padding: 6px !important;
            overflow: hidden !important;
            border-radius: 19px !important;
            border-color: rgba(153, 210, 215, .28) !important;
            background:
                linear-gradient(180deg, rgba(255,255,255,.055), transparent 48%),
                linear-gradient(112deg, rgba(7,40,49,.94), rgba(8,46,55,.86)) !important;
            box-shadow:
                inset 0 1px 0 rgba(232,255,251,.12),
                inset 0 -1px 0 rgba(0,17,26,.42),
                0 12px 30px rgba(0,18,27,.2) !important;
            transform: none !important;
        }
        html body.public-site .public-nav::before {
            content: "" !important;
            position: absolute !important;
            z-index: -1 !important;
            inset: 0 auto 0 0 !important;
            width: 3px !important;
            background: linear-gradient(180deg, #74e4d3, #d8b25d) !important;
            opacity: .82 !important;
        }
        html body.public-site .public-nav a {
            min-height: 44px !important;
            padding: 0 17px !important;
            display: inline-flex !important;
            align-items: center !important;
            justify-content: center !important;
            color: rgba(230,244,243,.76) !important;
            border: 1px solid transparent !important;
            border-radius: 13px !important;
            font-size: 13.5px !important;
            font-weight: 560 !important;
            letter-spacing: .01em !important;
            text-shadow: none !important;
            transition: color .2s ease, background-color .2s ease, border-color .2s ease !important;
        }
        html body.public-site .public-nav a::after {
            display: block !important;
            inset: auto 50% 5px !important;
            width: 18px !important;
            height: 2px !important;
            border-radius: 999px !important;
            background: linear-gradient(90deg, #d8b25d, #66decf) !important;
            box-shadow: none !important;
            transform: translateX(-50%) scaleX(0) !important;
            transform-origin: center !important;
            opacity: 0 !important;
            transition: transform .2s ease, opacity .2s ease !important;
        }
        html body.public-site .public-nav a:is(:hover, .is-active, :focus-visible) {
            color: #f7fffe !important;
            border-color: rgba(151,218,211,.13) !important;
            background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(93,205,191,.055)) !important;
        }
        html body.public-site .public-nav a:is(:hover, .is-active, :focus-visible)::after {
            transform: translateX(-50%) scaleX(1) !important;
            opacity: 1 !important;
        }
    }
    html body.public-site .public-header .public-nav-actions > .public-button-primary,
    html body.public-site .public-nav-portal {
        min-height: 52px !important;
        border-radius: 16px !important;
        color: #ffffff !important;
        border-color: rgba(118,190,207,.46) !important;
        background:
            radial-gradient(circle at 18% 0, rgba(113,224,210,.16), transparent 40%),
            linear-gradient(118deg, #174a62, #12374e) !important;
        box-shadow:
            inset 0 1px 0 rgba(226,249,251,.2),
            inset 0 -1px 0 rgba(0,20,34,.48),
            0 10px 24px rgba(0,22,36,.26) !important;
        text-shadow: none !important;
        transform: none !important;
        transition: color .2s ease, background .2s ease, box-shadow .2s ease, border-color .2s ease !important;
    }
    html body.public-site .public-header .public-nav-actions > .public-button-primary {
        min-width: 228px !important;
        padding: 7px 15px 7px 8px !important;
        justify-content: flex-start !important;
        gap: 11px !important;
    }
    html body.public-site .public-header .public-button::before { content: none !important; }
    html body.public-site .public-header .public-nav-actions > .public-button-primary i,
    html body.public-site .public-nav-portal i { color: #c9f9ff !important; }
    html body.public-site .public-header .public-nav-actions > .public-button-primary i {
        flex: 0 0 36px !important;
        width: 36px !important;
        height: 36px !important;
        display: grid !important;
        place-items: center !important;
        color: #a5f1e5 !important;
        background: rgba(5,29,42,.38) !important;
        border: 1px solid rgba(166,231,225,.19) !important;
        border-radius: 11px !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
    }
    html body.public-site .public-header .public-nav-actions > .public-button-primary > span {
        flex: 1 1 auto !important;
        text-align: left !important;
    }
    html body.public-site .public-header .public-nav-actions > .public-button-primary::after {
        content: "›" !important;
        margin-left: 2px !important;
        color: rgba(225,245,244,.66) !important;
        font-size: 21px !important;
        font-weight: 400 !important;
        line-height: 1 !important;
    }
    html body.public-site .public-header .public-nav-actions > .public-button-primary:hover,
    html body.public-site .public-nav-portal:hover {
        border-color: rgba(135,213,218,.58) !important;
        background:
            radial-gradient(circle at 18% 0, rgba(125,232,217,.22), transparent 42%),
            linear-gradient(118deg, #1b5870, #164158) !important;
        box-shadow: inset 0 1px 0 rgba(230,250,251,.24), 0 13px 28px rgba(0,25,40,.3) !important;
        transform: translateY(-1px) !important;
    }
    html body.public-site .public-header .public-nav-actions > .public-button-primary:active,
    html body.public-site .public-nav-portal:active {
        box-shadow: inset 0 1px 4px #001a2933 !important;
        transform: none !important;
    }
    html body.public-site .public-header :is(a, button):focus-visible {
        outline: 2px solid #b9e9e2 !important;
        outline-offset: 4px !important;
    }
    html body.public-site .public-menu-button {
        box-shadow: inset 0 1px 0 #ffffff12, 0 4px 12px #001a2924 !important;
        transform: none !important;
    }
    @media (min-width: 981px) and (max-width: 1080px) {
        html body.public-site .public-header .public-nav-actions > .public-button-primary {
            min-width: 52px !important;
            width: 52px !important;
            padding: 7px !important;
            justify-content: center !important;
        }
        html body.public-site .public-header .public-nav-actions > .public-button-primary i {
            flex-basis: 36px !important;
        }
        html body.public-site .public-header .public-nav-actions > .public-button-primary::after {
            content: none !important;
        }
    }
    html body.public-site .public-portal-dialog {
        max-height: calc(100dvh - 32px) !important;
        overscroll-behavior: contain !important;
    }
    html body.public-site .public-portal-dialog .public-dialog-head h2 {
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    /* Animate on open/close only. No looping light passes or delayed clicks. */
    html body.public-site .public-portal-dialog[open].is-portal-reveal {
        animation: publicAccessIn .52s var(--public-polish-ease) both !important;
    }
    html body.public-site .public-portal-dialog[open].is-portal-reveal::backdrop {
        animation: publicAccessBackdropIn .36s ease-out both !important;
    }
    html body.public-site .public-portal-dialog[open].is-portal-closing {
        pointer-events: none !important;
        animation: publicAccessOut .22s ease-in both !important;
    }
    html body.public-site .public-portal-dialog[open].is-portal-closing::backdrop {
        animation: publicAccessBackdropOut .22s ease-in both !important;
    }
    html body.public-site .is-portal-reveal :is(.public-portal-head-main, .public-portal-section-head, .public-school-vision) {
        animation: publicAccessContentIn .45s ease-out .06s both !important;
    }
    html body.public-site .is-portal-reveal :is(.public-portal-grid a, .public-service-grid a) {
        --access-delay: .12s;
        animation: publicAccessContentIn .4s ease-out var(--access-delay) both !important;
    }
    html body.public-site .is-portal-reveal :is(.public-portal-grid a, .public-service-grid a):nth-child(2) { --access-delay: .16s; }
    html body.public-site .is-portal-reveal :is(.public-portal-grid a, .public-service-grid a):nth-child(3) { --access-delay: .20s; }
    html body.public-site .is-portal-reveal :is(.public-portal-grid a, .public-service-grid a):nth-child(4) { --access-delay: .24s; }
    html body.public-site .is-portal-reveal :is(.public-portal-grid a, .public-service-grid a):nth-child(5) { --access-delay: .28s; }
    html body.public-site .is-portal-reveal .public-school-vision { animation-delay: .22s !important; }

    @media (max-width: 980px) {
        html body.public-site .public-nav.is-open {
            border-color: rgba(137,216,216,.24) !important;
            background:
                radial-gradient(circle at 96% 0, rgba(104,218,203,.14), transparent 37%),
                linear-gradient(145deg, rgba(5,29,40,.99), rgba(7,48,57,.985)) !important;
            box-shadow: inset 0 1px 0 #ffffff12, 0 18px 42px #00162161 !important;
        }
        html body.public-site .public-nav a { min-height: 46px !important; }
        html body.public-site .public-nav-portal {
            min-height: 48px !important;
            margin-top: 8px !important;
            border-radius: 13px !important;
        }
    }
    @media (max-width: 600px) {
        html body.public-site .public-portal-dialog {
            width: calc(100% - 20px) !important;
            max-height: calc(100dvh - 20px) !important;
        }
        html body.public-site .is-portal-reveal :is(.public-portal-grid a, .public-service-grid a) {
            animation-delay: .08s !important;
        }
    }
}
/* The access label is intentionally stronger than the global light text policy. */
@layer app-typography {
    html body.public-site .public-header .public-nav-actions > .public-button-primary,
    html body.public-site .public-header .public-nav-actions > .public-button-primary > span,
    html body.public-site .public-nav-portal,
    html body.public-site .public-nav-portal > span,
    html body.public-site .public-hero-portal-button,
    html body.public-site .public-hero-portal-button > span {
        font-family: "PublicPortalStrong", "Segoe UI", sans-serif !important;
        font-weight: 600 !important;
        font-size: 13px !important;
        line-height: 1.3 !important;
        letter-spacing: .01em !important;
    }
}

@keyframes publicAccessIn {
    from { opacity: 0; transform: translateY(24px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes publicAccessOut {
    from { opacity: 1; transform: translateY(0); }
    to { opacity: 0; transform: translateY(12px); }
}
@keyframes publicAccessContentIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes publicAccessBackdropIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes publicAccessBackdropOut {
    from { opacity: 1; }
    to { opacity: 0; }
}
