/* ============================================
   VARIABLES.CSS — Lucca Safari 1 Aninho
   Sistema de tokens: cores, tipografia, espaçamento
   ============================================ */

:root {
  /* ---- Paleta: Safári ao entardecer ----
     Inspirada na savana ao pôr-do-sol: folhagem
     densa, terra batida, e o sol baixo dourando tudo */
  --color-leaf-deep: #3F5C32;     /* verde-folha profundo (títulos, contraste) */
  --color-leaf: #5C7F4A;          /* verde-folha (acentos, ícones) */
  --color-leaf-soft: #A9C19B;     /* verde-folha suave (detalhes leves) */
  --color-terracotta: #C97D4A;    /* terracota (CTA, destaques) */
  --color-terracotta-deep: #A8623A; /* terracota escuro (hover) */
  --color-sun: #E8B84B;           /* amarelo-sol (acentos quentes) */
  --color-sand: #F5EDD8;          /* creme-areia (fundo principal) */
  --color-sand-deep: #EBE0C6;     /* creme-areia escuro (fundo de seção) */
  --color-bark: #6B4530;          /* marrom-couro (texto principal) */
  --color-bark-light: #8C6248;    /* marrom-couro claro (texto secundário) */
  --color-mickey-red: #D4453A;    /* vermelho-mickey (acentos pontuais) */
  --color-white: #FFFEF9;         /* branco quente (cartões) */

  /* ---- Tipografia ----
     Display: Baloo 2 — arredondada, lúdica, robusta
     Corpo: Quicksand — leve, geométrica, legível */
  --font-display: 'Baloo 2', 'Comic Sans MS', cursive, sans-serif;
  --font-body: 'Quicksand', 'Trebuchet MS', sans-serif;

  /* ---- Escala tipográfica ---- */
  --fs-xs: 0.85rem;
  --fs-sm: 1rem;
  --fs-base: 1.125rem;
  --fs-md: 1.375rem;
  --fs-lg: 1.75rem;
  --fs-xl: 2.5rem;
  --fs-2xl: 3.5rem;
  --fs-3xl: 5rem;

  /* ---- Espaçamento ---- */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;

  /* ---- Bordas e sombras ---- */
  --radius-sm: 12px;
  --radius-md: 24px;
  --radius-lg: 40px;
  --radius-full: 999px;

  --shadow-soft: 0 8px 24px rgba(107, 69, 48, 0.12);
  --shadow-strong: 0 16px 40px rgba(107, 69, 48, 0.18);

  /* ---- Container ---- */
  --container-max: 760px;
  --container-padding: 1.5rem;
}