/* Design tokens — the single place to restyle the whole site.
   Generated from webref by extract.py; edit the prototype, not this file. */
:root{
  --white:#FFFFFF; --grey:#F5F5F4; --ink:#141310; --body:#54514B; --muted:#6E6B65; --faint:#938C80;
  --accent:#B28A57; --accent-d:#957040; --hair:#E7E6E3; --dark:#141310; --warm:#1C1815;
  --green:#3F6B54; --green-d:#2F5340; --amber:#C79A3C;
  --disp:"Schibsted Grotesk",system-ui,sans-serif; --sans:"Hanken Grotesk",system-ui,sans-serif;
  --w:1560px; --wide:1560px; --gut:clamp(22px,5vw,72px);
  /* Viewport width WITHOUT the scrollbar. Raw 100vw includes it, so a full-bleed
     element ends up ~15px too wide and its right edge gets cropped by
     body{overflow-x:hidden} — which is exactly the "not full width on the right"
     bug. A script below keeps this in sync with documentElement.clientWidth. */
  --vw:100vw;
  /* Text inside a full-bleed container lines up with the CENTRED header column
     (max-width var(--wide) + var(--gut)), not with the raw viewport gutter — that
     is what keeps the centre line intact on ultrawide. Images ignore this and keep
     running to the edge; only text is capped. Below --wide it collapses to --gut. */
  /* Beyond --maxbleed the layout stops growing: the strips centre, text stops drifting
     away from the images and --edge can no longer exceed the cell it pads. */
  --maxbleed:2200px;
  --bleed:min(var(--vw),var(--maxbleed));
  /* --edge  : text inside a CAPPED row (whatis, bands) — the row is centred on
     --bleed, so this inset lands the text exactly on the header line.
     --edge-vp: text inside a FULL-BLEED container (hero, band 03). Using --edge there
     leaves the copy far left of the header once the window passes --maxbleed. */
  --edge:max(var(--gut),calc((var(--bleed) - var(--wide))/2 + var(--gut)));
  --edge-vp:max(var(--gut),calc((var(--vw) - var(--wide))/2 + var(--gut)));
  /* Shared text measure. Edge-aligned blocks must add --edge to their max-width:
     box-sizing is border-box, so padding eats the content box and the column
     collapses to one word per line on ultrawide. */
  --measure:720px;
  /* The one hover mechanism. A button's TEXT never changes on hover — only a slight
     wash over its own resting fill, darker on light grounds and lighter on dark.
     Solid buttons darken their fill instead. Text links are the deliberate
     exception: for a link a colour shift IS the affordance. */
  --wash-lt:rgba(20,19,16,.06); --wash-dk:rgba(255,255,255,.10);
  --head-h:81px;   /* replaced with the measured height as soon as JS runs */
  --over:max(0px,calc((var(--vw) - var(--wide))/2));
}