/* Pages du site (accueil, cabinet, contact, légales…). Les bases et la page de vente sont dans style.css. */

/* En-tête avec navigation */
.top{flex-wrap:wrap}
.nav{display:flex;gap:clamp(14px,2.4vw,32px);font-size:.95rem}
.nav a{text-decoration:none;padding:4px 0;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.nav a:hover,.nav a[aria-current=page]{color:var(--blue);border-color:var(--blue)}
@media (max-width:760px){.nav{order:3;width:100%;gap:18px;font-size:.88rem;flex-wrap:wrap;padding-top:6px}}

/* Pied de page */
.foot-nav{display:flex;flex-wrap:wrap;gap:8px 22px}
.foot-nav a{text-decoration:none}
.foot-nav a:hover{color:var(--blue)}

/* Titres de pages intérieures */
.page-head{padding-block:clamp(48px,7vw,96px) clamp(32px,4vw,56px)}
.page-head h1{font-size:clamp(2.4rem,5.4vw,4.4rem);margin-top:14px;max-width:22ch}
.page-head .lead{margin-top:24px}
.page-head.thanks{min-height:46vh}
.who.tight{border-top:1px solid var(--line)}

/* Accueil : hero */
.home-hero h1{max-width:none}
.home-hero h1 .line>span{white-space:normal}
.yearbar{margin-top:clamp(40px,5vw,64px);padding-top:22px;border-top:1px solid var(--line);display:grid;grid-template-columns:auto 1fr;gap:6px clamp(20px,5vw,64px);align-items:baseline}
.yb-n{font-size:.98rem}
.yb-n b{font-family:var(--serif);font-weight:400;font-size:2.1rem;color:var(--blue);margin-right:.2em;font-variant-numeric:lining-nums}
.yb-t{color:var(--muted);font-size:.95rem;max-width:62ch}
.track{grid-column:1/-1;height:2px;background:var(--line);margin-top:10px;position:relative}
.track .fill{position:absolute;inset:0 auto 0 0;width:0;background:var(--blue);transition:width 1.4s cubic-bezier(.2,.75,.2,1) .4s}
@media (max-width:700px){.yearbar{grid-template-columns:1fr}}

/* Accueil : deux sujets */
.sujets{padding-block:clamp(64px,9vw,120px);border-top:1px solid var(--line)}
.panels{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px)}
.panel{padding:clamp(24px,3vw,40px);border:1px solid var(--faint);transition:background .3s,border-color .3s}
.panel:hover{background:rgba(255,255,255,.45);border-color:var(--blue)}
.panel h3{font-size:clamp(1.7rem,3vw,2.4rem);margin-top:12px}
.panel p{color:var(--muted);margin-top:14px}
.panel ul{list-style:none;margin:22px 0 0;padding:0}
.panel li{padding:11px 0;border-top:1px solid var(--line)}
@media (max-width:760px){.panels{grid-template-columns:1fr}}

/* Bande bleue (guide) */
.band{background:var(--blue);color:#fff;padding-block:clamp(48px,7vw,88px)}
.band .label{color:#fff;opacity:.8}
.band-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(24px,6vw,88px);align-items:end}
.band-grid>*{min-width:0}
.band h2{font-size:clamp(1.8rem,3.6vw,2.9rem);margin-top:12px;max-width:20ch}
.band p{opacity:.9;max-width:36ch}
.btn-light{background:#fff;color:var(--blue);margin-top:20px}
.btn-light:hover{background:var(--bg);color:var(--blue-deep)}
@media (max-width:760px){.band-grid{grid-template-columns:1fr}}

/* FAQ */
.faq{padding-block:clamp(64px,9vw,120px)}
.faq-list{max-width:760px;margin-left:auto;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:20px 40px 20px 0;font-family:var(--serif);font-size:1.35rem;font-weight:400;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:50%;transform:translateY(-52%);font-family:var(--sans);font-size:1.5rem;color:var(--blue);transition:transform .25s}
.faq details[open] summary::after{transform:translateY(-52%) rotate(45deg)}
.faq details p{color:var(--muted);padding:0 40px 22px 0;max-width:60ch}
.faq .head{grid-template-columns:.7fr 1.3fr}

/* Appel final */
.closing{padding-block:clamp(56px,8vw,104px);border-top:1px solid var(--line)}
.closing-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(24px,6vw,88px);align-items:center}
.closing h2{font-size:clamp(2rem,4.4vw,3.4rem);max-width:16ch}
.closing .hero-cta{margin-top:0}
@media (max-width:760px){.closing-grid{grid-template-columns:1fr}}

/* Cabinet : principes et infos pratiques */
.prin,.facts{padding-block:clamp(56px,8vw,104px);border-top:1px solid var(--line)}
.prin-list{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,56px)}
.prin-list>div{border-top:1px solid var(--ink);padding-top:18px}
.prin-list h3{font-size:1.6rem;font-weight:400}
.prin-list p{color:var(--muted);margin-top:10px}
@media (max-width:820px){.prin-list{grid-template-columns:1fr}}
.facts-list{margin:0 0 36px;max-width:720px}
.facts-list>div{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:14px 0;border-top:1px solid var(--line)}
.facts-list>div:last-child{border-bottom:1px solid var(--line)}
.facts-list dt{color:var(--muted);font-size:.92rem}
.facts-list dd{margin:0}
@media (max-width:520px){.facts-list>div{grid-template-columns:1fr;gap:2px}}

