/* ==========================================================================
   asmr.at — Design Tokens (Redesign v2)
   Konzept: "Sanfte Session" — hell, weich, atmosphärisch, eindeutig ASMR.
   Ersetzt das bisherige dunkle "Mitternacht/Lavendelglanz"-System vollständig.
   Basis: Cremeweiß, sehr helles Lavendel, zartes Rosé. Kräftigere Violett-/
   Pink-Töne nur für Buttons, Akzente, Icons und aktive Zustände — keine
   großflächigen dunklen oder knalligen Flächen.
   ========================================================================== */

:root {
  /* --- Grundflächen (hell, überwiegend) --- */
  --color-bg: #FCF8FF;             /* Cremeweiß mit Lavendel-Stich, Seitenhintergrund */
  --color-bg-soft: #F5ECFF;        /* helles Lavendel, für Sektionswechsel */
  --color-surface: #FFFFFF;        /* Karten, Formulare */
  --color-surface-raised: #FBF3FF; /* Karten im Hover/aktiv, minimal getönt */
  --color-surface-lilac: #EADCFF;  /* Sektionsfläche: helles Violett */
  --color-surface-pink: #F9DFF1;   /* Sektionsfläche: zartes Rosé */
  --color-border: #DFCCEF;

  /* --- Text (dunkel auf hell, ausreichend Kontrast) --- */
  --color-text: #30263D;
  --color-text-muted: #6E6079;
  --color-text-faint: #6E5F80;
  --color-heading: #3E294F;

  /* --- Akzente: kräftiger, aber nur für Buttons/Icons/aktive Zustände --- */
  --color-accent: #9B5DE5;          /* Primär-Violett */
  --color-accent-strong: #8245CA;   /* Hover/aktiv, auch für Text auf hell */
  --color-accent-warm: #DF6FC1;     /* Sekundär-Rosé (nur für Flächen/Icons, nicht als Textfarbe auf Weiß) */
  --color-accent-warm-strong: #B23A88; /* AA-sicher für weißen Text auf Verlauf/Buttons */

  --color-warning-bg: #FFF2E9;
  --color-warning-border: #D98A52;
  --color-warning-text: #6B3A1E;

  --color-info-bg: #EDF9F5;
  --color-info-border: #6FA88F;
  --color-info-text: #2C5F4E;

  --color-affiliate: #8A4B72;      /* dunkles Mauve — lesbar auf Weiß, Kennzeichnungstext */

  --gradient-brand: linear-gradient(135deg, #8245CA 0%, #B23A88 100%);
  --gradient-hero: linear-gradient(135deg, #F9EFFF 0%, #F4DCF5 45%, #E7D4FF 100%);

  /* --- Trigger-Kategoriefarben (Hintergrundflächen, nicht als Fließtextfarbe) --- */
  --cat-whisper-bg: #EADCFF;   --cat-whisper-text: #4B2E73;   /* Flüstern: Lavendel */
  --cat-tapping-bg: #F9DFF1;   --cat-tapping-text: #7A2E5C;   /* Tapping: Rosé */
  --cat-brushing-bg: #E4D6FA;  --cat-brushing-text: #48306E;  /* Brushing: helles Violett */
  --cat-notalking-bg: #FBF2E3; --cat-notalking-text: #6B5433; /* No Talking: Creme/Mauve */
  --cat-personal-bg: #FCE1EE;  --cat-personal-text: #7A2E56;  /* Personal Attention: Pink */
  --cat-visual-bg: #DCE4FA;    --cat-visual-text: #2E3E73;    /* Visual ASMR: Fliederblau */

  /* --- Footer: einziger bewusst dunklerer Kontrastbereich --- */
  --color-footer-bg: #3E2A54;
  --color-footer-text: #E7D9F5;
  --color-footer-text-muted: #C3AEDA;
  --color-footer-border: #55396E;
  --color-footer-accent: #F0A6D6;

  /* --- Typografie: keine extern geladenen Fonts, robuste System-Stacks --- */
  --font-display: Georgia, "Iowan Old Style", "Times New Roman", serif;
  --font-body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

  --fs-100: 0.8125rem;
  --fs-200: 0.9375rem;
  --fs-300: 1.0625rem;
  --fs-400: 1.25rem;
  --fs-500: 1.625rem;
  --fs-600: 2.125rem;
  --fs-700: 2.875rem;
  --fs-800: 3.75rem;

  --lh-tight: 1.15;
  --lh-normal: 1.5;
  --lh-relaxed: 1.7;

  /* --- Abstand (8px-Basis) --- */
  --space-1: 0.5rem;
  --space-2: 0.75rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --space-7: 4.5rem;
  --space-8: 7rem;

  /* --- Radius / Schatten: großzügig gerundet, weich statt hart --- */
  --radius-s: 10px;
  --radius-m: 18px;
  --radius-l: 28px;
  --radius-xl: 32px;
  --radius-pill: 999px;
  --shadow-card: 0 18px 50px rgba(83, 53, 109, 0.08);
  --shadow-raised: 0 22px 60px rgba(83, 53, 109, 0.14);

  /* --- Layout --- */
  --content-max: 1180px;
  --content-narrow: 760px;

  --transition-fast: 150ms ease;
  --transition-normal: 240ms ease;
}
