.announcement { min-height: 42px; display: grid; place-items: center; background: #0c173b; color: #fff; font-size: 13px; }
.announcement__inner { display: flex; align-items: center; justify-content: center; gap: 10px; }
.announcement p { margin: 0; color: #dfe4ff; }
.announcement a { color: #fff; font-weight: 600; margin-left: 8px; border-bottom: 1px solid rgba(255,255,255,.4); }
.announcement__pulse { width: 7px; height: 7px; border-radius: 50%; background: #7fffbd; box-shadow: 0 0 0 5px rgba(127,255,189,.12); animation: pulse 2s infinite; }

.site-header { position: sticky; top: 0; z-index: 50; height: 82px; display: flex; align-items: center; background: rgba(255,255,255,.86); border-bottom: 1px solid transparent; backdrop-filter: blur(18px); transition: .3s ease; }
.site-header.scrolled { height: 72px; border-color: rgba(7,18,46,.08); box-shadow: 0 8px 30px rgba(30,44,90,.07); }
.nav-wrap { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.brand { display: flex; align-items: center; width: 250px; height: 52px; }
.brand__logo { display: block; width: 100%; height: 100%; object-fit: contain; object-position: left center; }
.site-header .brand { width: 220px; height: 64px; }
.nav { position: relative; display: flex; align-items: center; gap: 3px; padding: 5px; border: 1px solid rgba(7,18,46,.08); border-radius: 999px; color: #29324b; background: linear-gradient(135deg,rgba(247,248,255,.96),rgba(255,255,255,.78)); box-shadow: inset 0 1px 0 #fff, 0 10px 30px rgba(30,44,90,.07); font-size: 14px; font-weight: 600; }
.nav a { position: relative; z-index: 1; padding: 10px 16px; border-radius: 999px; transition: color .25s ease, background-color .25s ease, box-shadow .25s ease, transform .25s var(--ease-out); }
.nav a::after { content: ""; position: absolute; left: 50%; bottom: 4px; width: 4px; height: 4px; border-radius: 50%; background: var(--coral); opacity: 0; transform: translate(-50%,4px) scale(.5); transition: opacity .25s ease, transform .25s var(--ease-out); }
.nav a:hover { color: var(--blue-dark); background: rgba(255,255,255,.9); box-shadow: 0 5px 16px rgba(26,37,82,.09); transform: translateY(-1px); }
.nav a:hover::after { opacity: .8; transform: translate(-50%,0) scale(1); }
.nav a.is-active { color: #fff; background: linear-gradient(135deg,#101c3d,#07122e); box-shadow: 0 7px 18px rgba(7,18,46,.2), inset 0 1px 0 rgba(255,255,255,.15); }
.nav a.is-active::after { opacity: 1; transform: translate(-50%,0) scale(1); }
.nav a:focus-visible { outline: 3px solid rgba(240,82,63,.22); outline-offset: 2px; }
.nav-cta { justify-self: end; min-height: 48px; padding-inline: 23px; border-radius: 999px; box-shadow: 0 13px 32px rgba(240,82,63,.24); }
.menu-toggle { display: none; width: 44px; height: 44px; border: 1px solid rgba(7,18,46,.08); border-radius: 13px; background: linear-gradient(145deg,#fff,#f2f4fb); box-shadow: 0 8px 20px rgba(20,34,85,.08); align-items: center; justify-content: center; flex-direction: column; gap: 6px; }
.menu-toggle span { width: 20px; height: 2px; background: var(--ink); transition: .25s ease; }


.js:not(.is-ready) .site-header { opacity: 0; transform: translateY(-20px); }
.js .site-header { transition: height .3s ease, border-color .3s ease, box-shadow .3s ease, opacity .8s var(--ease-out), transform .8s var(--ease-out); }

@keyframes pulse { 0%, 100% { box-shadow: 0 0 0 5px rgba(127,255,189,.11); } 50% { box-shadow: 0 0 0 9px rgba(127,255,189,0); } }