/* Hallmark · macrostructure: Gallery Showcase · genre: atmospheric · theme: Deep Space
 * paper-band: dark · display-style: editorial-serif · accent-hue: electric-violet
 * nav: N4 Ghost · footer: Ft2 Grid
 */

:root {
  /* Paper / ink — deep space band */
  --color-paper-0: oklch(8.0% 0.020 270);
  /* page paper — near-black navy */
  --color-paper-1: oklch(12.0% 0.025 270);
  /* card */
  --color-paper-2: oklch(16.0% 0.030 270);
  /* elevated card */
  --color-paper-3: oklch(22.0% 0.035 270);
  /* hairline tint */

  --color-ink-0: oklch(95.0% 0.010 270);
  /* primary ink — near-white */
  --color-ink-1: oklch(78.0% 0.015 270);
  /* body */
  --color-ink-2: oklch(58.0% 0.020 270);
  /* secondary */
  --color-ink-3: oklch(38.0% 0.025 270);
  /* mute */

  /* Accent — electric violet with warm gold companion */
  --color-accent: oklch(62.0% 0.240 295);
  /* primary violet */
  --color-accent-soft: oklch(72.0% 0.160 295);
  --color-accent-tint: oklch(92.0% 0.050 295);
  --color-companion: oklch(78.0% 0.170 85);
  /* warm gold — sparingly */

  --color-warning: oklch(74.0% 0.180 50);
  /* amber */
  --color-success: oklch(68.0% 0.150 145);
  /* green */

  /* Focus ring */
  --color-focus: oklch(62.0% 0.240 295);

  /* Typography — Fraunces display + Geist body via Google Fonts */
  --font-display: "Fraunces", ui-serif, Georgia, serif;
  --font-body: "Geist", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SF Mono", Menlo, monospace;

  /* Type scale — modular, comfortable */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: 1.125rem;
  --text-lg: 1.375rem;
  --text-xl: 1.75rem;
  --text-2xl: 2.25rem;
  --text-3xl: clamp(2rem, 4vw, 3.5rem);
  --text-4xl: clamp(2.25rem, 6vw, 4.5rem);
  --text-5xl: clamp(2.5rem, 8vw, 6rem);

  /* Spacing — 4pt scale */
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 5rem;
  --space-4xl: 8rem;

  /* Radius */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;

  /* Lines */
  --rule-hair: 1px solid color-mix(in oklch, var(--color-ink-0) 8%, transparent);
  --rule-soft: 1px solid color-mix(in oklch, var(--color-ink-0) 14%, transparent);

  /* Easings + durations */
  --ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in: cubic-bezier(0.55, 0.06, 0.68, 0.19);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);

  --dur-fast: 140ms;
  --dur-mid: 240ms;
  --dur-slow: 420ms;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 140ms !important;
    scroll-behavior: auto !important;
  }
}