/* OOLYSOFT · Diagnostic · feuille de style (charte identique à index.html) */
:root{
  --navy:#0C1A2E; --orange:#FF8C38; --creme:#F7F3EC; --grey:#6B7280;
  --text:#1F2937; --white:#FFFFFF; --sep:#E2DCD2;
  --orange-8:#FFF4EA; --err:#B42318; --ok:#1B7F4B;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{font-family:Georgia,'Times New Roman',serif;color:var(--text);background:var(--creme);line-height:1.65}
h1,h2,h3,.sans{font-family:'Segoe UI',Arial,Helvetica,sans-serif}
.wrap{max-width:760px;margin:0 auto;padding:0 24px}
header{background:var(--navy);padding:18px 0}
header .wrap{display:flex;justify-content:space-between;align-items:center;gap:18px;max-width:1040px}
nav.main{display:flex;gap:22px;align-items:center;margin-left:auto;margin-right:18px}
nav.main a{color:#C6CEDA;text-decoration:none;font-family:'Segoe UI',Arial,sans-serif;font-size:.9rem}
nav.main a:hover,nav.main a[aria-current]{color:#fff}
@media(max-width:860px){nav.main{display:none}}
.logo-link{text-decoration:none}
.logo{color:var(--white);font-family:'Segoe UI',Arial,sans-serif;font-weight:800;font-size:1.35rem;letter-spacing:.12em}
.logo span{color:var(--orange)}
header a.cta-mini{color:var(--navy);background:var(--orange);padding:9px 18px;border-radius:6px;text-decoration:none;font-family:'Segoe UI',Arial,sans-serif;font-weight:700;font-size:.9rem;white-space:nowrap}
.btn{display:inline-block;padding:14px 30px;border-radius:6px;text-decoration:none;font-family:'Segoe UI',Arial,sans-serif;font-weight:700;font-size:1rem;border:0;cursor:pointer;line-height:1.3}
.btn-o{background:var(--orange);color:var(--navy)}
.btn-ghost{background:transparent;border:2px solid var(--navy);color:var(--navy)}
.btn:focus-visible,.lien:focus-visible,a:focus-visible{outline:3px solid var(--navy);outline-offset:2px}
.hero-diag .btn:focus-visible,.hero-diag .lien:focus-visible{outline-color:var(--orange)}
.tag{color:var(--orange);font-family:'Segoe UI',Arial,sans-serif;font-weight:700;letter-spacing:.14em;font-size:.8rem;text-transform:uppercase;display:block;margin-bottom:10px}
footer.site{background:var(--navy);color:#8FA0B8;padding:34px 0;font-size:.82rem;font-family:'Segoe UI',Arial,sans-serif;margin-top:40px}
footer.site .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;max-width:1040px}
footer.site a{color:#C6CEDA}

/* Sans JS : tout est visible d'un bloc ; les éléments conditionnels aussi */
.no-js .js-only{display:none}
.no-js .chip[hidden]{display:flex}
.no-js fieldset[hidden],.no-js .encart[hidden],.no-js .champ[hidden],.no-js p[hidden]{display:block}
.no-js #etape-6{display:none}
.js .panneau:not(.active){display:none}

/* Étapes */
body.diag.en-cours{padding-bottom:96px}
.etape{padding:28px 0 40px}
.etape[hidden]{display:none}
.hero-diag{background:var(--navy);color:var(--white);padding:56px 0 64px}
.hero-diag h1{font-size:clamp(1.8rem,6vw,2.8rem);line-height:1.15;outline:none}
.hero-diag h1 em{color:var(--orange);font-style:normal}
.hero-diag .sub{margin-top:20px;font-size:1.08rem;color:#D8DEE8;max-width:640px}
.hero-diag .beta-note{color:var(--orange);font-family:'Segoe UI',Arial,sans-serif;font-size:.95rem}
.hero-diag .btn-large{margin-top:30px}
.aide{color:var(--grey);font-size:1rem}
.aide.petite{font-size:.85rem;margin-top:6px}
.aide-clair{color:#8FA0B8;font-size:.85rem;margin-top:10px;font-family:'Segoe UI',Arial,sans-serif}
.reprise{margin-top:26px;background:#122540;border:1px solid var(--orange);border-radius:10px;padding:18px 20px;font-family:'Segoe UI',Arial,sans-serif}
.reprise p{color:#D8DEE8;font-size:.95rem}
.reprise-btns{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:12px}
.lien{background:none;border:0;color:var(--navy);text-decoration:underline;font-family:'Segoe UI',Arial,sans-serif;font-size:1rem;cursor:pointer;padding:12px 4px}
.lien-clair{color:#D8DEE8}
.btn-large{display:block;width:100%;text-align:center;min-height:56px}
.reassurance{background:var(--creme);padding:26px 0 10px}
.puces{list-style:none;font-family:'Segoe UI',Arial,sans-serif;font-size:.9rem;color:var(--grey)}
.puces li{padding:4px 0 4px 18px;position:relative}
.puces li::before{content:"·";position:absolute;left:4px;color:var(--orange);font-weight:800}
.credit{margin-top:18px;display:flex;gap:12px;align-items:center;font-size:.9rem;color:var(--grey)}
.avatar{width:48px;height:48px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font-family:'Segoe UI',Arial,sans-serif;font-weight:800;flex:none}
.etape h2{color:var(--navy);font-size:1.5rem;line-height:1.25;margin-bottom:8px;outline:none}

/* Progression */
.progress{padding:18px 0 6px}
.progress p{font-family:'Segoe UI',Arial,sans-serif;font-size:.85rem;color:var(--grey);margin-bottom:8px}
.barre{height:6px;background:var(--sep);border-radius:3px;overflow:hidden}
.barre-in{height:100%;width:0;background:var(--orange);transition:width .35s ease}
@media(prefers-reduced-motion:reduce){.barre-in{transition:none}}

/* Groupes et chips */
.groupe{border:0;padding:0;margin:22px 0 0;min-width:0}
.groupe legend{font-family:'Segoe UI',Arial,sans-serif;font-weight:700;color:var(--navy);margin:0 0 10px;line-height:1.35;padding:0}
.fac{font-weight:400;color:var(--grey);font-size:.85rem}
.chip{display:flex;align-items:center;gap:12px;min-height:56px;padding:12px 16px;margin-bottom:10px;background:var(--white);border:1px solid var(--sep);border-radius:10px;cursor:pointer;position:relative;font-family:'Segoe UI',Arial,sans-serif}
.chip input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.chip-txt{flex:1;line-height:1.3;color:var(--text)}
.chip-txt b{color:var(--navy);font-weight:700}
.chip-txt small{display:block;color:var(--grey);font-size:.8rem;margin-top:2px}
.chip-check{opacity:0;color:var(--orange);font-weight:800;flex:none}
.chip.on,.chip:has(input:checked){border:2px solid var(--orange);background:var(--orange-8);padding:11px 15px}
.chip.on .chip-check,.chip:has(input:checked) .chip-check{opacity:1}
.chip:has(input:focus-visible){outline:3px solid var(--navy);outline-offset:2px}
.chip-compact{min-height:48px;margin-top:8px;display:inline-flex;padding:8px 16px;min-width:140px}
.mono{width:36px;height:36px;border-radius:8px;background:var(--navy);color:#fff;font-weight:800;font-size:.9rem;display:grid;place-items:center;flex:none}
.chips-2col{display:grid;gap:0 10px}
@media(min-width:600px){.chips-2col{grid-template-columns:1fr 1fr}}
.champ-autre{margin:-2px 0 12px}

/* Radio segmenté */
.segments{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--sep);border-radius:8px;overflow:hidden;background:var(--white)}
.segment2 .segments{grid-template-columns:repeat(2,1fr)}
.segment3 .segments{grid-template-columns:repeat(3,1fr)}
.segment4 .segments{grid-template-columns:repeat(4,1fr)}
.segments label{position:relative;min-height:52px;display:grid;place-items:center;text-align:center;padding:6px 4px;font-family:'Segoe UI',Arial,sans-serif;font-size:.85rem;line-height:1.2;cursor:pointer;border-right:1px solid var(--sep);color:var(--text)}
.segments label:last-child{border-right:0}
.segments input{position:absolute;opacity:0;width:1px;height:1px}
.segments label.on,.segments label:has(input:checked){background:var(--orange);color:var(--navy);font-weight:800}
.segments label:has(input:focus-visible){outline:3px solid var(--navy);outline-offset:-3px;z-index:1}
@media(max-width:360px){.segments label{font-size:.78rem}}

/* Champs texte */
.champ{width:100%;padding:14px 16px;min-height:52px;border:1px solid var(--sep);border-radius:6px;font-size:1rem;font-family:'Segoe UI',Arial,sans-serif;background:var(--white);color:var(--text)}
select.champ{appearance:auto}
.champ:focus-visible{outline:3px solid var(--navy);outline-offset:1px}
.champ[aria-invalid="true"]{border-color:var(--err)}
.champ-bloc{margin:22px 0 0}
.champ-bloc > label{display:block;font-family:'Segoe UI',Arial,sans-serif;font-weight:700;color:var(--navy);margin-bottom:6px;line-height:1.35}
.compteur{text-align:right;font-size:.8rem;color:var(--grey);font-family:'Segoe UI',Arial,sans-serif;margin-top:4px}
.compteur.alerte{color:var(--orange)}
.erreur{color:var(--err);font-family:'Segoe UI',Arial,sans-serif;font-size:.9rem;margin-top:6px}
.erreur[hidden]{display:none}
.erreur::before{content:"!";display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;border:2px solid currentColor;font-weight:800;font-size:.75rem;margin-right:6px;line-height:1}
.encart{background:var(--white);border-left:5px solid var(--orange);border-radius:8px;padding:16px 18px;margin-top:16px;font-size:.95rem}
.hp{position:absolute;left:-9999px;opacity:0}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.chk{display:flex;gap:10px;align-items:flex-start;margin-top:22px;font-family:'Segoe UI',Arial,sans-serif;font-size:.9rem;color:var(--text);cursor:pointer}
.chk input{width:22px;height:22px;flex:none;margin-top:2px;accent-color:var(--orange)}
.rgpd{font-size:.8rem;color:var(--grey);margin-top:10px;font-family:'Segoe UI',Arial,sans-serif}
.rgpd a{color:var(--navy)}

/* Barre de navigation sticky */
.navbar{position:fixed;left:0;right:0;bottom:0;background:var(--creme);border-top:1px solid var(--sep);padding:12px 0 calc(12px + env(safe-area-inset-bottom));z-index:10}
.navbar[hidden]{display:none}
.navbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px}
.navbar .btn{min-height:48px;padding:12px 28px;margin-left:auto}
.navbar .lien[hidden]{display:none}

/* Résultat */
.resultat .chiffre{font-family:'Segoe UI',Arial,sans-serif;font-weight:800;font-size:clamp(3.4rem,14vw,5.2rem);color:var(--orange);line-height:1;margin-top:8px}
.resultat .chiffre-sub{font-size:1.1rem;color:var(--navy);font-family:'Segoe UI',Arial,sans-serif;font-weight:600;margin-top:6px}
.resultat .chiffre-eur{margin-top:10px;font-size:1rem}
.resultat .chiffre-eur input{width:80px;padding:6px 8px;border:1px solid var(--sep);border-radius:6px;font-size:1rem;font-family:'Segoe UI',Arial,sans-serif;margin:0 4px}
.resultat h3{color:var(--navy);font-size:1.05rem;margin:22px 0 8px}
.top-taches{margin:6px 0 0 20px}
.top-taches li{padding:6px 0;border-top:1px solid var(--sep);display:flex;justify-content:space-between;gap:12px}
.top-taches li span:last-child{white-space:nowrap;font-family:'Segoe UI',Arial,sans-serif;font-weight:700;color:var(--navy)}
.resultat hr{border:0;border-top:1px solid var(--sep);margin:26px 0}
.resultat h2{font-size:1.5rem;color:var(--navy);line-height:1.25;outline:none}
#res-texte{margin-top:12px}
#res-texte p{margin:10px 0}
#res-texte ul,#res-texte ol{margin:6px 0 6px 22px}
#res-texte li{margin:6px 0}
#res-cta{margin-top:26px}
#res-cta-sub{margin-top:10px;font-size:.9rem;font-family:'Segoe UI',Arial,sans-serif}
.mention{margin-top:18px;font-size:.85rem;color:var(--grey);font-family:'Segoe UI',Arial,sans-serif}
.bandeau-erreur{margin-top:18px;background:var(--white);border:1px solid var(--err);border-radius:8px;padding:12px 16px;font-family:'Segoe UI',Arial,sans-serif;font-size:.9rem;color:var(--err)}
.bandeau-erreur .lien{color:var(--err);padding:0 2px;font-weight:700}
.ok{color:var(--ok);font-family:'Segoe UI',Arial,sans-serif;font-weight:600;margin-top:14px;font-size:.9rem}
.beta{background:var(--white);border:1px solid var(--orange);border-radius:12px;padding:22px;margin-top:28px}
.beta h3{color:var(--navy);font-size:1.1rem;margin-bottom:6px}
.beta p{font-size:.92rem;color:var(--grey)}
.beta .groupe{margin-top:14px}
.beta textarea{margin-top:12px;min-height:88px;resize:vertical}
.legend-aide{display:block;font-weight:400;font-size:.85rem;color:var(--muted,#666);margin-top:4px}
.res-decl{font-weight:400;font-size:.8rem;color:var(--muted,#666)}
.res-plus{display:block;padding:0}
.res-plus summary{cursor:pointer;color:var(--orange);font-weight:700;padding:10px 0;list-style:none}
.res-plus summary::before{content:"+ ";}
.res-plus details[open] summary::before{content:"– ";}
.res-plus ul{list-style:none;margin:0;padding:0}
.res-total{font-weight:700;border-top:2px solid var(--navy,#1b2a41);margin-top:4px}
.res-revu{font-size:.9rem;color:var(--muted,#666);margin-top:14px}
.res-modif{margin-top:10px}
.res-modif .lien{background:none;border:0;padding:0;color:var(--orange);font-weight:700;text-decoration:underline;cursor:pointer;font:inherit}