/* Contact */
.contact{padding-block:0 clamp(56px,8vw,96px)}
.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(32px,7vw,104px);align-items:start}
.contact-grid>*{min-width:0}
.cform{display:grid;gap:22px;max-width:560px}
.fld{display:grid;gap:4px}
.fld span{font-size:.88rem;color:var(--muted)}
.fld small{font-size:.85em}
.cform input[type=text],.cform input[type=email],.cform input[type=tel],.cform textarea{font:inherit;font-size:1rem;padding:.6em 0;border:0;border-bottom:1px solid var(--ink);border-radius:0;background:transparent;color:var(--ink);width:100%;transition:border-color .2s}
.cform textarea{resize:vertical;min-height:110px;line-height:1.5}
.cform input:focus,.cform textarea:focus{outline:none;border-color:var(--blue);border-bottom-width:2px}
.practical h2{font-size:1.8rem;margin-bottom:18px}
.practical .facts-list{margin-bottom:0}
@media (max-width:820px){.contact-grid{grid-template-columns:1fr}}
.wa .wrap{border-top:1px solid var(--line);padding-top:clamp(40px,6vw,72px)}

/* Pages légales */
.prose-sec{padding-block:0 clamp(64px,9vw,120px)}
.prose{max-width:760px}
.prose h2{font-size:1.7rem;margin:40px 0 10px}
.prose p,.prose li{color:var(--muted)}
.prose p+p{margin-top:12px}
.prose ul{padding-left:1.2em}
.prose a{color:var(--blue)}
.draftnote{border-left:2px solid var(--blue);background:rgba(20,86,200,.06);padding:12px 16px;font-size:.92rem;color:var(--ink)!important}

/* Situation concrète */
.prose .big{font-family:var(--serif);font-size:clamp(1.35rem,2.4vw,1.8rem);line-height:1.4;color:var(--ink);font-weight:300;margin-top:22px}
.prose .big+.big{margin-top:16px}
.qlist{list-style:none;padding:0;margin:8px 0 0}
.qlist li{padding:14px 0;border-top:1px solid var(--line);color:var(--ink);font-family:var(--serif);font-size:1.3rem}
.qlist li:last-child{border-bottom:1px solid var(--line)}
.prose .hero-cta{margin-top:36px}
.themes{padding-block:clamp(56px,8vw,104px);border-top:1px solid var(--line)}
.themes-list{list-style:none;margin:0 0 40px;padding:0}
.themes-list li{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(16px,5vw,72px);padding:26px 0;border-top:1px solid var(--line);align-items:baseline}
.themes-list li:last-child{border-bottom:1px solid var(--line)}
.themes-list .q{font-family:var(--serif);font-size:clamp(1.35rem,2.6vw,2rem);line-height:1.25;font-weight:300;max-width:34ch}
@media (max-width:760px){.themes-list li{grid-template-columns:1fr;gap:8px}}
.prose .btn{color:#fff}
.prose .btn:hover{color:#fff}
.prose .lnk{color:var(--ink)}
.prose .lnk:hover{color:var(--blue)}
.prose .qlist{padding:0}
.themes .head h2{max-width:20ch}