/* ═══════════════════════════════════════════════════════════════
   Design system do Clube da Val, como variáveis CSS.

   Fonte: clube-da-val/design-system-web/ (o TOKENS canônico).
   A landing /cdv07/ usa esses mesmos valores, mas em hex literal,
   porque nasceu antes deste arquivo. Página nova usa as variáveis.
   ═══════════════════════════════════════════════════════════════ */

:root {
  /* Papel e tinta. A base de tudo. */
  --cdv-creme:        #F2E8DD;  /* creme-papel, fundo padrão */
  --cdv-creme-linho:  #E8D5C0;  /* creme-linho, faixa alternada */
  --cdv-borda:        #D4BEA8;  /* borda sobre creme */
  --cdv-cafe:         #4E2624;  /* marrom-café, texto e fundo escuro */
  --cdv-cafe-suave:   #8D735A;  /* texto secundário, só a partir de 24px */
  /* 21/08/2026. O café-suave sobre creme dá 3,67:1, e o mínimo do WCAG AA
     para texto normal é 4,5:1. Legenda, nota e rótulo pequeno usam este
     degrau, que dá 5,91:1 sobre creme e 5,01:1 sobre creme-linho. */
  --cdv-cafe-suave-forte: #6B5341;
  --cdv-preto:        #00070E;  /* preto-café */

  /* Acento. O terracota é a cor de ação. */
  --cdv-terracota:    #CE3F1D;
  --cdv-terracota-esc:#841600;  /* hover de link e botão */
  --cdv-vinho:        #7C1F0D;  /* a sombra dura da marca */

  /* Apoio */
  --cdv-indigo:       #32488E;
  --cdv-indigo-claro: #6374BC;
  --cdv-musgo:        #01301C;
  --cdv-salmao:       #FF8871;
  --cdv-pink:         #FF315D;

  /* Semânticas */
  --cdv-sucesso:      #4A7C59;
  --cdv-aviso:        #D4A574;
  --cdv-erro:         #B0352B;

  /* Tipografia. As cinco famílias da marca.
     Carregue no HTML com um único link do Google Fonts. */
  --cdv-display:  'Anton', Impact, sans-serif;                    /* números grandes */
  --cdv-titulo:   'DM Serif Display', Georgia, serif;             /* h1, h2, botões */
  --cdv-enfase:   'Playfair Display', Georgia, serif;             /* itálico de ênfase */
  --cdv-corpo:    'Inter', system-ui, -apple-system, sans-serif;  /* texto */
  --cdv-apoio:    'Lora', Georgia, serif;                         /* itálico de apoio */

  /* Espaço */
  --cdv-esp-1: 4px;
  --cdv-esp-2: 8px;
  --cdv-esp-3: 16px;
  --cdv-esp-4: 24px;
  --cdv-esp-5: 32px;
  --cdv-esp-6: 48px;
  --cdv-esp-7: 64px;
  --cdv-esp-8: 96px;

  /* Forma */
  --cdv-raio-sm:  6px;
  --cdv-raio:     16px;
  --cdv-raio-lg:  32px;
  --cdv-raio-pil: 999px;

  /* A sombra dura deslocada é a assinatura visual da marca.
     Ela não tem blur de propósito: é bloco de cor, não sombra. */
  --cdv-sombra:     6px 6px 0 var(--cdv-vinho);
  --cdv-sombra-lg: 10px 10px 0 var(--cdv-vinho);

  /* Medida */
  --cdv-largura:      1120px;
  --cdv-largura-texto: 68ch;
  --cdv-respiro: clamp(20px, 5vw, 56px);
}