/* ==========================================================================
   EreVital FR — tokens.css
   Paleta masculina, tipografia grande para público 50+.
   Fonte de verdade. Nada além disso entra neste arquivo.
   ========================================================================== */

:root {
  /* --- Cor ---------------------------------------------------------------- */
  --ink-900: #0F1923;   /* texto principal — deep navy-black */
  --ink-600: #2D3A4A;   /* texto secundário — steel */
  --ink-400: #6B7A8A;   /* legendas, disclaimers — cool gray */
  --paper:   #F0F0EC;   /* fundo — cool off-white */
  --white:   #F8F8F6;   /* cards, superfícies elevadas */
  --line:    #D4D4CE;   /* filetes, bordas */
  --clinic:  #0A5C4E;   /* dark teal — confiança */
  --signal:  #C23616;   /* deep red — CTA, preço */

  /* --- Tipografia -------------------------------------------------------- */
  --font-display: "Outfit", system-ui, -apple-system, sans-serif;
  --font-body:    "Crimson Pro", Georgia, "Times New Roman", serif;
  --font-mono:    "DM Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --fs-eyebrow: 0.8125rem;
  --fs-body:    1.125rem;
  --fs-h3:      1.375rem;
  --fs-h2:      2rem;
  --fs-h1:      2.5rem;
  --fs-price:   3.25rem;

  --ls-eyebrow: 0.12em;

  /* --- Layout ------------------------------------------------------------ */
  --container:    1080px;
  --gutter:       24px;
  --grid-gap:     28px;
  --section-gap:  72px;

  --radius-card: 6px;
  --radius-btn:  4px;

  --hairline: 0 1px 0 var(--line);

  /* --- Movimento --------------------------------------------------------- */
  --t-hover:  150ms;
  --t-reveal: 300ms;
}

@media (min-width: 768px) {
  :root {
    --fs-body:  1.25rem;
    --fs-h3:    1.75rem;
    --fs-h2:    3rem;
    --fs-h1:    4rem;
    --fs-price: 5rem;

    --gutter:      40px;
    --section-gap: 100px;
  }
}