/* leomore v2 · Tokens (SSoT, design.md §3). Einzige Datei mit Farbwerten. */
:root {
  /* Marke */
  --c-paper:      #FBF8F3;
  --c-ink:        #211A12;
  --c-yellow:     #F9DD00;
  --c-orange:     #F8950A;
  --c-orange-red: #F85701;
  --c-red:        #F70806;
  --grad: linear-gradient(90deg, var(--c-yellow), var(--c-orange) 40%, var(--c-orange-red) 70%, var(--c-red));
  --grad-v: linear-gradient(180deg, var(--c-yellow), var(--c-orange) 40%, var(--c-orange-red) 70%, var(--c-red));

  /* Neutrale */
  --c-ink-2:      #5C5145;
  --c-ink-3:      #6E6255;
  --c-surface:    #F2ECE2;
  --c-surface-2:  #E9E1D5;
  --c-line:       rgb(33 26 18 / .12);
  --c-line-strong:rgb(33 26 18 / .24);
  --c-paper-88:   rgb(251 248 243 / .88);
  --c-ink-scrim:  rgb(33 26 18 / .4);
  --c-night-veil: rgb(33 26 18 / .76);

  /* Dunkle Kapitel */
  --c-night:      #211A12;
  --c-night-2:    #2E261D;
  --c-on-night:   #FBF8F3;
  --c-on-night-2: #CDC3B6;
  --c-line-night: rgb(251 248 243 / .14);

  /* Funktional */
  --c-ok:         #2F6B3A;
  --c-ok-soft:    rgb(47 107 58 / .12);
  --c-focus:      #211A12;
  --c-error:      #A93A00;

  /* Typografie */
  --f-display: "Clash Display", "Clash Fallback", system-ui, sans-serif;
  --f-text:    "General Sans", "General Fallback", system-ui, sans-serif;
  --t-display: clamp(2.75rem, 1.6rem + 4.9vw, 5.5rem);
  --t-h2:      clamp(2rem, 1.25rem + 3.2vw, 3.75rem);
  --t-h3:      clamp(1.25rem, 1.1rem + 0.6vw, 1.625rem);
  --t-lead:    clamp(1.125rem, 1.05rem + 0.35vw, 1.375rem);
  --t-body:    clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
  --t-small:   0.875rem;
  --t-micro:   0.8125rem;

  /* Abstände */
  --s-1: .25rem; --s-2: .5rem; --s-3: .75rem; --s-4: 1rem; --s-5: 1.5rem;
  --s-6: 2rem;  --s-7: 3rem;  --s-8: 4rem;  --s-9: 6rem; --s-10: 8rem;
  --section:   clamp(4.5rem, 2.5rem + 7vw, 9rem);
  --gutter:    clamp(1.25rem, 0.6rem + 2.8vw, 2.5rem);
  --container: 76rem;
  --measure:   60ch;
  --header-h:  3.5rem;
  --thumb-h:   4.5rem;

  /* Radien */
  --r-card:  1.25rem;
  --r-field: 0.875rem;
  --r-pill:  999px;
  --r-inner: calc(var(--r-card) - 6px);

  /* Schatten */
  --sh-1: 0 1px 0 rgb(33 26 18 / .05), 0 1px 2px rgb(33 26 18 / .06);
  --sh-2: 0 1px 0 rgb(33 26 18 / .04), 0 12px 32px -12px rgb(33 26 18 / .22);
  --sh-3: 0 24px 64px -24px rgb(33 26 18 / .35);

  /* Bewegung */
  --ease-out:    cubic-bezier(.22, 1, .36, 1);
  --ease-spring: cubic-bezier(.32, .72, 0, 1);
  --d-fast: 160ms; --d-base: 320ms; --d-slow: 600ms;
  --reveal-y: 16px;
}

@media (min-width: 600px) {
  :root { --header-h: 4rem; --r-card: 1.5rem; }
}
@media (min-width: 1024px) {
  :root { --header-h: 4.5rem; }
}