/* ==========================================================================
   TOKENS OVERRIDE — CLÍNICA NUTRISTAR
   ==========================================================================
   Identidade visual oficial (manual de marca, 2023):
   - Bordeaux  #77252A (primária)
   - Gold      #EAC579 (secundária / accent)
   - Fonte     Montserrat Light (única)
   - Slogan    "Clínica de Nutrição Avançada"

   Aplicação:
   - Fundo claro → logo bordeaux
   - Fundo bordeaux → logo gold
   ========================================================================== */

:root {

  /* ---------- paleta base ---------- */
  --fb-color-primary:   #77252A;   /* bordeaux — títulos, links, cta */
  --fb-color-accent:    #EAC579;   /* gold — destaques, hover, detalhes */
  --fb-color-cream:     #faf5ec;   /* off-white quente derivado do gold */
  --fb-color-charcoal:  #1f1516;   /* quase preto com pigmento bordeaux */

  /* ---------- neutros derivados ---------- */
  --fb-color-muted:   #6b5a5c;     /* bordeaux dessaturado p/ texto secundário */
  --fb-color-border:  #e8dccb;     /* bege claro baseado no gold */

  /* ---------- tipografia ---------- */
  /* Montserrat Light (300) é a única fonte oficial.
     Usamos também 400/500/600 do Montserrat para hierarquia web,
     mantendo Light para hero/destaques conforme o manual. */
  --fb-font-display: 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif;
  --fb-font-body:    'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* peso default do display ajustado para Light (honrar o manual) */
  --fb-weight-display: 300;

  /* ---------- luz/depth com tons da marca ---------- */
  --fb-glow-cream:  radial-gradient(circle at 30% 20%, rgba(234, 197, 121, 0.20), transparent 60%);
  --fb-glow-accent: radial-gradient(circle at 70% 30%, rgba(119, 37, 42, 0.12), transparent 70%);

  /* ---------- sombras em bordeaux bem diluído ---------- */
  --fb-depth-sm: 0 1px 2px rgba(31, 21, 22, 0.05);
  --fb-depth-md: 0 4px 16px rgba(31, 21, 22, 0.07);
  --fb-depth-lg: 0 24px 48px rgba(31, 21, 22, 0.10);
}

/* ---------- Montserrat via Google Fonts ----------
   O import fica aqui (não no functions) para não inflar o HTML crítico.
   Carrega 300 (Light, oficial) + 400/500/600 para UI. */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600&display=swap');

/* ---------- ajuste fino de display ---------- */
.hero-title,
h1, h2 {
  font-weight: var(--fb-weight-display);
  letter-spacing: var(--fb-tracking-tight);
}

/* ---------- logo (header + footer) ---------- */
.fb-logo__img,
.fb-logo img {
  display: block;
  max-height: 52px;
  width: auto;
}

.fb-footer__logo {
  display: inline-block;
  margin-bottom: var(--fb-space-4);
}
.fb-footer__logo img {
  display: block;
  max-height: 56px;
  width: auto;
}