/* ============================================================
   paraiso.roahost.com — Design Tokens
   Source of truth: AESTHETIC-THESIS.md §2 / §3 / §4
   Every token has exactly one job. BANNED color: warm red-orange #E63900–#FF4500.
   ============================================================ */

:root {
  /* === COLORS (Parchment palette, light default) === */
  --paraiso-parchment: #F5EFE0;          /* page background; job: breathable surface */
  --paraiso-ink: #1A1814;                /* primary text; job: legible content */
  --paraiso-sovereign-blue: #2B4A8C;     /* primary action; job: trust + competence */
  --paraiso-crimson-bordeaux: #8B1A2B;   /* memorial only (cross-population); job: human cost */
  --paraiso-cedar-emerald: #1E6B4F;      /* secondary positive; job: life / restoration */
  --paraiso-warm-shadow: #6B5D4F;         /* muted/secondary text; job: subdued metadata */
  --paraiso-gold: #B08D57;               /* DECORATIVE ONLY — used in exactly 3 places: */
                                         /* 1) crown emblem; 2) crystallization keystone; 3) wax-seal confirmation */
  --paraiso-hairline: rgba(26, 24, 20, 0.12);  /* borders/dividers; job: structure without weight */
  --paraiso-focus-ring: #2B4A8C;         /* keyboard focus; job: visible a11y */

  /* === TYPOGRAPHY === */
  --paraiso-font-display: "Source Serif 4", "Source Serif Pro", Georgia, serif;
  --paraiso-font-ui: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --paraiso-font-mono: "IBM Plex Mono", "SF Mono", Consolas, monospace;

  /* === TYPE SCALE (mobile-first clamp, AESTHETIC-THESIS §4) === */
  --paraiso-fs-xs: clamp(0.78rem, 0.76rem + 0.1vw, 0.85rem);   /* metadata, breadcrumbs */
  --paraiso-fs-sm: clamp(0.88rem, 0.85rem + 0.15vw, 0.95rem);  /* small UI labels */
  --paraiso-fs-body: clamp(1.125rem, 1.08rem + 0.25vw, 1.2rem); /* 18px floor (ADHD WCAG) */
  --paraiso-fs-lead: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);  /* sub-thesis */
  --paraiso-fs-h3: clamp(1.5rem, 1.35rem + 0.7vw, 1.875rem);
  --paraiso-fs-h2: clamp(1.875rem, 1.6rem + 1.2vw, 2.5rem);
  --paraiso-fs-h1: clamp(2.25rem, 1.9rem + 1.8vw, 3.25rem);
  --paraiso-fs-display: clamp(2.75rem, 2.2rem + 3vw, 4.5rem); /* hero thesis only */

  --paraiso-lh-tight: 1.15;
  --paraiso-lh-snug: 1.3;
  --paraiso-lh-body: 1.6;   /* BDA floor */
  --paraiso-lh-loose: 1.75; /* long-form prose */

  --paraiso-measure: 70ch;  /* max line length */
  --paraiso-measure-wide: 84ch;

  /* === SPACING & LAYOUT === */
  --paraiso-space-1: 0.25rem;
  --paraiso-space-2: 0.5rem;
  --paraiso-space-3: 0.75rem;
  --paraiso-space-4: 1rem;
  --paraiso-space-6: 1.5rem;
  --paraiso-space-8: 2rem;
  --paraiso-space-12: 3rem;
  --paraiso-space-16: 4rem;
  --paraiso-space-24: 6rem;
  --paraiso-space-32: 8rem;

  --paraiso-radius-sm: 4px;
  --paraiso-radius-md: 8px;
  --paraiso-radius-lg: 14px;
  --paraiso-radius-pill: 999px;

  --paraiso-container-max: 1240px;
  --paraiso-gutter: clamp(1rem, 2vw, 2rem);

  /* === MOTION (Doherty <400ms, Disney Slow In/Out) === */
  --paraiso-ease: cubic-bezier(0.22, 0.61, 0.36, 1); /* slow-out */
  --paraiso-ease-in-out: cubic-bezier(0.45, 0, 0.55, 1);
  --paraiso-dur-fast: 160ms;
  --paraiso-dur: 240ms;
  --paraiso-dur-slow: 380ms;   /* crystallization ceiling */
  --paraiso-dur-emphasis: 600ms; /* only the typography reveal */

  /* === ELEVATION (light-ladder, never shadow stacks) === */
  --paraiso-elev-1: 0 0 0 1px var(--paraiso-hairline);
  --paraiso-elev-2: 0 0 0 1px var(--paraiso-hairline), 0 1px 0 rgba(26,24,20,0.04);
  --paraiso-elev-focus: 0 0 0 3px color-mix(in srgb, var(--paraiso-focus-ring) 28%, transparent);

  /* === SEMANTIC ALIASES === */
  --bg: var(--paraiso-parchment);
  --fg: var(--paraiso-ink);
  --fg-muted: var(--paraiso-warm-shadow);
  --accent: var(--paraiso-sovereign-blue);
  --accent-positive: var(--paraiso-cedar-emerald);
  --accent-memorial: var(--paraiso-crimson-bordeaux);
  --border: var(--paraiso-hairline);
}

/* === DARK VARIANT — by user override only (parchment default) === */
:root[data-color-scheme="dark"] {
  --paraiso-parchment: #14110D;
  --paraiso-ink: #F2EBD9;
  --paraiso-warm-shadow: #B5A691;
  --paraiso-sovereign-blue: #7896D6;     /* lifted to pass AA on dark */
  --paraiso-crimson-bordeaux: #D77181;   /* lifted */
  --paraiso-cedar-emerald: #5FB890;      /* lifted */
  --paraiso-hairline: rgba(242, 235, 217, 0.14);
  --bg: var(--paraiso-parchment);
  --fg: var(--paraiso-ink);
  --fg-muted: var(--paraiso-warm-shadow);
  --accent: var(--paraiso-sovereign-blue);
  --border: var(--paraiso-hairline);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-color-scheme]) {
    --paraiso-parchment: #14110D;
    --paraiso-ink: #F2EBD9;
    --paraiso-warm-shadow: #B5A691;
    --paraiso-sovereign-blue: #7896D6;
    --paraiso-crimson-bordeaux: #D77181;
    --paraiso-cedar-emerald: #5FB890;
    --paraiso-hairline: rgba(242, 235, 217, 0.14);
  }
}

/* === MOTION SAFETY: collapse all motion under reduced-motion (WCAG 2.3.3 AAA) === */
@media (prefers-reduced-motion: reduce) {
  :root {
    --paraiso-dur-fast: 0s;
    --paraiso-dur: 0s;
    --paraiso-dur-slow: 0s;
    --paraiso-dur-emphasis: 0s;
  }
  *, *::before, *::after {
    animation-duration: 0s !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0s !important;
    scroll-behavior: auto !important;
  }
}