/* ══════════════════════════════════════════════════════════════════════════════
   CHARTE GRAPHIQUE & TYPOGRAPHIE INSTITUTIONNELLE — ARA (point 2)
   Chargée en dernier par les 7 pages : elle ne change ni le balisage ni le code fonctionnel.
   • Fond global #F8FAFC · titres #0F172A · accent bleu académique #0B6BCB
   • Inter partout (titres en 700, sous-titres en 500) — plus aucune police à empattements ni DM Sans
   • Cartes : fond blanc, bordure 1px #E2E8F0, rayon 12px, ombre douce 0 4px 20px rgba(0,0,0,.06) au survol
   ══════════════════════════════════════════════════════════════════════════════ */
:root{
  --charte-bg:#F8FAFC;--charte-ink:#0F172A;--charte-line:#E2E8F0;
  --charte-accent:#0B6BCB;--charte-accent-d:#0A58A6;
  --charte-radius:12px;--charte-shadow-hover:0 4px 20px rgba(0,0,0,.06);
  --charte-font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
}

/* 1 ─ Fond global */
html,body{background:var(--charte-bg)}
section.hx-sec,section.hx-sec.hx-tint{background:transparent}   /* accueil : les cartes blanches se détachent du fond global */
.grades-bg{background:var(--charte-bg)}

/* 2 ─ Couleurs du texte : titres bleu marine très foncé / noir profond */
h1,h2,h3,h4,h5,h6{color:var(--charte-ink)}
.hx-final-box h2{color:#fff}   /* correction : ce titre héritait de la règle h2 et devenait invisible sur le bandeau bleu marine */

/* 3 ─ Typographie : Inter partout */
body{font-family:var(--charte-font)}
h1,h2,h3,h4,h5,h6{font-family:var(--charte-font);font-weight:700}


/* titres, chiffres clés et prix : Inter 700 */
body .bstat-val,
body .cc-title,
body .conseil-num,
body .contact-info h3,
body .cta-final h3,
body .cta-title,
body .detector-title,
body .dr-journal-name,
body .dr-score-num,
body .expert-name,
body .experts-section-heading,
body .float-val,
body .footer-brand-name,
body .grade-abbr,
body .grade-name,
body .header h1,
body .hero h1,
body .hstat-val,
body .hx-card h3,
body .hx-final-box h2,
body .hx-h2,
body .hx-hero h1.hx-h1,
body .hx-serif,
body .hx-stat-num,
body .jf-res-head h3,
body .jf-ttl strong,
body .mc-num,
body .mc-price,
body .mc-title,
body .module-title,
body .nav-icon,
body .nav-name,
body .pack-price-new,
body .pack-title,
body .price-amount,
body .proc-num,
body .pstep-num,
body .rp-impact,
body .section-title,
body .srv-title,
body .stat-val,
body .success-title,
body .tarif-price,
body .tarifs-title,
body .team-name{font-family:var(--charte-font);font-weight:700}

/* boutons et champs de saisie : Inter (les graisses propres à chaque composant sont conservées) */
body .btn,
body .btn-back,
body .btn-submit,
body .detector-btn,
body .detector-inp,
body .filter-adv-btn,
body .filter-icon-btn,
body .form-group input,
body .form-group select,
body .form-group textarea,
body .level-btn,
body .reduce-btn,
body .search-filter-inp,
body .search-inp,
body .sec-search,
body .submit-btn,
body .toggle-btn,
body input[type=email],
body input[type=tel],
body input[type=text],
body select,
body textarea{font-family:var(--charte-font)}

/* polices imposées en ligne (attribut style) */
[style*="Playfair"],[style*="DM Sans"],[style*="Source Serif"]{font-family:var(--charte-font) !important}

/* sous-titres : Inter 500 */
body .hero-desc,
body .hero .hero-desc,
body .hero-inner > p:not([class]),
body .hero > p:not([class]),
body .header-inner > p:not([class]),
body .hx-sub,
body .hx-lead,
body .section-desc,
body .tarifs-desc,
body .detector-desc,
body .cta-desc,
body .grade-subtitle{font-weight:500}


/* 4 ─ Cartes : blocs blancs, bordure fine, coins arrondis, ombre douce au survol
   (sélecteurs à une seule classe : les variantes .featured / .sel / .open / .active gardent leur priorité) */
.card,
.client-card,
.comm-h-card,
.concours-card,
.concours-h-card,
.cons-h-card,
.conseil-card,
.conseil-h-card,
.exp-h-card,
.expert-card,
.fonct-card,
.fonct-h-card,
.form-card,
.grade-h-card,
.hero-card,
.hero-card-float,
.hero-card-main,
.hx-card,
.impact-card,
.journal-card,
.level-card,
.mc-h-card,
.module-card,
.module-h-card,
.price-h-card,
.proc-h-card,
.pstep-card,
.pstep-h,
.res-card,
.res-h-card,
.rp-card,
.service-card,
.srv-h-card,
.stat-box,
.tarif-card,
.tarif-h-card,
.team-card,
.testi-card,
.dr-card,
.contact-form,
.contact-method,
.dl-inner,
.exp-block,
.faq-item,
.bstat,
.bstat-card,
.jf-item{background:#fff;border:1px solid var(--charte-line);border-radius:var(--charte-radius);box-shadow:none}
.card:hover,
.client-card:hover,
.comm-h-card:hover,
.concours-card:hover,
.concours-h-card:hover,
.cons-h-card:hover,
.conseil-card:hover,
.conseil-h-card:hover,
.exp-h-card:hover,
.expert-card:hover,
.fonct-card:hover,
.fonct-h-card:hover,
.form-card:hover,
.grade-h-card:hover,
.hero-card:hover,
.hero-card-float:hover,
.hero-card-main:hover,
.hx-card:hover,
.impact-card:hover,
.journal-card:hover,
.level-card:hover,
.mc-h-card:hover,
.module-card:hover,
.module-h-card:hover,
.price-h-card:hover,
.proc-h-card:hover,
.pstep-card:hover,
.pstep-h:hover,
.res-card:hover,
.res-h-card:hover,
.rp-card:hover,
.service-card:hover,
.srv-h-card:hover,
.stat-box:hover,
.tarif-card:hover,
.tarif-h-card:hover,
.team-card:hover,
.testi-card:hover,
.dr-card:hover,
.contact-form:hover,
.contact-method:hover,
.dl-inner:hover,
.exp-block:hover,
.faq-item:hover,
.bstat:hover,
.bstat-card:hover,
.jf-item:hover{box-shadow:var(--charte-shadow-hover)}


/* 5 ─ Accent : liens et badges actifs en bleu académique */
a{color:var(--charte-accent)}
a:hover{color:var(--charte-accent-d)}
.nav-link.active{color:var(--charte-accent);background:var(--accent-pale,#E6F1FB)}
.level-btn.active{background:var(--charte-accent);border-color:var(--charte-accent);color:#fff}
.toggle-btn.active-mentee,.toggle-btn.active-mentor{background:var(--charte-accent);color:#fff}
.jf-chip input:checked+span{background:var(--charte-accent);border-color:var(--charte-accent);color:#fff}