/* Unknown Architects — design tokens
   Concept "Van lijn naar gebouw". Zie BRIEFING §4. */

@font-face {
  font-family: "Inter Tight";
  src: url("assets/fonts/inter-tight-latin-300-normal.woff2") format("woff2");
  font-weight: 300; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Inter Tight";
  src: url("assets/fonts/inter-tight-latin-400-normal.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Inter Tight";
  src: url("assets/fonts/inter-tight-latin-500-normal.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}
/* Contrastletter: DM Mono. Het lichte lijngewicht volgt het dunne wordmark; mono verwijst naar
   maatvoering en het tekeningstempel op bouwtekeningen. Gebruikt voor labels, meta en tellers. */
@font-face {
  font-family: "DM Mono";
  src: url("assets/fonts/dm-mono-latin-400-normal.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}

:root {
  /* Kleur */
  --ink:      #111111;   /* tekst, lijnen, wordmark */
  --paper:    #F5F3EF;   /* hoofdondergrond: warm gebroken wit */
  --paper-2:  #ECE8E1;   /* alternerende sectie */
  --stone:    #6B665F;   /* secundaire tekst. Briefing: #8A857D, maar die haalt 3,3:1 op paper. Deze: 5,1:1 (paper), 4,7:1 (paper-2) */
  --line:     rgba(17,17,17,.12);  /* hairlines */
  --grid:     rgba(17,17,17,.06);  /* decoratief 12-koloms raster */
  /* Accent, gesampled: rode lijnen isometrie Leidsestraat ≈ #C77667 (gevelontwerp Oudeschans) / #CF9B8E (anti-aliased),
     dakpannen House on a Dune ≈ #AE7054. #A94B34 zit er tussenin en haalt 5,1:1 op paper en 4,6:1 op paper-2,
     dus ook bruikbaar voor kleine tekst. Op --night wordt --accent-night gebruikt. */
  --accent:       #A94B34;
  --accent-night: #D8775C;   /* 5,6:1 op --night */
  --night:        #161513;
  --night-line:   rgba(245,243,239,.14);
  --night-stone:  #A39E95;   /* 7,0:1 op --night */

  /* Typografie */
  --font-sans: "Repro", "Inter Tight", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "DM Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --fs-display: clamp(4.5rem, 16vw, 17rem);
  --fs-h1:      clamp(2.25rem, 4.6vw, 4.5rem);
  --fs-h2:      clamp(2rem, 4vw, 3.5rem);
  --fs-h3:      clamp(1.25rem, 1.8vw, 1.625rem);
  --fs-body:    clamp(1rem, 1.1vw, 1.125rem);
  --fs-small:   0.9375rem;
  --fs-label:   0.8125rem;   /* kapitalen, letter-spacing .08em */

  /* Ruimte: 8px-grid */
  --s-1: 8px; --s-2: 16px; --s-3: 24px; --s-4: 32px; --s-6: 48px;
  --s-8: 64px; --s-12: 96px; --s-16: 128px; --s-20: 160px;
  --gutter: clamp(16px, 3vw, 40px);
  --col-gap: clamp(16px, 1.7vw, 24px);
  --section-y: clamp(96px, 12vw, 192px);
  --nav-h: 72px;

  /* Motion */
  --ease-out:  cubic-bezier(.22,1,.36,1);
  --ease-lock: cubic-bezier(.7,0,.2,1);
  --dur-1: 200ms; --dur-2: 400ms; --dur-3: 800ms;

  /* Vorm: architectonisch vrijwel scherp; CTA's als pil (boog van de O in het wordmark) */
  --radius: 2px;
  --radius-pill: 999px;
}
