/* ClickWebinar — Design Tokens
 * Einzige Quelle der Wahrheit für Farben, Typografie, Abstände, Radien.
 * Extrahiert aus clickwebinar-final.html (Referenz-Design).
 */

:root {
  /* --- Hintergründe --- */
  --bg:          #FFFFFF;
  --bg-2:        #FAFAF9;
  --bg-3:        #F4F4F2;

  /* --- Text --- */
  --ink:         #0A0A0A;
  --ink-2:       #171717;
  --muted:       #525252;
  --muted-2:     #737373;

  /* --- Linien & Rahmen --- */
  --line:        #E5E5E5;
  --line-2:      #EDEDEB;

  /* --- Akzentfarbe (Koral) --- */
  --accent:      #E8553E;
  --accent-dark: #C43E28;
  --accent-soft: #FEF3F2;

  /* --- Statusfarben --- */
  --green:       #15803D;
  --green-soft:  #F0FDF4;
  --amber:       #CA8A04;
  --red:         #DC2626;
  --red-soft:    #FEF2F2;

  /* --- Schriften --- */
  --sans: 'Geist', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --mono: 'Geist Mono', ui-monospace, SFMono-Regular, monospace;

  /* --- Radien --- */
  --radius-sm:   4px;
  --radius-md:   6px;
  --radius-lg:   7px;
  --radius-xl:   8px;
  --radius-pill: 999px;

  /* --- Schatten --- */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .04);
  --shadow-md: 0 1px 2px rgba(0, 0, 0, .04), 0 0 0 1px rgba(255, 255, 255, .08) inset;
  --shadow-lg: 0 4px 16px rgba(0, 0, 0, .06);
  --shadow-focus: 0 0 0 3px rgba(10, 10, 10, .08);
  --shadow-focus-accent: 0 0 0 3px rgba(232, 85, 62, .18);

  /* --- Transitions --- */
  --t-fast:   .15s;
  --t-base:   .2s;

  /* --- Container-Breiten --- */
  --container:        1200px;
  --container-narrow: 820px;
  --container-form:   420px;
}
