/* ============================================
   VIAJANTE DE ECONÔMICA — Design Tokens (Café & Bordô)
   Linho 50% · Bordô 22% · Caramelo 13% · Nude 10% · Café 5%
   Fonte: Viajante-de-Economica-Identidade-Visual.pdf
   ============================================ */

:root {
  /* ---------- Paleta da marca ---------- */
  --bordo: #6E1F2E;                 /* cor principal: logo, títulos, destaques */
  --cafe: #4A3328;                  /* texto e profundidade */
  --caramelo: #C08552;              /* destaque: botões, ícones, detalhes */
  --nude: #E8CFC3;                  /* apoio: fundos de seção e cartões */
  --linho: #F7F0E8;                 /* fundo principal */

  /* ---------- Cores de marca (papéis) ---------- */
  --cor-primaria: #6E1F2E;          /* bordô (CTAs, links, títulos) */
  --cor-primaria-hover: #561522;
  --cor-primaria-suave: #F1E1E0;

  --cor-secundaria: #C08552;        /* caramelo (acento; nunca em texto longo) */
  --cor-secundaria-hover: #AD7443;
  --cor-secundaria-texto: #8F5B30;  /* caramelo escuro, legível sobre linho */
  --cor-secundaria-suave: #F3E6D8;

  --cor-acento: #4A3328;            /* café — uso pontual */
  --cor-acento-suave: #E8CFC3;

  --cor-sucesso: #4F6B3E;
  --cor-erro: #6E1F2E;

  /* ---------- Neutros quentes ---------- */
  --cor-dark: #4A3328;              /* café */
  --cor-dark-elevado: #5A4033;
  --cor-titulo: #6E1F2E;            /* bordô sobre linho — contraste 9.8:1 */
  --cor-corpo: #4A3328;             /* café sobre linho — contraste 10.4:1 */
  --cor-corpo-suave: #7A6257;
  --cor-texto-claro: #F7F0E8;
  --cor-cartao: #FFFFFF;
  --cor-borda: #E6D8CB;
  --cor-borda-suave: #EFE4D8;
  --cor-fundo: #F7F0E8;             /* linho */
  --cor-fundo-alt: #F2E8DD;
  --cor-fundo-suave: #EFDED4;       /* nude suavizado (blocos) */

  /* ---------- Gradientes (uso pontual) ---------- */
  --gradiente-marca: linear-gradient(135deg, #6E1F2E 0%, #561522 100%);
  --gradiente-suave: linear-gradient(180deg, #F7F0E8 0%, #F2E8DD 100%);
  --gradiente-hero: linear-gradient(135deg, #F7F0E8 0%, #F2E3D8 60%, #E8CFC3 100%);

  /* ---------- Tipografia ---------- */
  --fonte-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --fonte-texto: 'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --fonte-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

  --tamanho-corpo: 16px;
  --tamanho-pequeno: 13px;
  --tamanho-h1: clamp(30px, 4vw, 44px);
  --tamanho-h2: clamp(23px, 2.8vw, 31px);
  --tamanho-h3: clamp(19px, 2vw, 23px);

  --lh-corpo: 1.65;
  --lh-titulo: 1.2;

  /* ---------- Layout ---------- */
  --largura-max: 1200px;
  --largura-leitura: 680px;
  --padding-container: 5%;

  --gap-pequeno: 8px;
  --gap-medio: 16px;
  --gap-grande: 32px;
  --gap-secao: 56px;

  --radius-pequeno: 6px;
  --radius-medio: 12px;
  --radius-grande: 16px;
  --radius-redondo: 999px;

  /* ---------- Sombras sutis ---------- */
  --sombra-pequena: 0 1px 2px rgba(74, 51, 40, 0.05);
  --sombra-media: 0 2px 8px rgba(74, 51, 40, 0.08);
  --sombra-grande: 0 8px 24px rgba(74, 51, 40, 0.12);
  --sombra-vinho: 0 4px 16px rgba(110, 31, 46, 0.18);
  --sombra-header: 0 1px 0 rgba(74, 51, 40, 0.05);

  --transicao: 180ms cubic-bezier(0.4, 0, 0.2, 1);
  --transicao-lenta: 320ms cubic-bezier(0.4, 0, 0.2, 1);
}

@media (max-width: 1024px) {
  :root {
    --padding-container: 20px;
    --gap-secao: 40px;
  }
}

@media (max-width: 767px) {
  :root {
    --tamanho-corpo: 15px;
    --gap-secao: 32px;
  }
}
