/* =========================================================================
   Grande Pharmacie Terre de Seine — theme.css
   Variante B figée (émeraude équilibré). Tokens chromatiques + typo.
   ========================================================================= */

/* ---------- Polices Proxima Nova (self-hosted, RGPD-safe) --------------- *
 * Reprise de la grammaire typographique du site de référence
 * (Cabinet dentaire Pacy-sur-Eure). Fichiers dans /assets/fonts/.
 * ------------------------------------------------------------------------- */
@font-face {
  font-family: "Proxima Nova";
  src: url("../assets/fonts/ProximaNova-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: optional;
}
@font-face {
  font-family: "Proxima Nova";
  src: url("../assets/fonts/ProximaNova-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: optional;
}

:root {
  /* Fonds */
  --bg:            #f8faf9;
  --bg-soft:       #edf5f0;
  --surface:       #ffffff;
  --surface-muted: #f1f7f3;
  --surface-tint:  #ecfdf5;

  /* Texte */
  --ink:           #064E3B;
  --text:          #1f2937;
  --text-muted:    #475569;
  --text-soft:     #64748b;
  --inverse:       #ffffff;

  /* Accents émeraude */
  --accent:        #065F46;
  --accent-strong: #022C22;
  --accent-soft:   #D1FAE5;
  --hero-bg:       #064E3B;

  /* Couleurs complémentaires */
  --sage:          #10B981;
  --line:          rgba(6, 78, 59, 0.12);
  --line-strong:   rgba(6, 78, 59, 0.20);

  /* Ombres */
  --shadow-card:   0 16px 40px rgba(6, 78, 59, 0.08);
  --shadow-soft:   0 8px 24px rgba(6, 78, 59, 0.06);

  /* Typo */
  --font-body:     "Proxima Nova", "Helvetica Neue", system-ui, -apple-system, Arial, sans-serif;

  /* Grille */
  --container:        1180px;
  --container-narrow: 720px;
  --gutter:           24px;
  --section-space:    96px;

  /* Header & safe-areas */
  --safe-area-top:    0px;
  --safe-area-bottom: 0px;
  --header-content-height: 78px;
  --header-height:    var(--header-content-height);
  --anchor-offset:    calc(var(--header-height) + 18px);

  --radius: 8px;
  --touch:  48px;
}

@supports (padding: env(safe-area-inset-top)) {
  :root {
    --safe-area-top:    env(safe-area-inset-top);
    --safe-area-bottom: env(safe-area-inset-bottom);
    --header-height:    calc(var(--header-content-height) + var(--safe-area-top));
  }
}

@media (max-width: 760px) {
  :root { --section-space: 64px; }
}