@font-face{font-family:"Bodoni Moda";font-style:normal;font-weight:400 500;font-display:swap;src:url("fonts/bodoni-moda-normal.woff2") format("woff2")}
@font-face{font-family:"Bodoni Moda";font-style:italic;font-weight:400;font-display:swap;src:url("fonts/bodoni-moda-italic.woff2") format("woff2")}
@font-face{font-family:"Instrument Sans";font-style:normal;font-weight:400 600;font-display:swap;src:url("fonts/instrument-sans-normal.woff2") format("woff2")}
:root{--nuit:#3A4550;--nuit-rgb:58,69,80;--nuit-2:#2F3842;--ardoise:#3A4550;--sable:#B8A27A;--sable-c:#CDB78E;--sable-f:#8A7550;--encre:#1E252C;--craie:#F3F1EC;--fond-2:#ECE9E2;--blanc:#fff;--gris:#5F6368;--gris-c:#AEB4BA;--trait:#DCD8CF;
--serif:"Bodoni Moda",Georgia,serif;--sans:"Instrument Sans",system-ui,sans-serif;--max:1200px;--pad:clamp(20px,4.5vw,48px);--haut:76px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--haut) + 16px)}
body{margin:0;font-family:var(--sans);font-size:16.5px;line-height:1.65;color:var(--ardoise);background:var(--craie);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
a:hover{color:var(--sable-f)}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.12;margin:0;color:var(--nuit);text-wrap:balance}
p{margin:0;text-wrap:pretty}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.eyebrow{font-size:11.5px;font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:var(--sable-f)}
.sombre .eyebrow,.hero .eyebrow,.page-tete .eyebrow,.duo .eyebrow{color:var(--sable)}
.lien{display:inline-flex;align-self:flex-start;gap:8px;font-size:14px;font-weight:500;text-decoration:none;padding-bottom:3px;border-bottom:1px solid currentColor;white-space:nowrap}
.lien:hover{color:var(--sable-f)}
.sombre .lien:hover,.duo .lien:hover{color:var(--sable)}

/* Boutons */
.btns{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 26px;font-size:15px;font-weight:500;text-decoration:none;white-space:nowrap;transition:background .2s,color .2s,box-shadow .2s}
/* Bouton principal : Sable sur fond sombre, Ardoise (.btn-nuit) sur fond clair */
.btn-sable{background:var(--sable);color:var(--encre);font-weight:600;min-height:54px;padding:0 30px}.btn-sable:hover{background:var(--sable-c);color:var(--encre)}
.btn-clair{box-shadow:inset 0 0 0 1px rgba(243,241,236,.6);color:var(--craie)}.btn-clair:hover{background:var(--craie);color:var(--nuit)}
.btn-nuit{background:var(--nuit);color:var(--craie);font-weight:600;min-height:54px;padding:0 30px}.btn-nuit:hover{background:var(--ardoise);color:var(--craie)}
.btn-ligne{box-shadow:inset 0 0 0 1px var(--nuit);color:var(--nuit)}.btn-ligne:hover{background:var(--nuit);color:var(--craie)}

/* En-tête */
.entete{position:fixed;inset:0 0 auto;z-index:50;background:var(--nuit);color:var(--craie);box-shadow:0 1px 0 rgba(255,255,255,.06)}
.entete .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;height:var(--haut)}
.marque{display:flex;align-items:center;gap:14px;text-decoration:none}
.marque img{height:36px;width:auto}
.marque span{display:flex;flex-direction:column;line-height:1.2}
.marque b{font-family:var(--serif);font-weight:400;font-size:19px;white-space:nowrap}
.marque small{font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--sable);white-space:nowrap}
.marque:hover{color:var(--craie)}
.nav{display:flex;align-items:center;gap:30px}
.nav a{font-size:14.5px;text-decoration:none;white-space:nowrap;color:#D5D8DB}
.nav a:hover,.nav a[aria-current="page"]{color:var(--craie)}
.nav a[aria-current="page"]:not(.btn){box-shadow:inset 0 -1px 0 var(--sable)}
.nav .btn{color:var(--encre);min-height:44px;padding:0 22px;margin-left:6px}
.burger{display:none;background:none;border:0;padding:8px;cursor:pointer;color:inherit}
@media (max-width:900px){.burger{display:block}.nav{position:absolute;top:var(--haut);left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--nuit);padding:8px var(--pad) 24px;display:none}.nav.ouvert{display:flex}.nav a{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08)}.nav a[aria-current="page"]:not(.btn){box-shadow:none;color:var(--sable)}.nav .btn{margin:16px 0 0}}
main{padding-top:var(--haut)}

