/* ============================================================
   ONG ANSH — Feuille de style principale
   Palette : charte ANSH — bleu #216DB6 / bleu clair #E2ECF8
   Typo : Poppins (titres) + Public Sans (texte)
   ============================================================ */

:root{
  --vert:#216DB6;          /* bleu principal (charte) */
  --vert-fonce:#123A5E;    /* bleu marine — encre / fonds sombres */
  --vert-clair:#3F8AD1;
  --or:#F2A93B;            /* accent doré — bouton don uniquement */
  --or-clair:#FFC966;
  --sable:#E2ECF8;         /* bleu clair (charte) — fonds de sections */
  --blanc:#FFFFFF;
  --texte:#1C2B3A;
  --texte-doux:#51637A;
  --ligne:#CBDCEE;
  --radius:14px;
  --ombre:0 10px 30px rgba(18,58,94,.12);
  --transition:.25s ease;
  --largeur:1140px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Public Sans',system-ui,-apple-system,sans-serif;
  color:var(--texte);
  background:var(--blanc);
  line-height:1.65;
  font-size:16.5px;
}
img{max-width:100%;display:block}
a{color:var(--vert);text-decoration:none;transition:var(--transition)}
ul{list-style:none}

h1,h2,h3,.display{
  font-family:'Poppins',system-ui,sans-serif;
  font-weight:700;
  line-height:1.2;
  color:var(--vert-fonce);
  letter-spacing:-.02em;
}
h1{font-size:clamp(2.1rem,4.5vw,3.4rem)}
h2{font-size:clamp(1.7rem,3vw,2.4rem)}
h3{font-size:1.25rem}

