/* =========================================================
   Site header, 2026-08-28. Markup and styles supplied by Hayden.
   Moved out of an inline <style> block so it is cached like the rest.
   ========================================================= */
.nv-header{
  --nv-mist:#EAF4EE;
  --nv-mint:#9FE3A5;
  --nv-slate:#8496A8;
  --nv-line:rgba(159,227,165,.14);
  --nv-display:"Schibsted Grotesk",system-ui,sans-serif;

  position:sticky; top:0; z-index:50;
  backdrop-filter:blur(14px) saturate(140%);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  background:rgba(7,13,11,.62);
  transition:background .3s ease, box-shadow .3s ease;
}
.nv-header.is-stuck{
  background:rgba(7,13,11,.88);
  box-shadow:0 18px 44px -30px rgba(0,0,0,.9);
}

.nv-bar{
  max-width:1440px; margin:0 auto;
  height:76px; padding:0 36px;
  display:flex; align-items:center; gap:32px;
}

.nv-brand{display:flex; align-items:center; gap:16px; text-decoration:none; flex-shrink:0}
.nv-mark{width:26px; height:26px; flex-shrink:0; display:block}
.nv-word{
  font-family:var(--nv-display); font-weight:800; font-size:20px;
  letter-spacing:-.026em; color:var(--nv-mist); line-height:1;
}
.nv-credit{
  font-family:"JetBrains Mono",ui-monospace,monospace;
  font-size:9.5px; font-weight:500; letter-spacing:.16em;
  text-transform:uppercase; color:var(--nv-slate);
  padding-left:16px; border-left:1px solid var(--nv-line);
  line-height:1.5; white-space:nowrap;
}
.nv-credit b{color:var(--nv-mint); font-weight:500}

.nv-nav{flex:1; display:flex; align-items:center; justify-content:space-evenly; gap:8px}
.nv-nav > a:not(.nv-cta){flex:1; text-align:center}
.nv-nav a:not(.nv-cta){
  position:relative; font-family:var(--nv-display);
  font-size:16px; font-weight:600; letter-spacing:-.012em;
  color:var(--nv-slate); text-decoration:none;
  padding:10px 8px; border-radius:8px;
  transition:color .22s ease;
}
.nv-nav a:not(.nv-cta)::before{
  content:""; position:absolute; left:50%; bottom:2px;
  width:5px; height:5px; border-radius:50%; background:var(--nv-mint);
  transform:translateX(-50%) scale(0);
  transition:transform .24s cubic-bezier(.34,1.56,.64,1);
}
.nv-nav a:not(.nv-cta):hover{color:var(--nv-mist)}
.nv-nav a:not(.nv-cta):hover::before{transform:translateX(-50%) scale(1)}

.nv-cta{
  margin-left:auto; flex:0 0 auto;
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--nv-display); font-size:16.5px; font-weight:700;
  letter-spacing:-.017em; color:#06120C; text-decoration:none;
  background:var(--nv-mint); padding:14px 26px; border-radius:100px;
  box-shadow:0 0 0 0 rgba(159,227,165,.4), 0 10px 26px -12px rgba(159,227,165,.55);
  transition:transform .2s ease, box-shadow .28s ease, background .2s ease;
}
.nv-cta svg{transition:transform .24s ease}
.nv-cta:hover{
  background:#B4EDB8; transform:translateY(-1px);
  box-shadow:0 0 0 5px rgba(159,227,165,.12), 0 14px 30px -12px rgba(159,227,165,.6);
}
.nv-cta:hover svg{transform:translate(3px,-3px)}

.nv-beam{
  position:relative; height:2px; overflow:hidden;
  background:linear-gradient(90deg,
    rgba(159,227,165,.06),
    rgba(159,227,165,.20),
    rgba(159,227,165,.06));
}
.nv-beam::after{
  content:""; position:absolute; top:0; left:-30%;
  width:30%; height:100%;
  background:linear-gradient(90deg,
    transparent,
    rgba(159,227,165,.5) 30%,
    #C6F5C9 50%,
    rgba(159,227,165,.5) 70%,
    transparent);
  box-shadow:0 0 14px 2px rgba(159,227,165,.55);
  animation:nv-sweep 4s linear infinite;
}
@keyframes nv-sweep{
  from{left:-30%}
  to{left:100%}
}

.nv-header a:focus-visible{outline:2px solid var(--nv-mint); outline-offset:3px; border-radius:6px}

@media (max-width:1080px){
  .nv-bar{padding:0 24px; gap:20px}
  .nv-credit{display:none}
  .nv-nav a:not(.nv-cta){font-size:14.5px}
  .nv-cta{font-size:15px; padding:12px 20px}
}
@media (max-width:820px){
  .nv-bar{flex-direction:column; align-items:stretch; height:auto; gap:0; padding:16px 20px 14px}
  .nv-brand{justify-content:flex-start; margin-bottom:14px}
  .nv-nav{width:100%; gap:6px; justify-content:space-between}
  .nv-nav a:not(.nv-cta){flex:0 1 auto; font-size:13.5px; padding:8px 2px; white-space:nowrap}
  .nv-cta{margin-left:0; font-size:13.5px; padding:10px 16px; gap:7px}
  .nv-cta svg{width:11px; height:11px}
}
@media (max-width:420px){
  .nv-bar{padding:14px 14px 12px}
  .nv-nav a:not(.nv-cta){font-size:12.5px}
  .nv-cta{font-size:12.5px; padding:9px 13px}
  .nv-word{font-size:18px}
}
@media (prefers-reduced-motion:reduce){
  .nv-header *{animation:none !important; transition:none !important}
}

/* The old fixed pill nav reserved space at the top of every page.
   The new bar is sticky and in flow, so that offset has to go. */
.hero{ padding-top: clamp(60px, 9vh, 110px); }