/* Mise en page : une colonne étroite, étapes numérotées par document, bandeau d'aperçu en haut. */
:root{
  --bg:#f5f6f8; --surface:#ffffff; --ink:#14181f; --muted:#5b6472; --line:#dde1e8;
  --accent:#1f3fd1; --accent-ink:#ffffff; --accent-soft:#e8ecfd; --ok:#13795b; --ok-soft:#e2f4ee; --warn-soft:#fff4d6;
  --display:'Bricolage Grotesque','Helvetica Neue',Arial,sans-serif; --body:'DM Sans','Helvetica Neue',Arial,sans-serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0f1218; --surface:#171b24; --ink:#eef0f4; --muted:#9aa3b2; --line:#2a303c;
  --accent:#8ea2ff; --accent-ink:#0f1218; --accent-soft:#1f2640; --ok:#4cc9a0; --ok-soft:#14302a; --warn-soft:#3a3118; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#0f1218; --surface:#171b24; --ink:#eef0f4; --muted:#9aa3b2; --line:#2a303c;
  --accent:#8ea2ff; --accent-ink:#0f1218; --accent-soft:#1f2640; --ok:#4cc9a0; --ok-soft:#14302a; --warn-soft:#3a3118; color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 var(--body);padding-inline:16px;padding-block:0 56px}
.wrap{max-width:640px;margin-inline:auto}
.preview{background:var(--warn-soft);font-size:13px;padding:8px 16px;margin-inline:-16px;text-align:center}
header{display:flex;align-items:center;justify-content:space-between;padding-block:24px 8px}
.brand{font:700 22px/1 var(--display);letter-spacing:.14em}
.lock{font-size:13px;color:var(--muted)}
h1{font:700 clamp(28px,6vw,38px)/1.1 var(--display);letter-spacing:-.02em;margin:20px 0 10px;text-wrap:balance}
.lead{color:var(--muted);margin:0 0 28px;max-width:56ch}
section{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:22px;margin-bottom:16px}
h2{font:700 18px/1.2 var(--display);margin:0 0 4px}
.hint{color:var(--muted);font-size:14px;margin:0 0 16px}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.grid .full{grid-column:1/-1}
label{display:block;font-weight:500;font-size:14px;margin-bottom:6px}
input[type=text],input[type=tel],input[type=email]{width:100%;font:inherit;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:12px 14px;min-height:46px}
input:focus-visible,.drop:focus-within,button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.doc{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;padding-block:16px;border-top:1px solid var(--line)}
.doc:first-of-type{border-top:0;padding-top:0}
.ico{width:40px;height:40px;border-radius:10px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;font-size:20px;grid-row:span 2}
.doc strong{font-weight:700}.doc .tag{font-size:12px;color:var(--muted);margin-left:6px;font-weight:400}
.drop{grid-column:1/-1;margin-top:10px;display:flex;align-items:center;gap:12px;border:1.5px dashed var(--line);border-radius:10px;padding:14px;cursor:pointer;min-width:0}
.drop:hover{border-color:var(--accent)}
.drop input{position:absolute;opacity:0;width:1px;height:1px}
.drop .btn{flex:none;background:var(--accent-soft);color:var(--accent);font-weight:700;font-size:14px;padding:8px 12px;border-radius:8px}
.drop .name{color:var(--muted);font-size:14px;overflow-wrap:anywhere;min-width:0}
.drop.has{border-style:solid;border-color:var(--ok);background:var(--ok-soft)}
.drop.has .name{color:var(--ink)}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--muted)}
.consent input{margin-top:4px;width:20px;height:20px;flex:none;accent-color:var(--accent)}
button.send{width:100%;font:700 17px var(--body);background:var(--accent);color:var(--accent-ink);border:0;border-radius:12px;min-height:54px;cursor:pointer;margin-top:8px}
button.send:disabled{opacity:.45;cursor:not-allowed}
.after{font-size:14px;color:var(--muted);text-align:center;margin-top:14px}
.done{text-align:center;padding-block:32px}.done .check{font-size:44px}
.err{color:#b3261e;font-size:13px;margin-top:6px}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .err{color:#ff8a80}}
:root[data-theme="dark"] .err{color:#ff8a80}
@media (max-width:480px){.grid{grid-template-columns:1fr}}

.err-box{background:var(--warn-soft);border-radius:10px;padding:12px 14px;margin-bottom:16px;font-size:14px}
.plain{display:block;font-weight:700;font-size:15px}
