/* ============================================
   WANNA GO — Design Tokens
   ============================================ */

:root {
  /* --- Colors — Black scale --- */
  --color-black: #000000;
  --color-espresso: #0C0A09;   /* warm near-black with wood-fire depth */
  --color-deep: #0A0A0A;
  --color-surface: #111111;
  --color-line: #1A1A1A;
  --color-line-strong: #2A2A2A;

  /* --- Colors — Accent palette --- */
  --color-muted: #8A8178;
  --color-warm: #C8B8A4;       /* base warm — ivory ash */
  --color-gold: #A8956C;       /* smoked matte gold — more precise refinement */
  --color-amber: rgba(190, 130, 50, 0.1); /* ember glow — heat presence */
  --color-text: #F5F0EB;
  --color-white: #FFFFFF;

  /* --- DRAMA MAKER — Emotional Force Palette --- */
  --color-crimson: #7A1515;              /* deep controlled red — emotional ignition */
  --color-crimson-bright: #9B1C1C;       /* crimson at full presence */
  --color-crimson-muted: rgba(122, 21, 21, 0.12);  /* subtle crimson atmosphere */
  --color-crimson-glow: rgba(155, 28, 28, 0.07);   /* barely-felt crimson tension */
  --color-life: #2A3D2A;                 /* living deep green — life force */
  --color-life-muted: rgba(42, 61, 42, 0.18);      /* green breath in darkness */
  --color-life-bright: #3D5C3D;          /* green at visible presence */

  /* --- Typography Scale (mobile-first) --- */
  --font-serif: 'Cormorant Garamond', 'Noto Serif JP', 'YuMincho', 'Yu Mincho', serif;
  --font-serif-jp: 'Noto Serif JP', 'YuMincho', 'Yu Mincho', serif;
  --font-sans: 'Inter', 'Noto Sans JP', -apple-system, 'Hiragino Kaku Gothic ProN', sans-serif;
  --font-sans-jp: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', -apple-system, sans-serif;

  --text-xs: clamp(0.625rem, 0.5rem + 0.5vw, 0.75rem);       /* 10–12 */
  --text-sm: clamp(0.75rem, 0.65rem + 0.4vw, 0.875rem);      /* 12–14 */
  --text-base: clamp(0.9375rem, 0.875rem + 0.25vw, 1.0625rem);/* 15–17 */
  --text-lg: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem);        /* 17–20 */
  --text-xl: clamp(1.25rem, 1.1rem + 0.75vw, 1.875rem);      /* 20–30 */
  --text-2xl: clamp(1.75rem, 1.4rem + 1.5vw, 3rem);          /* 28–48 */
  --text-3xl: clamp(2.25rem, 1.8rem + 2vw, 4.5rem);          /* 36–72 */
  --text-display: clamp(3rem, 2.2rem + 3.5vw, 7rem);         /* 48–112 */

  /* --- Spacing --- */
  --space-xs: clamp(0.5rem, 0.4rem + 0.25vw, 0.75rem);
  --space-sm: clamp(0.75rem, 0.6rem + 0.5vw, 1.25rem);
  --space-md: clamp(1.5rem, 1rem + 1.5vw, 2.5rem);
  --space-lg: clamp(2.5rem, 1.75rem + 2.5vw, 4rem);
  --space-xl: clamp(4rem, 3rem + 4vw, 7rem);
  --space-2xl: clamp(6rem, 4rem + 6vw, 10rem);
  --space-section: clamp(5rem, 3.5rem + 5vw, 8rem);

  /* --- Layout --- */
  --content-width: min(90vw, 1200px);
  --content-narrow: min(88vw, 680px);
  --content-wide: min(95vw, 1400px);

  /* --- Surfaces --- */
  --nav-bg: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%, transparent 100%);

  /* --- Motion --- */
  --ease-out: cubic-bezier(0.25, 0.1, 0.25, 1);
  --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-editorial: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-luxury: cubic-bezier(0.19, 1, 0.22, 1);      /* extreme ease-out — revelation pacing */
  --ease-cinematic: cubic-bezier(0.12, 0, 0.39, 0);   /* authoritative slow-in */
  --ease-drift: cubic-bezier(0.37, 0, 0.63, 1);        /* balanced bilateral drift */
  --duration-fast: 200ms;
  --duration-base: 760ms;
  --duration-slow: 1100ms;
  --duration-enter: 2200ms;     /* section entrance — monumental, cinematic */
  --duration-cinematic: 2400ms;
  --duration-reveal: 1000ms;    /* scroll reveal — clearly visible, luxury-paced */
  --duration-atmospheric: 3600ms; /* ambient breathing cycles */
}

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