/* ============================================================
   ESSE — Design Tokens
   EINZIGE Quelle für Farbe, Typo-Skala, Spacing, Motion im CSS.
   Rebranding: nur diese Datei + brand/brand.config.mjs ändern.
   ============================================================ */
:root {
  /* Farbwelt (Herleitung: Kohle, Glut, Asche, Stahl, Messing) */
  --bg:           #12100E;
  --surface:      #1E1915;
  --surface-2:    #272019;
  --ink:          #EDE4D8;
  --accent:       #F15A22;
  --accent-deep:  #8C2F1B;
  --ember-bright: #FFB37A;
  --muted:        #8A8178;
  --detail:       #B87B4A;

  /* Verläufe */
  --grad-ember: linear-gradient(90deg, var(--accent-deep) 0%, var(--accent) 55%, var(--ember-bright) 100%);
  --glow-ember: 0 0 12px rgba(241, 90, 34, 0.55), 0 0 42px rgba(241, 90, 34, 0.25);

  /* Typografie */
  --font-display: 'Fraunces Variable', Georgia, serif;
  --font-body:    'Archivo Variable', Helvetica, Arial, sans-serif;
  --font-mono:    'Martian Mono Variable', 'Courier New', monospace;

  /* Typo-Skala */
  --text-wordmark: min(31vw, 44vh);   /* Hero ESSE., nach Sicht justieren: Ziel ~92vw Breite */
  --text-h1: clamp(3.2rem, 8vw, 7.5rem);
  --text-h2: clamp(2.2rem, 5vw, 4.5rem);
  --text-manifest: clamp(1.8rem, 4.2vw, 3.6rem);
  --text-body: clamp(1rem, 1.1vw, 1.125rem);
  --text-mono: 0.8125rem;
  --text-kicker: 0.75rem;
  --track-kicker: 0.18em;

  /* Spacing */
  --space-1: 0.5rem;  --space-2: 1rem;   --space-3: 1.5rem; --space-4: 2rem;
  --space-6: 3rem;    --space-8: 4rem;   --space-12: 6rem;  --space-16: 8rem;
  --section-pad: clamp(6rem, 14vh, 10rem);
  --gutter: clamp(1.25rem, 4vw, 4rem);
  --container-max: 90rem;

  /* Schatten (konstruierte Kontaktschatten der Cutouts) */
  --shadow-contact: 0 18px 32px -12px rgba(0, 0, 0, 0.72);
  --shadow-panel: 0 24px 60px -24px rgba(0, 0, 0, 0.6);

  /* Motion (CSS-Seite; GSAP-Werte in js/motion.config.js) */
  --dur-hover: 200ms;
  --ease-out-hard: cubic-bezier(0.16, 1, 0.3, 1);

  /* Z-Ordnung */
  --z-nav: 40; --z-overlay: 50; --z-splash: 60;
}
