/* ============================================================
   Aequitas Consultus · www.aequitus.net
   Charte : EB Garamond uniquement · ivoire · bleu nuit · or
   ============================================================ */

:root{
  --navy:#071028;      /* texte principal, bleu nuit */
  --gold:#BF8520;      /* filets et accents, or antique */
  --dark-gold:#6B3F08; /* texte secondaire or */
  --ivory:#F8F4EC;     /* fond papier, ivoire */
  --serif:"EB Garamond","Garamond","Times New Roman",serif;
}

/* ---------- Socle ---------- */

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

html{ scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--ivory);
  color:var(--navy);
  font-family:var(--serif);
  font-size:1.125rem;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

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

a{ color:var(--navy); text-decoration:underline; text-decoration-color:var(--gold); text-underline-offset:3px; }
a:hover{ color:var(--dark-gold); }

h1,h2,h3{ font-weight:500; line-height:1.25; margin:0 0 .6em; }
h1{ font-size:clamp(1.9rem,4.5vw,2.9rem); }
h2{ font-size:clamp(1.45rem,3vw,1.9rem); }
h3{ font-size:1.2rem; }

p{ margin:0 0 1em; }

.conteneur{
  max-width:68rem;
  margin:0 auto;
  padding:0 1.25rem;
}

/* ---------- Bandeau de marque ---------- */

.bandeau{
  text-align:center;
  padding:2.2rem 1rem 1.4rem;
}

.bandeau .marque{
  font-size:clamp(1.15rem,3.4vw,1.9rem);
  letter-spacing:.45em;
  text-indent:.45em; /* compense le dernier espacement pour un centrage exact */
  text-transform:uppercase;
  white-space:nowrap;
}

.bandeau .marque a{ text-decoration:none; color:var(--navy); }

.filet-or{
  border:none;
  border-top:1px solid var(--gold);
  width:min(22rem,70%);
  margin:.9rem auto;
}

.bandeau .sous-titre{
  font-size:clamp(.78rem,2vw,.95rem);
  letter-spacing:.28em;
  text-indent:.28em;
  text-transform:uppercase;
  color:var(--dark-gold);
}

/* ---------- Navigation ---------- */

.navigation{
  border-top:1px solid var(--gold);
  border-bottom:1px solid var(--gold);
  margin-bottom:2.5rem;
}

.navigation ul{
  list-style:none;
  margin:0; padding:.65rem 0;
  display:flex; flex-wrap:wrap;
  justify-content:center;
  gap:.4rem 1.9rem;
}

.navigation a{
  text-decoration:none;
  font-size:1.02rem;
  letter-spacing:.06em;
}

.navigation a[aria-current="page"]{
  color:var(--dark-gold);
  border-bottom:1px solid var(--gold);
}

.sel-langue{
  font-style:italic;
  color:var(--dark-gold);
}

/* ---------- Sections ---------- */

section{ margin:0 0 3.2rem; }

.titre-section{
  text-align:center;
}

.titre-section::after{
  content:"";
  display:block;
  width:4.5rem;
  border-top:1px solid var(--gold);
  margin:.7rem auto 1.6rem;
}

/* ---------- Accueil : proposition de valeur ---------- */

.proposition{
  text-align:center;
  max-width:46rem;
  margin:0 auto 3.2rem;
}

.proposition h1{ margin-bottom:.5em; }

.proposition .chapeau{
  font-size:1.18rem;
  color:var(--navy);
}

/* ---------- Appels à l'action ---------- */

.actions{
  display:flex; flex-wrap:wrap;
  justify-content:center;
  gap:1rem;
  margin-top:1.6rem;
}

.bouton{
  display:inline-block;
  padding:.65rem 1.9rem;
  border:1px solid var(--gold);
  text-decoration:none;
  letter-spacing:.08em;
  color:var(--navy);
  transition:background .2s ease;
}

.bouton:hover{ background:rgba(191,133,32,.08); color:var(--navy); }

.bouton.principal{
  background:var(--navy);
  color:var(--ivory);
  border-color:var(--navy);
}

