/* Juno Media — tokens. Gemeten op mrboost.nl, zie DESIGN-DNA.md. De enige bron voor kleur, type en ritme. */

:root {
  /* kleur */
  --zwart: #0A0A0A;
  --nacht: #14110F;
  --krijt: #E9E8E3;
  --wit: #F2F2F2;
  --grijs-licht: #CFCFCF;
  --grijs: #8A8A86;
  --grijs-donker: #2A2A28;
  --lijn-donker: rgba(233, 232, 227, 0.12);
  --lijn-licht: rgba(10, 10, 10, 0.14);
  --juno: #1E6FB8;      /* uit het logo — alleen als klein signaal */
  --juno-licht: #46B0DA;
  --groen: #25D366;     /* WhatsApp en "live"-stip */

  /* type */
  --font-kop: "Montserrat", "Gotham Ultra", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-tekst: "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, monospace;

  --h1: clamp(3.4rem, 9.4vw, 8.5rem);
  --h2: clamp(2.6rem, 5.4vw, 4.8rem);
  --h3: clamp(1.4rem, 2vw, 1.75rem);
  --cijfer: clamp(2.6rem, 3.6vw, 3.2rem);
  --marquee: clamp(3rem, 5.3vw, 4.75rem);
  --lead: clamp(1.15rem, 1.5vw, 1.375rem);
  --tekst: 1rem;
  --klein: 0.8125rem;

  --kop-lh: 0.79;
  --kop-ls: -0.027em;

  /* ritme */
  --shell: 1240px;
  --zij: clamp(20px, 3.5vw, 50px);
  --sectie: clamp(96px, 11vw, 160px);

  /* vorm */
  --r-kaart: 18px;
  --r-tegel: 20px;
  --r-pill: 999px;
  --knop-h: 45px;

  --ease: cubic-bezier(.2, .7, .2, 1);
}