/*
 * Sella Energy — Design Tokens
 * Quelle: docs/superpowers/specs/2026-05-01-sella-brand-style.md
 * Geltungsbereich: Pitch v3 · sellaenergy.com · alle Brand-Touchpoints
 */

:root {
  /* Anthrazit-Skala */
  --anthracite-900: #0E1014;
  --anthracite-800: #15181C;
  --anthracite-700: #1D2126;
  --anthracite-600: #2A2F36;
  --anthracite-500: #3D434B;

  /* Bronze-Skala */
  --bronze-300: #D4A878;
  --bronze-400: #C49862;
  --bronze-500: #B8895A;
  --bronze-600: #9C7048;
  --bronze-700: #7E5A39;

  /* Cream-Skala */
  --cream-50:  #F5F1EA;
  --cream-100: #EDE7DD;
  --paper-white: #FFFFFF;

  /* Text-Tokens */
  --text-on-dark:        #F5F1EA;
  --text-on-dark-muted:  #A4A8B0;
  --text-on-light:       #15181C;
  --text-on-light-muted: #5A6068;

  /* Funktional */
  --success: #5A8C6E;
  --warning: #C49862;
  --error:   #A85650;

  /* Icon-spezifisch (überschreibbar pro Kontext) */
  --icon-line:   var(--anthracite-800);
  --icon-accent: var(--bronze-500);

  /* Auf dunklem Hintergrund */
  --icon-line-on-dark:   var(--cream-50);
  --icon-accent-on-dark: var(--bronze-400);

  /* Typo-Skala Pitch (1280×720) */
  --type-hero:     56px;
  --type-section:  56px;
  --type-sub:      32px;
  --type-body:     18px;
  --type-quote:    22px;
  --type-caption:  14px;

  /* Line-Heights */
  --lh-tight:  1.1;
  --lh-snug:   1.3;
  --lh-normal: 1.55;

  /* Spacing-Skala */
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   16px;
  --space-4:   24px;
  --space-5:   32px;
  --space-6:   48px;
  --space-7:   64px;
  --space-8:   80px;

  /* Radius (sparsam) */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
}

html, body {
  font-family: "Inter", system-ui, -apple-system, sans-serif;
  font-feature-settings: "ss01", "cv11";
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}