/* ============================================================
   TOKENS — Oliver Høy El & Teknik · design-DNA: "Ren strøm" (blå/hvid)
   ============================================================
   KONTRAKTEN (UNIKHED.md): variabelNAVNENE er ens på alle Madsen
   Studio-sider — VÆRDIERNE er det aldrig. Alt udseende refererer
   hertil; ingen hex-koder eller font-navne andre steder i CSS'en.
   Divergerer bevidst fra Brdr. Østergaard (beige/brun + serif):
   her = kølig blå/hvid + grotesk-display + mono-labels = elektriker.
   ============================================================ */

:root {
  /* ---------- Flader (lys, ren verden — hvid/sort/orange fra Emils logo) ---------- */
  --bg:        #FAFAF8;   /* varm off-white primær flade */
  --bg-2:      #FFFFFF;   /* rene hvide løftede kort/fotorammer */
  --bg-3:      #F1EFEA;   /* lyst neutralt emphasis-bånd */

  /* ---------- Tekst (sort/grå verden) ---------- */
  --ink:       #1A1A1A;   /* næsten sort — generel/stærk tekst (WCAG AAA) */
  --head:      #0E0E0E;   /* overskrifter = sort */
  --ink-2:     #333333;   /* brødtekst = mørk grå (WCAG AA ~11:1 på --bg) */
  --ink-3:     #6A6A6A;   /* tertiær/svag grå (WCAG AA ~5:1 på --bg) */
  --paper:     #F6F5F2;   /* off-white tekst PÅ mørkt bånd */
  --paper-2:   #B8B7B3;   /* dæmpet tekst på mørkt bånd */
  --surface-dark: #171717; /* de mørke sektioners flade = næsten sort */

  /* ---------- Identitet (Emils orange = sidens eneste accent) ---------- */
  --accent:        #FF7A0A;            /* Emils orange (aflæst fra logoet) */
  --accent-deep:   #B85C0E;            /* mørk orange = tekst-accent/hover på lys (WCAG AA ~4.6:1) */
  --accent-soft:   rgba(255,122,10,0.14);
  --accent-line:   rgba(255,122,10,0.5);
  --cta:           #171717;            /* primær knap = sort (premium; orange er accenten) */
  --cta-deep:      #000000;

  /* ---------- Streger ---------- */
  --hairline:   rgba(20, 20, 20, 0.12);
  --hairline-2: rgba(20, 20, 20, 0.20);
  --hairline-d: rgba(246, 245, 242, 0.16); /* streg på mørkt bånd */

  /* ---------- Typografi (Familjen Grotesk + Hanken Grotesk + Space Mono — ALDRIG Inter/Roboto/system) ---------- */
  --f-display: "Familjen Grotesk", "Helvetica Neue", Arial, sans-serif;
  --f-body:    "Hanken Grotesk", system-ui, sans-serif;
  --f-mono:    "Space Mono", ui-monospace, monospace; /* eyebrows/indeks = mono UPPERCASE+tracking = teknisk */

  /* ---------- Typeskala (rolig, redaktionel — serif må blive STOR) ---------- */
  --t-display-xl: clamp(45px, 7vw, 110px);
  --t-display-l:  clamp(36px, 5.6vw, 84px);
  --t-display-m:  clamp(27px, 3.2vw, 46px);
  --t-display-s:  clamp(22px, 2.2vw, 31px);
  --t-lead:       clamp(18px, 1.45vw, 22px);
  --t-body:       17px;
  --t-small:      14.5px;
  --t-eyebrow:    12.5px;

  /* ---------- Rytme ---------- */
  --s-1: 4px;  --s-2: 8px;   --s-3: 12px;
  --s-4: 16px; --s-5: 24px;  --s-6: 32px;
  --s-7: 48px; --s-8: 64px;  --s-9: 96px;
  --s-10: 144px;

  --gutter: clamp(22px, 5vw, 76px);
  --rhythm: clamp(56px, 7vw, 112px);
  --max:    1320px;
  --measure: 62ch;

  /* ---------- Bevægelses-personlighed (rolig side) ---------- */
  --ease:      cubic-bezier(0.22, 1, 0.36, 1);
  --ease-soft: cubic-bezier(0.33, 0.02, 0.18, 1);
  --dur:       850ms;
  --dur-fast:  300ms;

  /* reveal-motor (overskrives pr. sektion ved behov) */
  --reveal-y:    26px;
  --reveal-dur:  900ms;
  --reveal-step: 90ms;
  --reveal-blur: 8px;

  /* ---------- Form (arkitektonisk = ret lav radius) ---------- */
  --r-1:    3px;
  --r-card: 5px;
  --r-pill: 999px;

  /* ---------- Skygger (lys, kølig verden = bløde, lange, blå) ---------- */
  --shadow-1: 0 1px 2px rgba(20,20,20,0.05), 0 8px 24px rgba(20,20,20,0.07);
  --shadow-2: 0 2px 6px rgba(20,20,20,0.06), 0 24px 60px rgba(20,20,20,0.12);
  --shadow-photo: 0 30px 70px -28px rgba(20,20,20,0.34);
}
