/* Diagnostic gratuit Melbourne. Couleurs et mise en page reprises de l'artefact d'Amandine.
   Écarts, tous pour le contraste AA (vérifiés par tests/contrast.test.js) :
   - clair : --coral-ink #C9503B -> #C24A36 (texte corail sur le fond : 4,26 -> 4,62) ;
   - sombre : --mint #3E7D6B -> #397363 (texte sur le bandeau de remerciement : 4,15 -> 4,74) ;
   - nouveaux jetons : --btn-bg/--btn-ink (le texte blanc sur --coral n'atteignait que 2,9),
     --focus (contour de focus visible) et --field-line (bord des champs et des pastilles
     d'option, 3:1) ; la pastille de l'option choisie passe de --coral à --coral-ink.
   Polices Sora et Lato servies par le site lui-même : aucun appel à Google Fonts. */

@font-face { font-family: 'Sora'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/sora-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: 'Sora'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/sora-latin-600-normal.woff2) format('woff2'); }
@font-face { font-family: 'Sora'; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/sora-latin-700-normal.woff2) format('woff2'); }
@font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/lato-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: 'Lato'; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/lato-latin-700-normal.woff2) format('woff2'); }

:root{
  --bg:#FFF8F4; --card:#FFFFFF; --ink:#2B2320; --muted:#7A6A64; --line:#F0DED5;
  --coral:#F2705A; --coral-ink:#C24A36; --peach:#FBD9C8; --mint:#A8E0CF; --mint-ink:#2F8A70;
  --display:'Sora',system-ui,sans-serif; --body:'Lato',system-ui,sans-serif;
  --btn-bg:#C24A36; --btn-ink:#FFFFFF; --focus:#2F8A70; --field-line:#9C8C87;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#1D1715; --card:#28201D; --ink:#F5ECE7; --muted:#B8A69E; --line:#3D312C;
  --coral:#F2826E; --coral-ink:#F59C8A; --peach:#4A3129; --mint:#397363; --mint-ink:#8FDCC4;
  --btn-bg:#F2826E; --btn-ink:#1D1715; --focus:#8FDCC4; --field-line:#81695E;
  color-scheme:dark;
}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55}
[hidden]{display:none!important}
img,svg{max-width:100%}
a{color:var(--coral-ink);text-decoration:underline;text-underline-offset:2px}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
[tabindex="-1"]:focus{outline:none}

.wrap{max-width:640px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:28px 48px}
header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:28px;flex-wrap:wrap}
.brand{font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:-.01em}
.brand span{color:var(--coral)}
.tag{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.tag-accent{color:var(--coral-ink);font-weight:700}
h1,h2{font-family:var(--display);text-wrap:balance;letter-spacing:-.015em;margin:0}
h1{font-size:clamp(26px,6vw,36px);line-height:1.15}
h2{font-size:clamp(21px,4.6vw,26px);line-height:1.25}
p{margin:0}
.lead{color:var(--muted);max-width:60ch}
.display{font-family:var(--display)}
.stack{display:flex;flex-direction:column;gap:18px}
.stack.tight{gap:10px}
.stack.tight-4{gap:4px;min-width:0}
.stack.tight-6{gap:6px}
.stack.gap-12{gap:12px}

.paths{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-top:8px}
.path{text-align:left;background:var(--card);border:1.5px solid var(--line);border-radius:14px;padding:20px;cursor:pointer;color:var(--ink);font:inherit;display:flex;flex-direction:column;gap:8px;transition:border-color .15s,transform .15s}
.path:hover,.path:focus-visible{border-color:var(--coral);transform:translateY(-2px)}
.path b{font-family:var(--display);font-size:18px}
.path small{color:var(--muted);font-size:14px}
.path .who{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--coral-ink);font-weight:700}

.progress{height:6px;background:var(--line);border-radius:6px;overflow:hidden}
.progress i{display:block;height:100%;background:var(--coral);transition:width .3s}
.qcount{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.opts{display:flex;flex-direction:column;gap:10px}
.opt{display:flex;align-items:center;gap:12px;background:var(--card);border:1.5px solid var(--line);border-radius:12px;padding:14px 16px;cursor:pointer;font:inherit;color:var(--ink);text-align:left}
.opt:hover{border-color:var(--coral)}
.opt .dot{flex:none;width:18px;height:18px;border-radius:50%;border:2px solid var(--field-line)}
.opt.sel{border-color:var(--coral-ink);background:var(--peach)}
.opt.sel .dot{border-color:var(--coral-ink);background:var(--coral-ink);box-shadow:inset 0 0 0 3px var(--peach)}

.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.btn{font:inherit;font-weight:700;border-radius:999px;padding:12px 22px;cursor:pointer;border:1.5px solid var(--btn-bg);background:var(--btn-bg);color:var(--btn-ink)}
.btn:disabled{opacity:.5;cursor:default}
.btn.ghost{background:transparent;color:var(--coral-ink);border-color:var(--coral-ink)}
.note{font-size:13px;color:var(--muted)}

.score{display:flex;align-items:center;gap:20px;background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:20px;flex-wrap:wrap}
.gauge{flex:none;width:96px;height:96px}
.gauge .track{stroke:var(--line)}
.gauge .value{stroke:var(--coral)}
.gauge text{font-family:var(--display);font-weight:700;fill:var(--ink)}
.level{font-family:var(--display);font-weight:600;font-size:19px}
.recos{display:flex;flex-direction:column;gap:12px}
.reco{background:var(--card);border-radius:12px;padding:16px 18px;border:1.5px solid var(--line)}
.reco b{display:block;font-family:var(--display);font-size:16px;margin-bottom:4px}

form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
form .full{grid-column:1/-1}
@media (max-width:520px){form{grid-template-columns:1fr}}
label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted);font-weight:700}
input{font:inherit;color:var(--ink);background:var(--card);border:1.5px solid var(--field-line);border-radius:10px;padding:11px 12px;min-width:0}
input:focus{border-color:var(--coral-ink)}
input[aria-invalid="true"]{border-color:var(--coral-ink);border-width:2px}
.consent{flex-direction:row;align-items:flex-start;gap:10px;font-weight:400;font-size:14px;color:var(--ink)}
.consent input{flex:none;width:18px;height:18px;margin:2px 0 0;padding:0;accent-color:var(--btn-bg)}
.hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.ok{background:var(--mint);color:var(--ink);border-radius:14px;padding:18px}
.err{color:var(--coral-ink);font-size:14px;font-weight:700}

.foot{margin-top:40px;padding-top:16px;border-top:1.5px solid var(--line);font-size:13px;color:var(--muted)}

/* Page « Données personnelles et mentions légales » */
.legal{max-width:68ch}
.legal h1{margin-bottom:8px}
.legal h2{font-size:clamp(19px,4vw,22px);margin-top:32px;margin-bottom:10px}
.legal h3{font-family:var(--display);font-size:16px;margin:20px 0 6px}
.legal p,.legal ul,.legal dl{margin:0 0 12px}
.legal ul{padding-left:20px}
.legal li{margin-bottom:6px}
.legal dt{font-weight:700}
.legal dd{margin:0 0 10px}
.todo{background:var(--peach);color:var(--ink);border-radius:4px;padding:0 4px;font-weight:700}

@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* Page de la plaquette des promoteurs (public/plaquette/) : pages en images, liens en forme de bouton. */
.plaquette{display:grid;gap:16px}
.plaquette img{display:block;width:100%;height:auto;border-radius:12px;border:1px solid var(--line)}
a.btn{display:inline-block;text-decoration:none}