/* ============================================================
   Design tokens — keskitetyt arvot väreille, typografialle,
   tiloille ja liikkeelle. Muutokset vain tähän tiedostoon.
   ============================================================ */
:root {
  /* Värit — lämmin maanläheinen pohja */
  --paper: #F4F0E8;        /* lämmin luonnonvalkoinen */
  --stone: #E8E0D3;        /* lämmin kivi */
  --sand: #D8C8AE;         /* hiekka */
  --forest: #33473C;       /* metsänvihreä */
  --navy: #24333D;         /* satunnainen laivastonsininen */
  --ink: #353A39;          /* pehmeä hiili — pääteksti */
  --ink-soft: #5A615D;     /* toissijainen teksti */
  --ink-faint: #7C817B;
  --line: rgba(53, 58, 57, 0.14);
  --line-strong: rgba(53, 58, 57, 0.32);
  --cream: #FBF9F3;
  --white: #FFFDF8;

  /* Varjo — hyvin pehmeä, vain korotukseen */
  --shadow: 0 18px 50px -24px rgba(36, 51, 61, 0.25);

  /* Typografia */
  --serif: "Source Serif 4", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --fs-hero: clamp(2.5rem, 5.6vw, 4.4rem);
  --fs-h2: clamp(1.85rem, 3.4vw, 2.8rem);
  --fs-h3: 1.25rem;
  --fs-body: 1.0625rem;
  --fs-small: 0.9375rem;
  --fs-micro: 0.8125rem;

  --lh-tight: 1.15;
  --lh-body: 1.72;

  /* Tila */
  --maxw: 1180px;
  --gutter: clamp(1.25rem, 5vw, 3.5rem);
  --section-pad: clamp(4.5rem, 10vw, 8.5rem);
  --radius: 14px;
  --radius-sm: 8px;

  /* Liike */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur: 0.45s;
}