/* ============================================================
   DRA. MONICA BAPTISTA — DESIGN TOKENS
   Fonte da identidade:
   - Preto + dourado: direcao da agencia (audio 25/08/2026).
   - Off-white #F4F1EC, areia #CEC9C3 e cinza-perola #E4E2E2:
     valores REAIS medidos nas pecas graficas do Instagram
     @dramonicabaptista.rinoplastia (capas de destaque e post
     "Conheca as cirurgias que realizo").
   - Serifada de alto contraste + sans caixa alta espacada:
     tipografia observada nas pecas graficas do perfil.
   Alterar QUALQUER cor ou medida do site inteiro comeca aqui.
   ============================================================ */

:root {
  /* --- Escuros (base do site) --- */
  --preto:        #0B0B0C;
  --preto-2:      #141416;
  --preto-3:      #1C1C1F;
  --preto-linha:  #2A2A2E;

  /* --- Dourado (acento e CTA) --- */
  --ouro:         #C8A45C;
  --ouro-claro:   #E4CE9B;
  --ouro-champagne: #D9AE57;
  --ouro-escuro:  #8C6F35;
  --ouro-veu:     rgba(200, 164, 92, 0.14);

  /* --- Claros (secoes de leitura) --- */
  --marfim:       #F4F1EC;
  --marfim-2:     #FAF8F5;
  --areia:        #CEC9C3;
  --perola:       #E4E2E2;

  /* --- Texto --- */
  --tinta:        #16161A;
  --tinta-suave:  #5F5A54;
  --claro:        #F2EFEA;
  --claro-suave:  #A8A49E;

  /* --- Tipografia --- */
  --fonte-titulo: "Playfair Display", "Times New Roman", serif;
  --fonte-corpo:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --t-h1:   clamp(2.125rem, 1.35rem + 3.4vw, 4rem);
  --t-h2:   clamp(1.75rem, 1.25rem + 2.1vw, 3rem);
  --t-h3:   clamp(1.25rem, 1.05rem + 0.8vw, 1.625rem);
  --t-corpo: clamp(1rem, 0.96rem + 0.16vw, 1.0625rem);
  --t-peq:  0.875rem;
  --t-kicker: 0.75rem;

  /* --- Grid de 8pt --- */
  --e1: 8px;   --e2: 16px;  --e3: 24px;  --e4: 32px;
  --e5: 48px;  --e6: 64px;  --e7: 80px;  --e8: 96px;
  --e9: 120px;

  --secao-y:      clamp(64px, 8vw, 120px);
  --secao-y-curta: clamp(48px, 6vw, 80px);

  /* --- Formas --- */
  --raio:      2px;
  --raio-card: 4px;
  --borda-ouro: 1px solid rgba(200, 164, 92, 0.32);
  --borda-clara: 1px solid rgba(22, 22, 26, 0.12);
  --borda-escura: 1px solid var(--preto-linha);

  --largura: 1200px;
  --largura-texto: 720px;

  --transicao: 0.2s ease;
  --sombra: 0 24px 64px rgba(0, 0, 0, 0.18);
}