.conteneur{max-width:var(--largeur);margin:0 auto;padding:0 22px}
section{padding:78px 0}
.section-sable{background:var(--sable)}
.section-sombre{background:var(--vert-fonce);color:#EAF2FA}
.section-sombre h2,.section-sombre h3{color:var(--blanc)}
.section-sombre p{color:#C3D6EA}

/* Eyebrow / surtitre */
.surtitre{
  display:inline-flex;align-items:center;gap:10px;
  text-transform:uppercase;letter-spacing:.18em;
  font-size:.78rem;font-weight:700;color:var(--or);
  margin-bottom:14px;
}
.surtitre::before{content:"";width:34px;height:2px;background:var(--or)}

.intro{max-width:640px;color:var(--texte-doux);margin-top:14px}

/* Boutons */
.btn{
  display:inline-flex;align-items:center;gap:9px;
  padding:14px 28px;border-radius:999px;
  font-weight:700;font-size:.95rem;cursor:pointer;border:none;
  transition:var(--transition);
}
.btn-or{background:var(--or);color:var(--vert-fonce)}
.btn-or:hover{background:var(--or-clair);transform:translateY(-2px)}
.btn-vert{background:var(--vert);color:var(--blanc)}
.btn-vert:hover{background:var(--vert-clair);transform:translateY(-2px)}
.btn-contour{border:2px solid var(--vert);color:var(--vert);background:transparent}
.btn-contour:hover{background:var(--vert);color:var(--blanc)}
.btn-blanc{background:var(--blanc);color:var(--vert-fonce)}
.btn-blanc:hover{background:var(--sable)}

/* ============ BARRE SUPÉRIEURE ============ */
.topbar{
  background:var(--vert-fonce);color:#BFD3E6;
  font-size:.82rem;padding:8px 0;
}
.topbar .conteneur{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.topbar a{color:#BFD3E6}
.topbar a:hover{color:var(--or-clair)}
.topbar .infos{display:flex;gap:22px;flex-wrap:wrap}
.topbar .sociaux{display:flex;gap:14px}

/* ============ NAVIGATION ============ */
.navbar{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,.96);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--ligne);
}
.navbar .conteneur{display:flex;align-items:center;justify-content:space-between;height:76px}
.logo{display:flex;align-items:center;gap:12px;font-family:'Poppins',sans-serif;font-weight:700;font-size:1.25rem;color:var(--vert-fonce)}
.logo img{height:52px;width:52px;object-fit:contain;border-radius:8px}
.logo span b{color:var(--or)}
.menu{display:flex;gap:6px;align-items:center}
.menu a{
  padding:9px 14px;border-radius:8px;font-weight:600;font-size:.93rem;color:var(--texte);
}
.menu a:hover{color:var(--vert);background:var(--sable)}
.menu a.actif{color:var(--vert);background:var(--sable)}
.menu .btn{margin-left:10px;padding:11px 22px}
.burger{display:none;background:none;border:none;cursor:pointer;font-size:1.7rem;color:var(--vert-fonce)}

/* ============ HERO ============ */
.hero{
  position:relative;min-height:82vh;display:flex;align-items:center;
  background:
    linear-gradient(100deg,rgba(18,58,94,.88) 0%,rgba(18,58,94,.55) 55%,rgba(18,58,94,.25) 100%),
    url('../assets/img/hero.jpg') center/cover no-repeat,
    var(--vert-fonce) url('https://ansh-niger.org/wp-content/uploads/2023/06/IMG-20250203-WA0205.jpg') center/cover no-repeat;
  color:var(--blanc);
  padding:90px 0;
}
.hero h1{color:var(--blanc);max-width:640px}
.hero h1 em{font-style:italic;color:var(--or-clair)}
.hero p{max-width:560px;margin:22px 0 32px;color:#DCE9F6;font-size:1.12rem}
.hero .actions{display:flex;gap:14px;flex-wrap:wrap}

/* Bandeau d'agrément officiel — élément signature de crédibilité */
.bandeau-officiel{
  background:var(--or);color:var(--vert-fonce);
  padding:13px 0;font-size:.92rem;font-weight:600;
}
.bandeau-officiel .conteneur{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;text-align:center}
.bandeau-officiel .sceau{font-size:1.2rem}

/* Séparateur zigzag sahélien */
.zigzag{height:14px;background:
  linear-gradient(135deg,var(--sable) 25%,transparent 25%) -8px 0,
  linear-gradient(225deg,var(--sable) 25%,transparent 25%) -8px 0;
  background-size:16px 16px;background-repeat:repeat-x;background-color:transparent;
}

/* ============ CHIFFRES CLÉS ============ */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;text-align:center}
.stat .nombre{
  font-family:'Poppins',sans-serif;font-size:2.6rem;font-weight:700;color:var(--or);
}
.stat .libelle{font-size:.9rem;color:inherit;opacity:.85;text-transform:uppercase;letter-spacing:.08em}

/* ============ GRILLES DE CARTES ============ */
.grille-2{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center}
.grille-3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.grille-4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}

.carte{
  background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--radius);
  padding:30px;transition:var(--transition);
}
.carte:hover{transform:translateY(-5px);box-shadow:var(--ombre);border-color:transparent}
.carte .icone{
  width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  background:var(--sable);font-size:1.6rem;margin-bottom:18px;
}
.carte h3{margin-bottom:10px}
.carte p{color:var(--texte-doux);font-size:.95rem}
.carte .lien{display:inline-block;margin-top:14px;font-weight:700;font-size:.9rem;color:var(--or)}
.carte .lien:hover{color:var(--vert)}

/* Carte projet avec image */
.carte-projet{padding:0;overflow:hidden}
.carte-projet .visuel{
  height:210px;background:linear-gradient(135deg,var(--vert) 0%,var(--vert-fonce) 100%) center/cover no-repeat;
  position:relative;
}
.carte-projet .visuel img{width:100%;height:100%;object-fit:cover}
.carte-projet .etiquette{
  position:absolute;top:14px;left:14px;background:var(--or);color:var(--vert-fonce);
  padding:4px 12px;border-radius:999px;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
}
.carte-projet .contenu{padding:24px}
.carte-projet .meta{font-size:.82rem;color:var(--texte-doux);margin-bottom:8px}

/* ============ IMAGES / VISUELS ============ */
.visuel-cadre{
  border-radius:var(--radius);overflow:hidden;box-shadow:var(--ombre);
  background:linear-gradient(135deg,var(--vert) 0%,var(--vert-fonce) 100%);
  min-height:340px;
}
.visuel-cadre img{width:100%;height:100%;object-fit:cover;min-height:340px}

