/* =========================================================
   Éveil Développement inc. — feuille de styles
   Direction : institutionnelle et sobre (note n°9 §9)
   ========================================================= */

:root{
  --vert-profond:#0A3D2E;
  --vert-moyen:#145C44;
  --vert-clair:#2A7A5E;
  --or:#C8963E;
  --or-clair:#E0B970;
  --blanc:#FFFFFF;
  --creme:#F7F4EE;
  --creme-fonce:#EDE8DE;
  --noir:#1A1A1A;
  --gris:#5A5A5A;
  --gris-clair:#8A8A8A;
  --filet:#DDD8CE;

  --serif:'Playfair Display', 'Lora', 'Libre Baskerville', Georgia, 'Times New Roman', serif;
  --sans:'Inter', 'Source Sans 3', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

  --largeur:1180px;
  --largeur-texte:720px;
  --gouttiere:24px;
  --rythme:96px;
}

*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}

body{
  margin:0;
  font-family:var(--sans);
  font-size:17px;
  line-height:1.7;
  color:var(--noir);
  background:var(--blanc);
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;height:auto;display:block}

a{color:var(--vert-moyen);text-decoration:none;transition:color .18s ease}
a:hover{color:var(--or)}

h1,h2,h3,h4{font-family:var(--serif);font-weight:600;color:var(--vert-profond);line-height:1.22;margin:0 0 .6em}
h1{font-size:clamp(2.1rem,4.4vw,3.35rem);letter-spacing:-.015em}
h2{font-size:clamp(1.65rem,3vw,2.35rem);letter-spacing:-.01em}
h3{font-size:clamp(1.2rem,2vw,1.5rem)}
h4{font-size:1.08rem}
p{margin:0 0 1.15em}
ul,ol{margin:0 0 1.15em;padding-left:1.3em}
li{margin-bottom:.5em}
strong{font-weight:600;color:var(--noir)}

