/* Shared public-site header and footer. Keep page-specific layout out of this file. */
html,body { max-width:100%; overflow-x:hidden; overflow-x:clip; }
body { min-width:0; }
body.menu-open { overflow:hidden; }

.site-header {
  position:fixed;
  z-index:100;
  inset:0 0 auto;
  height:var(--header);
  border-bottom:1px solid var(--line);
  background:rgba(8,9,10,.88);
  backdrop-filter:blur(18px);
}

.site-header__inner {
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.brand { display:inline-flex; align-items:center; }
.brand img { width:96px; transition:transform var(--motion-fast) var(--ease-out),opacity var(--motion-fast) ease; }
.brand:hover img,.brand:focus-visible img { transform:scale(1.025); opacity:.92; }

.desktop-nav { display:flex; align-items:center; gap:4px; }
.desktop-nav > a {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  padding:0 14px;
  color:var(--fog);
  font-size:13px;
  line-height:1.2;
  transition:color .16s ease;
}
.desktop-nav > a:hover,.desktop-nav > a:focus-visible { color:var(--paper); }
.desktop-nav > a:not(.button) { position:relative; }
.desktop-nav > a:not(.button)::after {
  content:"";
  position:absolute;
  right:14px;
  bottom:7px;
  left:14px;
  height:1px;
  background:var(--lime);
  transform:scaleX(0);
  transform-origin:right;
  transition:transform var(--motion-fast) var(--ease-out);
}
.desktop-nav > a:not(.button):hover::after,.desktop-nav > a:not(.button):focus-visible::after { transform:scaleX(1); transform-origin:left; }

.button {
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:9px 15px;
  border:1px solid transparent;
  border-radius:6px;
  cursor:pointer;
  font:500 13px/1.2 var(--sans);
  letter-spacing:-.01em;
  white-space:nowrap;
  transition:transform .16s ease,background .16s ease,border-color .16s ease,color .16s ease;
}
.button:hover { transform:translateY(-1px); }
.button:active { transform:translateY(0); }
.button--primary { background:var(--lime); color:var(--void); box-shadow:rgba(0,0,0,.01) 0 5px 2px,rgba(0,0,0,.04) 0 3px 2px,rgba(0,0,0,.07) 0 1px 1px,rgba(0,0,0,.08) 0 0 1px; }
.button--primary:hover,.button--primary:focus-visible { background:var(--lime-hover,#f0ff25); color:var(--void); }
.button--neutral { background:var(--paper); color:var(--void); }
.button--neutral:hover,.button--neutral:focus-visible { background:var(--bone,#e5e5e6); color:var(--void); }
.button--sm { min-height:32px; padding:6px 11px; font-size:12px; }
.button .icon { width:18px; height:18px; flex:0 0 18px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.desktop-nav > .button--primary,
.desktop-nav > .button--primary:hover,
.desktop-nav > .button--primary:focus-visible { color:var(--void); }

.menu-button {
  width:44px;
  height:44px;
  display:none;
  place-content:center;
  gap:6px;
  border:1px solid var(--line);
  border-radius:6px;
  background:var(--carbon);
  color:inherit;
  cursor:pointer;
  font:inherit;
}
.menu-button i { width:18px; height:1px; background:var(--paper); transition:transform .16s ease; }
.menu-button[aria-expanded="true"] i:first-of-type { transform:translateY(3.5px) rotate(45deg); }
.menu-button[aria-expanded="true"] i:last-of-type { transform:translateY(-3.5px) rotate(-45deg); }

.mobile-nav {
  position:fixed;
  z-index:90;
  inset:var(--header) 0 0;
  display:grid;
  align-content:start;
  padding:18px 20px 32px;
  background:rgba(8,9,10,.98);
}
.mobile-nav[hidden] { display:none; }
.mobile-nav:not([hidden]) { animation:menu-in 240ms var(--ease-out) both; }
.mobile-nav a {
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid var(--line);
  color:var(--mist);
  font-size:18px;
  line-height:1.3;
}
.mobile-nav a::after { content:"↗"; color:var(--lime); font-size:13px; }
.mobile-nav:not([hidden]) a { animation:menu-link-in 320ms var(--ease-out) both; }
.mobile-nav:not([hidden]) a:nth-child(2) { animation-delay:35ms; }
.mobile-nav:not([hidden]) a:nth-child(3) { animation-delay:70ms; }
.mobile-nav:not([hidden]) a:nth-child(4) { animation-delay:105ms; }
.mobile-nav:not([hidden]) a:nth-child(5) { animation-delay:140ms; }

.site-footer { border-top:1px solid var(--line); }
.footer-inner {
  min-height:190px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:30px;
}
.footer-links { display:flex; gap:6px; }
.footer-links a,.footer-links button {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  padding:0 10px;
  border:0;
  background:none;
  color:var(--fog);
  cursor:pointer;
  font-family:inherit;
  font-size:12px;
  line-height:1.2;
}
.footer-links a:hover,.footer-links a:focus-visible,.footer-links button:hover,.footer-links button:focus-visible { color:var(--paper); }
.copyright { justify-self:end; color:var(--fog); font:10px var(--mono); text-transform:uppercase; }

.cookie-consent {
  position:fixed;
  z-index:220;
  right:24px;
  bottom:24px;
  width:min(620px,calc(100vw - 48px));
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:22px;
  padding:24px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:10px;
  background:rgba(17,18,19,.98);
  box-shadow:0 24px 80px rgba(0,0,0,.42);
  color:var(--paper);
  box-sizing:border-box;
  overflow:hidden;
}
.cookie-consent * { box-sizing:border-box; }
.cookie-consent[hidden] { display:none; }
.cookie-consent__copy { min-width:0; }
.cookie-consent__eyebrow { margin:0 0 10px; color:var(--lime); font:10px/1.2 var(--mono); letter-spacing:.12em; text-transform:uppercase; }
.cookie-consent h2 { margin:0; color:var(--paper); font-size:20px; font-weight:500; line-height:1.2; letter-spacing:-.025em; }
.cookie-consent__copy > p:last-child { max-width:430px; margin:12px 0 0; color:var(--fog); font-size:13px; line-height:1.55; overflow-wrap:anywhere; }
.cookie-consent a { color:var(--paper); text-decoration:underline; text-decoration-color:rgba(228,242,34,.55); text-underline-offset:3px; }
.cookie-consent__actions { display:flex; flex-direction:column; justify-content:end; gap:8px; }
.cookie-consent__button {
  min-width:116px;
  min-height:42px;
  padding:10px 14px;
  border:1px solid var(--line);
  border-radius:6px;
  background:transparent;
  color:var(--paper);
  cursor:pointer;
  font:500 13px/1.2 var(--sans);
  transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease;
}
.cookie-consent__button:hover,.cookie-consent__button:focus-visible { border-color:rgba(255,255,255,.4); background:rgba(255,255,255,.06); }
.cookie-consent__button--primary { border-color:var(--lime); background:var(--lime); color:var(--void); }
.cookie-consent__button--primary:hover,.cookie-consent__button--primary:focus-visible { background:#f0ff25; color:var(--void); }
.cookie-consent__button:active { transform:translateY(1px); }
.cookie-consent__close {
  position:absolute;
  top:8px;
  right:8px;
  width:36px;
  height:36px;
  border:0;
  background:transparent;
  color:var(--fog);
  cursor:pointer;
  font:300 23px/1 var(--sans);
}
.cookie-consent__close:hover,.cookie-consent__close:focus-visible { color:var(--paper); }

@keyframes menu-in { from { opacity:0; transform:translateY(-10px); } }
@keyframes menu-link-in { from { opacity:0; transform:translateY(-8px); } }

@media (max-width:960px) {
  .desktop-nav { display:none; }
  .menu-button { display:grid; }
  .footer-inner { grid-template-columns:1fr auto; }
  .footer-links { order:3; grid-column:1/-1; }
}

@media (max-width:640px) {
  .footer-inner { min-height:230px; grid-template-columns:1fr; align-content:center; gap:16px; }
  .footer-links { grid-column:1; flex-wrap:wrap; margin-left:-10px; }
  .copyright { justify-self:start; }
  .cookie-consent { right:12px; bottom:12px; left:12px; width:auto; max-width:none; grid-template-columns:1fr; gap:18px; padding:22px 18px 18px; }
  .cookie-consent__copy { padding-right:22px; }
  .cookie-consent__actions { display:grid; grid-template-columns:1fr; }
  .cookie-consent__button { flex:1; min-width:0; }
}

@media (prefers-reduced-motion:reduce) {
  .button:hover,.brand:hover img,.brand:focus-visible img { transform:none; }
  .mobile-nav:not([hidden]),.mobile-nav:not([hidden]) a { animation:none; }
  .brand img,.desktop-nav > a:not(.button)::after,.button,.menu-button i,.cookie-consent__button { transition:none; }
}