/*
  Design tokens for Futari Design / MERU.
  These are intentionally kept separate from style.css so that colors,
  type, spacing, and motion can be swapped later (e.g. once the final
  Futari logotype and brand typeface are ready) without touching layout.
*/

:root {
  /* ============ Color — Futari shell (dark, cinematic) ============ */
  --color-shell-bg: #15130f;
  --color-shell-bg-deep: #0d0f0c; /* deep green-black, used in overlays/gradients */
  --color-shell-fg: #f1ebdf;
  --color-shell-fg-muted: #a99e8a;
  --color-shell-border: rgba(241, 235, 223, 0.14);
  --color-shell-scrim: rgba(13, 12, 10, 0.55);

  /* ============ Color — MERU world (warm, tactile, daylight) ============ */
  --color-meru-bg: #f4efe4;
  --color-meru-bg-alt: #e9e1cf;
  --color-meru-sage: #7c8b6e;
  --color-meru-cork: #b18a63;
  --color-meru-fg: #211e18;
  --color-meru-fg-muted: #635c4c;
  --color-meru-border: rgba(33, 30, 24, 0.14);

  /* ============ Typography ============ */
  /* Provisional pairing — not a final brand typeface decision. */
  --font-display: "Afacad", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-wordmark: var(--font-body); /* temporary wordmark uses body face, not the display face */

  --wordmark-tracking: 0.28em;
  --nav-tracking: 0.08em;
  --label-tracking: 0.14em;

  --type-hero: clamp(3rem, 1.75rem + 7vw, 7.5rem);
  --type-hero-sub: clamp(1.25rem, 1rem + 1.4vw, 2rem);
  --type-hero-lead: calc(var(--type-hero-sub) * 1.5); /* hero statement: ~1.5x the supporting line, at every viewport */
  --type-h1: clamp(2.25rem, 1.75rem + 3vw, 4.25rem);
  --type-h2: clamp(1.5rem, 1.25rem + 1.2vw, 2.125rem);
  --type-body-lg: clamp(1.125rem, 1rem + 0.6vw, 1.375rem);
  --type-body: 1rem;
  --type-small: 0.8125rem;

  --leading-tight: 1.08;
  --leading-snug: 1.3;
  --leading-body: 1.65;

  /* ============ Spacing ============ */
  --space-2xs: 0.5rem;
  --space-xs: 0.75rem;
  --space-sm: 1.25rem;
  --space-md: 2rem;
  --space-lg: 3.5rem;
  --space-xl: 6rem;
  --space-2xl: 9rem;
  --space-3xl: 12rem;

  --content-max: 76rem;
  --content-narrow: 38rem;
  --edge-padding: clamp(1.25rem, 4vw, 4rem);

  /* ============ Motion ============ */
  --duration-fast: 200ms;
  --duration-base: 500ms;
  --duration-slow: 900ms;
  --duration-signature: 1400ms; /* the single Futari → MERU threshold moment */

  --ease-standard: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-breathing: cubic-bezier(0.37, 0, 0.63, 1);

  --reveal-distance: 1.25rem;
  --reveal-scale: 1.04;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 0ms;
    --duration-base: 0ms;
    --duration-slow: 0ms;
    --duration-signature: 0ms;
    --reveal-distance: 0rem;
    --reveal-scale: 1;
  }
}
