/* ==========================================================================
   TOKENS.CSS — Introdução Alimentar sem Confusão
   Design tokens exclusivos desta landing (não importa nem referencia nada
   de /assets/css/ da raiz — arquivos próprios, mesmo padrão de isolamento
   do Nutrevocê). Cor/gradiente NÃO vêm do Nutrevocê — são cópia literal
   dos tokens de /assets/css/tokens.css (Rótulo Simples), a pedido: este
   produto reaproveita a identidade visual dos outros produtos
   maternos-infantis da Bruna, não a do Nutrevocê.
   ========================================================================== */
:root {
  /* Paleta — cópia literal de /assets/css/tokens.css (Rótulo Simples) */
  --bg-primary: #f2f7fc;
  --text-white: #ffffff;
  --text-black: #19232d;
  --bg-black: #19232d;
  --button-bg: #384d65;
  --button-text: #ffffff;
  --icon-white: #f2f7fc;

  --brand-primary: #d91425;
  --brand-primary-hover: #fbe8e9;
  --brand-secondary: #597a9f;

  --semantic-success: #599f5b;
  --semantic-warning: #fed82c;
  --semantic-danger: #d91425;

  --neutral-900: #19232d;
  --neutral-800: #202c3a;
  --neutral-700: #283748;
  --neutral-600: #304156;
  --neutral-500: #384d65;
  --neutral-400: #5c6d81;
  --neutral-300: #828f9e;
  --neutral-200: #a9b2bd;
  --neutral-100: #cfd4da;
  --neutral-white: #ebedf0;

  --gradient-brand: linear-gradient(38deg, #d91425 28.55%, #7dace0 71.62%);
  --gradient-baixa: linear-gradient(270deg, #89e07d 0%, #599f5b 100%);

  /* Tipografia — famílias */
  --font-display: 'Fraunces', serif;
  --font-body: 'Montserrat', sans-serif;

  /* Tipografia — pesos */
  --weight-black: 900;
  --weight-bold: 700;
  --weight-semibold: 600;
  --weight-regular: 400;

  /* Espaçamento — mesma escala numérica de /assets/css/tokens.css */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 80px;
  --space-10: 96px;

  /* Raio — padrão único, mesmo valor da Rótulo Simples */
  --radius-default: 12px;

  /* Container — mesma largura máxima do resto do projeto */
  --container-max: 1200px;
  --container-max-1440: 1280px;
}