/* ── Variables scoped only to header/footer — never bleed into page content ── */
.scope-header,
.scope-footer {
    --bg: #ffffff;
    --bg-1: #f5f8fd;
    --bg-2: #e9f0f9;
    --bg-3: #dde7f3;
    --text: #11182b;
    --text-2: #46587a;
    --text-3: #7c8aa0;
    --line: rgba(41, 46, 76, .14);
    --line-2: rgba(41, 46, 76, .22);
    --glass: rgba(255, 255, 255, .66);
    --glass-2: rgba(255, 255, 255, .82);
    --glass-hi: rgba(255, 255, 255, .9);
    --primary: #292e4c;
    --on-primary: #ffffff;
    --primary-shadow: rgba(41, 46, 76, .28);
    --heading: var(--primary);
    --ring: rgba(41, 46, 76, .14);
    --grid-line: rgba(41, 46, 76, .05);
    --shadow-sm: 0 1px 2px rgba(16, 24, 40, .06);
    --shadow-md: 0 8px 28px rgba(16, 24, 40, .08);
    --shadow-lg: 0 24px 60px rgba(16, 24, 40, .12);
    --input-bg: #f4f7fc;
    --input-focus: #ffffff;
    --header-bg: rgba(255, 255, 255, .78);
    --menu-bg: rgba(255, 255, 255, .97);
    --overlay: rgba(255, 255, 255, .82);
    --sunken: #f2f6fb;
    --chip-bg: linear-gradient(160deg, #e8eef9, #fafcff);
    --sheen: rgba(64, 96, 180, .07);
    --halo: rgba(41, 46, 76, .2);
    --toast-bg: #292e4c;
    --toast-fg: #ffffff;
    --selection: rgba(41, 46, 76, .18);

    --fs-xs: .75rem;
    --fs-sm: .875rem;
    --fs-base: 1rem;
    --fs-lg: clamp(1.0625rem, .5vw + 1rem, 1.125rem);
    --fs-xl: clamp(1.25rem, 3vw, 1.375rem);
    --fs-2xl: clamp(1.5rem, 4.5vw, 1.75rem);
    --fs-3xl: clamp(1.875rem, 6vw, 2.5rem);
    --fs-4xl: clamp(2.25rem, 8vw, 3.5rem);
    --fs-5xl: clamp(2.75rem, 7vw, 5.5rem);
    --sp-1: .25rem;
    --sp-2: .5rem;
    --sp-3: .75rem;
    --sp-4: 1rem;
    --sp-5: 1.5rem;
    --sp-6: 2rem;
    --sp-7: 3rem;
    --sp-8: 4rem;
    --sp-9: 6rem;
    --sp-10: 8rem;
    --r-sm: 8px;
    --r-md: 12px;
    --r-lg: 18px;
    --r-xl: 26px;
    --r-full: 999px;
    --blur: 18px;
    --maxw: 1480px;
    --maxw-narrow: 780px;
    --nav-h: 64px;
    --ease: cubic-bezier(.22, 1, .36, 1);
    --dur: .24s;
    --z-nav: 50;
    --z-drawer: 200;
    --z-toast: 300;
}

.hf-container {
    width: 100%;
    max-width: var(--maxw);
    margin-inline: auto;
    padding-inline: var(--sp-5);
}

.logo.scope-logo {
    display: inline-block;
    flex: none;
}

.pill.scope-footer {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .35rem .75rem;
    border-radius: var(--r-full);
    border: 1px solid var(--line);
    background: var(--glass);
    font-size: var(--fs-xs);
    color: var(--text-2);
    letter-spacing: .01em;
}

.pill.scope-footer svg {
    width: 14px;
    height: 14px;
    opacity: .85;
}

.ftr.scope-footer {
    margin-top: var(--sp-10);
    border-top: 1px solid var(--line);
    padding-block: var(--sp-8) var(--sp-6);
    background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--text) 2%, transparent));
}

.ftr-top.scope-footer {
    display: grid;
    grid-template-columns: 1.3fr 2fr;
    gap: var(--sp-7);
}

