/* ============================================================
   CINEMATIC LP — Design Tokens
   ============================================================ */

:root {

  /* --- CANVAS (warm dark — Fundo Profundo da marca) --- */
  --canvas-void:         #14100a;
  --canvas-deep:         #1c1610;
  --surface-1:           #26200f;
  --surface-2:           #342e1e;
  --surface-glass:       rgba(230, 227, 220, 0.04);
  --surface-glass-hover: rgba(230, 227, 220, 0.07);
  --surface-glass-card:  rgba(26, 18, 8, 0.88);

  /* --- TEXTO (paleta de marca) --- */
  --ink:            #f0ece5;   /* Creme — clarificado para contraste máximo */
  --ink-muted:      #d8d0c4;   /* Areia — mais luminosa para leitura confortável */
  --ink-subtle:     #bfac96;   /* Terracota suave — contraste WCAG AA garantido */

  /* --- GLOW / ACENTOS (cores da marca) --- */
  --glow-primary:   #5e6049;   /* Oliva */
  --glow-secondary: #8a5a3e;   /* Siena / Terracota */
  --glow-sky:       #838b9f;   /* Ardósia Azul */
  --glow-green:     #6b7a50;   /* Oliva suave — "done" */
  --glow-amber:     #8a5a3e;   /* Siena — "stuck" */
  --glow-red:       #b05840;   /* Terracota escuro — "overload" */
  --glow-orange:    #9a6040;   /* Terra médio — "proc" */

  /* --- BORDAS (sand-tinted) --- */
  --border-subtle:  rgba(200, 191, 176, 0.16);
  --border-glass:   rgba(200, 191, 176, 0.22);
  --border-bright:  rgba(230, 227, 220, 0.30);
  --border-glow:    rgba(94, 96, 73, 0.40);   /* Oliva glow */

  /* --- RAIO --- */
  --radius-xs:   6px;
  --radius-sm:   10px;
  --radius-md:   14px;
  --radius-lg:   20px;
  --radius-xl:   28px;
  --radius-pill: 9999px;

  /* --- TIPOGRAFIA (brand fonts) --- */
  --font-serif: 'Fraunces', Georgia, serif;
  --font-sans:  'DM Sans', system-ui, sans-serif;
  --font:       'DM Sans', system-ui, sans-serif;

  /* --- ESPAÇAMENTO --- */
  --container-max:  1200px;
  --container-px:   48px;
  --section-py:     120px;
}