/* ============ PROCESSUS ============ */
.processus{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;counter-reset:etape}
.etape{position:relative;padding:30px;background:var(--blanc);border-radius:var(--radius);border:1px solid var(--ligne)}
.etape::before{
  counter-increment:etape;content:"0" counter(etape);
  font-family:'Poppins',sans-serif;font-size:2.4rem;font-weight:700;color:var(--or);
  display:block;margin-bottom:8px;
}

/* ============ TÉMOIGNAGES ============ */
.temoignage{
  background:var(--blanc);border-radius:var(--radius);padding:32px;border:1px solid var(--ligne);
}
.temoignage blockquote{font-style:italic;color:var(--texte);font-size:1.02rem}
.temoignage .auteur{margin-top:18px;font-weight:700;color:var(--vert)}
.temoignage .role{font-size:.85rem;color:var(--texte-doux)}

/* ============ PARTENAIRES ============ */
.logos-partenaires{display:flex;gap:40px;flex-wrap:wrap;align-items:center;justify-content:center;opacity:.85}
.logos-partenaires .logo-p{
  min-width:150px;height:74px;display:flex;align-items:center;justify-content:center;
  background:var(--blanc);border:1px solid var(--ligne);border-radius:10px;
  font-weight:700;color:var(--texte-doux);padding:0 20px;
}