.ftr-brand.scope-footer {
    display: flex;
    flex-direction: column;
    gap: .9rem;
    align-items: flex-start;
}

.ftr-tag.scope-footer {
    color: var(--text-3);
    font-size: var(--fs-sm);
    max-width: 30ch;
}

.ftr-contact.scope-footer {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: .65rem;
    padding: 0;
    margin: 0;
}

.ftr-contact.scope-footer a.scope-footer,
.ftr-contact.scope-footer span.scope-footer {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    font-size: var(--fs-sm);
    color: var(--text-2);
    text-decoration: none;
}

.ftr-contact.scope-footer a.scope-footer:hover {
    color: var(--text);
}

.ftr-cols.scope-footer {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--sp-5);
}

.ftr-col.scope-footer h4.scope-footer {
    font-size: var(--fs-xs);
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--text-3);
    margin-bottom: .9rem;
    font-weight: 600;
}

.ftr-col.scope-footer ul.scope-footer {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: .65rem;
    padding: 0;
    margin: 0;
}

.ftr-col.scope-footer a.scope-footer {
    font-size: var(--fs-sm);
    color: var(--text-2);
    text-decoration: none;
}

.ftr-col.scope-footer a.scope-footer:hover {
    color: var(--text);
}

.ftr-disclaimer.scope-footer {
    margin-block: var(--sp-6);
    padding: 1.1rem 1.3rem;
    border-radius: var(--r-md);
    background: var(--glass);
    border: 1px solid var(--line);
}

.ftr-disclaimer.scope-footer strong.scope-footer {
    display: block;
    font-size: var(--fs-sm);
    margin-bottom: .35rem;
}

.ftr-disclaimer.scope-footer p.scope-footer {
    font-size: var(--fs-xs);
    color: var(--text-3);
    line-height: 1.6;
    margin: 0;
}

.ftr-bottom.scope-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-4);
    flex-wrap: wrap;
    font-size: var(--fs-xs);
    color: var(--text-3);
}

.ftr-pills.scope-footer {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
}

@media(max-width:760px) {
    .ftr.scope-footer {
        margin-top: var(--sp-7);
        padding-block: var(--sp-6) var(--sp-5);
    }
    .ftr-top.scope-footer {
        grid-template-columns: 1fr;
        gap: var(--sp-6);
    }
    .ftr-cols.scope-footer {
        grid-template-columns: repeat(2, 1fr);
    }
    .ftr-disclaimer.scope-footer {
        margin-block: var(--sp-5);
    }
}

.hdr.scope-header {
    position: sticky;
    top: 0;
    z-index: var(--z-nav);
    padding-top: .7rem;
    transition: background var(--dur) var(--ease), border-color var(--dur) var(--ease);
    border-bottom: 1px solid transparent;
}

.hdr.scope-header.scrolled {
    background: var(--header-bg);
    -webkit-backdrop-filter: blur(var(--blur)) saturate(1.4);
    backdrop-filter: blur(var(--blur)) saturate(1.4);
    border-bottom-color: var(--line);
}

.hdr-inner.scope-header {
    height: var(--nav-h);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sp-5);
}

.hdr-nav.scope-header {
    display: flex;
    align-items: center;
    gap: .35rem;
    margin-left: auto;
}

.hdr-link.scope-header {
    padding: .45rem .85rem;
    border-radius: var(--r-full);
    font-size: var(--fs-sm);
    color: var(--text-2);
    transition: color var(--dur) var(--ease), background var(--dur) var(--ease);
    text-decoration: none;
}

.hdr-link.scope-header:hover {
    color: var(--text);
    background: var(--glass);
}

.hdr-link.scope-header.active {
    color: var(--text);
}

.hdr-actions.scope-header {
    display: flex;
    align-items: center;
    gap: .4rem;
}

@media(max-width:640px) {
    .hdr.scope-header {
        padding-top: .4rem;
    }
    .hdr-inner.scope-header {
        height: 52px;
        gap: var(--sp-3);
    }
    .hdr-logo.scope-header .logo {
        height: 26px;
        width: auto;
    }
}