/* Accueil : bandeau */
.hero{position:relative;min-height:clamp(480px,68vh,640px);display:flex;align-items:center;color:var(--craie);background:var(--nuit);overflow:hidden}
.hero .fond{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% center}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--nuit-rgb),.92) 0%,rgba(var(--nuit-rgb),.72) 50%,rgba(var(--nuit-rgb),.35) 100%)}
.hero .wrap{position:relative;z-index:1;width:100%;padding-top:64px;padding-bottom:64px;display:flex;flex-direction:column;gap:24px}
.hero h1{font-size:clamp(40px,5.4vw,68px);color:var(--craie);max-width:11em}
.hero h1 em,.page-tete h1 em{font-style:italic;color:var(--sable)}
.hero p{font-size:clamp(16.5px,1.3vw,18.5px);color:#D5D8DB;max-width:31em}
.hero .btns{margin-top:8px}

/* Pages intérieures : bandeau */
.page-tete{position:relative;background:var(--nuit);color:var(--craie);overflow:hidden;padding:clamp(64px,8vw,104px) 0 clamp(56px,7vw,88px)}
.page-tete .fond{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3}
.page-tete::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--nuit-rgb),.95) 0%,rgba(var(--nuit-rgb),.75) 60%,rgba(var(--nuit-rgb),.5) 100%)}
.page-tete .wrap{position:relative;z-index:1;display:flex;flex-direction:column;gap:18px}
.page-tete h1{font-size:clamp(36px,4.6vw,58px);color:var(--craie);max-width:15em}
.page-tete p{font-size:17px;color:#D5D8DB;max-width:36em}

/* Sections */
section{padding:clamp(64px,8vw,112px) 0}
.tete{display:flex;flex-direction:column;gap:14px;margin-bottom:48px;max-width:720px}
.tete h2,.tete-ligne h2{font-size:clamp(30px,3.6vw,44px)}
.tete p{font-size:17px;color:var(--gris)}
.tete-ligne{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:44px}
.tete-ligne h2{max-width:16em}
.sombre{background:var(--nuit);color:#D5D8DB}
.sombre h2,.sombre h3{color:var(--craie)}
.sombre .tete p{color:var(--gris-c)}
.blanc{background:var(--blanc)}
.beige{background:var(--fond-2)}

/* Cartes (domaines, renvois) */
.cartes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px}
.carte{grid-column:span 2;background:var(--blanc);padding:36px 32px;display:flex;flex-direction:column;gap:14px;text-decoration:none;color:inherit;transition:box-shadow .25s,transform .25s}
.cartes>.carte:nth-child(n+4){grid-column:span 3}
a.carte:hover{color:inherit;transform:translateY(-3px);box-shadow:0 16px 36px rgba(var(--nuit-rgb),.08)}
.carte .n{font-family:var(--serif);font-size:15px;color:var(--sable-f)}
.carte h3{font-size:clamp(23px,2vw,27px)}
.carte p{font-size:15px;color:var(--gris)}
.carte .suite{margin-top:auto;padding-top:18px;font-size:13.5px;font-weight:500;color:var(--nuit)}
.blanc .carte{background:var(--craie)}
@media (max-width:980px){
  .cartes{grid-template-columns:1fr 1fr}
  .carte,.cartes>.carte:nth-child(n+4){grid-column:auto}
  .cartes>.carte:last-child:nth-child(odd){grid-column:1 / -1}
}
@media (max-width:640px){
  .cartes{grid-template-columns:1fr}
  .cartes>.carte:last-child:nth-child(odd){grid-column:auto}
}

/* Photo + texte */
.duo{display:grid;grid-template-columns:1fr 1fr;background:var(--nuit);color:#D5D8DB;padding:0}
.duo .photo{min-height:440px;position:relative}
.duo .photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.duo .texte{padding:clamp(48px,7vw,96px) clamp(24px,6vw,88px);display:flex;flex-direction:column;justify-content:center;gap:20px;max-width:640px}
.duo h2{font-size:clamp(28px,3.2vw,40px);color:var(--craie)}
.duo .lien{color:var(--craie)}
@media (max-width:860px){.duo{grid-template-columns:1fr}.duo .photo{min-height:0;aspect-ratio:4/3}}

/* Méthode */
.etapes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.etape{border-top:1px solid var(--nuit);padding-top:22px;display:flex;flex-direction:column;gap:10px}
.etape .n{font-family:var(--serif);font-size:15px;color:var(--sable-f)}
.etape h3{font-size:23px}
.etape p{color:var(--gris);font-size:15px}
@media (max-width:760px){.etapes{grid-template-columns:1fr}}

/* Le cabinet */
.apropos .grille{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(40px,7vw,96px);align-items:start}
.portrait img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 18%}
.apropos .texte{display:flex;flex-direction:column;gap:18px}
.apropos .texte h2{font-size:clamp(30px,3.6vw,44px)}
.apropos .texte>p{font-size:17px}
.parcours{list-style:none;margin:16px 0 0;padding:0;border-top:1px solid var(--trait)}
.parcours li{display:grid;grid-template-columns:64px 1fr;gap:20px;padding:16px 0;border-bottom:1px solid var(--trait);font-size:15px}
.parcours li b{font-family:var(--serif);font-weight:400;font-size:18px;color:var(--sable-f)}
.parcours li span{color:var(--gris)}
@media (max-width:860px){.apropos .grille{grid-template-columns:1fr}.portrait{max-width:420px}}
.valeurs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.valeurs div{border-top:1px solid var(--nuit);padding-top:22px;display:flex;flex-direction:column;gap:8px}
.valeurs b{font-family:var(--serif);font-weight:400;font-size:21px;color:var(--nuit)}
.valeurs span{color:var(--gris);font-size:15px}
@media (max-width:900px){.valeurs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.valeurs{grid-template-columns:1fr}}

/* Domaines */
.sommaire{background:var(--blanc);border-bottom:1px solid var(--trait);position:sticky;top:var(--haut);z-index:10}
.sommaire .wrap{display:flex;gap:8px 36px;flex-wrap:wrap;padding-top:16px;padding-bottom:16px}
.sommaire a{text-decoration:none;font-size:14px;display:inline-flex;gap:10px;color:var(--nuit)}
.sommaire a span{font-family:var(--serif);color:var(--sable-f)}
@media (max-width:760px){.sommaire{position:static}.sommaire .wrap{flex-direction:column}}
.domaine{scroll-margin-top:140px}
.domaine+.domaine{padding-top:0}
.domaine .grille{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:0 clamp(32px,6vw,96px);align-items:start}
.domaine .grille::before{content:"";grid-column:1/-1;border-top:1px solid var(--trait);margin-bottom:clamp(40px,5vw,64px)}
.domaine .n{font-family:var(--serif);font-size:15px;color:var(--sable-f);margin-bottom:12px}
.domaine h2{font-size:clamp(28px,3.2vw,40px)}
.domaine p{font-size:17px}
.puces{list-style:none;margin:24px 0 0;padding:0}
.puces li{position:relative;padding:12px 0 12px 24px;border-bottom:1px solid var(--trait);font-size:15.5px;color:var(--gris)}
.puces li::before{content:"";position:absolute;left:0;top:24px;width:12px;height:1px;background:var(--sable-f)}
@media (max-width:860px){.domaine .grille{grid-template-columns:1fr;row-gap:20px}.domaine .grille::before{margin-bottom:12px}}

/* Honoraires */
.formules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.suite-bloc{margin-top:clamp(56px,7vw,80px)}
.formule{background:var(--craie);padding:34px 30px;display:flex;flex-direction:column;gap:12px}
.formule h3{font-size:24px}
.formule p{color:var(--gris);font-size:15px}
.note{margin-top:32px;color:var(--gris);font-size:15px;max-width:48em}
@media (max-width:860px){.formules{grid-template-columns:1fr}}

/* FAQ */
.faq .grille{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:clamp(32px,6vw,96px)}
.faq details{border-top:1px solid var(--trait)}.faq details:last-child{border-bottom:1px solid var(--trait)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;font-family:var(--serif);font-size:20px;line-height:1.3;color:var(--nuit)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font-family:var(--sans);font-size:22px;font-weight:300;color:var(--sable-f);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 24px;color:var(--gris);max-width:42em}
@media (max-width:860px){.faq .grille{grid-template-columns:1fr}}

/* Contact */
.contact .grille{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px;align-items:stretch}
.coords{background:var(--blanc);padding:8px clamp(24px,4vw,44px)}
.coords .ligne{display:grid;grid-template-columns:130px minmax(0,1fr);gap:8px 24px;padding:22px 0;border-bottom:1px solid var(--trait)}
.coords .ligne:last-child{border-bottom:0}
.coords .k{font-size:11.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--sable-f);padding-top:5px}
.coords .v{font-family:var(--serif);font-size:19px;line-height:1.45;color:var(--nuit);text-decoration:none;overflow-wrap:anywhere}
.coords a.v:hover{color:var(--sable-f)}
.coords .lien{margin-top:10px}
.rdv{background:var(--nuit);color:#D5D8DB;padding:clamp(28px,4vw,48px);display:flex;flex-direction:column;gap:18px}
.rdv h2{font-size:clamp(26px,3vw,34px);color:var(--craie)}
.rdv .btns{margin-top:4px}
.rdv .petit{margin-top:auto;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);font-size:14px;color:var(--gris-c)}
@media (max-width:900px){.contact .grille{grid-template-columns:1fr}}
@media (max-width:520px){.coords .ligne{grid-template-columns:1fr;gap:4px;padding:18px 0}.coords .k{padding-top:0}.rdv .btns .btn{flex:1}}

/* Appel à l'action */
.cta{background:var(--nuit);padding:clamp(56px,7vw,88px) 0}
.cta .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:28px}
.cta h2{font-size:clamp(30px,3.8vw,46px);color:var(--craie)}

/* Pied */
.pied{background:var(--nuit-2);color:var(--gris-c);font-size:14px;padding:56px 0 0}
.pied .colonnes{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;padding-bottom:44px}
.pied .marque b{color:var(--craie)}
.pied p{line-height:1.7}
.pied ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.pied a{text-decoration:none}.pied a:hover{color:var(--sable)}
.pied .bas{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:20px;padding-bottom:24px;border-top:1px solid rgba(255,255,255,.08);font-size:13px}
@media (max-width:860px){.pied .colonnes{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.pied .colonnes{grid-template-columns:1fr}}

/* Apparition au défilement */
.rev{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .7s ease}
.rev.vu{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rev{opacity:1;transform:none;transition:none}}
