/* =========================================================
   Manna Bunsik — Design Tokens
   Schwarz gegen Knochenweiß, harte Wechsel zwischen den
   Sektionen. Farbe ist die Ausnahme: das Petrol-Türkis vom
   Ladenschild in kleinster Dosis. Kein Gelb, kein Orange.
   ========================================================= */

:root {
  /* Farben */
  --ink:        #0A0A0A;   /* echtes Schwarz – maximaler Kontrast */
  --ink-soft:   #171717;
  --paper:      #F2F0EA;   /* Knochenweiß, kühl statt cremig */
  --paper-deep: #E2DFD6;

  --teal:        #1D7A82;  /* Schriftzug am Laden – sehr sparsam dosiert */
  --teal-bright: #58C7BE;  /* dasselbe, aufgehellt für dunklen Grund */
  --wood:        #6B5B4A;
  --stripe:      #C8402F;  /* nur für „scharf“ */

  --bg:     var(--paper);
  --fg:     var(--ink);
  --accent: var(--teal);
  --muted:  color-mix(in srgb, var(--ink) 60%, var(--paper));
  --line:   color-mix(in srgb, var(--ink) 15%, transparent);
  --on-accent: var(--paper);   /* Textfarbe auf Akzentflächen */

  /* Typografie */
  --font-display: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --font-body:    'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --font-ko:      'Noto Sans KR', 'Apple SD Gothic Neo', sans-serif;

  --step--1: clamp(0.78rem, 0.75rem + 0.15vw, 0.86rem);
  --step-0:  clamp(0.95rem, 0.9rem + 0.25vw, 1.06rem);
  --step-1:  clamp(1.15rem, 1.05rem + 0.5vw, 1.4rem);
  --step-2:  clamp(1.5rem, 1.2rem + 1.4vw, 2.4rem);
  --step-3:  clamp(2.2rem, 1.4rem + 3.8vw, 5rem);
  --step-4:  clamp(3rem, 1rem + 8vw, 9rem);
  --step-5:  clamp(4rem, 0.5rem + 15vw, 17rem);

  /* Raster & Rhythmus */
  --gutter: clamp(1.25rem, 4vw, 4rem);
  --section-y: clamp(5rem, 12vh, 11rem);
  --maxw: 1600px;

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 0.6s;
}

/* Dunkle Sektionen: Gelb wird zum Akzent */
.on-dark {
  --bg: var(--ink);
  --fg: var(--paper);
  --accent: var(--teal-bright);
  --on-accent: var(--ink);
  --muted: color-mix(in srgb, var(--paper) 60%, var(--ink));
  --line: color-mix(in srgb, var(--paper) 18%, transparent);
  background: var(--bg);
  color: var(--fg);
}