/* Hallmark · tokens · Seenly Studio
 * theme: custom · vibe: "deep berry night, gold signal, editorial"
 * axes: dark / roman-serif / chromatic-berry ~3
 */

:root {
  /* ---- Canvas: tiefes Beere, fast schwarz ------------------------- */
  --color-canvas:    oklch(15.0% 0.035 355);   /* Grundfläche        */
  --color-canvas-2:  oklch(19.0% 0.048 356);   /* eine Stufe höher   */
  --color-canvas-3:  oklch(24.0% 0.062 357);   /* Panels             */
  --color-berry:     oklch(38.0% 0.115 3.0);   /* Beere, satt        */
  --color-berry-lit: oklch(45.0% 0.129 3.3);   /* Beere, Marke       */

  /* ---- Text auf dunklem Grund ------------------------------------- */
  --color-ink:       oklch(96.0% 0.008 48);    /* Papier als Text    */
  --color-ink-2:     oklch(80.0% 0.018 20);
  --color-muted:     oklch(64.0% 0.020 12);
  --color-rule:      oklch(30.0% 0.030 356);
  --color-rule-2:    oklch(25.0% 0.025 356);

  /* ---- Gold: das einzige Signal ----------------------------------- */
  --color-gold:      oklch(78.0% 0.110 75);
  --color-gold-2:    oklch(71.6% 0.103 75.4);  /* Marke              */
  --color-gold-deep: oklch(62.0% 0.100 72);

  /* ---- Helle Karten auf dunklem Grund ------------------------------ */
  --color-card:      oklch(96.2% 0.008 48.7);  /* Papier             */
  --color-card-2:    oklch(93.5% 0.010 45);
  --color-card-ink:  oklch(23.4% 0.010 356);   /* Tinte              */
  --color-card-ink-2:oklch(45.0% 0.014 356);
  --color-card-rule: oklch(88.0% 0.010 42);

  --color-focus:     oklch(80.0% 0.140 75);
  --color-success:   oklch(72.0% 0.130 155);
  --color-danger:    oklch(68.0% 0.150 25);

  /* ---- Type -------------------------------------------------------- */
  --font-display: "Fraunces", ui-serif, Georgia, serif;
  --font-body:    "Inter", ui-sans-serif, system-ui, sans-serif;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-md:   1.0625rem;
  --text-lg:   1.375rem;
  --text-xl:   1.75rem;
  --text-2xl:  2.25rem;
  --text-3xl:  2.875rem;
  --text-display:   clamp(2.5rem, 6vw + 0.5rem, 5rem);
  --text-display-s: clamp(2rem, 3.6vw + 0.75rem, 3.25rem);

  /* ---- Space ------------------------------------------------------- */
  --space-3xs: 0.125rem;
  --space-2xs: 0.25rem;
  --space-xs:  0.5rem;
  --space-sm:  0.75rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6.5rem;
  --space-4xl: 10rem;
  --page-gutter: clamp(1.25rem, 5vw, 4rem);
  --measure: 60ch;

  /* ---- Motion ------------------------------------------------------ */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 120ms;
  --dur-short: 240ms;
  --dur-long:  620ms;

  /* ---- Kanten, Radien, Tiefe --------------------------------------- */
  --rule-hair: 1px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 18px;
  --radius-pill: 999px;

  /* Tiefe auf dunklem Grund: dunkler Schatten, kein Glühen */
  --shadow-card: 0 24px 60px -20px oklch(8% 0.02 355 / 0.75),
                 0 4px 12px -6px oklch(8% 0.02 355 / 0.5);
  --shadow-pill: 0 8px 24px -10px oklch(8% 0.02 355 / 0.6);

  --z-base: 1;
  --z-raised: 10;
  --z-sticky: 200;
}