/* Glass lives on a pseudo-element so it never contains the fixed drawer. */
.site-header, .site-header.scrolled { isolation: isolate; background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: none; border-block-end: 1px solid rgba(255,255,255,.14); }
.site-header::before { content: ""; position: absolute; z-index: -1; inset: 0; background: rgba(20,22,61,.4); backdrop-filter: blur(18px) saturate(145%); -webkit-backdrop-filter: blur(18px) saturate(145%); transition: background .35s ease, box-shadow .35s ease; }
.site-header.scrolled::before, .account-page .site-header::before { background: rgba(20,22,61,.68); box-shadow: 0 6px 30px rgba(10,13,40,.08); }
.site-header .nav { gap: 20px; }
.site-header .nav-links { gap: clamp(12px, 1.15vw, 20px); }
.site-header .nav-actions { flex-shrink: 0; gap: 14px; }
.site-header .nav-account { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 15px; border: 1px solid rgba(255,255,255,.25); border-radius: 8px; color: #e2f7ed; background: rgba(255,255,255,.05); font-size: .75rem; font-weight: 600; white-space: nowrap; transition: background .25s, border-color .25s; }
.site-header .nav-account:hover { background: rgba(95,187,148,.2); border-color: var(--color-mint); }
.site-header .nav-links .mobile-quote, .site-header .nav-backdrop, .nav-drawer-heading { display: none; }
.site-header .nav-links a[aria-current="location"] { color: white; }
.site-header .nav-links a[aria-current="location"]::after { transform: scaleX(1); }

@media (max-width: 1280px) {
    .site-header .nav { gap: 14px; }
    .site-header .desktop-quote { display: none; }
    .site-header .menu-toggle { display: block; flex-shrink: 0; border: 1px solid rgba(255,255,255,.25); border-radius: 10px; width: 40px; height: 40px; background: rgba(255,255,255,.05); }
    .site-header .menu-toggle i { transition: transform .35s ease; }
    .site-header .menu-toggle[aria-expanded="true"] i:first-child { transform: translateY(3.5px) rotate(45deg); }
    .site-header .menu-toggle[aria-expanded="true"] i:last-child { transform: translateY(-3.5px) rotate(-45deg); }
    .site-header .nav-links { --drawer-offset: 110%; position: fixed; z-index: 103; inset-block: 12px; inset-inline-start: auto; inset-inline-end: 12px; display: flex; width: min(370px, calc(100vw - 32px)); height: auto; max-height: calc(100dvh - 24px); overflow-y: auto; overscroll-behavior: contain; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 4px; padding: 22px; margin: 0; border: 1px solid rgba(255,255,255,.2); border-radius: 22px; color: white; background: linear-gradient(145deg, rgba(43,48,94,.8), rgba(16,21,48,.78)); backdrop-filter: blur(28px) saturate(155%); -webkit-backdrop-filter: blur(28px) saturate(155%); box-shadow: 0 24px 80px rgba(5,9,30,.24), inset 0 1px 0 rgba(255,255,255,.12); visibility: hidden; pointer-events: none; transform: translate3d(var(--drawer-offset),0,0); }
    html[dir="rtl"] .site-header .nav-links { --drawer-offset: -110%; transform: translate3d(var(--drawer-offset),0,0); }
    .site-header.nav-motion-ready .nav-links { transition: transform .52s cubic-bezier(.22,1,.36,1), visibility 0s linear .52s; }
    .site-header .nav-links.open, html[dir="rtl"] .site-header .nav-links.open { visibility: visible; pointer-events: auto; transform: translate3d(0,0,0); transition-delay: 0s; }
    .site-header .nav-drawer-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block-end: 24px; margin-block-end: 12px; border-block-end: 1px solid rgba(255,255,255,.13); }
    .nav-drawer-heading > span { color: var(--color-mint); font-family: var(--font-body-en); font-size: .72rem; letter-spacing: .19em; font-weight: 600; }
    .nav-drawer-close { display: grid; place-items: center; flex-shrink: 0; width: 38px; height: 38px; padding: 0; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; background: rgba(255,255,255,.06); color: white; cursor: pointer; transition: background .2s, transform .25s; }
    .nav-drawer-close:hover { background: rgba(255,255,255,.15); transform: rotate(90deg); }
    .site-header .nav-links > a { display: flex; align-items: center; width: 100%; min-height: 48px; flex-shrink: 0; border: 0; border-radius: 10px; padding: 13px 14px; font-family: inherit; font-size: .92rem; line-height: 1.5; white-space: normal; color: rgba(255,255,255,.8); opacity: 0; transform: translateY(10px); }
    .site-header.nav-motion-ready .nav-links > a { transition: opacity .18s ease, transform .25s ease, background .2s, color .2s; }
    .site-header .nav-links.open > a { opacity: 1; transform: translateY(0); transition-duration: .35s; transition-delay: .1s; }
    .site-header .nav-links.open > a:nth-of-type(2) { transition-delay: .13s; }
    .site-header .nav-links.open > a:nth-of-type(3) { transition-delay: .16s; }
    .site-header .nav-links.open > a:nth-of-type(4) { transition-delay: .19s; }
    .site-header .nav-links.open > a:nth-of-type(n+5) { transition-delay: .22s; }
    .site-header .nav-links a::after { display: none; }
    .site-header .nav-links a.active { color: #a7e4c7; background: rgba(95,187,148,.12); }
    .site-header .nav-links a:hover { color: white; background: rgba(255,255,255,.08); }
    .site-header .nav-links .mobile-quote { display: flex; justify-content: space-between; gap: 16px; margin-block-start: 20px; padding: 13px 16px; border: 1px solid rgba(95,187,148,.35); border-radius: 10px; background: rgba(95,187,148,.15); color: #b4efd3; font-size: .82rem; }
    .site-header .nav-backdrop { position: fixed; z-index: 102; inset: 0; display: block; width: 100%; height: 100dvh; border: 0; padding: 0; background: rgba(4,8,26,.28); opacity: 0; visibility: hidden; pointer-events: none; cursor: pointer; }
    .site-header.nav-motion-ready .nav-backdrop { transition: opacity .4s ease, visibility 0s linear .52s; }
    .site-header.drawer-open .nav-backdrop { opacity: 1; visibility: visible; pointer-events: auto; transition-delay: 0s; }
    .site-header:not(.nav-ready) { position: relative; height: auto; }
    .site-header:not(.nav-ready) .nav { flex-wrap: wrap; padding-block: 16px; }
    .site-header:not(.nav-ready) .menu-toggle, .site-header:not(.nav-ready) .nav-drawer-heading { display: none; }
    .site-header:not(.nav-ready) .nav-links { position: static; width: 100%; max-height: none; order: 3; height: auto; flex-direction: row; flex-wrap: wrap; gap: 4px 16px; padding: 8px 0 0; border: 0; box-shadow: none; background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; visibility: visible; pointer-events: auto; transform: none; }
    .site-header:not(.nav-ready) .nav-links a { width: auto; font-size: .8rem; opacity: 1; transform: none; }
    .site-header:not(.nav-ready) .nav-links .mobile-quote { width: 100%; }
}
@media (max-width: 600px) {
    .site-header .brand-logo { height: 48px; max-width: 124px; }
    .site-header .nav { gap: 8px; }
    .site-header .nav-actions { gap: 8px; }
    .site-header .nav-account { padding-inline: 10px; min-height: 36px; font-size: .7rem; }
    .site-header .language-switch { gap: 4px; }
    .site-header .lang-btn { font-size: .6rem; padding: 2px; }
    .site-header .menu-toggle { width: 36px; height: 36px; }
}
@media (max-width: 360px) {
    .site-header .brand-logo { max-width: 95px; height: 42px; }
    .site-header .nav-account { padding-inline: 7px; font-size: .65rem; }
    .site-header .nav-actions { gap: 6px; }
    .site-header .nav-links { padding: 18px; }
}
@media (prefers-reduced-motion: reduce) {
    .site-header.nav-motion-ready .nav-links, .site-header.nav-motion-ready .nav-links > a, .site-header.nav-motion-ready .nav-backdrop, .site-header::before, .nav-drawer-close { transition: none !important; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .site-header::before { background: rgba(20,22,61,.92); }
    .site-header .nav-links { background-color: rgba(20,22,61,.97); }
}