/* ============ APPEL À L'ACTION ============ */
.cta{
  background:linear-gradient(120deg,var(--vert) 0%,var(--vert-fonce) 100%);
  border-radius:22px;padding:58px 48px;color:var(--blanc);
  display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;
}
.cta h2{color:var(--blanc);max-width:520px}
.cta p{color:#CFE0F0;max-width:520px;margin-top:10px}

/* ============ FORMULAIRES ============ */
.formulaire{display:grid;gap:18px}
.formulaire .rangee{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.champ label{display:block;font-weight:700;font-size:.88rem;margin-bottom:7px;color:var(--vert-fonce)}
.champ input,.champ select,.champ textarea{
  width:100%;padding:13px 16px;border:1.5px solid var(--ligne);border-radius:10px;
  font-family:inherit;font-size:.95rem;background:var(--blanc);color:var(--texte);
  transition:var(--transition);
}
.champ input:focus,.champ select:focus,.champ textarea:focus{
  outline:none;border-color:var(--vert);box-shadow:0 0 0 3px rgba(33,109,182,.15);
}
.champ textarea{min-height:140px;resize:vertical}

/* ============ PAGE DON ============ */
.montants{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.montant{
  padding:16px;border:2px solid var(--ligne);border-radius:12px;background:var(--blanc);
  font-weight:700;font-size:1.05rem;cursor:pointer;text-align:center;transition:var(--transition);
  color:var(--vert-fonce);
}
.montant:hover{border-color:var(--or)}
.montant.choisi{border-color:var(--or);background:var(--or);color:var(--vert-fonce)}
.moyens-paiement{display:grid;gap:16px}
.moyen{
  display:flex;gap:16px;align-items:flex-start;padding:20px;border:1px solid var(--ligne);
  border-radius:var(--radius);background:var(--blanc);
}
.moyen .picto{font-size:1.6rem}

/* ============ GALERIE ============ */
.galerie{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.galerie figure{
  border-radius:12px;overflow:hidden;position:relative;aspect-ratio:4/3;
  background:linear-gradient(135deg,var(--vert) 0%,var(--vert-fonce) 100%);
}
.galerie img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.galerie figure:hover img{transform:scale(1.05)}
.galerie figcaption{
  position:absolute;inset:auto 0 0 0;padding:12px 14px;font-size:.85rem;color:var(--blanc);
  background:linear-gradient(transparent,rgba(18,58,94,.85));
}

/* ============ EN-TÊTE DE PAGE INTÉRIEURE ============ */
.entete-page{
  background:
    linear-gradient(100deg,rgba(18,58,94,.9),rgba(18,58,94,.65)),
    url('../assets/img/bandeau.jpg') center/cover no-repeat,
    var(--vert-fonce) url('https://ansh-niger.org/wp-content/uploads/2023/06/DSC_1526-1024x683.jpg') center/cover no-repeat;
  color:var(--blanc);padding:88px 0 64px;
}
.entete-page h1{color:var(--blanc)}
.entete-page .fil{margin-top:12px;font-size:.9rem;color:#B7CCE2}
.entete-page .fil a{color:var(--or-clair)}

/* ============ ARTICLES / ACTUALITÉS ============ */
.article-corps{max-width:760px;margin:0 auto}
.article-corps p{margin-bottom:18px;color:var(--texte)}
.article-corps h2{margin:34px 0 14px;font-size:1.5rem}
.article-corps .meta{color:var(--texte-doux);font-size:.9rem;margin-bottom:26px}
.encadre{
  background:var(--sable);border-left:4px solid var(--or);border-radius:0 12px 12px 0;
  padding:20px 24px;margin:26px 0;
}

/* Fiche technique projet */
.fiche{
  background:var(--sable);border-radius:var(--radius);padding:28px;
  display:grid;gap:14px;position:sticky;top:100px;
}
.fiche dt{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--texte-doux);font-weight:700}
.fiche dd{font-weight:700;color:var(--vert-fonce);margin-bottom:6px}

/* ============ PIED DE PAGE ============ */
footer{background:var(--vert-fonce);color:#B7CCE2;padding:64px 0 0;font-size:.93rem}
footer h4{color:var(--blanc);font-family:'Poppins',sans-serif;font-size:1.05rem;margin-bottom:18px}
footer a{color:#B7CCE2}
footer a:hover{color:var(--or-clair)}
.footer-grille{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:44px}
.footer-grille li{margin-bottom:10px}
.footer-bas{
  border-top:1px solid rgba(255,255,255,.12);padding:20px 0;
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:.85rem;
}
.footer-bas .conteneur{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;width:100%}

/* ============ BOUTON WHATSAPP FLOTTANT ============ */
.wa-flottant{
  position:fixed;bottom:24px;right:24px;z-index:99;
  width:58px;height:58px;border-radius:50%;
  background:#25D366;color:var(--blanc);font-size:1.7rem;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 24px rgba(0,0,0,.25);
}
.wa-flottant:hover{transform:scale(1.08)}

/* ============ ANIMATIONS AU DÉFILEMENT ============ */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  *{scroll-behavior:auto!important}
}

/* ============ RESPONSIVE ============ */
@media (max-width:960px){
  .grille-3,.processus{grid-template-columns:1fr 1fr}
  .grille-4{grid-template-columns:1fr 1fr}
  .stats{grid-template-columns:1fr 1fr;gap:34px}
  .footer-grille{grid-template-columns:1fr 1fr}
  .galerie{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  section{padding:56px 0}
  .grille-2,.grille-3,.processus,.formulaire .rangee{grid-template-columns:1fr}
  .menu{
    position:fixed;inset:76px 0 auto 0;background:var(--blanc);
    flex-direction:column;align-items:stretch;padding:18px 22px 26px;gap:4px;
    border-bottom:1px solid var(--ligne);box-shadow:var(--ombre);
    transform:translateY(-130%);transition:transform .3s ease;
  }
  .menu.ouvert{transform:none}
  .menu a{padding:13px 14px}
  .menu .btn{margin:10px 0 0}
  .burger{display:block}
  .topbar .infos span:nth-child(2){display:none}
  .hero{min-height:70vh}
  .cta{padding:40px 28px}
  .montants{grid-template-columns:1fr 1fr}
  .galerie{grid-template-columns:1fr}
  .fiche{position:static}
}

/* Mise en page deux colonnes (don, contact, fiche projet) */
.duo{display:grid;grid-template-columns:1.2fr 1fr;gap:44px;align-items:start}
.duo-large{grid-template-columns:2fr 1fr}
@media (max-width:900px){.duo,.duo-large{grid-template-columns:1fr}}


/* Logos partenaires (images) */
.logos-partenaires .logo-p img{
  max-height:52px;max-width:130px;object-fit:contain;
  filter:grayscale(100%);opacity:.75;transition:var(--transition);
}
.logos-partenaires .logo-p:hover img{filter:none;opacity:1}

/* ============ CORRECTIFS NAVBAR (v4) ============ */
.navbar .conteneur{gap:10px}
.logo{white-space:nowrap;flex-shrink:0;font-size:1.15rem}
.logo img{height:46px;width:46px}
.menu{flex-wrap:nowrap}
.menu a{padding:9px 10px;font-size:.88rem;white-space:nowrap}
.menu .btn{padding:10px 18px;white-space:nowrap}
/* Menu burger dès que l'écran est trop étroit pour 8 liens + bouton */
@media (max-width:1160px){
  .menu{
    position:fixed;inset:76px 0 auto 0;background:var(--blanc);
    flex-direction:column;align-items:stretch;padding:18px 22px 26px;gap:4px;
    border-bottom:1px solid var(--ligne);box-shadow:var(--ombre);
    transform:translateY(-130%);transition:transform .3s ease;
  }
  .menu.ouvert{transform:none}
  .menu a{padding:13px 14px;font-size:.95rem}
  .menu .btn{margin:10px 0 0}
  .burger{display:block}
}

/* ============ LOGO PLUS VISIBLE (v7) ============ */
.navbar .conteneur{height:92px}
.logo{gap:14px;font-size:1.45rem}
.logo img{height:72px;width:72px}
@media (max-width:1160px){
  .menu{inset:92px 0 auto 0}
}
@media (max-width:760px){
  .navbar .conteneur{height:78px}
  .logo img{height:58px;width:58px}
  .logo{font-size:1.2rem}
  .menu{inset:78px 0 auto 0}
}

/* ============ REFONTE V8 : sans topbar, hero premium ============ */
.navbar .conteneur{height:96px}
.logo img{height:78px;width:78px}
.logo{font-size:1.5rem}
@media (max-width:1160px){.menu{inset:96px 0 auto 0}}
@media (max-width:760px){
  .navbar .conteneur{height:80px}
  .logo img{height:60px;width:60px}
  .logo{font-size:1.25rem}
  .menu{inset:80px 0 auto 0}
}

/* Hero : décor élégant même sans photo */
.hero{position:relative;overflow:hidden;min-height:76vh}
.hero::before{
  content:"";position:absolute;width:640px;height:640px;border-radius:50%;
  background:radial-gradient(circle,rgba(63,138,209,.40),transparent 68%);
  top:-180px;right:-140px;
}
.hero::after{
  content:"";position:absolute;width:460px;height:460px;border-radius:50%;
  background:radial-gradient(circle,rgba(242,169,59,.20),transparent 68%);
  bottom:-160px;left:-110px;
}
.hero-grille{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1.25fr 1fr;gap:56px;align-items:center;
}
.carte-hero{
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(10px);
  border-radius:22px;padding:34px;
  box-shadow:0 20px 50px rgba(0,0,0,.25);
}
.carte-hero-logo{height:110px;width:110px;margin:0 auto 22px}
.carte-hero ul{display:grid;gap:12px;color:#DCE9F6;font-size:.97rem}
.carte-hero-btn{width:100%;justify-content:center;margin-top:24px}
@media (max-width:960px){
  .hero-grille{grid-template-columns:1fr;gap:40px}
  .carte-hero{max-width:440px}
}

/* ============ LOGO NET (v9) : proportions naturelles ============ */
.logo img{height:64px;width:auto}
.carte-hero-logo{height:120px;width:auto}
@media (max-width:760px){.logo img{height:52px;width:auto}}

/* ============ V12 : logo bleu, stats-6, thème nuit, assistant ============ */
.logo, .logo span b{color:var(--vert)}

.stats-6{grid-template-columns:repeat(3,1fr)}
@media (max-width:960px){.stats-6{grid-template-columns:repeat(2,1fr)}}

/* Sélecteur de langue + bouton thème */
.choix-langue{
  border:1.5px solid var(--ligne);border-radius:8px;padding:7px 8px;
  font-family:inherit;font-weight:700;font-size:.85rem;color:var(--vert-fonce);
  background:var(--blanc);cursor:pointer;margin-left:6px;
}
.basculer-theme{
  background:var(--sable);border:none;border-radius:8px;width:38px;height:38px;
  font-size:1.1rem;cursor:pointer;margin-left:6px;transition:var(--transition);
}
.basculer-theme:hover{transform:scale(1.08)}

/* ---------- MODE NUIT ---------- */
body.nuit{
  --blanc:#13202E;          /* surfaces (cartes, navbar) */
  --sable:#0D1826;          /* fonds de sections */
  --vert-fonce:#0A1420;     /* fonds sombres (hero, footer) */
  --vert:#4D9BE0;
  --vert-clair:#6FB2EC;
  --texte:#E8F0F8;
  --texte-doux:#A5B8CC;
  --ligne:#25384E;
  background:#0D1826;
}
body.nuit .navbar{background:rgba(19,32,46,.95)}
body.nuit .menu a{color:var(--texte)}
body.nuit .carte-hero{background:rgba(255,255,255,.05)}
body.nuit .choix-langue{color:var(--texte)}

/* ---------- ASSISTANT ANSH ---------- */
.assistant-bouton{
  position:fixed;bottom:24px;right:24px;z-index:99;
  display:flex;align-items:center;gap:10px;
  background:var(--vert);color:#fff;border:none;cursor:pointer;
  padding:14px 20px;border-radius:999px;font-weight:700;font-size:.95rem;
  box-shadow:0 10px 30px rgba(0,0,0,.3);transition:var(--transition);
  font-family:inherit;
}
.assistant-bouton:hover{transform:translateY(-3px)}
.assistant-panneau{
  position:fixed;bottom:92px;right:24px;z-index:100;
  width:360px;max-width:calc(100vw - 32px);max-height:70vh;
  background:var(--blanc);border-radius:18px;overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.35);
  display:none;flex-direction:column;border:1px solid var(--ligne);
}
.assistant-panneau.ouvert{display:flex}
.assistant-tete{
  background:linear-gradient(120deg,var(--vert),#123A5E);color:#fff;
  padding:16px 18px;font-weight:700;display:flex;justify-content:space-between;align-items:center;
}
.assistant-tete small{display:block;font-weight:400;opacity:.85;font-size:.78rem}
.assistant-fermer{background:none;border:none;color:#fff;font-size:1.3rem;cursor:pointer}
.assistant-corps{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.msg{max-width:85%;padding:10px 14px;border-radius:14px;font-size:.92rem;line-height:1.5}
.msg.bot{background:var(--sable);color:var(--texte);border-bottom-left-radius:4px;align-self:flex-start}
.msg.moi{background:var(--vert);color:#fff;border-bottom-right-radius:4px;align-self:flex-end}
.msg a{font-weight:700;text-decoration:underline}
.msg.bot a{color:var(--vert)}
.msg.moi a{color:#fff}
.assistant-chips{display:flex;flex-wrap:wrap;gap:8px;padding:0 16px 10px}
.chip{
  background:var(--blanc);border:1.5px solid var(--vert);color:var(--vert);
  border-radius:999px;padding:7px 13px;font-size:.8rem;font-weight:700;cursor:pointer;
  transition:var(--transition);font-family:inherit;
}
.chip:hover{background:var(--vert);color:#fff}
.assistant-saisie{display:flex;gap:8px;padding:12px;border-top:1px solid var(--ligne)}
.assistant-saisie input{
  flex:1;padding:11px 14px;border:1.5px solid var(--ligne);border-radius:999px;
  font-family:inherit;font-size:.9rem;background:var(--blanc);color:var(--texte);
}
.assistant-saisie button{
  background:var(--or);border:none;border-radius:999px;width:44px;height:44px;
  font-size:1.1rem;cursor:pointer;
}

/* ============ V14 : carrousel hero + logo final ============ */
.hero{background:var(--vert-fonce)}
.hero-fond{position:absolute;inset:0;z-index:0}
.hero-fond .diapo{
  position:absolute;inset:0;background-position:center;background-size:cover;
  opacity:0;transition:opacity 1.4s ease;transform:scale(1.06);
}
.hero-fond .diapo.active{opacity:1;transform:scale(1);transition:opacity 1.4s ease, transform 7s linear}
.hero-voile{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(100deg,rgba(10,26,42,.88) 0%,rgba(10,26,42,.62) 55%,rgba(10,26,42,.30) 100%);
}
.hero::before,.hero::after{z-index:1}
.hero .conteneur{position:relative;z-index:2}
.hero-points{
  position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:3;
  display:flex;gap:10px;
}
.hero-points button{
  width:11px;height:11px;border-radius:50%;border:none;cursor:pointer;
  background:rgba(255,255,255,.4);transition:var(--transition);padding:0;
}
.hero-points button.actif{background:var(--or);transform:scale(1.25)}

/* Logo : taille finale, proportions respectées, bien visible */
.logo img{height:72px;width:auto}
.carte-hero-logo{height:118px;width:auto}
@media (max-width:760px){.logo img{height:56px;width:auto}}

/* ============ V15 : logo HD détaillé en grand ============ */
.navbar .conteneur{height:118px}
.logo{gap:16px;font-size:1.6rem}
.logo img{height:98px;width:auto}
@media (max-width:1160px){.menu{inset:118px 0 auto 0}}
@media (max-width:760px){
  .navbar .conteneur{height:86px}
  .logo img{height:66px;width:auto}
  .logo{font-size:1.25rem}
  .menu{inset:86px 0 auto 0}
}

/* ============ V16 : hero épuré, photos à l'honneur ============ */
.hero-grille{grid-template-columns:1fr}
.hero-confiance{
  display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:30px;
  color:#DCE9F6;font-size:.92rem;font-weight:600;max-width:620px;
}

/* ============ V17 : traduction intégrée, interface Google masquée ============ */
.skiptranslate iframe,.goog-te-banner-frame{display:none!important}
body{top:0!important}
#goog-gt-tt,.goog-te-balloon-frame{display:none!important}
font[style]{background:transparent!important;box-shadow:none!important}
html[dir="rtl"] .surtitre::before{margin-left:10px}

/* ============ V19 : barre réseaux sociaux (slogan + liens) ============ */
.topbar .slogan{color:var(--or-clair);font-weight:600;font-style:italic}
@media (max-width:640px){.topbar .slogan{display:none}.topbar .conteneur{justify-content:center}}

/* ============ V20 : slogan accueil uniquement ============ */
.topbar-centree .conteneur{justify-content:center}

/* ============ V21 : page actualités réseaux + galerie complète ============ */
.reseaux-actu{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-top:40px}
.reseau{
  display:flex;align-items:center;gap:12px;padding:16px 26px;border-radius:14px;
  color:#fff;font-weight:700;font-size:1.05rem;min-width:190px;justify-content:center;
  transition:var(--transition);
}
.reseau:hover{transform:translateY(-4px);box-shadow:var(--ombre);color:#fff}
.reseau .ri{font-size:1.3rem;font-weight:800;width:30px;height:30px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.2);border-radius:8px}
.reseau.fb{background:#1877F2}
.reseau.ig{background:linear-gradient(45deg,#F58529,#DD2A7B,#8134AF)}
.reseau.li{background:#0A66C2}
.reseau.tw{background:#000}
.reseau.tk{background:#010101}

/* ============ V24 : mode nuit — logo blanc + lisibilité totale ============ */
/* Bascule du logo selon le thème */
.logo-nuit{display:none}
body.nuit .logo-jour{display:none}
body.nuit .logo-nuit{display:block;height:82px;width:auto}
@media (max-width:760px){body.nuit .logo-nuit{height:60px}}

/* Mode nuit : forcer la lisibilité de TOUS les textes et surfaces */
body.nuit{color:var(--texte)}
body.nuit h1,
body.nuit h2,
body.nuit h3,
body.nuit .carte h3,
body.nuit .etape h3,
body.nuit .temoignage .auteur,
body.nuit .fiche dd{color:#F3F8FD}
body.nuit p,
body.nuit .intro,
body.nuit li,
body.nuit .carte p,
body.nuit .temoignage blockquote,
body.nuit .article-corps p,
body.nuit .footer-grille p,
body.nuit .footer-grille li{color:#C6D5E6}
body.nuit .meta,
body.nuit .role,
body.nuit .fiche dt,
body.nuit .fil{color:#9DB2C9}

/* Cartes et surfaces claires -> surfaces sombres lisibles */
body.nuit .carte,
body.nuit .etape,
body.nuit .temoignage,
body.nuit .moyen,
body.nuit .fiche,
body.nuit .logo-p,
body.nuit .champ input,
body.nuit .champ select,
body.nuit .champ textarea,
body.nuit .choix-langue{
  background:#182838;
  border-color:#2A3F55;
  color:#E8F0F8;
}
body.nuit .encadre{background:#182838;border-left-color:var(--or)}
body.nuit .section-sable{background:#0D1826}
body.nuit .carte .icone{background:#0D1826}

/* En-têtes de pages intérieures : voile plus dense en nuit pour lire le titre */
body.nuit .entete-page{background:linear-gradient(100deg,rgba(6,15,26,.92),rgba(6,15,26,.78)),var(--vert-fonce)}
body.nuit .entete-page h1{color:#F3F8FD}

/* Liens sociaux du footer en nuit */
body.nuit footer a{color:#C6D5E6}
body.nuit footer a:hover{color:var(--or-clair)}

/* Logos partenaires : léger fond clair pour rester lisibles en nuit */
body.nuit .logos-partenaires .logo-p img{filter:none;opacity:1}
body.nuit .logo-p{background:#F3F8FD}

/* ============ V25 : alignement soigné des chiffres clés ============ */
.stats{align-items:start}
.stats-6{gap:40px 30px}
.stat{display:flex;flex-direction:column;align-items:center;gap:8px;padding:0 8px}
.stat .nombre{
  line-height:1;margin:0;
  font-variant-numeric:tabular-nums;
  min-height:2.6rem;display:flex;align-items:center;justify-content:center;
}
.stat .libelle{
  line-height:1.35;margin:0;max-width:16ch;
  min-height:2.4em;display:flex;align-items:center;justify-content:center;text-align:center;
}

/* ============ V26 : carrousel plus fluide ============ */
.hero-fond .diapo{transition:opacity 2s ease-in-out;transform:scale(1.08)}
.hero-fond .diapo.active{opacity:1;transform:scale(1);transition:opacity 2s ease-in-out, transform 9s ease-out}

/* ============ V27 : justification cohérente sur TOUT le site ============ */
/* Tous les paragraphes de contenu, justifiés proprement, sans césure */
.intro,
.carte p,
.etape p,
.temoignage blockquote,
.article-corps p,
.cta p,
.moyen p,
.hero-confiance,
.champ p,
section p,
footer p{
  text-align:justify;
  text-justify:inter-word;
  hyphens:none;
  -webkit-hyphens:none;
}

/* Anti-« gros trous » : sur les colonnes étroites (cartes, listes, mobile),
   la justification crée des espaces béants -> on repasse à gauche */
.carte p,
.etape p,
.moyen p,
.hero-confiance li,
.footer-grille p,
.footer-grille li{
  text-align:left;
}

/* Titres, libellés, méta, boutons : jamais justifiés */
h1,h2,h3,h4,
.surtitre,.meta,.libelle,.btn,.fil,.role,.auteur,
.stat,.logo,.etiquette{
  text-align:left;
}
.hero h1,.hero p{text-align:left}

/* Sur petits écrans, tout le corps repasse à gauche (colonnes trop étroites pour justifier) */
@media (max-width:760px){
  .intro,.temoignage blockquote,.article-corps p,.cta p,section p{text-align:left}
}