/* ---------- utilitaires ---------- */
.contenant{max-width:var(--largeur);margin:0 auto;padding-inline:var(--gouttiere)}
.contenant-etroit{max-width:var(--largeur-texte);margin:0 auto;padding-inline:var(--gouttiere)}
.section{padding-block:var(--rythme)}
.section--serree{padding-block:60px}
.section--creme{background:var(--creme)}
.section--vert{background:var(--vert-profond);color:#EFEDE6}
.section--vert h2,.section--vert h3{color:var(--blanc)}
.section--vert p{color:#D8D5CC}

.surligne{
  font-family:var(--sans);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--or);
  display:block;
  margin-bottom:1rem;
}
.section--vert .surligne{color:var(--or-clair)}

.filet{width:52px;height:2px;background:var(--or);border:0;margin:0 0 1.7rem}

.chapeau{font-size:1.16rem;line-height:1.72;color:var(--gris);max-width:66ch}
.section--vert .chapeau{color:#CFCCC3}

.texte-sec{color:var(--gris)}
.centre{text-align:center}
.centre .filet{margin-inline:auto}
.centre .chapeau{margin-inline:auto}

/* ---------- boutons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.55em;
  font-family:var(--sans);font-size:.94rem;font-weight:600;letter-spacing:.01em;
  padding:15px 30px;border:1.5px solid transparent;border-radius:2px;
  cursor:pointer;transition:all .2s ease;text-align:center;
}
.btn--or{background:var(--or);color:#26210F;border-color:var(--or)}
.btn--or:hover{background:var(--or-clair);border-color:var(--or-clair);color:#26210F}
.btn--vert{background:var(--vert-profond);color:var(--blanc);border-color:var(--vert-profond)}
.btn--vert:hover{background:var(--vert-moyen);border-color:var(--vert-moyen);color:var(--blanc)}
.btn--ligne{background:transparent;color:var(--vert-profond);border-color:var(--filet)}
.btn--ligne:hover{border-color:var(--vert-profond);color:var(--vert-profond);background:var(--creme)}
.btn--ligne-clair{background:transparent;color:var(--blanc);border-color:rgba(255,255,255,.35)}
.btn--ligne-clair:hover{border-color:var(--blanc);color:var(--blanc);background:rgba(255,255,255,.08)}
.btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:2rem}

.lien-fleche{
  display:inline-flex;align-items:center;gap:.45em;
  font-weight:600;font-size:.94rem;color:var(--vert-moyen);
}
.lien-fleche::after{content:"→";transition:transform .2s ease;display:inline-block}
.lien-fleche:hover::after{transform:translateX(4px)}

/* ---------- en-tête ---------- */
.entete{
  position:sticky;top:0;z-index:100;
  background:rgba(255,255,255,.97);
  backdrop-filter:saturate(180%) blur(10px);
  border-bottom:1px solid var(--filet);
}
.entete__inner{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:78px}
.logo{display:flex;flex-direction:column;line-height:1.1;flex-shrink:0}
.logo__nom{font-family:var(--serif);font-size:1.32rem;font-weight:700;color:var(--vert-profond);letter-spacing:-.01em}
.logo__sous{font-size:.62rem;letter-spacing:.19em;text-transform:uppercase;color:var(--or);font-weight:600;margin-top:3px}

.nav{display:flex;align-items:center;gap:30px}
.nav a{font-size:.925rem;font-weight:500;color:var(--noir);position:relative;padding-block:6px}
.nav a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1.5px;background:var(--or);transition:width .22s ease}
.nav a:hover::after,.nav a.actif::after{width:100%}
.nav a.actif{color:var(--vert-profond);font-weight:600}
.nav .btn{padding:11px 22px;font-size:.88rem}
.nav .btn::after{display:none}
/* la couleur du bouton doit gagner sur .nav a */
.nav a.btn--vert{color:var(--blanc)}
.nav a.btn--vert:hover{color:var(--blanc)}
.nav a.btn--or{color:#26210F}

.burger{display:none;background:none;border:0;padding:10px;cursor:pointer}
.burger span{display:block;width:24px;height:2px;background:var(--vert-profond);margin:5px 0;transition:.25s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- bandeau principal ---------- */
.hero{
  background:linear-gradient(160deg,var(--vert-profond) 0%,#0d4a37 55%,#10553f 100%);
  color:var(--blanc);
  padding-block:clamp(80px,11vw,140px);
  position:relative;overflow:hidden;
}
.hero::after{
  content:"";position:absolute;right:-8%;top:-20%;width:520px;height:520px;
  border:1px solid rgba(200,150,62,.16);border-radius:50%;pointer-events:none;
}
.hero__inner{position:relative;z-index:1;max-width:830px}
.hero h1{color:var(--blanc);margin-bottom:1.5rem}
.hero p{font-size:1.2rem;line-height:1.72;color:#D5D2C9;max-width:62ch}

.hero--page{padding-block:clamp(58px,7vw,88px)}
.hero--page h1{font-size:clamp(1.9rem,3.6vw,2.8rem)}
.hero--page .chapeau{color:#CFCCC3}

/* ---------- fil d'ariane ---------- */
.ariane{font-size:.82rem;color:var(--gris);padding-block:16px;border-bottom:1px solid var(--filet)}
.ariane a{color:var(--gris)}
.ariane a:hover{color:var(--vert-moyen)}
.ariane span{color:var(--gris-clair);margin-inline:7px}

/* ---------- grilles et cartes ---------- */
.grille{display:grid;gap:28px}
.grille--2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.grille--3{grid-template-columns:repeat(auto-fit,minmax(285px,1fr))}
.grille--4{grid-template-columns:repeat(auto-fit,minmax(215px,1fr))}

.carte{
  background:var(--blanc);border:1px solid var(--filet);border-radius:3px;
  padding:36px 32px;transition:border-color .22s ease,transform .22s ease,box-shadow .22s ease;
  display:flex;flex-direction:column;
}
.carte:hover{border-color:var(--or);transform:translateY(-3px);box-shadow:0 12px 34px rgba(10,61,46,.08)}
.carte__num{
  font-family:var(--serif);font-size:1.9rem;color:var(--or);
  line-height:1;margin-bottom:.7rem;display:block;font-weight:600;
}
.carte h3{margin-bottom:.7rem}
.carte p{font-size:.97rem;color:var(--gris);margin-bottom:1rem}
.carte__livrable{
  font-size:.87rem;font-style:italic;color:var(--vert-moyen);
  border-top:1px solid var(--filet);padding-top:1rem;margin-top:auto;margin-bottom:0;
}
.section--creme .carte{background:var(--blanc)}

/* étapes de méthode */
.etape{position:relative;padding-top:26px;border-top:2px solid var(--filet);transition:border-color .22s}
.etape:hover{border-top-color:var(--or)}
.etape__num{
  font-family:var(--sans);font-size:.72rem;font-weight:700;letter-spacing:.14em;
  color:var(--or);text-transform:uppercase;display:block;margin-bottom:.7rem;
}
.etape h3{font-size:1.12rem;margin-bottom:.55rem}
.etape p{font-size:.94rem;color:var(--gris);margin:0}

/* ---------- bandes ---------- */
.bande-constat{background:var(--creme);border-block:1px solid var(--filet)}

.duo{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.duo--texte-droite{direction:ltr}
.visuel-outil{
  background:linear-gradient(155deg,#0d4a37,#0A3D2E);
  border-radius:4px;padding:44px 38px;color:var(--blanc);
  border:1px solid rgba(200,150,62,.28);
}
.visuel-outil h4{color:var(--or-clair);font-family:var(--sans);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;margin-bottom:1.3rem}
.visuel-outil ul{list-style:none;padding:0;margin:0}
.visuel-outil li{
  padding:13px 0;border-bottom:1px solid rgba(255,255,255,.11);
  font-size:.94rem;color:#D8D5CC;display:flex;gap:12px;align-items:flex-start;margin:0;
}
.visuel-outil li:last-child{border-bottom:0}
.visuel-outil li::before{content:"—";color:var(--or);flex-shrink:0}

/* ---------- tableaux ---------- */
.tableau-enveloppe{overflow-x:auto;margin-block:2rem;-webkit-overflow-scrolling:touch}
table{border-collapse:collapse;width:100%;min-width:520px;font-size:.94rem}
th,td{text-align:left;padding:15px 18px;border-bottom:1px solid var(--filet);vertical-align:top}
th{
  background:var(--vert-profond);color:var(--blanc);font-weight:600;
  font-size:.79rem;letter-spacing:.07em;text-transform:uppercase;
}
tbody tr:nth-child(even){background:var(--creme)}
td strong{color:var(--vert-profond)}

/* ---------- honoraires ---------- */
.honoraires{
  background:var(--creme);border-left:3px solid var(--or);
  padding:26px 30px;margin-block:2.2rem;border-radius:0 3px 3px 0;
}
.honoraires dl{display:grid;grid-template-columns:auto 1fr;gap:10px 24px;margin:0}
.honoraires dt{font-size:.78rem;letter-spacing:.11em;text-transform:uppercase;color:var(--gris);font-weight:600;padding-top:3px}
.honoraires dd{margin:0;font-family:var(--serif);font-size:1.16rem;color:var(--vert-profond);font-weight:600}

.encart{
  background:var(--creme);border:1px solid var(--filet);
  padding:28px 32px;border-radius:3px;margin-block:2rem;
}
.encart h3{margin-top:0}
.encart p:last-child{margin-bottom:0}

.avertissement{
  font-size:.86rem;font-style:italic;color:var(--gris);line-height:1.65;
  border-top:1px solid var(--filet);padding-top:22px;margin-top:52px;
}

.a-completer{
  background:#FFF6DC;border:1px dashed var(--or);
  padding:3px 9px;border-radius:2px;font-size:.9em;
  font-style:normal;color:#7A5A12;font-weight:600;
}

/* ---------- publications ---------- */
.outils-pub{
  display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between;
  margin-bottom:34px;padding-bottom:26px;border-bottom:1px solid var(--filet);
}
.recherche{position:relative;flex:1;min-width:230px;max-width:340px}
.recherche input{
  width:100%;padding:13px 16px 13px 42px;font-family:var(--sans);font-size:.94rem;
  border:1px solid var(--filet);border-radius:2px;background:var(--blanc);color:var(--noir);
}
.recherche input:focus{outline:none;border-color:var(--vert-moyen);box-shadow:0 0 0 3px rgba(20,92,68,.09)}
.recherche::before{
  content:"⌕";position:absolute;left:15px;top:50%;transform:translateY(-52%);
  color:var(--gris-clair);font-size:1.25rem;pointer-events:none;
}
.filtres{display:flex;flex-wrap:wrap;gap:8px}
.filtre{
  font-family:var(--sans);font-size:.83rem;font-weight:500;
  padding:9px 17px;border:1px solid var(--filet);background:var(--blanc);
  color:var(--gris);border-radius:2px;cursor:pointer;transition:all .18s ease;
}
.filtre:hover{border-color:var(--vert-moyen);color:var(--vert-moyen)}
.filtre.actif{background:var(--vert-profond);border-color:var(--vert-profond);color:var(--blanc)}

.liste-articles{display:grid;gap:0;border-top:1px solid var(--filet)}
/* [hidden] doit gagner sur display:grid — indispensable au filtrage */
.article-ligne[hidden],.rubrique[hidden],[hidden]{display:none !important}
.article-ligne{
  display:grid;grid-template-columns:120px 1fr auto;gap:26px;align-items:start;
  padding:28px 4px;border-bottom:1px solid var(--filet);transition:background .18s ease;
}
.article-ligne:hover{background:var(--creme)}
.article-ligne__date{font-size:.83rem;color:var(--gris-clair);letter-spacing:.03em;padding-top:4px;white-space:nowrap}
.article-ligne h3{font-size:1.14rem;margin-bottom:.45rem;line-height:1.35}
.article-ligne h3 a{color:var(--vert-profond)}
.article-ligne h3 a:hover{color:var(--or)}
.article-ligne p{font-size:.94rem;color:var(--gris);margin:0}
.etiquette{
  display:inline-block;font-size:.7rem;font-weight:600;letter-spacing:.09em;
  text-transform:uppercase;padding:5px 11px;border-radius:2px;white-space:nowrap;
  background:var(--creme-fonce);color:var(--vert-moyen);
}
.etiquette--femmes{background:#EFE4F0;color:#6B3D72}
.etiquette--filieres{background:#E3EFE4;color:#2A6B34}
.etiquette--securite{background:#FBEBDD;color:#8A5320}
.etiquette--gouvernance{background:#E0E9F2;color:#2B5478}
.aucun-resultat{padding:56px 0;text-align:center;color:var(--gris)}

.rubriques{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));margin-block:2.6rem}
.rubrique{
  border-left:3px solid var(--or);padding:18px 24px;background:var(--creme);
}
.rubrique h3{font-size:1.05rem;margin-bottom:.45rem}
.rubrique p{font-size:.9rem;color:var(--gris);margin:0}

/* article */
.article-corps{max-width:var(--largeur-texte);margin:0 auto}
.article-meta{
  display:flex;flex-wrap:wrap;gap:14px;align-items:center;
  font-size:.86rem;color:var(--gris);margin-bottom:2rem;
}
.article-corps p{font-size:1.07rem;line-height:1.82}
.brouillon{
  background:#FFF6DC;border:1px dashed var(--or);border-radius:3px;
  padding:26px 30px;margin-block:2rem;
}
.brouillon h4{color:#7A5A12;margin-bottom:.6rem}
.brouillon p{font-size:.96rem;color:#6B5215;margin-bottom:.6rem}
.brouillon p:last-child{margin-bottom:0}
.brouillon code{
  background:rgba(0,0,0,.06);padding:2px 7px;border-radius:2px;
  font-size:.87em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* ---------- formulaire ---------- */
.formulaire{display:grid;gap:22px}
.champs-duo{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.champ{display:flex;flex-direction:column}
.champ label{font-size:.85rem;font-weight:600;color:var(--vert-profond);margin-bottom:8px;letter-spacing:.01em}
.champ .requis{color:var(--or);margin-left:3px}
.champ input,.champ select,.champ textarea{
  font-family:var(--sans);font-size:.98rem;padding:14px 16px;
  border:1px solid var(--filet);border-radius:2px;background:var(--blanc);color:var(--noir);width:100%;
}
.champ textarea{min-height:165px;resize:vertical;line-height:1.65}
.champ input:focus,.champ select:focus,.champ textarea:focus{
  outline:none;border-color:var(--vert-moyen);box-shadow:0 0 0 3px rgba(20,92,68,.09);
}
.champ__aide{font-size:.82rem;color:var(--gris-clair);margin-top:7px}

.consentement{
  display:flex;gap:14px;align-items:flex-start;
  background:var(--creme);border:1px solid var(--filet);
  padding:20px 22px;border-radius:3px;
}
.consentement input[type="checkbox"]{
  width:19px;height:19px;margin:2px 0 0;flex-shrink:0;accent-color:var(--vert-profond);cursor:pointer;
}
.consentement label{font-size:.9rem;font-weight:400;color:var(--gris);line-height:1.6;margin:0;cursor:pointer}
.consentement a{text-decoration:underline}
.champ-cache{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}

/* ---------- pied de page ---------- */
.pied{background:var(--vert-profond);color:#C6C3BA;padding-block:66px 0;font-size:.92rem}
.pied a{color:#C6C3BA}
.pied a:hover{color:var(--or-clair)}
.pied__grille{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:44px;padding-bottom:50px}
.pied h4{
  color:var(--blanc);font-family:var(--sans);font-size:.74rem;font-weight:700;
  letter-spacing:.15em;text-transform:uppercase;margin-bottom:1.1rem;
}
.pied ul{list-style:none;padding:0;margin:0}
.pied li{margin-bottom:.62em}
.pied__logo{font-family:var(--serif);font-size:1.32rem;color:var(--blanc);font-weight:700;margin-bottom:.5rem}
.pied__desc{font-size:.9rem;line-height:1.68;max-width:34ch;color:#ADA99F}
.pied__bas{
  border-top:1px solid rgba(255,255,255,.12);padding-block:26px;
  display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;
  font-size:.83rem;color:#96928A;
}
.pied__bas a{color:#96928A}

/* ---------- bandeau témoins ---------- */
.temoins{
  position:fixed;left:0;right:0;bottom:0;z-index:200;
  background:var(--vert-profond);color:#D8D5CC;
  padding:22px var(--gouttiere);
  box-shadow:0 -6px 30px rgba(0,0,0,.22);
  transform:translateY(105%);transition:transform .34s ease;
}
.temoins.visible{transform:translateY(0)}
.temoins__inner{
  max-width:var(--largeur);margin:0 auto;
  display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between;
}
.temoins p{margin:0;font-size:.9rem;line-height:1.6;max-width:66ch}
.temoins a{color:var(--or-clair);text-decoration:underline}
.temoins__btns{display:flex;gap:11px;flex-shrink:0;flex-wrap:wrap}
.temoins .btn{padding:11px 22px;font-size:.87rem}

/* ---------- accessibilité ---------- */
.saut-contenu{
  position:absolute;left:-9999px;top:0;background:var(--or);color:#26210F;
  padding:12px 22px;z-index:300;font-weight:600;border-radius:0 0 3px 0;
}
.saut-contenu:focus{left:0}
:focus-visible{outline:2px solid var(--or);outline-offset:3px}

/* ---------- responsive ---------- */
@media (max-width:900px){
  :root{--rythme:66px}
  .duo{grid-template-columns:1fr;gap:38px}
  .pied__grille{grid-template-columns:1fr 1fr;gap:34px}
}

@media (max-width:768px){
  body{font-size:16px}
  .burger{display:block}
  .nav{
    position:absolute;top:100%;left:0;right:0;
    background:var(--blanc);border-bottom:1px solid var(--filet);
    flex-direction:column;align-items:stretch;gap:0;
    padding:12px var(--gouttiere) 22px;
    display:none;box-shadow:0 14px 30px rgba(0,0,0,.08);
  }
  .nav.ouvert{display:flex}
  .nav a{padding:14px 0;border-bottom:1px solid var(--filet)}
  .nav a::after{display:none}
  .nav .btn{margin-top:14px;justify-content:center;border-bottom:0}
  .article-ligne{grid-template-columns:1fr;gap:11px}
  .article-ligne__date{padding-top:0}
  .champs-duo{grid-template-columns:1fr}
  .honoraires dl{grid-template-columns:1fr;gap:4px 0}
  .honoraires dd{margin-bottom:1rem}
  .btns .btn{flex:1 1 100%;justify-content:center}
  .temoins__inner{flex-direction:column;align-items:flex-start}
  .temoins__btns{width:100%}
  .temoins .btn{flex:1;justify-content:center}
}

@media (max-width:520px){
  .pied__grille{grid-template-columns:1fr;gap:30px}
  .carte{padding:28px 24px}
  .outils-pub{flex-direction:column;align-items:stretch}
  .recherche{max-width:none}
}

@media print{
  .entete,.pied,.temoins,.btns,.outils-pub{display:none}
  body{font-size:11pt;color:#000}
  a{color:#000;text-decoration:none}
}

/* =========================================================
   VERSION 2 — sous-sites, réseaux, devis, livre
   ========================================================= */

/* ---------- navigation de sous-site ---------- */
.sous-nav{background:var(--creme);border-bottom:1px solid var(--filet)}
.sous-nav__inner{display:flex;align-items:center;gap:26px;flex-wrap:wrap;padding-block:14px}
.sous-nav__titre{
  font-family:var(--serif);font-size:1.02rem;font-weight:600;color:var(--vert-profond);
  padding-right:24px;border-right:1px solid var(--filet);flex-shrink:0;
}
.sous-nav__liens{display:flex;gap:22px;flex-wrap:wrap}
.sous-nav__liens a{
  font-size:.88rem;font-weight:500;color:var(--gris);
  padding-block:5px;border-bottom:1.5px solid transparent;
}
.sous-nav__liens a:hover{color:var(--vert-moyen)}
.sous-nav__liens a.actif{color:var(--vert-profond);font-weight:600;border-bottom-color:var(--or)}
@media(max-width:700px){
  .sous-nav__inner{gap:12px}
  .sous-nav__titre{border-right:0;padding-right:0;width:100%}
  .sous-nav__liens{gap:16px;overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch}
  .sous-nav__liens a{white-space:nowrap}
}

/* ---------- réseaux sociaux ---------- */
.reseaux{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:9px}
.reseaux--colonne{flex-direction:column;gap:11px;margin-top:1.2rem}
.reseau{
  display:inline-flex;align-items:center;gap:10px;
  font-size:.86rem;font-weight:500;
  padding:8px 15px 8px 9px;border:1px solid rgba(255,255,255,.2);border-radius:2px;
  transition:border-color .18s ease,background .18s ease;
}
.reseau:hover{border-color:var(--or);background:rgba(255,255,255,.06)}
.reseau__marque{
  width:26px;height:26px;flex-shrink:0;border-radius:2px;
  display:grid;place-items:center;
  background:var(--or);color:#26210F;
  font-family:var(--serif);font-weight:700;font-size:.9rem;line-height:1;
}
.reseau--large{
  width:100%;padding:13px 18px 13px 13px;gap:14px;
  border-color:var(--filet);background:var(--blanc);align-items:flex-start;
}
.reseau--large:hover{border-color:var(--or);background:var(--creme)}
.reseau--large span{display:flex;flex-direction:column;gap:2px}
.reseau--large strong{color:var(--vert-profond);font-size:.95rem;font-weight:600}
.reseau--large em{color:var(--gris);font-style:normal;font-size:.84rem;line-height:1.5}
.encart .reseaux--colonne{margin-top:1rem}
.pied__liens{list-style:none;padding:0;margin:0}
.pied__liens li{margin-bottom:.62em}

/* ---------- blocs de détail ---------- */
.bloc-detail{
  border-top:1px solid var(--filet);padding-top:26px;margin-top:32px;
}
.bloc-detail:first-of-type{border-top:0;padding-top:0;margin-top:2rem}
.bloc-detail h3{margin-bottom:.55rem}
.bloc-detail p{margin-bottom:0;color:var(--gris)}

.etape-num{display:flex;gap:24px;align-items:flex-start;margin-top:32px}
.etape-num__chiffre{
  flex-shrink:0;width:46px;height:46px;border-radius:50%;
  border:1.5px solid var(--or);color:var(--or);
  display:grid;place-items:center;
  font-family:var(--serif);font-size:1.3rem;font-weight:600;line-height:1;
}
.etape-num h3{margin-bottom:.45rem;font-size:1.18rem}
.etape-num p{margin-bottom:0;color:var(--gris)}

/* ---------- questions fréquentes ---------- */
.faq{
  border-bottom:1px solid var(--filet);padding:4px 0;
}
.faq summary{
  cursor:pointer;padding:20px 34px 20px 0;position:relative;list-style:none;
  font-family:var(--serif);font-size:1.12rem;font-weight:600;color:var(--vert-profond);
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+";position:absolute;right:4px;top:50%;transform:translateY(-50%);
  color:var(--or);font-size:1.5rem;font-family:var(--sans);font-weight:300;line-height:1;
  transition:transform .2s ease;
}
.faq[open] summary::after{content:"–"}
.faq summary:hover{color:var(--or)}
.faq p{padding:0 34px 22px 0;margin:0;color:var(--gris)}

/* ---------- encarts spécialisés ---------- */
.encart--devis{border-left:3px solid var(--or);background:var(--creme)}
.encart--livre{border-left:3px solid var(--vert-moyen);background:var(--creme)}

/* ---------- visuel du livre ---------- */
.visuel-livre{
  background:linear-gradient(158deg,#0d4a37,#0A3D2E 60%,#083326);
  border:1px solid rgba(200,150,62,.32);border-radius:3px;
  padding:52px 40px;color:var(--blanc);
  display:flex;flex-direction:column;justify-content:center;min-height:330px;
  position:relative;overflow:hidden;
}
.visuel-livre::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:9px;
  background:linear-gradient(180deg,var(--or),#8A6427);
}
.visuel-livre--grand{min-height:440px;padding:64px 46px}
.visuel-livre__etiquette{
  font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--or-clair);font-weight:600;margin-bottom:1.6rem;
}
.visuel-livre__titre{
  font-family:var(--serif);font-size:clamp(2.1rem,3.6vw,2.9rem);
  color:var(--blanc);margin:0 0 .5rem;line-height:1.1;font-weight:600;
}
.visuel-livre__soustitre{
  font-family:var(--serif);font-size:1.06rem;font-style:italic;
  color:#CFCCC3;margin:0 0 2.2rem;line-height:1.45;max-width:24ch;
}
.visuel-livre__auteur{
  font-size:.82rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--or);margin:0;font-weight:600;
}

/* ---------- rubriques cliquables ---------- */
a.rubrique{display:block;transition:border-color .2s ease,background .2s ease}
a.rubrique:hover{border-left-color:var(--vert-moyen);background:var(--creme-fonce)}
a.rubrique h3{color:var(--vert-profond)}
a.rubrique:hover h3{color:var(--vert-moyen)}
.rubrique__compte{
  display:block;margin-top:.8rem;font-size:.78rem;font-weight:600;
  letter-spacing:.09em;text-transform:uppercase;color:var(--or);
}
a.etiquette{transition:filter .18s ease}
a.etiquette:hover{filter:brightness(.93)}

/* ---------- navigation entre articles ---------- */
.navig-duo{
  display:grid;grid-template-columns:1fr 1fr;gap:20px;
  max-width:var(--largeur-texte);margin:3rem auto 0;
}
.navig{
  display:flex;flex-direction:column;gap:7px;
  border:1px solid var(--filet);border-radius:3px;padding:22px 24px;
  transition:border-color .2s ease,background .2s ease;
}
.navig:hover{border-color:var(--or);background:var(--creme)}
.navig span{
  font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--or);font-weight:600;
}
.navig strong{
  font-family:var(--serif);font-size:1rem;font-weight:600;
  color:var(--vert-profond);line-height:1.35;
}
.navig--suiv{text-align:right}
.navig--prec:only-child{grid-column:1}
@media(max-width:700px){
  .navig-duo{grid-template-columns:1fr}
  .navig--suiv{text-align:left}
}

/* ---------- partage ---------- */
.partage{
  border-top:1px solid var(--filet);border-bottom:1px solid var(--filet);
  padding:22px 0;margin-top:2.6rem;
  display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;
}
.partage > span{
  font-size:.76rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--gris);font-weight:600;
}
.partage__liens{display:flex;gap:9px;flex-wrap:wrap}
.partage__liens a{
  display:inline-flex;align-items:center;gap:8px;
  font-size:.83rem;font-weight:500;color:var(--gris);
  padding:8px 14px;border:1px solid var(--filet);border-radius:2px;
  transition:all .18s ease;
}
.partage__liens a:hover{border-color:var(--vert-moyen);color:var(--vert-moyen);background:var(--creme)}

/* ---------- grille 4 en cartes ---------- */
.grille--4 .carte{padding:28px 24px}
.grille--4 .carte h3{font-size:1.08rem}
.grille--4 .carte p{font-size:.92rem}

/* ---------- fiche technique du livre ---------- */
.fiche{margin:1.6rem 0 2rem;padding:0}
.fiche__ligne{
  display:grid;grid-template-columns:130px 1fr;gap:16px;
  padding:12px 0;border-bottom:1px solid var(--filet);
}
.fiche__ligne:first-child{border-top:1px solid var(--filet)}
.fiche dt{
  font-size:.76rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--gris);font-weight:600;padding-top:3px;
}
.fiche dd{margin:0;color:var(--noir);font-size:.96rem;line-height:1.55}
@media(max-width:560px){
  .fiche__ligne{grid-template-columns:1fr;gap:4px}
  .fiche dd{margin-bottom:2px}
}

/* =========================================================
   VERSION 3 — logo et photographies de terrain
   ========================================================= */

/* ---------- logo dans l'en-tête ---------- */
.logo{flex-direction:row;align-items:center;gap:13px}
.logo__marque{width:46px;height:46px;flex-shrink:0;display:block}
.logo__texte{display:flex;flex-direction:column;line-height:1.1}
@media(max-width:420px){
  .logo__marque{width:38px;height:38px}
  .logo__nom{font-size:1.1rem}
  .logo__sous{font-size:.56rem}
}

.pied__marque{width:58px;height:58px;margin-bottom:1rem;display:block}

/* ---------- bandeau avec photographie ---------- */
.hero--photo{position:relative;isolation:isolate}
.hero--photo::before{
  content:"";position:absolute;inset:0;z-index:-2;
  background-size:cover;background-position:center 42%;
}
.hero--photo::after{
  content:"";position:absolute;inset:0;z-index:-1;border:0;border-radius:0;width:auto;height:auto;
  background:linear-gradient(105deg,rgba(8,45,34,.94) 0%,rgba(10,61,46,.88) 45%,rgba(10,61,46,.66) 100%);
}
.hero--photo .hero__inner{position:relative;z-index:1}
@media(max-width:820px){
  .hero--photo::after{background:linear-gradient(180deg,rgba(8,45,34,.93),rgba(10,61,46,.9))}
}

/* ---------- figure et légende ---------- */
.figure{margin:0}
.figure img{
  width:100%;display:block;border-radius:3px;
  background:var(--creme-fonce);
}
.figure figcaption{
  font-size:.85rem;color:var(--gris);line-height:1.55;
  padding-top:11px;border-top:1px solid var(--filet);margin-top:11px;
}
.figure--bord img{border:1px solid var(--filet)}

/* ---------- galerie ---------- */
.galerie{
  display:grid;gap:22px;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.galerie .figure img{aspect-ratio:4/3;object-fit:cover}
.galerie--serree{gap:14px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.galerie--serree .figure img{aspect-ratio:1/1}
.galerie--serree figcaption{font-size:.79rem;padding-top:8px;margin-top:8px}

/* bande pleine largeur de photos */
.bande-photos{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:0;
}
.bande-photos img{
  width:100%;aspect-ratio:1/1;object-fit:cover;display:block;
  filter:saturate(.92);transition:filter .3s ease,transform .3s ease;
}
.bande-photos a{overflow:hidden;display:block}
.bande-photos a:hover img{filter:saturate(1.05);transform:scale(1.04)}

/* ---------- blocs terrain alternés ---------- */
.terrain-bloc{
  display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;
  padding-block:40px;border-top:1px solid var(--filet);
}
.terrain-bloc:first-of-type{border-top:0}
.terrain-bloc:nth-child(even) .terrain-bloc__img{order:2}
.terrain-bloc__img img{
  width:100%;display:block;border-radius:3px;
  aspect-ratio:4/3;object-fit:cover;
}
.terrain-bloc h3{font-size:1.34rem;margin-bottom:.6rem}
.terrain-bloc h3 .terrain-bloc__verbe{
  display:block;font-family:var(--sans);font-size:.72rem;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--or);margin-bottom:.5rem;
}
.terrain-bloc p{color:var(--gris);margin-bottom:0}
@media(max-width:820px){
  .terrain-bloc{grid-template-columns:1fr;gap:24px;padding-block:30px}
  .terrain-bloc:nth-child(even) .terrain-bloc__img{order:0}
}

/* ---------- portrait ---------- */
.portrait{
  width:100%;max-width:340px;border-radius:3px;display:block;
  aspect-ratio:3/4;object-fit:cover;object-position:center 22%;
}
.portrait-bloc{display:flex;gap:34px;align-items:flex-start;flex-wrap:wrap;margin-bottom:2.4rem}
.portrait-bloc > div{flex:1;min-width:260px}

/* ---------- mention des crédits photo ---------- */
.credit-photos{
  font-size:.82rem;color:var(--gris-clair);font-style:italic;
  border-top:1px solid var(--filet);padding-top:18px;margin-top:2.4rem;
}

/* =========================================================
   VERSION 4 — corps des articles repris du blog
   ========================================================= */

.texte-article{margin-top:2.4rem}
.texte-article p{font-size:1.07rem;line-height:1.82;margin-bottom:1.3em}
.texte-article h2{
  font-size:clamp(1.4rem,2.4vw,1.85rem);margin-top:2.8rem;margin-bottom:.9rem;
  padding-top:1.6rem;border-top:1px solid var(--filet);
}
.texte-article h3{font-size:1.24rem;margin-top:2rem;margin-bottom:.7rem}
.texte-article h4{font-size:1.06rem;margin-top:1.6rem;margin-bottom:.5rem}
.texte-article ul,.texte-article ol{margin-bottom:1.5em;padding-left:1.4em}
.texte-article li{margin-bottom:.65em;line-height:1.75}
.texte-article li::marker{color:var(--or)}
.texte-article strong{color:var(--vert-profond);font-weight:600}
.texte-article a{text-decoration:underline;text-underline-offset:2px}

.texte-article blockquote.citation,
.texte-article blockquote{
  border-left:3px solid var(--or);background:var(--creme);
  margin:2.2rem 0;padding:22px 28px;border-radius:0 3px 3px 0;
  font-family:var(--serif);font-size:1.16rem;font-style:italic;
  color:var(--vert-profond);line-height:1.6;
}
.texte-article blockquote p{margin:0;font-size:inherit;font-style:inherit}

.texte-article figure{margin:2.4rem 0}
.texte-article figure img{
  width:100%;display:block;border-radius:3px;background:var(--creme-fonce);
}
.texte-article figcaption{
  font-size:.85rem;color:var(--gris);padding-top:10px;
  border-top:1px solid var(--filet);margin-top:10px;line-height:1.55;
}
.texte-article img{max-width:100%;height:auto;border-radius:3px}

.texte-article table{margin-block:2rem}
.texte-article hr{border:0;border-top:1px solid var(--filet);margin-block:2.4rem}

.avis-programme{
  background:#FFF6DC;border:1px dashed var(--or);border-radius:3px;
  padding:14px 20px;font-size:.9rem;color:#7A5A12;margin-top:2rem;
}

/* image du blog absente : cadre discret plutôt qu'icône cassée */
.texte-article img[src*="/blog/"]{min-height:60px}

/* image du blog pas encore récupérée : cadre explicite au lieu d'une icône cassée */
.img-absente{
  background:var(--creme);border:1px dashed var(--or);border-radius:3px;
  padding:34px 28px;text-align:center;color:#7A5A12;
}
.img-absente strong{display:block;font-family:var(--serif);font-size:1.02rem;margin-bottom:.5rem;color:#7A5A12}
.img-absente span{font-size:.86rem;line-height:1.55;display:block;max-width:52ch;margin:0 auto}

/* =========================================================
   VERSION 5 — carrousels, galerie, chiffres, partenaires
   ========================================================= */

/* ---------- diaporama du bandeau ---------- */
.hero--diapo{position:relative;isolation:isolate;overflow:hidden}
.diapo__fonds{position:absolute;inset:0;z-index:-2}
.diapo__fond{
  position:absolute;inset:0;background-size:cover;background-position:center 45%;
  opacity:0;transition:opacity 1.1s ease;transform:scale(1.03);
}
.diapo__fond.actif{opacity:1;animation:diapo-zoom 9s ease-out forwards}
@keyframes diapo-zoom{from{transform:scale(1.03)}to{transform:scale(1.10)}}
.hero--diapo::after{
  content:"";position:absolute;inset:0;z-index:-1;border:0;border-radius:0;width:auto;height:auto;
  background:linear-gradient(105deg,rgba(8,45,34,.95) 0%,rgba(10,61,46,.9) 48%,rgba(10,61,46,.7) 100%);
}
@media(max-width:820px){
  .hero--diapo::after{background:linear-gradient(180deg,rgba(8,45,34,.94),rgba(10,61,46,.92))}
}

.diapo__legende{
  position:absolute;right:24px;bottom:78px;z-index:2;max-width:270px;
  font-size:.78rem;line-height:1.5;color:rgba(255,255,255,.72);text-align:right;
  border-right:2px solid var(--or);padding-right:12px;
}
.diapo__puces{
  position:absolute;left:0;right:0;bottom:26px;z-index:3;
  display:flex;gap:9px;justify-content:center;
}
.diapo__puce{
  width:30px;height:3px;border:0;padding:0;cursor:pointer;border-radius:2px;
  background:rgba(255,255,255,.3);transition:background .25s ease,width .25s ease;
}
.diapo__puce:hover{background:rgba(255,255,255,.55)}
.diapo__puce.actif{background:var(--or);width:46px}
@media(max-width:700px){
  .diapo__legende{display:none}
  .diapo__puces{bottom:18px}
}
@media(prefers-reduced-motion:reduce){
  .diapo__fond,.diapo__fond.actif{transition:none;animation:none;transform:none}
}

/* ---------- carrousel horizontal ---------- */
.carrousel{position:relative}
.carrousel__piste{
  display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;padding:4px 4px 20px;
  scrollbar-width:thin;scrollbar-color:var(--filet) transparent;
}
.carrousel__piste::-webkit-scrollbar{height:6px}
.carrousel__piste::-webkit-scrollbar-track{background:var(--creme)}
.carrousel__piste::-webkit-scrollbar-thumb{background:var(--filet);border-radius:3px}
.carrousel__piste > *{scroll-snap-align:start;flex:0 0 min(360px,84vw)}
.carrousel__cmd{
  display:flex;gap:10px;align-items:center;justify-content:flex-end;
  margin-bottom:18px;
}
.carrousel__btn{
  width:42px;height:42px;border:1px solid var(--filet);background:var(--blanc);
  border-radius:50%;cursor:pointer;display:grid;place-items:center;
  color:var(--vert-profond);font-size:1.1rem;line-height:1;
  transition:all .2s ease;flex-shrink:0;
}
.carrousel__btn:hover:not(:disabled){border-color:var(--or);color:var(--or)}
.carrousel__btn:disabled{opacity:.3;cursor:default}
.carrousel__progression{
  height:2px;background:var(--filet);border-radius:2px;overflow:hidden;
  margin-top:4px;
}
.carrousel__progression i{display:block;height:100%;background:var(--or);width:20%;transition:width .2s ease,margin-left .2s ease}

/* carte d'article pour le carrousel */
.carte-pub{
  background:var(--blanc);border:1px solid var(--filet);border-radius:3px;
  display:flex;flex-direction:column;overflow:hidden;
  transition:border-color .22s ease,transform .22s ease,box-shadow .22s ease;
}
.carte-pub:hover{border-color:var(--or);transform:translateY(-3px);box-shadow:0 12px 30px rgba(10,61,46,.09)}
.carte-pub__img{aspect-ratio:16/9;object-fit:cover;width:100%;display:block;background:var(--creme-fonce)}
.carte-pub__corps{padding:24px 24px 26px;display:flex;flex-direction:column;flex:1}
.carte-pub__meta{display:flex;gap:11px;align-items:center;flex-wrap:wrap;margin-bottom:.8rem}
.carte-pub__date{font-size:.78rem;color:var(--gris-clair)}
.carte-pub h3{font-size:1.09rem;line-height:1.38;margin-bottom:.55rem}
.carte-pub h3 a{color:var(--vert-profond)}
.carte-pub h3 a:hover{color:var(--or)}
.carte-pub p{font-size:.92rem;color:var(--gris);margin-bottom:1rem;flex:1}
.carte-pub .lien-fleche{font-size:.86rem;margin-top:auto}

/* ---------- visionneuse plein écran ---------- */
.visionneuse{
  position:fixed;inset:0;z-index:400;background:rgba(8,20,16,.96);
  display:none;align-items:center;justify-content:center;padding:60px 20px 90px;
}
.visionneuse.ouverte{display:flex}
.visionneuse img{
  max-width:100%;max-height:100%;object-fit:contain;border-radius:3px;
  animation:apparait .3s ease;
}
@keyframes apparait{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
.visionneuse__legende{
  position:absolute;left:0;right:0;bottom:34px;text-align:center;
  color:#D8D5CC;font-size:.9rem;padding-inline:70px;line-height:1.5;
}
.visionneuse__compte{display:block;font-size:.76rem;color:#8A8A8A;margin-top:7px;letter-spacing:.08em}
.visionneuse__btn{
  position:absolute;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);
  color:#fff;width:48px;height:48px;border-radius:50%;cursor:pointer;
  display:grid;place-items:center;font-size:1.3rem;transition:all .2s ease;
}
.visionneuse__btn:hover{background:rgba(200,150,62,.25);border-color:var(--or)}
.visionneuse__prec{left:22px;top:50%;transform:translateY(-50%)}
.visionneuse__suiv{right:22px;top:50%;transform:translateY(-50%)}
.visionneuse__fermer{right:22px;top:22px}
@media(max-width:600px){
  .visionneuse{padding:50px 10px 100px}
  .visionneuse__prec{left:10px}.visionneuse__suiv{right:10px}
  .visionneuse__legende{padding-inline:20px;font-size:.84rem}
}
.zoomable{cursor:zoom-in}

/* ---------- bande de chiffres ---------- */
.chiffres{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:0;border-top:1px solid rgba(255,255,255,.14);
}
.chiffre{
  padding:34px 22px;text-align:center;
  border-right:1px solid rgba(255,255,255,.14);
}
.chiffre:last-child{border-right:0}
.chiffre__nombre{
  font-family:var(--serif);font-size:clamp(2.1rem,4vw,3rem);font-weight:600;
  color:var(--or);line-height:1;display:block;margin-bottom:.5rem;
  font-variant-numeric:tabular-nums;
}
.chiffre__libelle{
  font-size:.82rem;color:#CFCCC3;line-height:1.5;display:block;max-width:22ch;margin:0 auto;
}
@media(max-width:620px){
  .chiffre{border-right:0;border-bottom:1px solid rgba(255,255,255,.14);padding:26px 18px}
  .chiffre:last-child{border-bottom:0}
}

/* ---------- bloc de suivi social ---------- */
.suivre{
  background:var(--creme);border:1px solid var(--filet);border-radius:3px;
  padding:34px 36px;
}
.suivre h3{margin-bottom:.6rem}
.suivre > p{color:var(--gris);font-size:.96rem;margin-bottom:1.5rem}
.suivre .reseaux--colonne{margin-top:0}

/* ---------- partenaires et points de vente ---------- */
.lien-externe{
  display:flex;gap:18px;align-items:flex-start;
  border:1px solid var(--filet);border-radius:3px;padding:24px 26px;
  transition:border-color .2s ease,background .2s ease,transform .2s ease;
}
.lien-externe:hover{border-color:var(--or);background:var(--creme);transform:translateY(-2px)}
.lien-externe__marque{
  width:44px;height:44px;flex-shrink:0;border-radius:3px;
  background:var(--vert-profond);color:var(--or);
  display:grid;place-items:center;
  font-family:var(--serif);font-size:1.15rem;font-weight:700;
}
.lien-externe h3{font-size:1.06rem;margin-bottom:.4rem;color:var(--vert-profond)}
.lien-externe p{font-size:.9rem;color:var(--gris);margin-bottom:.5rem;line-height:1.6}
.lien-externe__adresse{
  font-size:.78rem;color:var(--vert-moyen);font-weight:600;
  word-break:break-all;display:block;
}
.lien-externe--vide{opacity:.55;border-style:dashed}
.lien-externe--vide .lien-externe__marque{background:var(--filet);color:var(--gris)}

/* menu principal : jamais de retour à la ligne sur grand écran */
.nav{gap:24px}
.nav > a{white-space:nowrap}
@media(min-width:769px) and (max-width:1120px){
  .nav{gap:17px}
  .nav > a{font-size:.87rem}
  .nav .btn{padding:10px 16px;font-size:.83rem}
  .logo__nom{font-size:1.18rem}
}
@media(min-width:769px) and (max-width:900px){
  .logo__sous{display:none}
  .logo__marque{width:38px;height:38px}
}