/* ==========================================================================
   DESIGN TOKENS — Nilson Cortinas (Estilo Editorial Claro & Terracota)
   Inspirado no The Shade Store e Hunter Douglas: base off-white, serifada,
   terracota nobre como destaque e fotografia em grande formato.
   ========================================================================== */

:root {
  /* PALETA BASE CLARA & WARM (THE SHADE STORE / EDITORIAL) */
  --bg-main: #fbf9f5;             /* Off-white quente, base principal */
  --bg-subtle: #f5f0eb;           /* Bege suave para quebra de seções */
  --bg-surface: #ede6dd;          /* Superfície neutra quente */
  --bg-white: #ffffff;            /* Branco puro para cartões selecionados e inputs */
  --bg-dark-section: #141210;     /* Carvão escuro profundo para contraste único (História) */

  /* DESTAQUE & ACENTO TERRACOTA (CUIABÁ REFINADO) */
  --color-terracota: #c2593f;        /* Terracota refinado institucional */
  --color-terracota-dark: #9e432c;   /* Terracota escurecido (hover) */
  --color-terracota-soft: #f7ebe6;   /* Fundo terracota pálido para tags e badges */
  --color-terracota-border: #e6c8bf; /* Borda terracota sutil */

  /* CORES SOLARES FUNCIONAIS (DIAGRAMAS E CONTRASTE) */
  --color-sun: #ea580c;
  --color-sun-glow: #f97316;
  --color-sun-gold: #b45309;
  --color-sun-soft: #fef3c7;

  /* TEXTO & CONTRASTE (AA/AAA) */
  --text-primary: #1c1917;        /* Carvão profundo (títulos e ênfase) */
  --text-secondary: #44403c;      /* Texto de corpo de leitura (>16px) */
  --text-muted: #78716c;          /* Metadados, legendas e rótulos */
  --text-inverse: #fbf9f5;        /* Texto claro sobre fundo escuro */
  --text-inverse-muted: #a8a29e;  /* Texto secundário sobre fundo escuro */

  /* BORDAS & LINHAS */
  --border-light: #e7e0d8;
  --border-medium: #d4cbbe;
  --border-focus: #c2593f;

  /* TIPOGRAFIA EDITORIAL */
  --font-serif: 'Playfair Display', Georgia, serif;
  --font-sans: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;

  /* ESCALA TIPOGRÁFICA */
  --text-h1: clamp(2.5rem, 5vw, 4rem);
  --text-h2: clamp(1.85rem, 3.2vw, 2.65rem);
  --text-h3: clamp(1.25rem, 2vw, 1.65rem);
  --text-body: 1.0625rem;         /* 17px para leitura editorial impecável */
  --text-body-small: 0.9375rem;   /* 15px */
  --text-small: 0.8125rem;        /* 13px */

  /* ESPAÇAMENTO */
  --space-2xs: 4px;
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 40px;
  --space-xl: 64px;
  --space-2xl: 96px;

  /* BORDAS & RAIOS */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-full: 9999px;
  --radius-btn: 9999px;

  /* SOMBRAS REFINADAS */
  --shadow-subtle: 0 4px 20px rgba(28, 25, 23, 0.05);
  --shadow-elevated: 0 12px 36px rgba(28, 25, 23, 0.08);
  --shadow-btn: 0 8px 24px rgba(194, 89, 63, 0.25);
  --shadow-popover: 0 16px 40px rgba(0, 0, 0, 0.15);

  /* MOTION & ASSINATURA */
  --motion-slat-duration: 0.35s;
  --motion-slat-timing: cubic-bezier(0.16, 1, 0.3, 1);
  --motion-multiplier: 1.2;
}