/* =====================================================================
   Nath Lab, feuille de styles unique (styles.css)
   Générée par consolidation des 8 blocs <style> : règles communes
   fusionnées, conflits inter-pages limités par classe de page,
   générations mortes supprimées, typographie centralisée en tokens.
   Aucun texte visible modifié.
   ===================================================================== */

@keyframes prismStroke { 0%{ stroke: var(--petrole); } 14%{ stroke: var(--brume); } 28%{ stroke: var(--sauge); } 43%{ stroke: var(--beurre); } 57%{ stroke: var(--peche); } 71%{ stroke: var(--lavande); } 86%{ stroke: var(--laiton); } 100%{ stroke: var(--petrole); } }
@keyframes prismFill { 0%{ fill: var(--petrole); } 14%{ fill: var(--brume); } 28%{ fill: var(--sauge); } 43%{ fill: var(--beurre); } 57%{ fill: var(--peche); } 71%{ fill: var(--lavande); } 86%{ fill: var(--laiton); } 100%{ fill: var(--petrole); } }
@keyframes fadeInUp { from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:translateY(0); } }
@keyframes scroll-left { 0%{ transform:translateX(0); } 100%{ transform:translateX(-50%); } }
@keyframes accordFade { from{ opacity:0; transform:translateY(-6px); } to{ opacity:1; transform:translateY(0); } }
@keyframes prismeLight { 0%,100%{ color:var(--ambre); } 20%{ color:var(--turquoise); } 40%{ color:var(--lavande); } 60%{ color:var(--rose); } 80%{ color:var(--sauge); } }
@keyframes mineralShift { 0%,100%{ color:var(--accent); } 25%{ color:#5A8A8E; } 50%{ color:#8B6B99; } 75%{ color:#8A7A4E; } }
@keyframes mineralScroll { 0%{ transform:translateX(0); } 100%{ transform:translateX(-50%); } }
@keyframes launchPulse { 0%{transform:scale(0.8);box-shadow:0 0 0 0 rgba(242,172,57,0.85);}55%{transform:scale(1.18);box-shadow:0 0 0 15px rgba(242,172,57,0);}100%{transform:scale(0.8);box-shadow:0 0 0 0 rgba(242,172,57,0);} }
@keyframes launchDotColor { 0%,100%{background:var(--rose);}25%{background:var(--ambre);}50%{background:var(--turquoise);}75%{background:var(--lavande);} }

:root{
  --font-page-title-desktop:64px;   --font-page-title-mobile:38px;
  --font-section-title-desktop:44px; --font-section-title-mobile:32px;
  --font-subsection-title-desktop:36px; --font-subsection-title-mobile:30px;
  --font-card-title-desktop:24px;   --font-card-title-mobile:22px;
  --font-body-desktop:24px;         --font-body-mobile:18px;
  --font-small:14px;
  --line-height-title:1.1;          --line-height-body:1.6;
}

/* --- Base & composants (fusionnés) --- */
:root { --ivoire:#FAFAF6; --petrole:#2F4A50; --accent:#A07218; --ambre:#F2AC39; --turquoise:#42B1BB; --lavande:#C1A4D4; --rose:#F1A7AF; --sauge:#AFC194; --orange:#FB8244; --dark:#1E5A5E; --ink:#2F4A50; --laiton:#C4882A; --brume:#42B1BB; --peche:#F1A7AF; --beurre:#F2AC39; }
* { box-sizing:border-box; margin:0; padding:0; }
body { font-family:"Plus Jakarta Sans", sans-serif; background:var(--ivoire); color:var(--ink); }
h1,h2,h3 { font-family:"Instrument Serif", serif; font-weight:400; color:var(--petrole); }
a { color:inherit; }
nav { display:flex; justify-content:space-between; align-items:center; padding:24px 52px; border-bottom:1px solid rgba(47,74,80,0.12); position:sticky; top:0; background:rgba(248,243,234,0.92); z-index:20; backdrop-filter:blur(12px); }
.logo { display:flex; align-items:center; gap:10px; text-decoration:none; }
.logo svg { width:63px !important; height:auto; color:var(--ambre); animation:prismeLight 12s ease-in-out infinite; }
.logo-text { font-family:"Instrument Serif", serif; font-weight:500; font-size:39px !important; color:var(--petrole); letter-spacing:-0.01em; line-height:1.15; }
body.page-index .logo-text small { display:block; font-family:"Plus Jakarta Sans", sans-serif; font-size:18px !important; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent) !important; font-weight:500; margin-top:1px; }
body.page-lien .logo-text small { display:block; font-family:"Plus Jakarta Sans", sans-serif; font-size:18px !important; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent) !important; font-weight:500; margin-top:1px; opacity:0.8; }
body.page-coaching .logo-text small { display:block; font-family:"Plus Jakarta Sans", sans-serif; font-size:18px !important; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent) !important; font-weight:500; margin-top:1px; }
body.page-orientation .logo-text small { display:block; font-family:"Plus Jakarta Sans", sans-serif; font-size:18px !important; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent) !important; font-weight:500; margin-top:1px; }
body.page-potentiels .logo-text small { display:block; font-family:"Plus Jakarta Sans", sans-serif; font-size:18px !important; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent) !important; font-weight:500; margin-top:1px; }
body.page-apropos .logo-text small { display:block; font-family:"Plus Jakarta Sans", sans-serif; font-size:18px !important; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent) !important; font-weight:500; margin-top:1px; }
body.page-contact .logo-text small { display:block; font-family:"Plus Jakarta Sans", sans-serif; font-size:18px !important; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent) !important; font-weight:500; margin-top:1px; }
body.page-mentions .logo-text small { display:block; font-family:"Plus Jakarta Sans", sans-serif; font-size:18px !important; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent) !important; font-weight:500; margin-top:1px; }
.navlinks { display:flex; gap:26px; font-size:15px !important; }
.navlinks a { text-decoration:none; opacity:0.72; position:relative; transition:opacity 0.2s ease; font-weight:400; letter-spacing:0.02em; }
body.page-index .navlinks a.active { opacity:1; color:var(--ambre); }
body.page-lien .navlinks a.active { opacity:1; color:var(--turquoise); font-weight:600; }
body.page-coaching .navlinks a.active { opacity:1; color:var(--ambre); }
body.page-orientation .navlinks a.active { opacity:1; color:var(--ambre); }
body.page-potentiels .navlinks a.active { opacity:1; color:var(--ambre); }
body.page-apropos .navlinks a.active { opacity:1; color:var(--ambre); }
body.page-contact .navlinks a.active { opacity:1; color:var(--ambre); }
body.page-mentions .navlinks a.active { opacity:1; color:var(--ambre); }
body.page-index .nav-cta { font-size:15px !important; background:var(--turquoise); color:var(--ivoire); padding:13px 26px !important; border-radius:20px; text-decoration:none; font-weight:500; letter-spacing:0.03em; }
body.page-lien .nav-cta { font-size:15px !important; background:var(--turquoise); color:var(--ivoire); padding:13px 26px !important; border-radius:20px; text-decoration:none; font-weight:600 !important; letter-spacing:0.03em; }
body.page-coaching .nav-cta { font-size:15px !important; background:var(--turquoise); color:var(--ivoire); padding:13px 26px !important; border-radius:20px; text-decoration:none; font-weight:600 !important; letter-spacing:0.03em; }
body.page-orientation .nav-cta { font-size:15px !important; background:var(--turquoise); color:var(--ivoire); padding:13px 26px !important; border-radius:20px; text-decoration:none; font-weight:600 !important; letter-spacing:0.03em; }
body.page-potentiels .nav-cta { font-size:15px !important; background:var(--turquoise); color:var(--ivoire); padding:13px 26px !important; border-radius:20px; text-decoration:none; font-weight:600 !important; letter-spacing:0.03em; }
body.page-apropos .nav-cta { font-size:15px !important; background:var(--turquoise); color:var(--ivoire); padding:13px 26px !important; border-radius:20px; text-decoration:none; font-weight:600 !important; letter-spacing:0.03em; }
body.page-contact .nav-cta { font-size:15px !important; background:var(--turquoise); color:var(--ivoire); padding:13px 26px !important; border-radius:20px; text-decoration:none; font-weight:600 !important; letter-spacing:0.03em; }
body.page-mentions .nav-cta { font-size:15px !important; background:var(--turquoise); color:var(--ivoire); padding:13px 26px !important; border-radius:20px; text-decoration:none; font-weight:600 !important; letter-spacing:0.03em; }
body.page-index .eyebrow { font-size:14px !important; letter-spacing:0.18em; font-weight:500; text-transform:uppercase; color:var(--accent); margin-bottom:20px; display:flex; align-items:center; gap:10px; }
body.page-lien .eyebrow { font-size:14px !important; letter-spacing:0.15em !important; font-weight:500; text-transform:uppercase; color:var(--accent); margin-bottom:20px; display:flex; align-items:center; gap:10px; }
body.page-coaching .eyebrow { font-size:14px !important; letter-spacing:0.15em !important; font-weight:500; text-transform:uppercase; color:var(--accent); margin-bottom:20px; display:flex; align-items:center; gap:10px; }
body.page-orientation .eyebrow { font-size:14px !important; letter-spacing:0.15em !important; font-weight:500; text-transform:uppercase; color:var(--accent); margin-bottom:20px; display:flex; align-items:center; gap:10px; }
body.page-potentiels .eyebrow { font-size:14px !important; letter-spacing:0.15em !important; font-weight:500; text-transform:uppercase; color:var(--accent); margin-bottom:20px; display:flex; align-items:center; gap:10px; }
body.page-apropos .eyebrow { font-size:14px !important; letter-spacing:0.15em !important; font-weight:500; text-transform:uppercase; color:var(--accent); margin-bottom:20px; display:flex; align-items:center; gap:10px; }
body.page-contact .eyebrow { font-size:14px !important; letter-spacing:0.15em !important; font-weight:500; text-transform:uppercase; color:var(--accent); margin-bottom:20px; display:flex; align-items:center; gap:10px; }
body.page-mentions .eyebrow { font-size:14px !important; letter-spacing:0.15em !important; font-weight:500; text-transform:uppercase; color:var(--accent); margin-bottom:20px; display:flex; align-items:center; gap:10px; }
.eyebrow::before { content:""; width:20px; height:1px; background:var(--accent); }
.page-header { max-width:1160px; margin:0 auto; padding:70px 52px 54px; animation:fadeInUp 0.8s ease both; padding-top:90px; padding-bottom:64px; }
.page-header h1 { font-style:italic; font-size:44px; line-height:1.22; margin-bottom:20px; max-width:680px; letter-spacing:-0.02em; }
.page-header p { font-size:20px !important; line-height:1.7 !important; opacity:0.82; max-width:520px; }
.hero { display:grid; grid-template-columns:1.05fr 0.95fr; gap:56px; align-items:center; padding:76px 52px 90px; max-width:1160px; margin:0 auto; }
.hero h1 { font-style:italic; font-size:40px; line-height:1.28; margin-bottom:22px; letter-spacing:-0.02em; }
.hero .lead { font-size:15px; line-height:1.8; opacity:0.85; max-width:460px; margin-bottom:14px; }
.btnrow { display:flex; gap:18px; align-items:center; flex-wrap:wrap; margin-top:22px; }
.btn-primary { background:var(--turquoise); color:var(--ivoire); padding:18px 38px !important; border-radius:24px; text-decoration:none; font-size:18px !important; display:inline-block; font-weight:600 !important; letter-spacing:0.04em; }
.btn-link { color:var(--petrole); text-decoration:underline; font-size:13px; }
.hero-visual { display:flex; align-items:center; justify-content:center; }
.hero-visual svg { width:100%; max-width:340px; height:auto; }
.section { max-width:1160px; margin:0 auto; padding:66px 52px; }
.section h2 { font-style:italic; font-size:32px; margin-bottom:20px; max-width:600px; }
.section p { font-size:14px; line-height:1.75; opacity:0.82; max-width:520px; }
.card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:40px; }
.card { background:#fffdf9; border:1px solid rgba(47,74,80,0.1); border-radius:10px; padding:30px 26px; }
.card .tag { font-size:13px !important; letter-spacing:0.08em; text-transform:uppercase; color:var(--accent); margin-bottom:14px; }
.card h3 { font-style:italic; font-size:24px !important; margin-bottom:10px; }
.card p { font-size:16px !important; line-height:1.7; opacity:0.78; }
.band { padding:80px 52px; transition:background 0.6s ease; }
.band.sauge, .band.brume, .band.peche, .band.beurre { background:var(--dark); color:var(--ivoire); }
.band.sauge h2, .band.brume h2, .band.peche h2, .band.beurre h2, .band.sauge h3, .band.brume h3, .band.peche h3, .band.beurre h3, .band.sauge p, .band.brume p, .band.peche p, .band.beurre p { color:var(--ivoire); }
.band.sauge .eyebrow, .band.beurre .eyebrow, .band.brume .eyebrow { color:var(--ambre); }
.band.sauge .eyebrow::before, .band.beurre .eyebrow::before, .band.brume .eyebrow::before { background:var(--ambre); }
.band-inner { max-width:1160px; margin:0 auto; }
.band h2 { font-style:italic; max-width:640px; margin-bottom:36px; }
.step-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
body.page-index .step { background:rgba(193,164,212,0.08); border:1px solid rgba(255,255,255,0.1); border-radius:10px; padding:28px 24px; }
body.page-lien .step { background:transparent !important; border-radius:10px; padding:0 !important; border:none !important; perspective:800px; cursor:pointer; position:relative; min-height:230px; }
body.page-coaching .step { background:transparent !important; border:none !important; border-radius:10px; padding:0 !important; perspective:800px; cursor:pointer; position:relative; min-height:230px; }
body.page-orientation .step { background:transparent !important; border:none !important; border-radius:10px; padding:0 !important; perspective:800px; cursor:pointer; position:relative; min-height:230px; }
body.page-potentiels .step { background:transparent !important; border:none !important; border-radius:10px; padding:0 !important; perspective:800px; cursor:pointer; position:relative; min-height:230px; }
body.page-apropos .step { background:transparent !important; border:none !important; border-radius:10px; padding:0 !important; perspective:800px; cursor:pointer; position:relative; min-height:230px; }
body.page-contact .step { background:transparent !important; border:none !important; border-radius:10px; padding:0 !important; perspective:800px; cursor:pointer; position:relative; min-height:230px; }
body.page-mentions .step { background:transparent !important; border:none !important; border-radius:10px; padding:0 !important; perspective:800px; cursor:pointer; position:relative; min-height:230px; }
body.page-index .step .num { font-size:11px; letter-spacing:0.08em; color:var(--petrole); opacity:0.8; margin-bottom:12px; }
body.page-lien .step .num { font-size:11px; letter-spacing:0.08em; color:var(--accent); opacity:1; margin-bottom:12px; text-transform:uppercase; }
body.page-coaching .step .num { font-size:11px; letter-spacing:0.08em; color:var(--petrole); opacity:0.8; margin-bottom:12px; }
body.page-orientation .step .num { font-size:11px; letter-spacing:0.08em; color:var(--petrole); opacity:0.8; margin-bottom:12px; }
body.page-potentiels .step .num { font-size:11px; letter-spacing:0.08em; color:var(--petrole); opacity:0.8; margin-bottom:12px; }
body.page-apropos .step .num { font-size:11px; letter-spacing:0.08em; color:var(--petrole); opacity:0.8; margin-bottom:12px; }
body.page-contact .step .num { font-size:11px; letter-spacing:0.08em; color:var(--petrole); opacity:0.8; margin-bottom:12px; }
body.page-mentions .step .num { font-size:11px; letter-spacing:0.08em; color:var(--petrole); opacity:0.8; margin-bottom:12px; }
.step h3 { font-style:italic; font-size:19px; margin-bottom:8px; color:var(--ivoire); }
.step p { font-size:14px; line-height:1.7; opacity:0.75; color:var(--ivoire); }
body.page-index .lede { max-width:640px; margin:0 auto; padding:0 52px 10px; font-size:28px !important; line-height:1.85; font-weight:300; letter-spacing:0.005em; }
body.page-lien .lede { max-width:640px; margin:0 auto; padding:0 52px 10px; font-size:28px !important; line-height:1.85 !important; font-weight:300; letter-spacing:0.005em; }
body.page-coaching .lede { max-width:640px; margin:0 auto; padding:0 52px 10px; font-size:28px !important; line-height:1.85 !important; font-weight:300; letter-spacing:0.005em; }
body.page-orientation .lede { max-width:640px; margin:0 auto; padding:0 52px 10px; font-size:28px !important; line-height:1.85 !important; font-weight:300; letter-spacing:0.005em; }
body.page-potentiels .lede { max-width:640px; margin:0 auto; padding:0 52px 10px; font-size:28px !important; line-height:1.85 !important; font-weight:300; letter-spacing:0.005em; }
body.page-apropos .lede { max-width:640px; margin:0 auto; padding:0 52px 10px; font-size:28px !important; line-height:1.85 !important; font-weight:300; letter-spacing:0.005em; }
body.page-contact .lede { max-width:640px; margin:0 auto; padding:0 52px 10px; font-size:28px !important; line-height:1.85 !important; font-weight:300; letter-spacing:0.005em; }
body.page-mentions .lede { max-width:640px; margin:0 auto; padding:0 52px 10px; font-size:28px !important; line-height:1.85 !important; font-weight:300; letter-spacing:0.005em; }
body.page-index .lede::first-letter { font-family:"Instrument Serif", serif; font-style:italic; font-size:66px; font-weight:700; float:left; line-height:0.8; margin:8px 10px 0 0; color:var(--ambre); }
body.page-lien .lede::first-letter { font-family:"Instrument Serif", serif; font-style:italic; font-size:66px; font-weight:700; float:left; line-height:0.8; margin:8px 10px 0 0; color:var(--accent); opacity:0.6; }
body.page-coaching .lede::first-letter { font-family:"Instrument Serif", serif; font-style:italic; font-size:66px; font-weight:700; float:left; line-height:0.8; margin:8px 10px 0 0; color:var(--ambre); }
body.page-orientation .lede::first-letter { font-family:"Instrument Serif", serif; font-style:italic; font-size:66px; font-weight:700; float:left; line-height:0.8; margin:8px 10px 0 0; color:var(--ambre); }
body.page-potentiels .lede::first-letter { font-family:"Instrument Serif", serif; font-style:italic; font-size:66px; font-weight:700; float:left; line-height:0.8; margin:8px 10px 0 0; color:var(--ambre); }
body.page-apropos .lede::first-letter { font-family:"Instrument Serif", serif; font-style:italic; font-size:66px; font-weight:700; float:left; line-height:0.8; margin:8px 10px 0 0; color:var(--ambre); }
body.page-contact .lede::first-letter { font-family:"Instrument Serif", serif; font-style:italic; font-size:66px; font-weight:700; float:left; line-height:0.8; margin:8px 10px 0 0; color:var(--ambre); }
body.page-mentions .lede::first-letter { font-family:"Instrument Serif", serif; font-style:italic; font-size:66px; font-weight:700; float:left; line-height:0.8; margin:8px 10px 0 0; color:var(--ambre); }
.readcol { max-width:640px; margin:0 auto; padding:44px 52px; padding-top:50px; padding-bottom:50px; }
.readcol p { font-size:19px !important; line-height:1.8 !important; opacity:0.85; margin-bottom:24px; font-weight:300; }
.readcol p:last-child { margin-bottom:0; }
.pull { max-width:760px; margin:0 auto; padding:70px 52px; text-align:center; }
.pull p { font-family:"Instrument Serif", serif; font-style:italic; font-weight:500; font-size:36px !important; line-height:1.4; color:var(--petrole); letter-spacing:-0.01em; }
.duo { display:grid; grid-template-columns:1fr 1fr; gap:0; max-width:1160px; margin:0 auto; border-radius:14px; overflow:hidden; }
.duo-col { padding:44px 40px; }
.duo-col.parent { background:var(--peche); }
.duo-col.ado { background:var(--sauge); }
.duo-col .who { font-size:11px; letter-spacing:0.1em; text-transform:uppercase; opacity:0.65; margin-bottom:14px; }
.duo-col p { font-size:14px; line-height:1.75; opacity:0.88; }
.figure-inline { max-width:760px; margin:60px auto; padding:0 52px; }
.figure-inline img { width:100%; border-radius:12px; display:block; }
.figure-inline .cap { font-size:11.5px; opacity:0.55; margin-top:10px; text-align:center; }
.quote-photo { display:grid; grid-template-columns:auto 1fr; gap:26px; align-items:center; max-width:640px; margin:0 auto; padding:56px 52px; }
.quote-photo img { width:140px; height:140px; border-radius:50%; object-fit:cover; }
.quote-photo p { font-family:"Instrument Serif", serif; font-style:italic; font-size:20px; line-height:1.55; color:var(--petrole); margin-bottom:10px; }
.quote-photo .who { font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--accent); }
.section-index { font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent); text-align:center; padding-top:56px; }
.note { max-width:660px; margin:0 auto; padding:70px 52px; text-align:center; }
.note p { font-family:"Instrument Serif", serif; font-style:italic; font-size:24px; line-height:1.55; color:var(--petrole); }
.note .who { font-size:11.5px; letter-spacing:0.05em; color:var(--accent); margin-top:18px; text-transform:uppercase; }
body.page-index .closing { background:var(--petrole); color:var(--ivoire); text-align:center; padding:80px 52px; }
body.page-lien .closing { background:var(--dark); color:var(--ivoire); text-align:center; padding:80px 52px; }
body.page-coaching .closing { background:var(--dark); color:var(--ivoire); text-align:center; padding:80px 52px; }
body.page-orientation .closing { background:var(--dark); color:var(--ivoire); text-align:center; padding:80px 52px; }
body.page-potentiels .closing { background:var(--dark); color:var(--ivoire); text-align:center; padding:80px 52px; }
body.page-apropos .closing { background:var(--dark); color:var(--ivoire); text-align:center; padding:80px 52px; }
body.page-contact .closing { background:var(--dark); color:var(--ivoire); text-align:center; padding:80px 52px; }
body.page-mentions .closing { background:var(--dark); color:var(--ivoire); text-align:center; padding:80px 52px; }
.closing h2 { color:var(--ivoire); font-style:italic; margin-bottom:24px; }
body.page-index .closing .btn-primary { background:var(--ambre); color:var(--dark); }
body.page-lien .closing .btn-primary { background:var(--ambre); color:var(--dark); font-weight:600; }
body.page-coaching .closing .btn-primary { background:var(--ambre); color:var(--dark); }
body.page-orientation .closing .btn-primary { background:var(--ambre); color:var(--dark); }
body.page-potentiels .closing .btn-primary { background:var(--ambre); color:var(--dark); }
body.page-apropos .closing .btn-primary { background:var(--ambre); color:var(--dark); }
body.page-contact .closing .btn-primary { background:var(--ambre); color:var(--dark); }
body.page-mentions .closing .btn-primary { background:var(--ambre); color:var(--dark); }
.ethics { max-width:760px; margin:0 auto; padding:0 52px 60px; text-align:center; }
.ethics p { font-size:11.5px; line-height:1.7; opacity:0.6; }
.photo-slot { border:1.5px dashed rgba(47,74,80,0.25); border-radius:10px; display:flex; align-items:center; justify-content:center; background:rgba(47,74,80,0.03); text-align:center; padding:24px; }
body.page-index .photo-slot span { font-size:11px; color:var(--ambre); line-height:1.7; }
body.page-lien .photo-slot span { font-size:11px; color:var(--petrole); opacity:0.5; line-height:1.7; }
body.page-coaching .photo-slot span { font-size:11px; color:var(--ambre); line-height:1.7; }
body.page-orientation .photo-slot span { font-size:11px; color:var(--ambre); line-height:1.7; }
body.page-potentiels .photo-slot span { font-size:11px; color:var(--ambre); line-height:1.7; }
body.page-apropos .photo-slot span { font-size:11px; color:var(--ambre); line-height:1.7; }
body.page-contact .photo-slot span { font-size:11px; color:var(--ambre); line-height:1.7; }
body.page-mentions .photo-slot span { font-size:11px; color:var(--ambre); line-height:1.7; }
footer { padding:36px 52px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; font-size:11px; opacity:0.6; border-top:1px solid rgba(47,74,80,0.1); }
.prism-mark path { animation:prismStroke 14s ease-in-out infinite; }
.prism-mark line { animation:prismStroke 14s ease-in-out infinite; animation-delay:-2s; }
.prism-mark circle:first-of-type { animation:prismFill 14s ease-in-out infinite; animation-delay:-4s; }
.prism-mark circle:last-of-type { animation:prismFill 14s ease-in-out infinite; animation-delay:-8s; }
.hero > div { animation:fadeInUp 0.9s ease both; }
.hero > div:nth-child(2) { animation-delay:0.15s; }
.btn-primary, .btn-link, .nav-cta { transition:transform 0.25s ease, box-shadow 0.25s ease, opacity 0.25s ease; }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 8px 20px rgba(47,74,80,0.18); }
.nav-cta:hover { transform:translateY(-1px); }
.btn-link:hover { opacity:0.65; }
.card, .step, .duo-col { transition:transform 0.35s ease, box-shadow 0.35s ease; }
.card:hover { transform:translateY(-4px); box-shadow:0 10px 24px rgba(47,74,80,0.1); }
.step:hover { transform:translateY(-3px); }
.navlinks a::after { content:""; position:absolute; left:0; bottom:-4px; width:0; height:1px; background:var(--turquoise); opacity:0.5; transition:width 0.25s ease; }
.navlinks a:hover::after, .navlinks a.active::after { width:100%; }
img { transition:transform 0.6s ease; }
.figure-inline img:hover, .duo-col img:hover { transform:scale(1.02); }
.marquee { overflow:hidden; white-space:nowrap; background:var(--turquoise); color:var(--ivoire); padding:9px 0; font-size:11px; letter-spacing:0.06em; text-transform:uppercase; position:relative; z-index:30; }
.marquee-inner { display:inline-block; animation:scroll-left 35s linear infinite; }
body.page-index .marquee-inner span { margin:0 36px; opacity:0.85; }
body.page-lien .marquee-inner span { margin:0 36px; opacity:1; }
body.page-coaching .marquee-inner span { margin:0 36px; opacity:1; }
body.page-orientation .marquee-inner span { margin:0 36px; opacity:1; }
body.page-potentiels .marquee-inner span { margin:0 36px; opacity:1; }
body.page-apropos .marquee-inner span { margin:0 36px; opacity:1; }
body.page-contact .marquee-inner span { margin:0 36px; opacity:1; }
body.page-mentions .marquee-inner span { margin:0 36px; opacity:1; }
body.page-index .marquee-inner span::before { content:"◇"; margin-right:36px; opacity:0.4; font-size:8px; color:var(--ambre) !important; }
body.page-lien .marquee-inner span::before { content:"◇"; margin-right:36px; opacity:0.7; color:var(--ambre) !important; font-size:8px; }
body.page-coaching .marquee-inner span::before { content:"◇"; margin-right:36px; opacity:0.7; color:var(--ambre) !important; font-size:8px; }
body.page-orientation .marquee-inner span::before { content:"◇"; margin-right:36px; opacity:0.7; color:var(--ambre) !important; font-size:8px; }
body.page-potentiels .marquee-inner span::before { content:"◇"; margin-right:36px; opacity:0.7; color:var(--ambre) !important; font-size:8px; }
body.page-apropos .marquee-inner span::before { content:"◇"; margin-right:36px; opacity:0.7; color:var(--ambre) !important; font-size:8px; }
body.page-contact .marquee-inner span::before { content:"◇"; margin-right:36px; opacity:0.7; color:var(--ambre) !important; font-size:8px; }
body.page-mentions .marquee-inner span::before { content:"◇"; margin-right:36px; opacity:0.7; color:var(--ambre) !important; font-size:8px; }
body.page-index .navlinks a[href="index.html"]::after, body.page-lien .navlinks a[href="le-code-du-lien.html"]::after, body.page-coaching .navlinks a[href="coaching-de-vie.html"]::after, body.page-potentiels .navlinks a[href="autres-potentiels.html"]::after, body.page-orientation .navlinks a[href="orientation-scolaire.html"]::after, body.page-apropos .navlinks a[href="a-propos.html"]::after, body.page-contact .navlinks a[href="contact.html"]::after { width:100% !important; }
body.page-index .navlinks a.active { color:var(--petrole); }
body.page-lien .navlinks a.active { color:var(--petrole); }
body.page-coaching .navlinks a.active { color:#D4876A; }
body.page-potentiels .navlinks a.active { color:#7A9E74; }
body.page-orientation .navlinks a.active { color:#6A9EA3; }
body.page-apropos .navlinks a.active { color:var(--ambre); }
body.page-apropos .navlinks a.active { color:var(--turquoise); font-weight:600; }
body.page-apropos .navlinks a.active { color:var(--ambre); }
body.page-apropos .navlinks a.active { color:var(--ambre); }
body.page-apropos .navlinks a.active { color:var(--ambre); }
body.page-apropos .navlinks a.active { color:var(--ambre); }
body.page-apropos .navlinks a.active { color:var(--ambre); }
body.page-apropos .navlinks a.active { color:var(--ambre); }
body.page-contact .navlinks a.active { color:var(--ambre); }
body.page-contact .navlinks a.active { color:var(--turquoise); font-weight:600; }
body.page-contact .navlinks a.active { color:var(--ambre); }
body.page-contact .navlinks a.active { color:var(--ambre); }
body.page-contact .navlinks a.active { color:var(--ambre); }
body.page-contact .navlinks a.active { color:var(--ambre); }
body.page-contact .navlinks a.active { color:var(--ambre); }
body.page-contact .navlinks a.active { color:var(--ambre); }
.navlinks a:hover { opacity:1; color:var(--turquoise); }
body.page-coaching .navlinks a:hover { color:#D4876A; }
body.page-potentiels .navlinks a:hover { color:#7A9E74; }
body.page-orientation .navlinks a:hover { color:#6A9EA3; }
.deco-prism { text-align:center; padding:30px 0; opacity:0.35; }
.deco-prism svg { width:120px; height:auto; }
.closing-cards { max-width:1160px; margin:0 auto; padding:50px 52px 20px; }
.closing-cards h2 { font-family:"Instrument Serif", serif; font-style:italic; font-size:24px; color:var(--petrole); margin-bottom:30px; text-align:center; }
.closing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.closing-card { background:#fffdf9; border:1px solid rgba(47,74,80,0.1); border-radius:10px; padding:26px 22px; text-align:center; transition:transform 0.35s ease, box-shadow 0.35s ease; }
.closing-card:hover { transform:translateY(-4px); box-shadow:0 10px 24px rgba(47,74,80,0.1); }
.closing-card .tag { font-size:10px; letter-spacing:0.08em; text-transform:uppercase; color:var(--accent); margin-bottom:10px; }
.closing-card h3 { font-family:"Instrument Serif", serif; font-style:italic; font-size:16px; color:var(--petrole); margin-bottom:8px; }
.closing-card p { font-size:12px; line-height:1.55; opacity:0.72; margin-bottom:14px; }
.closing-card a { font-size:11.5px; color:var(--petrole); text-decoration:underline; }
.hero-image { max-width:1160px; margin:0 auto; padding:0 52px; }
.hero-image .img-wrap { border-radius:14px; overflow:hidden; position:relative; background:linear-gradient(135deg, var(--brume) 0%, var(--sauge) 40%, var(--peche) 70%, var(--beurre) 100%); aspect-ratio:21/9; display:flex; align-items:center; justify-content:center; }
.hero-image .img-wrap .overlay-text { font-family:"Instrument Serif", serif; font-style:italic; font-size:13px; color:var(--petrole); opacity:0.5; text-align:center; padding:20px; }
h1, h2, h3 { letter-spacing:-0.01em; }
.card p, .step p { font-weight:300; }
.page-header, .readcol, .pull, .hero-image, .closing-cards { opacity:1; }
::selection { background:var(--rose); color:var(--petrole); }
body::before { content:""; position:fixed; inset:0; z-index:-1; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E"); pointer-events:none; }
.readcol a, .ethics a { text-decoration:none; background-image:linear-gradient(var(--turquoise), var(--turquoise)); background-size:0% 1px; background-position:left bottom; background-repeat:no-repeat; transition:background-size 0.3s ease; padding-bottom:1px; }
.readcol a:hover, .ethics a:hover { background-size:100% 1px; }
.card:hover, .closing-card:hover { border-color:var(--turquoise); }
html { scroll-behavior:smooth; }
.statement { max-width:1160px; margin:0 auto; padding:90px 52px; }
.statement p { font-family:"Instrument Serif", serif; font-style:italic; font-size:56px !important; line-height:1.2 !important; color:var(--petrole); font-weight:400; letter-spacing:-0.02em; }
.statement .accent { color:var(--accent); animation:mineralShift 10s ease-in-out infinite; }
body.page-index .accordion { max-width:760px; margin:0 auto; padding:0 52px; }
body.page-lien .accordion { max-width:760px; margin:0 auto; padding:40px 52px; background:var(--dark); color:var(--ivoire); border-radius:14px; }
body.page-coaching .accordion { max-width:760px; margin:0 auto; padding:40px 52px; background:var(--dark); color:var(--ivoire); border-radius:14px; }
body.page-orientation .accordion { max-width:760px; margin:0 auto; padding:40px 52px; background:var(--dark); color:var(--ivoire); border-radius:14px; }
body.page-potentiels .accordion { max-width:760px; margin:0 auto; padding:40px 52px; background:var(--dark); color:var(--ivoire); border-radius:14px; }
body.page-apropos .accordion { max-width:760px; margin:0 auto; padding:40px 52px; background:var(--dark); color:var(--ivoire); border-radius:14px; }
body.page-contact .accordion { max-width:760px; margin:0 auto; padding:40px 52px; background:var(--dark); color:var(--ivoire); border-radius:14px; }
body.page-mentions .accordion { max-width:760px; margin:0 auto; padding:40px 52px; background:var(--dark); color:var(--ivoire); border-radius:14px; }
body.page-index .accordion details { border-bottom:1px solid rgba(47,74,80,0.12); padding:0; }
body.page-lien .accordion details { border-bottom:1px solid rgba(47,74,80,0.12); padding:0; border-color:rgba(255,255,255,0.12) !important; }
body.page-coaching .accordion details { border-bottom:1px solid rgba(47,74,80,0.12); padding:0; border-color:rgba(255,255,255,0.12) !important; }
body.page-orientation .accordion details { border-bottom:1px solid rgba(47,74,80,0.12); padding:0; border-color:rgba(255,255,255,0.12) !important; }
body.page-potentiels .accordion details { border-bottom:1px solid rgba(47,74,80,0.12); padding:0; border-color:rgba(255,255,255,0.12) !important; }
body.page-apropos .accordion details { border-bottom:1px solid rgba(47,74,80,0.12); padding:0; border-color:rgba(255,255,255,0.12) !important; }
body.page-contact .accordion details { border-bottom:1px solid rgba(47,74,80,0.12); padding:0; border-color:rgba(255,255,255,0.12) !important; }
body.page-mentions .accordion details { border-bottom:1px solid rgba(47,74,80,0.12); padding:0; border-color:rgba(255,255,255,0.12) !important; }
.accordion details:first-child { border-top:1px solid rgba(47,74,80,0.12); }
body.page-index .accordion summary { font-family:"Instrument Serif", serif; font-style:italic; font-size:24px !important; color:var(--petrole); padding:22px 40px 22px 0; cursor:pointer; list-style:none; position:relative; transition:color 0.2s ease; }
body.page-lien .accordion summary { font-family:"Instrument Serif", serif; font-style:italic; font-size:24px !important; color:var(--ivoire); padding:24px 40px 24px 0; cursor:pointer; list-style:none; position:relative; transition:color 0.2s ease; }
body.page-coaching .accordion summary { font-family:"Instrument Serif", serif; font-style:italic; font-size:24px !important; color:var(--ivoire); padding:24px 40px 24px 0; cursor:pointer; list-style:none; position:relative; transition:color 0.2s ease; }
body.page-orientation .accordion summary { font-family:"Instrument Serif", serif; font-style:italic; font-size:24px !important; color:var(--ivoire); padding:24px 40px 24px 0; cursor:pointer; list-style:none; position:relative; transition:color 0.2s ease; }
body.page-potentiels .accordion summary { font-family:"Instrument Serif", serif; font-style:italic; font-size:24px !important; color:var(--ivoire); padding:24px 40px 24px 0; cursor:pointer; list-style:none; position:relative; transition:color 0.2s ease; }
body.page-apropos .accordion summary { font-family:"Instrument Serif", serif; font-style:italic; font-size:24px !important; color:var(--ivoire); padding:24px 40px 24px 0; cursor:pointer; list-style:none; position:relative; transition:color 0.2s ease; }
body.page-contact .accordion summary { font-family:"Instrument Serif", serif; font-style:italic; font-size:24px !important; color:var(--ivoire); padding:24px 40px 24px 0; cursor:pointer; list-style:none; position:relative; transition:color 0.2s ease; }
body.page-mentions .accordion summary { font-family:"Instrument Serif", serif; font-style:italic; font-size:24px !important; color:var(--ivoire); padding:24px 40px 24px 0; cursor:pointer; list-style:none; position:relative; transition:color 0.2s ease; }
body.page-index .accordion summary:hover { color:var(--ambre); }
body.page-lien .accordion summary:hover { color:var(--turquoise); opacity:1; }
body.page-coaching .accordion summary:hover { color:var(--ambre); }
body.page-orientation .accordion summary:hover { color:var(--ambre); }
body.page-potentiels .accordion summary:hover { color:var(--ambre); }
body.page-apropos .accordion summary:hover { color:var(--ambre); }
body.page-contact .accordion summary:hover { color:var(--ambre); }
body.page-mentions .accordion summary:hover { color:var(--ambre); }
.accordion summary::-webkit-details-marker { display:none; }
.accordion summary::after { content:"+"; position:absolute; right:0; top:50%; transform:translateY(-50%); font-family:"Instrument Serif", serif; font-size:24px; color:var(--turquoise); transition:transform 0.3s ease; }
.accordion details[open] summary::after { content:"−"; }
body.page-index .accordion .accord-body { padding:0 0 24px; font-size:15px; line-height:1.8; opacity:0.82; animation:accordFade 0.3s ease; }
body.page-lien .accordion .accord-body { padding:0 0 24px; font-size:15px; line-height:1.8; opacity:0.82; animation:accordFade 0.3s ease; color:var(--ivoire); }
body.page-coaching .accordion .accord-body { padding:0 0 24px; font-size:15px; line-height:1.8; opacity:0.82; animation:accordFade 0.3s ease; color:var(--ivoire); }
body.page-orientation .accordion .accord-body { padding:0 0 24px; font-size:15px; line-height:1.8; opacity:0.82; animation:accordFade 0.3s ease; color:var(--ivoire); }
body.page-potentiels .accordion .accord-body { padding:0 0 24px; font-size:15px; line-height:1.8; opacity:0.82; animation:accordFade 0.3s ease; color:var(--ivoire); }
body.page-apropos .accordion .accord-body { padding:0 0 24px; font-size:15px; line-height:1.8; opacity:0.82; animation:accordFade 0.3s ease; color:var(--ivoire); }
body.page-contact .accordion .accord-body { padding:0 0 24px; font-size:15px; line-height:1.8; opacity:0.82; animation:accordFade 0.3s ease; color:var(--ivoire); }
body.page-mentions .accordion .accord-body { padding:0 0 24px; font-size:15px; line-height:1.8; opacity:0.82; animation:accordFade 0.3s ease; color:var(--ivoire); }
.img-accordion { display:flex; gap:8px; max-width:1160px; margin:0 auto; padding:40px 52px 60px; height:480px; }
.img-accordion .panel { position:relative; flex:0.6; border-radius:14px; overflow:hidden; cursor:pointer; transition:flex 0.7s cubic-bezier(0.4, 0, 0.2, 1); }
.img-accordion .panel:hover, .img-accordion .panel.active { flex:4; }
.img-accordion .panel img { width:100%; height:100%; object-fit:cover; position:absolute; inset:0; }
.img-accordion .panel .overlay { position:absolute; inset:0; background:linear-gradient(to top, rgba(47,74,80,0.62) 0%, rgba(47,74,80,0.04) 42%, transparent 100%); transition:background 0.5s ease; }
.img-accordion .panel:hover .overlay { background:linear-gradient(to top, rgba(47,74,80,0.5) 0%, rgba(47,74,80,0.02) 55%, transparent 100%); }
.img-accordion .panel .panel-title { position:absolute; color:#F8F3EA; font-family:"Instrument Serif", serif; font-style:italic; transition:all 0.5s ease; white-space:nowrap; }
.img-accordion .panel .panel-title.vertical { bottom:100px; left:50%; font-size:16px; transform:translateX(-50%) rotate(-90deg); transform-origin:center center; }
.img-accordion .panel:hover .panel-title.vertical, .img-accordion .panel.active .panel-title.vertical { opacity:0; pointer-events:none; }
.img-accordion .panel .panel-info { position:absolute; bottom:0; left:0; right:0; padding:28px 24px; color:#F8F3EA; opacity:0; transform:translateY(10px); transition:all 0.5s ease 0.15s; }
.img-accordion .panel:hover .panel-info, .img-accordion .panel.active .panel-info { opacity:1; transform:translateY(0); }
.img-accordion .panel .panel-info .panel-tag { font-family:"Plus Jakarta Sans", sans-serif; font-size:10px; letter-spacing:0.12em; text-transform:uppercase; color:var(--ambre); margin-bottom:8px; }
.img-accordion .panel .panel-info h3 { font-family:"Instrument Serif", serif; font-style:italic; font-size:26px; color:#F8F3EA; font-weight:400; margin-bottom:6px; }
.img-accordion .panel .panel-info p { font-family:"Plus Jakarta Sans", sans-serif; font-size:13px; line-height:1.6; opacity:0.85; margin-bottom:14px; }
.img-accordion .panel .panel-info a { font-family:"Plus Jakarta Sans", sans-serif; font-size:12px; color:var(--ambre); text-decoration:underline; }
body.page-index .panel-info .panel-tag { color:var(--ambre) !important; }
body.page-lien .panel-info .panel-tag { color:var(--accent) !important; }
body.page-coaching .panel-info .panel-tag { color:var(--ambre) !important; }
body.page-orientation .panel-info .panel-tag { color:var(--ambre) !important; }
body.page-potentiels .panel-info .panel-tag { color:var(--ambre) !important; }
body.page-apropos .panel-info .panel-tag { color:var(--ambre) !important; }
body.page-contact .panel-info .panel-tag { color:var(--ambre) !important; }
body.page-mentions .panel-info .panel-tag { color:var(--ambre) !important; }
.hero-prism { width:100px; height:auto; color:var(--ambre); margin-bottom:28px; filter:drop-shadow(0 0 18px rgba(196,136,42,0.15)); }
body.page-index .section-divider { max-width:60px; height:1px; background:linear-gradient(to right, transparent, #C4882A, transparent); margin:0 auto; opacity:0.4; }
body.page-lien .section-divider { max-width:60px; height:1px; background:linear-gradient(to right, transparent, var(--sauge), transparent); margin:0 auto; opacity:0.5; }
body.page-coaching .section-divider { max-width:60px; height:1px; background:linear-gradient(to right, transparent, #C4882A, transparent); margin:0 auto; opacity:0.4; }
body.page-orientation .section-divider { max-width:60px; height:1px; background:linear-gradient(to right, transparent, #C4882A, transparent); margin:0 auto; opacity:0.4; }
body.page-potentiels .section-divider { max-width:60px; height:1px; background:linear-gradient(to right, transparent, #C4882A, transparent); margin:0 auto; opacity:0.4; }
body.page-apropos .section-divider { max-width:60px; height:1px; background:linear-gradient(to right, transparent, #C4882A, transparent); margin:0 auto; opacity:0.4; }
body.page-contact .section-divider { max-width:60px; height:1px; background:linear-gradient(to right, transparent, #C4882A, transparent); margin:0 auto; opacity:0.4; }
body.page-mentions .section-divider { max-width:60px; height:1px; background:linear-gradient(to right, transparent, #C4882A, transparent); margin:0 auto; opacity:0.4; }
.mineral-strip { overflow:hidden; white-space:nowrap; padding:18px 0; font-family:"Instrument Serif", serif; font-style:italic; font-size:16px; letter-spacing:0.02em; border-top:1px solid rgba(47,74,80,0.06); border-bottom:1px solid rgba(47,74,80,0.06); }
.mineral-strip-inner { display:inline-block; animation:mineralScroll 30s linear infinite; }
.mineral-strip-inner span { margin:0 32px; display:inline; }
.mineral-strip-inner span::before { content:"·"; margin-right:32px; opacity:0.3; color:var(--petrole); }
.card:nth-child(1):hover, .closing-card:nth-child(1):hover { border-color:var(--turquoise); }
.card:nth-child(2):hover, .closing-card:nth-child(2):hover { border-color:var(--lavande); }
.card:nth-child(3):hover, .closing-card:nth-child(3):hover { border-color:var(--ambre); }
.card:nth-child(4):hover { border-color:var(--rose); }
.step:nth-child(1) .num { color:var(--turquoise) !important; }
.step:nth-child(2) .num { color:var(--ambre) !important; }
.step:nth-child(3) .num { color:var(--rose) !important; }
.step:nth-child(4) .num { color:var(--lavande) !important; }
.step:nth-child(5) .num { color:var(--sauge) !important; }
.step:nth-child(6) .num { color:var(--orange) !important; }
.accordion details:nth-child(1) summary::after { color:var(--turquoise) !important; }
.accordion details:nth-child(2) summary::after { color:var(--ambre) !important; }
.accordion details:nth-child(3) summary::after { color:var(--lavande) !important; }
.accordion details:nth-child(4) summary::after { color:var(--rose) !important; }
.accordion details:nth-child(5) summary::after { color:var(--sauge) !important; }
.accordion details:nth-child(6) summary::after { color:var(--orange) !important; }
.accordion details:nth-child(7) summary::after { color:var(--turquoise) !important; }
.accordion details:nth-child(8) summary::after { color:var(--accent) !important; }
.section:nth-of-type(odd) .eyebrow::before { background:var(--turquoise); }
.section:nth-of-type(even) .eyebrow::before { background:var(--ambre); }
.launch-status { display:inline-flex; align-items:center; gap:10px; padding:10px 20px; border:1px solid rgba(242,172,57,0.7); border-radius:999px; background:rgba(242,172,57,0.18); color:var(--petrole); backdrop-filter:blur(8px); margin-bottom:28px; animation:launchAlert 1.35s ease-in-out infinite; }
.launch-status__dot { width:9px; height:9px; flex:0 0 9px; border-radius:50%; background:var(--ambre); box-shadow:0 0 0 0 rgba(242,172,57,0.6); animation:launchPulse 1.6s ease-out infinite; }
.launch-status__text { display:flex; align-items:baseline; gap:8px; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; font-family:"Plus Jakarta Sans",sans-serif; }
.launch-status__text strong { font-weight:700; }
.launch-status__text .sep { opacity:0.3; }
.launch-status__text span { opacity:1; font-weight:700; color:var(--petrole); }
body.page-index .nav-badge { font-size:9px; background:var(--ambre); color:var(--dark); padding:2px 7px; border-radius:8px; margin-left:4px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; vertical-align:middle; }
body.page-lien .nav-badge { font-size:11px !important; background:var(--ambre); color:var(--dark); padding:2px 7px; border-radius:8px; margin-left:4px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; vertical-align:middle; }
body.page-coaching .nav-badge { font-size:11px !important; background:var(--ambre); color:var(--dark); padding:2px 7px; border-radius:8px; margin-left:4px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; vertical-align:middle; }
body.page-orientation .nav-badge { font-size:11px !important; background:var(--ambre); color:var(--dark); padding:2px 7px; border-radius:8px; margin-left:4px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; vertical-align:middle; }
body.page-potentiels .nav-badge { font-size:11px !important; background:var(--ambre); color:var(--dark); padding:2px 7px; border-radius:8px; margin-left:4px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; vertical-align:middle; }
body.page-apropos .nav-badge { font-size:11px !important; background:var(--ambre); color:var(--dark); padding:2px 7px; border-radius:8px; margin-left:4px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; vertical-align:middle; }
body.page-contact .nav-badge { font-size:11px !important; background:var(--ambre); color:var(--dark); padding:2px 7px; border-radius:8px; margin-left:4px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; vertical-align:middle; }
body.page-mentions .nav-badge { font-size:11px !important; background:var(--ambre); color:var(--dark); padding:2px 7px; border-radius:8px; margin-left:4px; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; vertical-align:middle; }
.menu-toggle { display:none; background:none; border:none; cursor:pointer; padding:8px; z-index:110; }
.menu-toggle span { display:block; width:22px; height:2px; background:var(--petrole); margin:5px 0; transition:all 0.3s ease; border-radius:1px; }
.menu-toggle.active span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.menu-toggle.active span:nth-child(2) { opacity:0; }
.menu-toggle.active span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }
h3 { font-size:30px !important; }
body.page-index .top-bar { font-size:16px !important; padding:10px 20px !important; }
body.page-lien .top-bar { background:var(--turquoise); color:var(--ivoire); text-align:center; padding:10px 20px !important; font-size:16px !important; font-weight:600; letter-spacing:0.04em; }
body.page-coaching .top-bar { background:var(--turquoise); color:var(--ivoire); text-align:center; padding:10px 20px !important; font-size:16px !important; font-weight:600; letter-spacing:0.04em; }
body.page-orientation .top-bar { background:var(--turquoise); color:var(--ivoire); text-align:center; padding:10px 20px !important; font-size:16px !important; font-weight:600; letter-spacing:0.04em; }
body.page-potentiels .top-bar { background:var(--turquoise); color:var(--ivoire); text-align:center; padding:10px 20px !important; font-size:16px !important; font-weight:600; letter-spacing:0.04em; }
body.page-apropos .top-bar { background:var(--turquoise); color:var(--ivoire); text-align:center; padding:10px 20px !important; font-size:16px !important; font-weight:600; letter-spacing:0.04em; }
body.page-contact .top-bar { background:var(--turquoise); color:var(--ivoire); text-align:center; padding:10px 20px !important; font-size:16px !important; font-weight:600; letter-spacing:0.04em; }
body.page-mentions .top-bar { background:var(--turquoise); color:var(--ivoire); text-align:center; padding:10px 20px !important; font-size:16px !important; font-weight:600; letter-spacing:0.04em; }
body.page-index .accordion .accord-body p { font-size:18px !important; }
body.page-lien .accordion .accord-body p { color:var(--ivoire); opacity:0.85; font-size:18px !important; }
body.page-coaching .accordion .accord-body p { color:var(--ivoire); opacity:0.85; font-size:18px !important; }
body.page-orientation .accordion .accord-body p { color:var(--ivoire); opacity:0.85; font-size:18px !important; }
body.page-potentiels .accordion .accord-body p { color:var(--ivoire); opacity:0.85; font-size:18px !important; }
body.page-apropos .accordion .accord-body p { color:var(--ivoire); opacity:0.85; font-size:18px !important; }
body.page-contact .accordion .accord-body p { color:var(--ivoire); opacity:0.85; font-size:18px !important; }
body.page-mentions .accordion .accord-body p { color:var(--ivoire); opacity:0.85; font-size:18px !important; }
body.page-index .step-front .num { font-size:28px !important; }
body.page-lien .step-front .num { font-family:"Instrument Serif", serif !important; font-style:italic; font-size:28px !important; letter-spacing:0 !important; text-transform:none !important; margin:0 !important; opacity:1 !important; }
body.page-coaching .step-front .num { font-family:"Instrument Serif", serif !important; font-style:italic; font-size:28px !important; letter-spacing:0 !important; text-transform:none !important; margin:0 !important; opacity:1 !important; }
body.page-orientation .step-front .num { font-family:"Instrument Serif", serif !important; font-style:italic; font-size:28px !important; letter-spacing:0 !important; text-transform:none !important; margin:0 !important; opacity:1 !important; }
body.page-potentiels .step-front .num { font-family:"Instrument Serif", serif !important; font-style:italic; font-size:28px !important; letter-spacing:0 !important; text-transform:none !important; margin:0 !important; opacity:1 !important; }
body.page-apropos .step-front .num { font-family:"Instrument Serif", serif !important; font-style:italic; font-size:28px !important; letter-spacing:0 !important; text-transform:none !important; margin:0 !important; opacity:1 !important; }
body.page-contact .step-front .num { font-family:"Instrument Serif", serif !important; font-style:italic; font-size:28px !important; letter-spacing:0 !important; text-transform:none !important; margin:0 !important; opacity:1 !important; }
body.page-mentions .step-front .num { font-family:"Instrument Serif", serif !important; font-style:italic; font-size:28px !important; letter-spacing:0 !important; text-transform:none !important; margin:0 !important; opacity:1 !important; }
.band.sauge h2, .band.brume h2, .band.peche h2, .band.beurre h2, .band.sauge p, .band.brume p, .band.peche p, .band.beurre p { color:var(--ivoire); }
.band.sauge .eyebrow, .band.beurre .eyebrow { color:var(--ambre); opacity:1; }
.band.sauge .eyebrow::before, .band.beurre .eyebrow::before { background:var(--ambre); }
.checklist { max-width:640px; margin:28px auto 0; padding:0 52px; }
.checklist ul { list-style:none; }
.checklist li { position:relative; padding-left:28px; margin-bottom:14px; font-size:14px; line-height:1.65; opacity:0.85; }
body.page-lien .checklist li::before { content:""; position:absolute; left:0; top:9px; width:8px; height:1.5px; background:var(--petrole); opacity:0.3; }
body.page-orientation .checklist li::before { content:""; position:absolute; left:0; top:9px; width:8px; height:1.5px; background:var(--laiton); }
.litany { max-width:520px; margin:0 auto; padding:70px 52px; text-align:center; }
.litany p { font-family:"Instrument Serif", serif; font-style:italic; font-size:19px; line-height:2.3; color:var(--petrole); opacity:0.9; }
body.page-lien .litany .accent { color:var(--petrole); opacity:1; }
body.page-orientation .litany .accent { color:var(--ambre); opacity:1; }
.intent-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; max-width:640px; margin:32px auto 0; padding:0 52px; }
.intent-grid div { font-family:"Instrument Serif", serif; font-style:italic; font-size:15px; color:var(--petrole); opacity:0.85; padding:16px 0; border-top:1px solid rgba(47,74,80,0.12); }
.read-more { border:none; margin-top:-8px; }
.read-more summary { font-family:"Plus Jakarta Sans", sans-serif; font-size:13px; font-weight:500; color:var(--turquoise); cursor:pointer; list-style:none; padding:6px 0 16px; display:inline-flex; align-items:center; gap:6px; transition:opacity 0.2s; }
.read-more summary:hover { opacity:0.75; }
.read-more summary::-webkit-details-marker { display:none; }
.read-more summary::after { content:"↓"; font-size:11px; transition:transform 0.3s ease; }
.read-more[open] summary::after { transform:rotate(180deg); }
.read-more .expand-body { animation:accordFade 0.4s ease; }
.read-more .expand-body p { margin-bottom:20px; }
.top-bar a { color:var(--ivoire); text-decoration:underline; text-underline-offset:3px; margin-left:8px; font-size:16px !important; }
.accordion summary::before { content:""; width:8px; height:8px; border-radius:50%; display:inline-block; margin-right:14px; flex-shrink:0; }
.accordion details:nth-child(1) summary::before { background:var(--turquoise); }
.accordion details:nth-child(2) summary::before { background:var(--ambre); }
.accordion details:nth-child(3) summary::before { background:var(--lavande); }
.accordion details:nth-child(4) summary::before { background:var(--rose); }
.accordion details:nth-child(5) summary::before { background:var(--sauge); }
.accordion details:nth-child(6) summary::before { background:var(--orange); }
.accordion details:nth-child(7) summary::before { background:var(--turquoise); }
.accordion details:nth-child(8) summary::before { background:var(--ambre); }
.underline-accent { text-decoration:underline; text-decoration-color:var(--ambre); text-underline-offset:4px; text-decoration-thickness:2px; }
.newsletter-section { background:var(--turquoise); color:var(--ivoire); padding:56px 52px; border-radius:14px; text-align:center; max-width:760px; margin:40px auto; }
.newsletter-section h3 { color:var(--ivoire) !important; font-style:italic; margin-bottom:12px; }
.newsletter-section p { color:var(--ivoire); opacity:0.8; font-size:14px; margin-bottom:20px; }
.newsletter-section input[type="email"] { padding:12px 18px; border:none; border-radius:8px; font-size:14px; width:260px; max-width:100%; margin-right:8px; color:var(--petrole); font-family:"Plus Jakarta Sans",sans-serif; }
.newsletter-section button { background:var(--ambre); color:var(--dark); border:none; padding:12px 24px; border-radius:8px; font-weight:700; font-size:14px; cursor:pointer; font-family:"Plus Jakarta Sans",sans-serif; }
.flashcard-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:32px 0; max-width:760px; margin-left:auto; margin-right:auto; padding:0 52px; }
.flashcard { background:var(--dark); color:var(--ivoire); padding:24px 20px; border-radius:12px; text-align:center; font-family:"Instrument Serif",serif; font-style:italic; font-size:20px; }
body.page-mentions .readcol { text-align:center; }
body.page-mentions h3 { font-weight:700 !important; margin-top:32px; }
.step-inner { position:relative; width:100%; height:100%; min-height:230px; transition:transform 0.6s ease; transform-style:preserve-3d; }
.step:hover .step-inner { transform:rotateY(180deg); }
.step-front, .step-back { position:absolute; top:0; left:0; right:0; bottom:0; backface-visibility:hidden; -webkit-backface-visibility:hidden; border-radius:12px; display:flex; align-items:center; justify-content:center; padding:24px 20px; }
.step-front { background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.12); flex-direction:column; text-align:center; }
.step-back { background:var(--ambre); color:var(--dark); transform:rotateY(180deg); text-align:center; }
.step-back p { font-size:15px !important; line-height:1.6 !important; color:var(--dark) !important; opacity:1 !important; margin:0; }
.step-front h3, .step-front p { display:none; }
body.page-mentions h2 { font-weight:700 !important; text-decoration:underline; text-underline-offset:6px; text-decoration-thickness:2px; text-decoration-color:var(--ambre); }
body.page-mentions h3, body.page-mentions strong { font-weight:700 !important; text-decoration:underline; text-underline-offset:4px; text-decoration-color:var(--accent); }

/* --- Requêtes média (fusionnées) --- */
@media (max-width:860px) {
  .hero { grid-template-columns:1fr; padding:56px 26px; }
  .card-grid, .step-grid { grid-template-columns:1fr; }
  .navlinks { display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:var(--ivoire); flex-direction:column; justify-content:center; align-items:center; gap:28px; z-index:100; font-size:18px; }
  .section, .page-header, .band { padding-left:26px; padding-right:26px; }
  .closing-grid { grid-template-columns:1fr; }
  .marquee { font-size:10px; }
  .statement p { font-size:32px !important; }
  .statement { padding:60px 26px; }
  .pull p { font-size:26px !important; }
  .page-header h1 { font-size:32px; }
  body.page-index .accordion { padding:0 26px; }
  body.page-lien .accordion { padding:28px 26px; }
  body.page-coaching .accordion { padding:28px 26px; }
  body.page-orientation .accordion { padding:28px 26px; }
  body.page-potentiels .accordion { padding:28px 26px; }
  body.page-apropos .accordion { padding:28px 26px; }
  body.page-contact .accordion { padding:28px 26px; }
  body.page-mentions .accordion { padding:28px 26px; }
  .accordion summary { font-size:20px !important; }
  .img-accordion { flex-direction:column; height:auto; padding:20px 26px 40px; }
  .img-accordion .panel { flex:none !important; height:100px; transition:height 0.5s ease; }
  .img-accordion .panel:hover, .img-accordion .panel.active { height:320px; }
  .img-accordion .panel .panel-title.vertical { transform:translateX(-50%) rotate(0deg); bottom:40px; }
  .page-header { padding-top:60px; padding-bottom:44px; }
  .pull { padding:50px 26px; }
  .band { padding:60px 26px; }
  .menu-toggle { display:block; }
  .navlinks.open { display:flex; }
  .navlinks a { opacity:1; font-size:18px; }
  .nav-cta { position:relative; z-index:110; }
  .readcol p { font-size:18px !important; }
  .step-front .num { font-size:22px !important; }
  .checklist, .litany { padding-left:26px; padding-right:26px; }
  .intent-grid { grid-template-columns:1fr; padding-left:26px; padding-right:26px; }
  .flashcard-grid { grid-template-columns:1fr; padding:0 26px; }
  .newsletter-section { margin:24px 16px; padding:40px 26px; }
  .newsletter-section input[type="email"] { width:100%; margin-bottom:10px; margin-right:0; }
  h3 { font-size:24px !important; }
  .step { min-height:160px; }
  .step-inner { min-height:160px; }
  .band-inner[style*="grid-template-columns"] { display:block !important; }
  .band-inner[style*="grid-template-columns"] > div:first-child { margin-bottom:20px; }
}
@media (prefers-reduced-motion: reduce) {
  .logo svg { animation:none; color:var(--ambre); }
  .statement .accent { animation:none; color:var(--accent); }
  .mineral-strip-inner { animation:none; }
  .marquee-inner { animation:none; }
  * { transition-duration:0s !important; animation-duration:0s !important; }
}
@media (prefers-reduced-motion:reduce) {
  .launch-status__dot { animation:none; box-shadow:none; }
}

/* --- Echelle typographique unique (tokens). !important cible uniquement
       les niveaux a unifier, pour primer sur les selecteurs de composants
       (comme le faisait le bloc d'origine), sans se disperser. --- */
h1,.page-title{ font-size:var(--font-page-title-desktop) !important; line-height:var(--line-height-title); }
h2,.section-title{ font-size:var(--font-section-title-desktop) !important; line-height:var(--line-height-title); }
.band h2,.closing h2,.subsection-title{ font-size:var(--font-subsection-title-desktop) !important; line-height:var(--line-height-title); }
body,.body-text{ font-size:var(--font-body-desktop) !important; }
.small-text,.ethics p,.legal-fine{ font-size:var(--font-small) !important; }
@media (max-width:860px){
  h1,.page-title{ font-size:var(--font-page-title-mobile) !important; }
  h2,.section-title{ font-size:var(--font-section-title-mobile) !important; }
  .band h2,.closing h2,.subsection-title{ font-size:var(--font-subsection-title-mobile) !important; }
  body,.body-text{ font-size:var(--font-body-mobile) !important; }
  .small-text,.ethics p,.legal-fine{ font-size:var(--font-small) !important; }
}

/* --- Accessibilité & structure --- */
.skip-link{ position:absolute; left:-9999px; top:0; z-index:2000; background:var(--petrole,#2F4A50);
  color:var(--ivoire,#FAFAF6); padding:12px 20px; border-radius:0 0 10px 0;
  font-family:'Plus Jakarta Sans',sans-serif; font-size:15px; text-decoration:none; }
.skip-link:focus{ left:0; }
main:focus{ outline:none; }
header, main, footer{ display:block; }
html, body{ overflow-x:hidden; }

/* Flashcards accessibles (le flip ne dépend plus du survol) */
.step:hover .step-inner{ transform:none; }
.step.is-flipped .step-inner{ transform:rotateY(180deg); }
.step[role="button"]{ cursor:pointer; }
.step[role="button"]:focus-visible{ outline:3px solid var(--ambre,#F2AC39); outline-offset:3px; border-radius:12px; }
@media (prefers-reduced-motion: reduce){
  .step-inner{ transition:none !important; }
  *{ scroll-behavior:auto !important; }
}

/* ============================================================
   PHASE 2B, Composants cartes : flashcard (A) + extensible (B)
   ============================================================ */
/* Composant A : bouton réel */
.step > button.step-inner{ -webkit-appearance:none; appearance:none; background:transparent;
  border:0; margin:0; padding:0; font:inherit; color:inherit; text-align:inherit;
  width:100%; display:block; cursor:pointer; }
.step > button.step-inner:focus-visible{ outline:3px solid var(--ambre); outline-offset:4px; border-radius:14px; }
.step-back span{ font-size:15px; line-height:1.6; color:var(--dark); opacity:1; margin:0; display:block; }

/* Desktop (>768px) : flip 3D, face arrière EN FLUX = hauteur auto, jamais tronqué */
@media (min-width:769px){
  .step, .step > button.step-inner{ height:auto; }
  .step-back{ position:relative; }
  .step-front{ position:absolute; inset:0; }
}
/* Mobile (<=768px) : pas de 3D, ouverture verticale sous le libellé, hauteur auto */
@media (max-width:768px){
  .step{ perspective:none; min-height:0; cursor:default; }
  .step > button.step-inner{ transform:none !important; transform-style:flat; min-height:0; height:auto; }
  .step-front, .step-back{ position:relative; inset:auto; transform:none;
    -webkit-backface-visibility:visible; backface-visibility:visible; border-radius:12px; }
  .step-back{ display:none; margin-top:8px; }
  .step.is-flipped .step-back{ display:block; }
}
/* Orientation : cartes simples cohérentes (choix : sans retournement, sans texte ajouté) */
body.page-orientation .step{ perspective:none; cursor:default; min-height:0;
  background:rgba(47,74,80,0.06) !important; border:1px solid rgba(47,74,80,0.12) !important;
  border-radius:14px; padding:22px 24px !important; display:flex; align-items:center; }
body.page-orientation .step p{ color:var(--petrole); opacity:1; font-size:16px; }

/* Composant B : carte extensible */
.expand-card{ border:1px solid rgba(47,74,80,0.14); border-radius:16px; overflow:hidden; background:var(--ivoire); }
.expand-card__toggle{ -webkit-appearance:none; appearance:none; width:100%; text-align:left; cursor:pointer;
  background:transparent; border:0; padding:20px 24px; font:inherit; color:inherit;
  display:flex; align-items:center; justify-content:space-between; gap:16px; }
.expand-card__toggle:focus-visible{ outline:3px solid var(--ambre); outline-offset:-3px; }
.expand-card__toggle::after{ content:"+"; font-size:26px; line-height:1; color:var(--turquoise); transition:transform .2s ease; }
.expand-card__toggle[aria-expanded="true"]::after{ transform:rotate(45deg); }
.expand-card__content{ padding:0 24px 22px; }
.expand-card__content[hidden]{ display:none; }

@media (prefers-reduced-motion: reduce){
  .step > button.step-inner{ transition:none !important; }
  .expand-card__toggle::after{ transition:none !important; }
}

/* ============================================================
   PHASE 2C, Zone haute utilitaire (Contact · Newsletter · Ouverture)
   ============================================================ */
.utility-zone{ padding:14px clamp(16px,4vw,48px); border-bottom:1px solid rgba(47,74,80,0.08); background:var(--ivoire); }
.utility-inner{ max-width:1200px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; align-items:start; }
.ucard{ display:flex; align-items:center; justify-content:center; text-align:center; gap:8px;
  min-height:56px; padding:14px 18px; border-radius:14px; text-decoration:none;
  border:1px solid rgba(47,74,80,0.12); background:#fff; color:var(--petrole);
  font-family:"Plus Jakarta Sans",sans-serif; font-weight:600; font-size:15px; transition:transform .15s ease, box-shadow .15s ease; }
.ucard:hover{ transform:translateY(-2px); box-shadow:0 6px 18px rgba(47,74,80,0.10); }
.ucard:focus-visible{ outline:3px solid var(--ambre); outline-offset:3px; }
.ucard--contact{ background:var(--turquoise); color:#fff; border-color:transparent; }
.ucard--code{ background:var(--ambre); color:var(--dark); border-color:transparent; }
.ucard__title{ display:block; }
/* newsletter = carte extensible compacte */
.utility-zone .ucard--news{ padding:0; overflow:visible; background:#fff; }
.utility-zone .expand-card__toggle{ min-height:56px; padding:0 18px; justify-content:center; font-weight:600; color:var(--petrole); }
.utility-zone .expand-card__content{ padding:14px 18px 16px; text-align:center; }
.utility-zone .ucard__desc{ font-size:14px; line-height:1.5; margin:0 0 12px; color:var(--petrole); opacity:.85; }
.utility-zone form[name="newsletter-nathlab"]{ display:inline-flex; flex-wrap:wrap; justify-content:center; gap:8px; }

/* Mobile : cartes défilables horizontalement (seul le groupe défile) */
@media (max-width:768px){
  .utility-inner{ grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:82%;
    overflow-x:auto; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory; padding-bottom:4px; }
  .utility-inner > *{ scroll-snap-align:start; }
  .utility-zone .expand-card__content{ text-align:left; }
}

/* PHASE 2D, labels masqués accessibles + marqueur consentement */
.sr-only{ position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.consent-todo{ display:inline; font-size:13px; line-height:1.6; color:var(--petrole); }

/* PHASE 2D, contrastes : texte foncé lisible sur fonds clairs colorés (>=4.5:1) */
.ucard--contact{ color:var(--petrole); }
.ucard--contact .ucard__title{ color:var(--petrole); }
.top-bar a{ color:var(--petrole); }
[style*="background:var(--turquoise)"], [style*="background:var(--rose)"]{ color:var(--petrole); }
.mineral-strip-inner span{ filter:brightness(0.88); }

/* Badges de certifications (À propos) */
.cert-badges{ list-style:none; display:flex; flex-wrap:wrap; gap:10px; justify-content:center; padding:0; margin:18px auto 8px; max-width:760px; }
.cert-badges li{ font-family:"Plus Jakarta Sans",sans-serif; font-size:13px; font-weight:600; color:var(--petrole); background:var(--ivoire); border:1px solid rgba(47,74,80,0.16); border-radius:999px; padding:8px 16px; }

/* PHASE finale, images du site */
:root{ --radius-image:24px; }
.site-photo{ display:block; width:100%; max-width:100%; height:auto; object-fit:cover; border-radius:var(--radius-image,24px); }
.site-photo-frame{ overflow:hidden; border-radius:var(--radius-image,24px); }
.page-visual{ padding:clamp(20px,4vw,44px); display:flex; justify-content:center; }
.panel picture{ position:absolute; inset:0; display:block; }

/* Logo Le Code du Lien (sous le kaléidoscope) */
.cdl-logo{ display:inline-flex; align-items:center; gap:10px; text-decoration:none; margin-top:22px; padding:10px 18px; border:1px solid rgba(47,74,80,0.16); border-radius:999px; color:var(--petrole); transition:transform .15s ease, box-shadow .15s ease; }
.cdl-logo:hover{ transform:translateY(-2px); box-shadow:0 6px 18px rgba(47,74,80,0.10); }
.cdl-logo:focus-visible{ outline:3px solid var(--ambre); outline-offset:3px; }
.cdl-logo .prism-mark{ width:46px; height:auto; color:var(--ambre); }
.cdl-logo-text{ font-family:"Instrument Serif", serif; font-size:21px; color:var(--petrole); }

/* Pastille photo (accueil) */
.quote-photo .pastille{ text-align:center; }
.pastille-name{ font-family:"Instrument Serif", serif; font-size:17px; color:var(--petrole); margin-top:10px; white-space:nowrap; }

/* Flashcards avec image au recto (Code du Lien + futures cartes) */
.step--img{ min-height:300px !important; }
.step-front--img{ padding:0 !important; overflow:hidden; display:flex !important; align-items:flex-end !important; }
.step-front-img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:12px; }
.step-front--img .num{ position:relative; z-index:2; width:100%; margin:0; padding:16px 14px 18px; text-align:center; color:var(--ivoire) !important;
  background:linear-gradient(to top, rgba(30,90,94,0.72), rgba(30,90,94,0.18) 65%, transparent); border-radius:0 0 12px 12px; }
@media (max-width:768px){ .step--img{ min-height:0 !important; } .step-front--img{ aspect-ratio:4/3; } }
/* Repère « retourner » sur toutes les flashcards */
.flip-cue{ position:absolute; top:10px; right:10px; z-index:3; width:34px; height:34px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,0.92); color:var(--dark); border-radius:50%; font-size:17px; line-height:1; box-shadow:0 2px 8px rgba(0,0,0,0.18); pointer-events:none; }
.step.is-flipped .flip-cue{ opacity:0; }
@media (prefers-reduced-motion: no-preference){ .step:not(.is-flipped) .flip-cue{ animation:flipHint 2.8s ease-in-out infinite; } }
@keyframes flipHint{ 0%,78%,100%{ transform:rotate(0deg); } 86%,94%{ transform:rotate(180deg); } }

/* Fix contraste cartes statiques (orientation) sur bandes foncées */
.band.sauge .step, .band.sauge .step p, .band.sauge .step li, .band.sauge .step span:not(.num),
.band.peche .step, .band.peche .step p, .band.peche .step li, .band.peche .step span:not(.num),
.band.brume .step, .band.brume .step p, .band.brume .step li, .band.brume .step span:not(.num),
.band.beurre .step, .band.beurre .step p, .band.beurre .step li, .band.beurre .step span:not(.num){ color:var(--ivoire) !important; }

/* Bouton Contact flottant, toujours accessible */
.contact-fab{ position:fixed; right:18px; bottom:18px; z-index:300; display:inline-flex; align-items:center; gap:8px;
  padding:13px 20px; background:var(--ambre); color:var(--dark); font-family:"Plus Jakarta Sans",sans-serif; font-weight:700; font-size:15px;
  border-radius:999px; box-shadow:0 6px 22px rgba(30,90,94,0.28); text-decoration:none; transition:transform .15s ease, box-shadow .15s ease; }
.contact-fab:hover{ transform:translateY(-2px); box-shadow:0 10px 30px rgba(30,90,94,0.34); }
.contact-fab:focus-visible{ outline:3px solid var(--petrole); outline-offset:3px; }
.contact-fab svg{ flex-shrink:0; }
@media (max-width:768px){ .contact-fab{ right:14px; bottom:14px; } }

/* Accordéon vertical mobile (accueil / à propos) */
@media (max-width:768px){
  .img-accordion{ flex-direction:column; gap:12px; height:auto !important; }
  .img-accordion .panel{ flex:none !important; width:100%; min-height:96px; transition:min-height .45s cubic-bezier(.4,0,.2,1); }
  .img-accordion .panel.active{ min-height:342px; }
  .img-accordion .panel:focus-visible{ outline:3px solid var(--ambre); outline-offset:3px; }
  /* titre lisible à l'horizontale quand le panneau est fermé */
  .img-accordion .panel .panel-title.vertical{ transform:translateY(-50%) !important; bottom:auto !important; top:50% !important; left:22px !important; font-size:23px !important; white-space:normal; max-width:66%; }
  /* chevron d'ouverture */
  .img-accordion .panel::after{ content:"\2304"; position:absolute; right:20px; top:50%; transform:translateY(-60%); color:#F8F3EA; font-size:30px; line-height:1; z-index:4; transition:transform .3s ease; pointer-events:none; }
  .img-accordion .panel.active::after{ transform:translateY(-50%) rotate(180deg); opacity:.7; }
  .img-accordion .panel .panel-info{ padding:22px 22px 24px; }
}

/* Lisibilité : libellés des flashcards à image en ivoire (prime sur les couleurs nth-child) */
.step.step--img .step-front--img .num{ color:var(--ivoire) !important; text-shadow:0 1px 4px rgba(0,0,0,0.4); }


/* Harmonisation typo (relecture) */
.readcol{ text-align:left !important; }                         /* fin du tout-centré */
.eyebrow{ text-transform:none !important; letter-spacing:0.05em !important; }  /* fin des MAJUSCULES */
.read-more{ margin-top:2px !important; }                        /* Poursuivre la lecture collé au texte */
.read-more summary{ margin-top:0 !important; }
.read-more .expand-body p{ font-style:normal !important; }      /* texte déplié = même style que le reste (19px hérité) */

/* Qualité titres : romain pour les sections, italique gardé pour l'accroche (h1) */
.band h2, .closing h2, section h2, .readcol h2{ font-style:normal !important; letter-spacing:-0.01em; }

/* Retrait de la pastille blanche des flashcards */
.flip-cue{ display:none !important; }

/* Aération blocs à sur-titre (Parent/Ado + trois voies) */
.duo-col p{ font-size:16px !important; line-height:1.8 !important; }   /* texte plus lisible */
.duo-col{ padding:48px 44px !important; }                              /* plus d'air */
.duo-trois{ grid-template-columns:repeat(3,1fr) !important; gap:26px !important; overflow:visible !important; border-radius:0 !important; }
.duo-trois > div{ padding:4px 2px; }
@media (max-width:768px){ .duo-trois{ grid-template-columns:1fr !important; gap:20px !important; } }

/* Aération duo Parent/Ado */
.duo-reco > div{ padding:46px 42px !important; }
@media (max-width:768px){ .duo-reco > div{ padding:36px 26px !important; } }

/* Design cartes duo + voies (relecture qualité) */
/* Duo Parent/Ado : deux cartes claires sur le fond profond */
.duo-reco{ gap:24px !important; overflow:visible !important; border-radius:0 !important; background:transparent !important; }
.duo-reco > div{ background:var(--ivoire) !important; border-radius:20px; padding:48px 44px !important;
  box-shadow:0 14px 40px rgba(0,0,0,0.22); border-top:5px solid var(--ambre); }
.duo-reco > div:last-child{ border-top-color:var(--turquoise); }
.duo-reco > div, .duo-reco > div p, .duo-reco > div h3, .duo-reco > div span:not(.accent){ color:var(--petrole) !important; }
.duo-reco > div .eyebrow{ color:var(--accent) !important; }
.duo-reco > div .accent{ color:var(--laiton) !important; }
/* Trois voies : trois cartes douces sur l'ivoire, liseré distinct */
.duo-trois{ gap:24px !important; }
.duo-trois > div{ background:#ffffff; border-radius:16px; padding:34px 28px !important;
  box-shadow:0 6px 22px rgba(47,74,80,0.08); border-top:4px solid var(--turquoise); }
.duo-trois > div:nth-child(2){ border-top-color:var(--ambre); }
.duo-trois > div:nth-child(3){ border-top-color:var(--lavande); }
.duo-trois > div h3{ margin-top:2px; }
@media (max-width:768px){ .duo-reco > div{ padding:36px 28px !important; } .duo-trois > div{ padding:28px 24px !important; } }

/* Finition cohérence globale (le Code du Lien) */
.band, .closing, .statement{ padding-top:72px !important; padding-bottom:72px !important; }  /* respiration régulière */
.readcol{ padding-top:8px !important; padding-bottom:8px !important; }
.duo-reco, .duo-trois{ margin-top:8px; }
/* ombres et arrondis homogènes sur toutes les cartes du site */
.step--img, .duo-reco > div, .duo-trois > div{ border-radius:16px; }
.duo-reco > div{ border-radius:20px; }

@media (max-width:768px){
  .duo-reco{ grid-template-columns:1fr !important; }
}

/* Galerie de diplômes (À propos) */
.diplomes-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin:26px auto 40px; max-width:720px; }
.diplomes-grid .diplome{ margin:0; }
.diplomes-grid .diplome a{ display:block; background:#fff; border-radius:12px; padding:8px; box-shadow:0 6px 20px rgba(47,74,80,0.12); transition:transform .18s ease, box-shadow .18s ease; }
.diplomes-grid .diplome a:hover{ transform:translateY(-3px); box-shadow:0 12px 28px rgba(47,74,80,0.18); }
.diplomes-grid .diplome a:focus-visible{ outline:3px solid var(--ambre); outline-offset:3px; }
.diplomes-grid img{ width:100%; height:150px; object-fit:contain; display:block; border-radius:8px; }
.diplomes-grid figcaption{ margin-top:10px; font-family:"Plus Jakarta Sans",sans-serif; font-size:13px; line-height:1.5; color:var(--ivoire); opacity:0.92; }
@media (max-width:768px){ .diplomes-grid{ grid-template-columns:repeat(2,1fr); gap:14px; } .diplomes-grid img{ height:120px; } }

@media (max-width:768px){ 
 }

/* Cartes de hauteur égale (flashcards et cartes de contenu) */
.step-grid{ align-items:stretch !important; }
.step{ height:100%; display:flex; }
.step > *{ width:100%; }

/* Cartes de texte simples : fond clair pour révéler la structure */
body .step.step--plain{ background:rgba(250,250,246,0.14) !important; border:1px solid rgba(250,250,246,0.22) !important;
  border-radius:16px !important; padding:26px 24px !important; min-height:0 !important; cursor:default !important; perspective:none !important; }
body .step.step--plain p{ margin:0; color:var(--ivoire) !important; font-size:16px; line-height:1.7; }
body .step.step--plain strong{ display:block; margin-bottom:6px; color:var(--ambre) !important; font-size:17px; }
@media (max-width:768px){ body .step.step--plain{ padding:22px 20px !important; } }

/* Retouches captures 24/07 */
/* 1. menu : un peu d'air avant le bouton Réserver + éviter le collage */
.navlinks{ gap:30px !important; }
.nav-cta{ margin-left:14px; }
/* 2. gros texte « statement » un cran plus petit (moins écrasant) */
.statement p{ font-size:44px !important; }
@media (max-width:768px){ .statement p{ font-size:27px !important; } }
/* 3-4. image intercalée : plus d'air dessus/dessous, pas collée */
.figure-inline{ margin:36px auto !important; }
.figure-inline img{ max-height:460px; object-fit:cover; }
/* 5-6. cartes Parent/Ado : vraie séparation entre les deux */
.duo-reco{ gap:36px !important; }
@media (max-width:768px){ .duo-reco{ gap:24px !important; } }
/* 8. flashcards : contenu bien centré dans chaque carte */
.step-front{ align-items:center !important; justify-content:center !important; }
.step-front--img{ align-items:flex-end !important; }
.step-front--img .num{ text-align:center !important; }

/* 7. lede : respiration après le titre d'accroche */
.page-header + .lede{ margin-top:26px; }
.lede{ max-width:640px; margin-left:auto; margin-right:auto; }
/* 3. figure-inline suivie d'une bande foncée : ménager l'espace */
.figure-inline + .band, .figure-inline + section{ margin-top:0; }


/* Pré-footer (newsletter + accès rapides relogés depuis l'ancienne utility-zone) */
.prefooter { padding:48px 52px; border-top:1px solid rgba(47,74,80,0.1); }
.prefooter-inner { max-width:720px; margin:0 auto; display:flex; flex-direction:column; align-items:center; text-align:center; gap:18px; }
.prefooter-lede { font-size:15px; opacity:0.75; max-width:520px; margin:0; }
.prefooter-form { display:inline-flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:0; }
.prefooter-form input[type=email] { padding:11px 16px; border:1px solid rgba(47,74,80,0.2); border-radius:8px; font-size:14px; font-family:'Plus Jakarta Sans',sans-serif; min-width:240px; }
.prefooter-form button { padding:11px 22px; border:none; border-radius:8px; background:var(--turquoise); color:var(--ivoire); font-size:14px; font-family:'Plus Jakarta Sans',sans-serif; cursor:pointer; }
.prefooter-links { display:flex; flex-wrap:wrap; justify-content:center; gap:22px; font-size:14px; }
.prefooter-links a { color:var(--petrole); text-decoration:underline; opacity:0.82; }
@media (max-width:768px){ .prefooter { padding:36px 24px; } .prefooter-form input[type=email]{ min-width:0; width:100%; } .prefooter-form button{ width:100%; } }


/* À propos, en-tête deux colonnes (texte + portrait) */
.apropos-hero{ padding:36px 52px 22px; }
.apropos-hero-inner{ max-width:1020px; margin:0 auto; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:44px; align-items:center; }
.apropos-hero-text{ text-align:left; }
.apropos-hero-text .eyebrow{ justify-content:flex-start; margin-left:0; }
.apropos-hero-text h1{ margin:6px 0 0; }
.apropos-quals{ font-size:15px; letter-spacing:0.03em; opacity:0.72; line-height:1.7; margin:12px auto 22px; }
.apropos-baseline{ font-family:"Instrument Serif",serif; font-style:italic; font-size:30px; line-height:1.2; color:var(--petrole); margin:0 auto 14px; }
.apropos-lede{ font-size:16px; line-height:1.6; opacity:0.85; max-width:520px; margin:0 auto; }
.apropos-hero-photo{ width:100%; margin:0; }
.apropos-hero-photo img{ display:block; width:100%; height:auto; border-radius:16px; }
.apropos-below{ padding-top:6px; }
@media (max-width:768px){
  .apropos-hero{ padding:20px 24px; }
  .apropos-hero-inner{ grid-template-columns:1fr; gap:22px; }
  .apropos-hero-text{ text-align:center; }
  .apropos-hero-text .eyebrow{ justify-content:center; }
  .apropos-lede{ font-size:16px; line-height:1.6; opacity:0.85; max-width:520px; margin:0 auto; }
  .apropos-baseline{ font-family:"Instrument Serif",serif; font-style:italic; font-size:30px; line-height:1.2; color:var(--petrole); margin:0 auto 14px; }
  .apropos-hero-photo{ max-width:none; }
}


/* Bouton d'appel, pulsé doux (attention sans clignotement agressif) */
@keyframes btnPulse { 0%,100%{ transform:scale(1); box-shadow:0 0 0 0 rgba(242,172,57,0.75); } 50%{ transform:scale(1.06); box-shadow:0 0 0 16px rgba(242,172,57,0); } }
.btn-pulse{ animation:btnPulse 1.5s ease-in-out infinite; }
.btn-pulse:hover{ animation:none; }
@media (prefers-reduced-motion: reduce){ .btn-pulse{ animation:none; } }

/* Coaching : versos plus courts -> hauteur resserrée pour éviter les cartes trop vides */
body.page-coaching .step, body.page-coaching .step-inner{ min-height:230px !important; }


/* Bandeau ouverture "octobre 2026", dynamique, style alerte */
@keyframes launchAlert {
  0%,100% { transform:scale(1); box-shadow:0 0 0 0 rgba(242,172,57,0.8), 0 4px 16px rgba(242,172,57,0.22); }
  50%     { transform:scale(1.07); box-shadow:0 0 0 22px rgba(242,172,57,0), 0 8px 30px rgba(242,172,57,0.42); }
}
@keyframes badgeAlert {
  0%,100% { box-shadow:0 0 0 0 rgba(242,172,57,0.65); }
  50%     { box-shadow:0 0 0 7px rgba(242,172,57,0); }
}
.nav-badge { animation:badgeAlert 1.6s ease-in-out infinite; white-space:nowrap; }
@media (prefers-reduced-motion: reduce){
  .launch-status, .nav-badge { animation:none !important; }
}

/* AOS retiré : les éléments doivent rester visibles, pas de fondu au chargement */
[data-aos]{ opacity:1 !important; transform:none !important; }


/* Bloc de bascule, page Coaching individuel */
body.page-coaching .coaching-reframe{ max-width:860px; margin:44px auto 0; padding:34px 36px; border-radius:16px; background:rgba(250,250,246,0.12); border:1px solid rgba(250,250,246,0.22); text-align:left; }
body.page-coaching .coaching-reframe-line{ display:block; width:28px; height:2px; background:var(--ambre); margin-bottom:14px; }
body.page-coaching .coaching-reframe h3{ font-family:"Instrument Serif",serif; font-style:normal; font-weight:400; font-size:30px; line-height:1.25; letter-spacing:-0.01em; color:var(--ivoire); margin:0 0 18px; }
body.page-coaching .coaching-reframe p{ font-family:"Plus Jakarta Sans",sans-serif; font-size:18px; line-height:1.75; font-weight:400; color:var(--ivoire); opacity:0.88; margin:0 0 13px; }
body.page-coaching .coaching-reframe p.coaching-reframe-q{ font-size:19px; font-weight:600; line-height:1.6; color:var(--ambre); opacity:1; margin:20px 0 0; }
@media (max-width:768px){
  body.page-coaching .coaching-reframe{ width:100%; max-width:100%; padding:28px 24px; margin-top:32px; }
  body.page-coaching .coaching-reframe h3{ font-size:26px; }
  body.page-coaching .coaching-reframe p{ font-size:18px; }
  body.page-coaching .coaching-reframe p.coaching-reframe-q{ font-size:18px; }
}


/* Lien "Découvrir ce regard" (accueil, section fond sombre) : lisibilité + accessibilité */
.home-potentiels-link{ color:var(--ivoire); font-family:"Plus Jakarta Sans", sans-serif; font-weight:600; transition:color 0.2s ease; }
.home-potentiels-link:visited{ color:var(--ivoire); }
.home-potentiels-link:hover{ color:var(--ambre); opacity:1; }
.home-potentiels-link:focus-visible{ outline:2px solid var(--ambre); outline-offset:4px; }


/* Coaching : photo (lunettes) + citation en une composition */
body.page-coaching .coaching-photo-quote{ max-width:900px; margin:56px auto; display:grid; grid-template-columns:auto 1fr; gap:48px; align-items:center; padding-inline:24px; }
body.page-coaching .coaching-photo-quote .site-photo-frame{ margin:0; }
body.page-coaching .coaching-photo-quote .cpq-quote{ padding:0; margin:0; max-width:none; text-align:left; }
@media (max-width:768px){
  body.page-coaching .coaching-photo-quote{ grid-template-columns:1fr; gap:28px; margin:40px auto; }
  body.page-coaching .coaching-photo-quote .site-photo-frame{ margin:0 auto; }
  body.page-coaching .coaching-photo-quote .cpq-quote{ text-align:center; }
}


/* Contact : formulaire + photo machine à écrire en une composition */
body.page-contact .contact-form-layout{ max-width:980px; margin:0 auto 56px; padding:0 24px; display:grid; grid-template-columns:1.15fr 0.85fr; gap:56px; align-items:center; }
body.page-contact .contact-form-layout .cfl-img .site-photo-frame{ margin:0 auto; }
@media (max-width:768px){
  body.page-contact .contact-form-layout{ grid-template-columns:1fr; gap:28px; }
  body.page-contact .contact-form-layout .cfl-img{ order:2; }
}


/* Orientation : hero 2 colonnes (texte + image) puis colonne de lecture */
body.page-orientation .orientation-hero{ max-width:1100px; margin:0 auto; padding:0 24px; display:grid; grid-template-columns:55fr 45fr; gap:54px; align-items:center; }
body.page-orientation .orientation-hero .oh-text{ text-align:left; }
body.page-orientation .orientation-hero .oh-img .site-photo-frame{ margin:0 auto; }
body.page-orientation .orientation-intro-read{ padding:32px 24px 0; }
body.page-orientation .orientation-intro-read .readcol{ max-width:660px; text-align:left; }
@media (max-width:768px){
  body.page-orientation .orientation-hero{ grid-template-columns:1fr; gap:28px; }
  body.page-orientation .orientation-hero .oh-img{ order:2; }
}

/* ===== Affinage visuel : interlignes, espacements, alignements (scoppé, sans toucher aux textes/photos) ===== */

/* Orientation : restaurer le style du titre du hero + respirations justes */
body.page-orientation .orientation-hero{ padding-top:48px; gap:56px; align-items:center; }
body.page-orientation .orientation-hero .oh-text .eyebrow{ justify-content:flex-start; margin-bottom:16px; }
body.page-orientation .orientation-hero .oh-text h1{ font-style:italic !important; font-size:40px; line-height:1.2; letter-spacing:-0.02em; margin:0 0 18px; max-width:100%; }
body.page-orientation .orientation-hero .oh-text p{ font-size:19px !important; line-height:1.75 !important; opacity:0.85; margin:0; max-width:none; font-weight:300; }
body.page-orientation .orientation-intro-read{ padding:40px 24px 0; }
body.page-orientation .orientation-intro-read .readcol{ padding-top:0; padding-bottom:0; }
@media (max-width:768px){
  body.page-orientation .orientation-hero{ padding-top:32px; gap:26px; }
  body.page-orientation .orientation-hero .oh-text h1{ font-size:30px; }
  body.page-orientation .orientation-hero .oh-text{ text-align:left; }
}

/* Coaching : interligne de la citation + mesure de lecture + centrage vertical */
body.page-coaching .coaching-photo-quote{ gap:52px; align-items:center; }
body.page-coaching .coaching-photo-quote .cpq-quote p{ line-height:1.45 !important; max-width:34ch; margin:0; }
@media (max-width:768px){
  body.page-coaching .coaching-photo-quote .cpq-quote p{ max-width:100%; }
}

/* Contact : alignement vertical formulaire / image, gap régulier */
body.page-contact .contact-form-layout{ align-items:center; gap:52px; }
body.page-contact .contact-form-layout .cfl-form form{ margin:0 auto !important; }

/* À propos : centrage net de l'image facettes + respiration */
body.page-apropos .figure-inline{ margin-left:auto; margin-right:auto; }


/* ===== Ajustements demandés : romain (pas d'italique), plus d'air ===== */
h1, h2, h3 { font-style:normal !important; }
.pull p, body.page-coaching .coaching-photo-quote .cpq-quote p { font-style:normal !important; }

/* Plus d'air entre blocs et textes */
body.page-orientation .band .step-grid{ margin-bottom:44px; }
body.page-orientation .orientation-hero{ max-width:1160px; grid-template-columns:50fr 50fr; gap:56px; padding-top:56px; }
body.page-orientation .orientation-intro-read{ padding-top:48px; }
body.page-potentiels .figure-inline{ margin-top:44px; margin-bottom:44px; }
body.page-potentiels .readcol{ padding-top:8px; }
body.page-coaching .coaching-photo-quote{ margin:72px auto; gap:56px; }
body.page-contact .contact-form-layout{ margin:8px auto 72px; }


/* ===== Réglages ciblés (captures) ===== */
/* Autres Potentiels : image alignée + air image/titre/texte */
body.page-potentiels .figure-inline{ max-width:640px !important; margin:52px auto !important; }
body.page-potentiels .figure-inline img{ margin:0 auto; }
body.page-potentiels .readcol h2{ margin-bottom:26px !important; }
/* Espace entre une bande foncée et le contenu blanc qui suit (toutes pages) */
.band + section, .band + div, .band + figure{ margin-top:48px; }
/* Image facettes en cercle (a-propos) : cadrage propre */
body.page-apropos .facettes-circle img{ box-shadow:0 10px 30px rgba(47,74,80,0.12); }
@media (max-width:768px){
  body.page-apropos .facettes-circle{ margin-left:auto !important; margin-right:auto !important; }
}


/* ===== Finitions captures (aération) ===== */
/* Autres Potentiels : plus d'air entre la photo et le texte */
body.page-potentiels .figure-inline{ margin:72px auto !important; }
/* Orientation : espacement ÉGAL au-dessus et au-dessous des cartes */
body.page-orientation .band .step-grid{ margin-top:44px !important; margin-bottom:44px !important; }
/* De l'air AVANT les bandes foncées (texte blanc qui ne colle plus au bleu) */
.band{ margin-top:36px; }

/* ===== Finitions captures (suite) ===== */
/* FAQ : descendre le cadre bleu pour qu'il ne "morde" plus le bloc du dessus */
.accordion{ margin-top:56px !important; }
/* Autres Potentiels : encore un peu plus d'air entre la photo et le titre */
body.page-potentiels .figure-inline{ margin-top:88px !important; margin-bottom:64px !important; }
/* À propos : texte du hero à la même taille que les autres pages */
body.page-apropos .apropos-lede{ font-size:19px !important; line-height:1.7 !important; }
body.page-apropos .apropos-quals{ font-size:16px !important; }
/* Plus aucune écriture en italique (FAQ, baseline À propos, citations) */
summary, .apropos-baseline, .pull p{ font-style:normal !important; }


/* Autres Potentiels : attribution de marque (Marc Breugelmans) */
.autres-potentiels-credit{ max-width:680px; margin:32px auto 40px; padding:0 24px; text-align:left; font-family:"Plus Jakarta Sans", sans-serif; }
.autres-potentiels-credit p{ font-size:14px; line-height:1.65; color:var(--petrole); opacity:0.85; margin:0 0 8px; }
.autres-potentiels-credit p:last-child{ margin:0; }
.autres-potentiels-credit .ap-credit-link{ color:var(--accent); text-decoration:underline; font-weight:600; }
.autres-potentiels-credit .ap-credit-link:hover{ color:var(--ambre); }
.autres-potentiels-credit .ap-credit-link:focus-visible{ outline:2px solid var(--ambre); outline-offset:3px; }

/* ============================================================
   SEO 08/2026, revu 19/08/2026 : hero et titres de la page
   Le Code du Lien. Voir le rapport pour la regle typographique.
   ============================================================ */

/* H1 des heros de pages : italique, comme le H1 de la page Orientation.
   Retablit une regle deja presente dans la charte (.page-header h1,
   .hero h1) que la regle globale h1,h2,h3{font-style:normal!important}
   neutralisait sur 7 pages sur 8. */
.page-header h1,
.hero h1,
.apropos-hero-text h1,
body.page-lien .page-header .page-title,
body.page-lien .page-header .offer-name{ font-style:italic !important; }

/* Nouveau H1 : present et lisible, volontairement plus sobre que l'accroche */
body.page-lien .page-header h1.seo-title{
  font-family:"Instrument Serif", serif;
  font-weight:400;
  font-size:var(--font-page-title-desktop) !important;
  line-height:var(--line-height-title) !important;
  letter-spacing:-0.02em;
  color:var(--petrole);
  opacity:1;
  max-width:680px;
  margin:0 0 6px;
}

/* Nom de l'accompagnement, entre le H1 et l'accroche */
body.page-lien .page-header p.offer-name{
  font-family:"Instrument Serif", serif;
  font-weight:400;
  font-size:24px !important;
  line-height:1.25 !important;
  letter-spacing:0.01em;
  color:var(--accent);
  opacity:1;
  max-width:680px;
  margin:0 0 14px;
}

/* Accroche : reprise du rendu du hero, en italique comme les autres H1 */
body.page-lien .page-header h2.page-title{
  font-family:"Instrument Serif", serif;
  font-weight:400;
  font-size:var(--font-subsection-title-desktop) !important;
  line-height:var(--line-height-title) !important;
  letter-spacing:-0.01em;
  color:var(--petrole);
  opacity:0.9;
  max-width:680px;
  margin:0 0 20px;
}

/* Titre H2 de la FAQ */
body.page-lien h2.faq-title{ margin:0 0 6px; }

/* Questions de FAQ : passees en h3, rendu strictement inchange */
body.page-lien .accordion summary h3{
  display:inline;
  font-family:inherit;
  font-size:inherit !important;
  font-weight:inherit;
  font-style:inherit;
  line-height:inherit;
  letter-spacing:inherit;
  color:inherit;
  margin:0;
  padding:0;
}

/* « Cadre et limites de l'accompagnement » : vrai H2 de section,
   rendu aligne sur l'echelle de sous-titre de section de la charte */
body.page-lien .ethics h2.ethics-title{
  font-family:"Instrument Serif", serif;
  font-weight:400;
  font-size:var(--font-subsection-title-desktop) !important;
  line-height:var(--line-height-title);
  letter-spacing:-0.01em;
  color:var(--petrole);
  opacity:1;
  margin:0 0 18px;
}

@media (max-width:768px){
  body.page-lien .page-header h1.seo-title{ font-size:var(--font-page-title-mobile) !important; margin-bottom:4px; }
  body.page-lien .page-header p.offer-name{ font-size:20px !important; margin-bottom:10px; }
  body.page-lien .page-header h2.page-title{ font-size:var(--font-subsection-title-mobile) !important; }
  body.page-lien .ethics h2.ethics-title{ font-size:var(--font-subsection-title-mobile) !important; }
}

/* Bandeau d'ouverture de la page Le Code du Lien : allege sur desktop
   uniquement (hauteur, paddings, taille de texte). Couleurs, bordure,
   arrondi, fond, pastille et animation strictement inchanges.
   Le bandeau de l'accueil n'est pas concerne. */
@media (min-width:769px){
  body.page-lien .page-header .launch-status{
    padding:7px 16px;
    gap:8px;
    font-size:15px !important;
    line-height:1.3;
    margin-bottom:20px;
  }
}

/* ---------------------------------------------------------------
   Header mobile : le bouton « Réserver une première rencontre »
   debordait a droite sur petits ecrans. Cause : nav conservait
   padding:24px 52px sur mobile et aucun des trois enfants du flex
   (logo, burger, CTA) ne pouvait se reduire sous sa largeur
   min-content. Correction uniquement sous 768px : marges du header
   reduites, enfants autorises a se reduire (min-width:0), CTA
   plafonne et compacte. Couleur, texte, destination, forme et
   header desktop inchanges.
   --------------------------------------------------------------- */
@media (max-width:768px){
  nav{
    padding-left:14px;
    padding-right:14px;
    gap:8px;
    flex-wrap:nowrap;
    max-width:100%;
  }
  nav > .logo{ min-width:0; flex:0 1 auto; }
  nav > .logo .logo-text{ min-width:0; overflow-wrap:break-word; }
  nav > .menu-toggle{ flex:0 0 auto; padding:6px; }
  nav > .nav-cta{
    flex:0 1 auto;
    min-width:0;
    max-width:44vw;
    margin-left:6px;
    font-size:12px !important;
    padding:9px 12px !important;
    line-height:1.25;
    text-align:center;
    white-space:normal;
    overflow-wrap:break-word;
  }
}

/* ---------------------------------------------------------------
   Passe UX 22/08 : lecture progressive et hierarchie des titres.
   Aucun texte modifie, aucune balise de titre changee.
   --------------------------------------------------------------- */

/* Libelles ouvrir / refermer du composant « Poursuivre la lecture ».
   Les instances anciennes, sans span, ne sont pas affectees. */
.read-more .rm-close{ display:none; }
.read-more[open] .rm-open{ display:none; }
.read-more[open] .rm-close{ display:inline; }
.read-more summary:focus-visible{ outline:2px solid var(--ambre); outline-offset:3px; border-radius:4px; }

/* Le composant apparait maintenant aussi dans les bandes colorees et
   dans le bloc « Regles du cadre » : on garde le meme langage visuel,
   avec juste l'air necessaire au-dessus. */
.band .read-more, .ethics .read-more{ margin-top:6px !important; }
.ethics .read-more summary{ font-size:12px; padding:4px 0 10px; }

/* H3 subordonnes au H2 de leur section : la regle globale
   h3{font-size:30px !important} les mettait a 30px, soit presque la
   taille d'un H2 de bande (36px), malgre leur style inline a 22px. */
body.page-lien .duo-reco h3,
body.page-lien .duo-trois h3{ font-size:24px !important; margin-bottom:10px; }
@media (max-width:768px){
  body.page-lien .duo-reco h3,
  body.page-lien .duo-trois h3{ font-size:21px !important; }
}

/* ===============================================================
   Passe UX 22/08, rythme vertical : supprimer l'effet d'empilement.
   Aucun texte, aucune balise de titre, aucune couleur touches.
   Cause principale : le reset * { margin:0 } laisse les paragraphes
   des bandes et du bloc « Regles du cadre » sans aucune separation.
   Hierarchie retenue :
     avant un H2   : padding de section, 72px
     apres un H2   : 36px (regle existante)
     avant un H3   : 28px
     apres un H3   : 10px
     entre deux paragraphes : 18px
   =============================================================== */

/* 1. Respiration entre paragraphes d'une meme bande */
.band-inner > p,
.band-inner > div > p{ margin-bottom:18px; }
.band-inner > p:last-child,
.band-inner > div > p:last-child{ margin-bottom:0; }
.ethics p{ margin-bottom:12px; }
.ethics p:last-child{ margin-bottom:0; }

/* 2. Grandes lignes editoriales du bloc « statement » */
.statement p{ margin-bottom:18px; }
.statement p:last-child{ margin-bottom:0; }

/* 3. Un H3 qui suit du texte : respiration intermediaire,
      nettement plus courte que celle qui precede un H2 */
.band-inner p + h3,
.readcol p + h3{ margin-top:28px; }

/* 4. Phrases fortes : appartiennent a leur section, ne doivent pas
      etre lues comme un titre. Plus d'air qu'entre deux paragraphes,
      moins qu'autour d'un vrai titre. */
.phrase-forte{ margin-top:26px !important; margin-bottom:30px !important; }
.band-inner .phrase-forte strong{ font-weight:600; }

/* 5. Hero du Code du Lien : une seule composition, puis respiration */
body.page-lien .page-header h1.seo-title{ margin-bottom:4px; }
body.page-lien .page-header p.offer-name{ margin-bottom:16px; }
body.page-lien .page-header h2.page-title{ margin-bottom:26px; }

/* 6. « Poursuivre la lecture » : centre, rattache au bloc qu'il
      developpe, et separe de la suite. Une fois ouvert, la commande
      passe sous le texte deplie (ordre visuel seulement, l'ordre DOM
      et l'ordre de lecture par synthese vocale ne changent pas). */
.read-more > summary{ display:flex; justify-content:center; padding:10px 0 6px; }
.read-more{ margin-bottom:26px; }
.read-more[open]{ display:flex; flex-direction:column-reverse; }
.read-more[open] > summary{ padding:14px 0 4px; }
.read-more .expand-body > p:last-child{ margin-bottom:0; }

/* 7. Colonnes : vraie respiration quand elles s'empilent sur mobile */
@media (max-width:768px){
  .duo-reco{ gap:32px !important; }
  .duo-trois{ gap:26px !important; }
}
