/* Header with dropdown menus, and the wider footer. Loads after pages.css on every inner page. */
.site-header{position:sticky;top:0;z-index:50;background:rgba(250,253,255,.94);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid #edf2f8}
.header-inner{height:68px;position:relative}
.site-nav{display:flex;align-items:center;gap:2px}
.nav-item{position:relative}
.nav-trigger,.nav-link{display:flex;align-items:center;gap:5px;border:0;background:none;font:inherit;font-size:13px;font-weight:500;color:#40516c;padding:9px 12px;border-radius:6px;cursor:pointer;white-space:nowrap}
.nav-trigger:hover,.nav-link:hover,.nav-item.open .nav-trigger{color:var(--blue);background:#f2f7ff}
.nav-trigger[data-active],.nav-link[aria-current]{color:var(--blue)}
.chev{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.6;transition:transform .15s}
.nav-item.open .chev{transform:rotate(180deg)}

.nav-panel{position:absolute;top:calc(100% + 10px);left:-12px;min-width:300px;display:none;gap:8px;padding:10px;background:#fff;border:1px solid #e3eaf3;border-radius:12px;box-shadow:0 24px 48px -20px rgba(12,23,48,.28)}
.nav-panel:before{content:'';position:absolute;left:0;right:0;top:-12px;height:12px}
.nav-panel.wide{grid-template-columns:auto 230px}
.nav-item.open .nav-panel{display:grid}
.nav-cols{display:flex;gap:4px}
.nav-col{min-width:250px;padding:6px}
.nav-col h3{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:#8794a7;font-weight:600;padding:6px 10px 8px}
.nav-col a{display:block;padding:9px 10px;border-radius:8px}
.nav-col a:hover,.nav-col a[aria-current]{background:#f2f7ff}
.nav-col strong{display:block;font-size:13px;font-weight:600;color:var(--ink)}
.nav-col a:hover strong,.nav-col a[aria-current] strong{color:var(--blue)}
.nav-col span{display:block;font-size:11.5px;color:#7a889c;margin-top:2px}
.nav-feature{display:flex;flex-direction:column;justify-content:flex-end;gap:6px;padding:18px;border-radius:10px;background:#0c1730;background-image:radial-gradient(ellipse at 100% 0%,rgba(8,122,255,.45),transparent 60%);color:#fff}
.nav-feature small{font-size:9.5px;letter-spacing:1px;font-weight:700;color:#7ee0c3}
.nav-feature strong{font-size:16px}
.nav-feature span{font-size:12px;line-height:1.5;color:#b9c8df}
.nav-feature b{font-size:12px;color:#8fc0ff;margin-top:6px}
.nav-feature:hover b{color:#fff}
.nav-mobile-actions{display:none}

.menu-toggle{display:none;width:40px;height:38px;border:1px solid #d6e2f0;border-radius:7px;background:#fff;padding:0;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer}
.menu-toggle span{display:block;width:16px;height:1.6px;background:#40516c;border-radius:2px;transition:transform .2s,opacity .2s}
.menu-toggle.open span:nth-child(1){transform:translateY(5.6px) rotate(45deg)}
.menu-toggle.open span:nth-child(2){opacity:0}
.menu-toggle.open span:nth-child(3){transform:translateY(-5.6px) rotate(-45deg)}

/* Footer */
.footer-grid{grid-template-columns:1.7fr repeat(6,1fr);gap:28px}
.footer-col a{font-size:11px}
.footer-news{margin-top:18px;max-width:240px}
.footer-news label{font-size:11px;font-weight:600;color:var(--ink);margin-bottom:6px}
.footer-news div{display:flex;gap:6px}
.footer-news input:not([type=checkbox]){padding:8px 10px;font-size:11px}
.footer-news .button{padding:8px 12px}
.footer-news-done{font-size:11px;color:var(--teal)}

@media(max-width:1180px){
  .nav-trigger,.nav-link{padding:9px 8px;font-size:12px}
  .header-actions .auth-nav-link{display:none}
}
@media(max-width:1020px){
  .menu-toggle{display:flex;margin-left:auto}
  .site-nav{display:none;position:absolute;left:0;right:0;top:64px;max-height:calc(100vh - 80px);overflow-y:auto;flex-direction:column;align-items:stretch;gap:0;padding:10px;background:#fff;border:1px solid #dfebf7;border-radius:12px;box-shadow:0 20px 40px -20px rgba(12,23,48,.3)}
  .site-nav.open{display:flex}
  .nav-trigger,.nav-link{width:100%;justify-content:space-between;font-size:15px;padding:13px 10px}
  .nav-panel{position:static;display:none;box-shadow:none;border:0;padding:0 0 8px;min-width:0}
  .nav-panel:before{display:none}
  .nav-item.open .nav-panel{display:block}
  .nav-cols{flex-direction:column}
  .nav-col{min-width:0;padding:0 4px}
  .nav-feature{margin:6px 4px 0}
  .nav-mobile-actions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;padding:12px 4px 4px;border-top:1px solid #edf2f8;margin-top:6px}
  .nav-mobile-actions .button{padding:11px 8px}
  .header-actions{display:none}
  .footer-grid{grid-template-columns:repeat(3,1fr)}
  .footer-brand{grid-column:1/-1}
}
@media(max-width:560px){
  .footer-grid{grid-template-columns:repeat(2,1fr)}
  .nav-mobile-actions{grid-template-columns:1fr}
}

/* pages.css styles every ".site-nav a" as a single grey line; panel links need to wrap and keep their own colours */
.site-nav .nav-col a,.site-nav .nav-feature{white-space:normal;font-size:inherit}
.site-nav .nav-feature,.site-nav .nav-feature strong{color:#fff}
.site-nav .nav-feature span{color:#b9c8df}

/* Header logo: the three bars "flow" one after another and the mark glows softly */
.site-header .brand svg{overflow:visible;animation:logo-glow 2.8s ease-in-out infinite}
.site-header .brand svg rect{transform-box:fill-box;transform-origin:left center;animation:logo-flow 2.8s cubic-bezier(.45,0,.25,1) infinite}
.site-header .brand svg rect:nth-child(2){animation-delay:.18s}
.site-header .brand svg rect:nth-child(3){animation-delay:.36s;transform-origin:right center}
.site-header .brand:hover svg,.site-header .brand:hover svg rect{animation-duration:1.4s}
@keyframes logo-flow{
  0%,55%,100%{transform:scaleX(1)}
  20%{transform:scaleX(.45)}
  38%{transform:scaleX(1.08)}
}
@keyframes logo-glow{
  0%,100%{filter:drop-shadow(0 0 0 rgba(121,167,255,0))}
  35%{filter:drop-shadow(0 0 5px rgba(121,167,255,.75)) drop-shadow(0 0 2px rgba(85,228,193,.6))}
}
@media(prefers-reduced-motion:reduce){.site-header .brand svg,.site-header .brand svg rect{animation:none}}