/* ============================================================
   Boussole IA · Typographie V4 (refonte du 24/09/2026, demande de Paul)
   Chargée EN DERNIER par les 4 pages V4 uniquement :
   index-v4.html · phase-1-sprint.html · phase-2a-autonomie.html · phase-2b-accompagnement.html
   ------------------------------------------------------------
   Abandon du trio Sora / Inter / Fraunces (esthétique « template IA »).
   Nouveau parti pris, inspiré de la presse économique :
   - Newsreader (Production Type) : titres, chiffres clés, citations.
     Une seule famille pour le titre ET son emphase : l'italique
     vient de la même police (fin de l'effet « deux polices collées »).
   - Libre Franklin (Impallari, d'après le Franklin Gothic) : texte
     courant, navigation, boutons, étiquettes.
   - Interlettrage négatif agressif supprimé (autre signature « SaaS IA »).
   ============================================================ */

:root {
  --display: 'Newsreader', 'Iowan Old Style', 'Palatino Linotype', Georgia, serif;
  --serif: 'Newsreader', 'Iowan Old Style', 'Palatino Linotype', Georgia, serif;
  --sans: 'Libre Franklin', 'Helvetica Neue', Arial, sans-serif;
}

body {
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.68;
  font-feature-settings: "kern" 1;
}

/* ---------- Titres : serif de presse, interlettrage naturel ---------- */
h1, h2, h3 {
  font-family: var(--display);
  font-optical-sizing: auto;
  font-variation-settings: normal;
  letter-spacing: -0.005em;
  font-weight: 500;
}
h1 { font-weight: 500; letter-spacing: -0.012em; }
h2 { letter-spacing: -0.01em; }
h3 { font-weight: 600; letter-spacing: 0; }

.hero-title,
.hero-v4 .hero-title,
.detail-page .hero-title {
  font-weight: 500;
  font-size: clamp(2.5rem, 4.6vw, 3.8rem);
  line-height: 1.06;
  letter-spacing: -0.012em;
}
.section-title {
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -0.01em;
}

/* ---------- Emphases : même famille que le texte parent ---------- */
em {
  font-family: inherit;
  font-variation-settings: normal;
  letter-spacing: inherit;
}
.hero-title em,
.section-title em,
.arbo-phase-title em,
h1 em, h2 em, h3 em {
  font-family: var(--display);
  font-style: italic;
  font-weight: 500;
  font-variation-settings: normal;
  letter-spacing: -0.005em;
}
/* Emphases dans le texte courant : italique Libre Franklin, plus de serif incrusté */
p em, li em,
.method-panels .step-pitch em,
.step-result em {
  font-family: var(--sans);
  font-style: italic;
  font-weight: inherit;
}

/* ---------- Composants en serif (titres de cartes, chiffres) ---------- */
.arbo-phase-title,
.arbo-option-title,
.visual-card-title,
.journey-step h3,
.mission-card h3,
.arbo-details summary,
.p2-deliverable strong {
  font-family: var(--display);
  letter-spacing: 0;
}
.arbo-phase-title { font-weight: 500; }
.arbo-option-title { font-size: 1.02rem; font-weight: 600; line-height: 1.35; }
.visual-card-title { font-size: 1.18rem; font-weight: 600; }
.journey-step h3 { font-size: 1.22rem; font-weight: 600; }
.arbo-details summary { font-size: 1.2rem; font-weight: 500; }
.p2-deliverable strong { font-size: 1.12rem; font-weight: 500; }

.hero-facts strong,
.v4-price-value {
  font-family: var(--display);
  font-weight: 600;
  letter-spacing: 0;
  font-variant-numeric: lining-nums;
}
.hero-facts strong { font-size: 1.3rem; }
.v4-price-value { font-size: 1.5rem; }

.team-profile-photo-placeholder { font-family: var(--display); font-weight: 500; }
.detail-summary dd { font-family: var(--sans); font-size: .95rem; font-weight: 500; }

/* Citations : serif italique, cohérente avec les titres */
.pull-quote,
.pull-quote-mark {
  font-family: var(--serif);
  font-variation-settings: normal;
}

/* ---------- Étiquettes et petits textes : toujours en sans ---------- */
.arbo-label,
.section-eyebrow,
.hero-kicker,
.pull-quote-author,
h4 {
  font-family: var(--sans);
}
.arbo-label { font-weight: 600; letter-spacing: .14em; }

/* ---------- Illustration du hero (codée) : sans, sans tracking négatif ---------- */
.hw-canvas { font-family: var(--sans); }
.hw-step-title { font-family: var(--display); font-weight: 600; font-size: clamp(1.08rem, 1.7vw, 1.28rem); letter-spacing: 0; }
.hw-card strong,
.hw-final p,
.sv-step-text strong,
.method-tab-text strong { letter-spacing: 0; }
.hw-final p { font-family: var(--display); font-style: italic; font-weight: 600; font-size: clamp(1rem, 1.6vw, 1.12rem); }
.hw-num { font-family: var(--display); font-weight: 600; font-size: 1.3rem; letter-spacing: 0; }

/* ---------- Interface ---------- */
.btn, .main-nav a, .nav-phase summary { font-family: var(--sans); letter-spacing: 0; }
.btn { font-weight: 600; }

/* ---------- Mobile ---------- */
@media (max-width: 768px) {
  .hero-title,
  .hero-v4 .hero-title,
  .detail-page .hero-title { font-size: 2.4rem; line-height: 1.1; letter-spacing: -0.008em; }
  .section-title { font-size: clamp(1.8rem, 7vw, 2.2rem); }
}
