/* ============================================
   SYUNOI — Design Tokens
   "A luz não destrói a escuridão; revela o que
    sempre esteve ali."
   ============================================ */

:root {
  /* ── Cores Primárias ── */
  --color-void: #0a0a0a;
  --color-depth: #111010;
  --color-surface: #1a1816;
  --color-surface-warm: #1f1c18;
  --color-surface-glass: rgba(26, 24, 22, 0.7);
  
  /* ── Luz & Claridade (Iluminismo sutil) ── */
  --color-light: #f5f0e8;
  --color-light-soft: #e8e0d4;
  --color-light-muted: #b8b0a4;
  --color-light-dim: #7a7268;
  
  /* ── Acentos ── */
  --color-gold: #c4a24e;
  --color-gold-warm: #d4b45e;
  --color-gold-dim: #8a7234;
  --color-gold-glow: rgba(196, 162, 78, 0.2);
  --color-ink: #c43a2f;
  --color-ink-soft: rgba(196, 58, 47, 0.6);
  
  /* ── Tipografia ── */
  --font-display: 'Playfair Display', 'Georgia', serif;
  --font-body: 'Inter', 'Helvetica Neue', sans-serif;
  --font-accent: 'Cormorant Garamond', 'Georgia', serif;
  
  /* ── Escala Tipográfica ── */
  --text-xs: clamp(0.7rem, 0.65rem + 0.25vw, 0.8rem);
  --text-sm: clamp(0.8rem, 0.75rem + 0.3vw, 0.95rem);
  --text-base: clamp(0.95rem, 0.9rem + 0.3vw, 1.1rem);
  --text-lg: clamp(1.1rem, 1rem + 0.5vw, 1.35rem);
  --text-xl: clamp(1.4rem, 1.2rem + 1vw, 2rem);
  --text-2xl: clamp(1.8rem, 1.4rem + 2vw, 3rem);
  --text-3xl: clamp(2.2rem, 1.6rem + 3vw, 4.5rem);
  --text-hero: clamp(3rem, 2rem + 5vw, 8rem);
  
  /* ── Espaçamento ── */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 2rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;
  --space-3xl: 10rem;
  --space-section: clamp(5rem, 4rem + 5vw, 12rem);
  
  /* ── Layout ── */
  --max-width: 1400px;
  --max-width-narrow: 900px;
  --gutter: clamp(1.5rem, 1rem + 2vw, 4rem);
  
  /* ── Transições ── */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast: 200ms;
  --duration-base: 400ms;
  --duration-slow: 800ms;
  --duration-glacial: 1600ms;
  
  /* ── Bordas & Sombras ── */
  --border-subtle: 1px solid rgba(245, 240, 232, 0.08);
  --border-light: 1px solid rgba(245, 240, 232, 0.15);
  --border-gold: 1px solid rgba(196, 162, 78, 0.3);
  --border-gold-bright: 1px solid rgba(196, 162, 78, 0.6);
  --shadow-soft: 0 4px 30px rgba(0, 0, 0, 0.4);
  --shadow-glow: 0 0 40px rgba(196, 162, 78, 0.08);
  --shadow-glow-strong: 0 0 60px rgba(196, 162, 78, 0.15);
  
  /* ── Grain / Ruído ── */
  --noise-opacity: 0.032;
  
  /* ── Marquee ── */
  --marquee-duration: 38s;
}
