/* FNDR brand tokens. Single source of truth.
 * Gebruik deze waarden in alle merkuitingen en demonstreer ze in brand.html.
 * Fontpaden zijn relatief: url() lost op tegen dit bestand, niet tegen de pagina.
 * Fonts: Geist en Geist Mono (OFL), Switzer (Fontshare). Zie fonts/LICENSES.md.
 */

/* font-display is swap, niet block. Met block houdt de browser de tekst onzichtbaar tot het
 * bestand binnen is, en de displaykop is op elke pagina het grootste element in beeld: precies
 * wat Google als LCP meet. Swap toont direct een fallback en wisselt daarna. Voorwaarde is dat
 * elke pagina de twee dragende fonts preloadt, anders ruil je onzichtbare tekst in voor een
 * zichtbaar springende kop. GeistMono draagt alleen kleine labels en wordt bewust niet
 * gepreload. */
@font-face{font-family:'Geist';src:url('./fonts/geist-var.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'GeistMono';src:url('./fonts/geistmono-var.woff2') format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'Switzer';src:url('./fonts/switzer-var.woff2') format('woff2');font-weight:100 900;font-display:swap}

:root{
  /* colour */
  --blue:#1100ff; --blue-dk:#0d00cc;
  --paper:#ffffff; --paper-2:#f4f5f8; --paper-3:#eaecf3;
  --ink:#0a0d16; --ink-70:#414759; --ink-45:#6a7185; --ink-22:#bcc1ce;
  --line:rgba(10,13,22,.10); --line-strong:rgba(10,13,22,.42);
  --warm:#d6ad91; --err:#d92d20;
  /* type */
  --display:'Geist'; --body:'Switzer'; --mono:'GeistMono';
  --t-display:clamp(2.75rem,1rem + 7vw,7rem);
  --t-h2:clamp(1.4rem,.95rem + 1.5vw,2rem);
  --t-lead:clamp(1.02rem,.96rem + .4vw,1.28rem);
  --t-body:1rem;
  --t-label:.82rem;
  --w-display:450; --w-head:500; --w-body:400; --w-lead:300;
  /* space, 4px base */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px;
  --s7:48px; --s8:64px; --s9:96px; --s10:128px;
  --gut:clamp(1.25rem,5vw,6.5rem); --content-max:1360px;
  --section:clamp(3rem,7vw,6.5rem);
  /* form */
  --r-cell:20px; --r-pill:999px; --bento-gap:12px;
  /* motion */
  --ease:cubic-bezier(.16,1,.3,1);
  --d-micro:200ms; --d-comp:450ms; --d-reveal:800ms;
  --logo-rest-angle:10deg; --logo-spin-duration:36s;
  /* identity */
  --logo-min-size:24px; --logo-clear-space:.25em;
  --lockup-mark-size:1em; --lockup-gap:.375em;
  /* guide surfaces */
  --guide-copy-max:44rem; --guide-preview-max:90rem;
  --preview-ratio-wide:16 / 9; --preview-ratio-portrait:4 / 5;
  --preview-ratio-square:1 / 1; --preview-ratio-a4:210 / 297;
  /* image treatment */
  --grain-opacity-soft:.08; --grain-opacity-strong:.18;
  --image-veil-strength:.28;
  --raster-cell-size:8px; --raster-dot-radius:1.4px;
  --photo-halftone-cell-size:12px; --photo-halftone-dot-scale:1.42;
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='250' height='250'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}