.bouton.principal:hover{ background:#10203f; }

/* ---------- Piliers ---------- */

.piliers{
  display:grid;
  grid-template-columns:1fr;
  gap:1.8rem;
}

@media(min-width:46rem){
  .piliers{ grid-template-columns:repeat(3,1fr); }
}

.pilier{
  border-top:1px solid var(--gold);
  padding-top:1.1rem;
}

.pilier h3{ margin-bottom:.45em; }

.pilier .lien-suite{
  font-style:italic;
  color:var(--dark-gold);
  text-decoration:none;
}

.pilier .lien-suite:hover{ text-decoration:underline; text-decoration-color:var(--gold); }

/* ---------- Parcours en quatre étapes ---------- */

.parcours{
  display:grid;
  grid-template-columns:1fr;
  gap:1.4rem;
  counter-reset:etape;
}

@media(min-width:46rem){
  .parcours{ grid-template-columns:repeat(4,1fr); }
}

.etape{
  text-align:center;
  padding:0 .6rem;
}

.etape::before{
  counter-increment:etape;
  content:counter(etape,upper-roman);
  display:block;
  font-size:1.5rem;
  color:var(--gold);
  margin-bottom:.3rem;
}

.etape h3{ font-size:1.08rem; margin-bottom:.3em; }

.etape p{ font-size:.98rem; margin:0; }

/* ---------- Bande de preuve ---------- */

.preuves{
  border-top:1px solid var(--gold);
  border-bottom:1px solid var(--gold);
  padding:1.6rem 1rem;
  text-align:center;
}

.preuves ul{
  list-style:none;
  margin:0; padding:0;
  display:flex; flex-wrap:wrap;
  justify-content:center;
  gap:.7rem 2.6rem;
}

.preuves li{
  font-size:1.02rem;
  color:var(--dark-gold);
  font-style:italic;
}

/* ---------- Portrait ---------- */

.portrait{
  display:grid;
  grid-template-columns:1fr;
  gap:2rem;
  align-items:center;
}

@media(min-width:46rem){
  .portrait{ grid-template-columns:2fr 3fr; }
}

.portrait figure{
  margin:0;
}

.portrait img{
  width:100%;
  max-width:20rem;
  margin:0 auto;
  border-radius:50%;
  border:1px solid var(--gold);
  filter:saturate(.92);
}

.portrait figcaption{
  font-style:italic;
  font-size:.95rem;
  color:var(--dark-gold);
  text-align:center;
  margin-top:.6rem;
}

/* ---------- Médias en appel ---------- */

.medias-appel{
  text-align:center;
  max-width:42rem;
  margin:0 auto;
}

/* ---------- Pied de page ---------- */

.pied{
  margin-top:4rem;
  border-top:1px solid var(--gold);
  padding:2.2rem 1rem 2.6rem;
  text-align:center;
}

.pied .marque-pied{
  letter-spacing:.4em;
  text-indent:.4em;
  text-transform:uppercase;
  font-size:.95rem;
}

.pied .signature{
  font-style:italic;
  color:var(--dark-gold);
  margin:.5rem 0 1.2rem;
}

.pied ul{
  list-style:none;
  margin:0 0 1rem; padding:0;
  display:flex; flex-wrap:wrap;
  justify-content:center;
  gap:.4rem 1.8rem;
}

.pied a{ text-decoration:none; }
.pied a:hover{ text-decoration:underline; text-decoration-color:var(--gold); }

.pied .legal{
  font-size:.88rem;
  color:var(--dark-gold);
}

/* ---------- Page Médias ---------- */

.video-embed{
  position:relative;
  width:100%;
  max-width:52rem;
  margin:1.4rem auto;
  aspect-ratio:16/9;
  border:1px solid var(--gold);
}

.video-embed iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}

.themes{
  list-style:none;
  margin:1.2rem auto; padding:0;
  max-width:44rem;
}

.themes li{
  padding:.6rem 0 .6rem 1.4rem;
  position:relative;
  border-top:1px solid rgba(191,133,32,.35);
}

.themes li:last-child{
  border-bottom:1px solid rgba(191,133,32,.35);
}

.themes li::before{
  content:"·";
  position:absolute;
  left:.3rem;
  color:var(--gold);
  font-size:1.4em;
  line-height:1.1;
}

/* ---------- Page Expertises ---------- */

.bloc-expertise{
  max-width:52rem;
  margin:0 auto 3.4rem;
}

.bloc-expertise h2{
  border-top:1px solid var(--gold);
  padding-top:1.1rem;
}

.prestations{
  list-style:none;
  margin:1.2rem 0; padding:0;
}

.prestations li{
  padding-left:1.4rem;
  position:relative;
  margin-bottom:.55rem;
}

.prestations li::before{
  content:"·";
  position:absolute;
  left:.3rem;
  color:var(--gold);
  font-size:1.4em;
  line-height:1.1;
}

.benefices{
  margin:1.4rem 0;
}

.benefices dt{
  font-weight:500;
  margin-top:1rem;
}

.benefices dd{
  margin:0 0 .4rem;
}

.note-source{
  font-size:.92rem;
  color:var(--dark-gold);
  font-style:italic;
}

.avertissement{
  border-top:1px solid var(--gold);
  border-bottom:1px solid var(--gold);
  padding:1rem 1.2rem;
  margin:1.6rem 0;
  font-style:italic;
  font-size:1.02rem;
}

/* ---------- Page À propos ---------- */

.prose{
  max-width:44rem;
  margin:0 auto;
}

.prose p{
  margin-bottom:1.15em;
}

.portrait-haut{
  text-align:center;
  margin:0 auto 2.4rem;
}

.portrait-haut img{
  width:min(14rem,55vw);
  margin:0 auto .8rem;
  border-radius:50%;
  border:1px solid var(--gold);
  filter:saturate(.92);
}

.portrait-haut figcaption{
  font-style:italic;
  color:var(--dark-gold);
  font-size:.98rem;
}

.mention-livre{
  border-top:1px solid var(--gold);
  margin-top:2.4rem;
  padding-top:1.2rem;
  font-style:italic;
  font-size:1rem;
  color:var(--dark-gold);
}

/* ---------- FAQ ---------- */

.faq{
  max-width:52rem;
  margin:0 auto;
}

.faq details{
  border-top:1px solid var(--gold);
  padding:.85rem .2rem;
}

.faq details:last-of-type{
  border-bottom:1px solid var(--gold);
}

.faq summary{
  cursor:pointer;
  font-size:1.12rem;
  font-weight:500;
  list-style:none;
}

.faq summary::-webkit-details-marker{ display:none; }

.faq summary::after{
  content:"+";
  float:right;
  color:var(--gold);
  font-size:1.2em;
}

.faq details[open] summary::after{
  content:"\2212"; /* signe moins */
}

.faq details p{
  margin:.7rem 0 .2rem;
}

/* ---------- Accessibilité ---------- */

.acces-rapide{
  position:absolute;
  left:-9999px;
}

.acces-rapide:focus{
  position:static;
  display:block;
  padding:.4rem;
}

:focus-visible{
  outline:2px solid var(--dark-gold);
  outline-offset:2px;
}