/* ==========================================================================
   TOKENS — THG Móveis Design System
   Variáveis centrais do site. Nunca hardcode fora delas.
   ========================================================================== */

:root {
  /* ---- Fundos ---- */
  --cor-fundo: #F5F0E6;
  --cor-fundo-suave: #EBE4D4;
  --cor-fundo-elevado: #FFFFFF;

  /* ---- Marca ---- */
  --cor-marca: #6B4423;
  --cor-marca-hover: #5A3818;

  /* ---- Tintas (textos) ---- */
  --cor-tinta: #2D1F12;
  --cor-tinta-suave: #4A3828;
  --cor-tinta-fraca: #8A7A66;

  /* ---- Acento (CTAs) ---- */
  --cor-acento: #F5C842;
  --cor-acento-hover: #E3B630;
  --cor-acento-tinta: #2D1F12;

  /* ---- Bordas e divisores ---- */
  --cor-borda: rgba(45, 31, 18, 0.12);
  --cor-borda-forte: rgba(45, 31, 18, 0.24);

  /* ---- Sombras ---- */
  --sombra-card: 0 1px 2px rgba(45, 31, 18, 0.04), 0 8px 24px rgba(45, 31, 18, 0.06);
  --sombra-elevada: 0 4px 12px rgba(45, 31, 18, 0.08), 0 24px 48px rgba(45, 31, 18, 0.12);
  --sombra-foco: 0 0 0 3px rgba(245, 200, 66, 0.4);

  /* ---- Tipografia ---- */
  --fonte-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --fonte-corpo: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --txt-hero: clamp(2.5rem, 8vw, 6.5rem);
  --txt-display: clamp(2.5rem, 6vw, 4.5rem);
  --txt-h2: clamp(1.75rem, 3.5vw, 2.75rem);
  --txt-h3: clamp(1.25rem, 2vw, 1.625rem);

  --txt-lg: 1.125rem;
  --txt-base: 1rem;
  --txt-sm: 0.875rem;
  --txt-xs: 0.75rem;

  --lh-tight: 1.05;
  --lh-snug: 1.25;
  --lh-normal: 1.5;
  --lh-relaxed: 1.7;

  /* ---- Espaçamento ---- */
  --esp-1: 0.25rem;
  --esp-2: 0.5rem;
  --esp-3: 0.75rem;
  --esp-4: 1rem;
  --esp-5: 1.5rem;
  --esp-6: 2rem;
  --esp-7: 3rem;
  --esp-8: 4rem;
  --esp-9: 6rem;
  --esp-10: 8rem;

  --espaco-secao: clamp(4rem, 10vw, 8rem);

  --container-max: 1400px;
  --container-pad: clamp(1.25rem, 4vw, 2.5rem);

  /* ---- Raios de borda ---- */
  --raio-sm: 8px;
  --raio-md: 16px;
  --raio-lg: 24px;
  --raio-xl: 32px;
  --raio-pill: 999px;

  /* ---- Easing ---- */
  --ease-saida: cubic-bezier(0.2, 0.65, 0.3, 1);
  --ease-entrada: cubic-bezier(0.55, 0, 0.65, 1);
  --ease-inout: cubic-bezier(0.65, 0.05, 0.36, 1);
  --ease-suave: cubic-bezier(0.4, 0, 0.2, 1);

  /* ---- Durações ---- */
  --dur-rapido: 180ms;
  --dur-padrao: 280ms;
  --dur-suave: 480ms;
  --dur-lento: 720ms;
}

/* ---- Scrollbar Customizada ---- */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--cor-fundo);
}

::-webkit-scrollbar-thumb {
  background: var(--cor-acento);
  border-radius: var(--raio-pill);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--cor-acento-hover);
}

/* ---- Seleção de Texto ---- */
::selection {
  background: var(--cor-acento);
  color: var(--cor-acento-tinta);
}