/*
Theme Name: ISNAR-IMG
Theme URI:  https://www.isnar-img.com
Author:     ISNAR-IMG
Description: Thème sur-mesure pour l'ISNAR-IMG, traduit de la maquette Figma.
Version:    1.0
License:    GPL-2.0-or-later
Text Domain: isnar-img
*/

/* ---------- Palette & tokens ---------- */
:root {
  --orange:       #F27D52; /* teinte validée client */
  --orange-dark:  #EF6431; /* même teinte que --orange, luminosité réduite d'autant que l'ancienne palette */
  --orange-soft:  #FBD9CD; /* même teinte que --orange, version très éclaircie */
  --navy:         #1C2A5A;
  --navy-deep:    #141E48;
  --blue-tag:     #2B3A67;
  --ink:          #1B1B1B;
  --muted:        #6C727F;
  --line:         #E6E8EC;
  --bg:           #FFFFFF;
  --bg-soft:      #F1F3F5;
  --radius:       10px;
  --radius-pill:  999px;
  /* min() plutôt qu'un vw pur : au-delà d'environ 2000px de viewport, 70vw
     dépasserait 1400px et donnerait des lignes de texte trop longues sur
     grand écran — sans effet en dessous de ce seuil, ni sur la surcharge
     --maxw:100vw à 560px (assets/css/main.css), déclarée dans un contexte
     de cascade plus spécifique qui l'emporte quoi qu'il arrive. */
  --maxw:         min(70vw, 1400px);
  --gap:          24px;
  --sticky-offset: 130px; /* hauteur approx. de .sticky-nav (mainnav + subbar) : dégage les ancres et le sommaire collant */
}

/* ---------- Reset léger ---------- */
*,*::before,*::after { box-sizing: border-box; }
html { font-size: clamp(14px, 1.1vw, 20px); scroll-padding-top: var(--sticky-offset); }
body { margin: 0; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }

/* ---------- Base ---------- */
body {
  font-family: "Helvetica Neue", Arial, sans-serif;
  color: var(--ink);
  background: var(--bg);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  /* Colle le footer en bas même quand le contenu ne remplit pas l'écran :
     body en colonne flex sur toute la hauteur de la fenêtre, footer poussé
     en bas via margin-top:auto (voir .site-footer, main.css). */
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}
.container { max-width: var(--maxw); margin: 0 auto; padding: 0 20px; }

h1,h2,h3 { line-height: 1.2; margin: 0; }
p { margin: 0 0 1rem; }

/* ---------- Boutons ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 22px; border-radius: var(--radius-pill);
  font-weight: 700; font-size: 0.875rem; border: 2px solid var(--navy);
  color: var(--navy); background: #fff; transition: .2s;
  box-shadow: 0 2px 8px rgba(0,0,0,.10);
}
.btn:hover { background: var(--navy); color: #fff; box-shadow: 0 4px 14px rgba(0,0,0,.22); }
.btn--orange { background: var(--orange); border-color: var(--orange); color: #fff; box-shadow: 0 2px 10px rgba(242,125,82,.32); }
.btn--orange:hover { background: var(--orange-dark); border-color: var(--orange-dark); box-shadow: 0 4px 16px rgba(242,125,82,.48); }
/* Utilisée sur fond clair (page-antidote.php, single-antidote.php) : base
   .btn est déjà un contour navy sur blanc, ici juste plus "plat" (sans
   l'ombre portée) pour signaler une action secondaire. Restait non définie
   jusqu'ici — retombait silencieusement sur .btn seul. */
.btn--outline { background: transparent; box-shadow: none; }
.btn--sm { padding: 6px 16px; font-size: 0.8rem; }
.btn__arrow { width: 22px; height: 22px; border-radius: 50%; border: 1px solid currentColor;
  display: inline-flex; align-items: center; justify-content: center; font-size: 0.825rem; }