:root{
  --ink:#0B1220;        /* bleu nuit quasi noir — l'héritage */
  --ink-2:#121C2E;
  --line:#22304A;
  --text:#E8EDF5;
  --muted:#93A1B8;
  --accent:#22D3EE;     /* cyan électrique — le futur */
  --accent-2:#0EA5C6;
  --paper:#F6F7F9;
  --radius:14px;
  --max:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--text);font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.serif{font-family:"Fraunces",Georgia,serif;font-weight:400}

/* header */
header.top{position:sticky;top:0;z-index:10;background:rgba(11,18,32,.85);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:10px;color:var(--text);font-family:"Space Grotesk",sans-serif;font-weight:600;font-size:20px;letter-spacing:.04em}
.brand:hover{text-decoration:none}
.brand svg{width:34px;height:34px}
nav a{color:var(--muted);margin-left:22px;font-size:15px}
nav a:hover{color:var(--text);text-decoration:none}
.btn{display:inline-block;background:var(--accent);color:#04121A;font-weight:600;padding:12px 22px;border-radius:999px;border:0;cursor:pointer;font-size:15px;font-family:inherit}
.btn:hover{background:#67E8F9;text-decoration:none}
.btn.ghost{background:transparent;color:var(--text);border:1px solid var(--line)}
.btn.ghost:hover{border-color:var(--accent);color:var(--accent)}
nav .btn{margin-left:22px;padding:9px 18px;color:#04121A}

/* hero */
.hero{padding:96px 0 72px;position:relative;overflow:hidden}
.hero h1{font-family:"Space Grotesk",sans-serif;font-size:clamp(36px,5.5vw,64px);line-height:1.05;margin:0 0 20px;letter-spacing:-.02em;max-width:820px}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero p.lead{font-size:clamp(17px,2vw,20px);color:var(--muted);max-width:640px;margin:0 0 32px}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero svg.trace{position:absolute;right:-60px;top:40px;width:min(620px,70vw);opacity:.55;pointer-events:none}
.kicker{font-family:"Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.18em;font-size:12px;color:var(--accent);margin-bottom:14px}

section{padding:72px 0;border-top:1px solid var(--line)}
section h2{font-family:"Space Grotesk",sans-serif;font-size:clamp(26px,3.4vw,38px);margin:0 0 14px;letter-spacing:-.01em}
section p.sub{color:var(--muted);max-width:680px;margin:0 0 40px}

.grid{display:grid;gap:18px}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}
@media (max-width:860px){.g3,.g2{grid-template-columns:1fr}nav a:not(.btn){display:none}}
.card{background:var(--ink-2);border:1px solid var(--line);border-radius:var(--radius);padding:26px}
.card h3{font-family:"Space Grotesk",sans-serif;margin:0 0 8px;font-size:19px}
.card p{margin:0;color:var(--muted);font-size:15px}
.num{font-family:"Space Grotesk",sans-serif;color:var(--accent);font-size:13px;letter-spacing:.12em;margin-bottom:10px;display:block}

/* heritage */
.heritage{background:linear-gradient(180deg,var(--ink) 0%,#0E1626 100%)}
.heritage blockquote{font-family:"Fraunces",Georgia,serif;font-size:clamp(22px,2.8vw,32px);line-height:1.35;margin:0 0 18px;max-width:820px}
.heritage cite{color:var(--muted);font-style:normal;font-size:14px}

.notice{border-left:3px solid var(--accent);padding:14px 18px;background:rgba(34,211,238,.06);border-radius:0 10px 10px 0;color:var(--muted);font-size:15px}

/* forms */
.form-page{padding:56px 0 80px}
form .block{background:var(--ink-2);border:1px solid var(--line);border-radius:var(--radius);padding:26px;margin-bottom:18px}
form .block h3{font-family:"Space Grotesk",sans-serif;margin:0 0 4px;font-size:19px}
form .block p.hint{color:var(--muted);font-size:14px;margin:0 0 18px}
.row{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.row.r3{grid-template-columns:repeat(3,1fr)}
@media (max-width:700px){.row,.row.r3{grid-template-columns:1fr}}
label{display:block;font-size:14px;color:var(--muted);margin-bottom:6px}
input,select,textarea{width:100%;background:var(--ink);border:1px solid var(--line);border-radius:10px;color:var(--text);padding:11px 12px;font:inherit;font-size:15px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent)}
textarea{min-height:90px;resize:vertical}
.field{margin-bottom:14px}
.check{display:flex;gap:10px;align-items:flex-start;margin:12px 0;color:var(--text);font-size:15px}
.check input{width:auto;margin-top:4px}
.req{color:var(--accent)}
.hidden{display:none}

footer{border-top:1px solid var(--line);padding:36px 0;color:var(--muted);font-size:14px}
footer .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
/* vérification de la lecture du protocole */
table.verif{width:100%;border-collapse:collapse;font-size:14px}
table.verif th,table.verif td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
table.verif input{width:4.2em;padding:4px 6px}
table.verif tr.doute td{background:rgba(245,158,11,.14)}
table.verif tr.doute td:first-child{box-shadow:inset 3px 0 0 #F59E0B}
/* application installable */
.pwa-installer{position:fixed;left:16px;bottom:16px;z-index:50;display:flex;gap:6px;align-items:center;background:var(--panel,#121C2E);border:1px solid var(--line);border-radius:14px;padding:8px;box-shadow:0 10px 30px rgba(0,0,0,.35)}
.pwa-x{background:none;border:0;color:var(--muted,#93A1B8);font-size:22px;line-height:1;cursor:pointer;padding:0 6px}
.pwa-aide{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.6);display:flex;align-items:flex-end;justify-content:center;padding:16px}
.pwa-aide-boite{background:var(--panel,#121C2E);border:1px solid var(--line);border-radius:16px;padding:20px;max-width:420px;width:100%}
.pwa-aide-boite ol{padding-left:20px;line-height:1.7}
.pwa-hors-ligne{position:sticky;top:0;z-index:55;background:#F59E0B;color:#0B1220;text-align:center;padding:8px 12px;font-weight:600}
.lang-switch{display:flex;gap:6px;font-size:13px}
.lang-switch a{opacity:.7}.lang-switch a[aria-current]{opacity:1;color:var(--accent)}

@media (max-width:640px){.pwa-installer{left:12px;right:12px;bottom:72px;justify-content:space-between}}
.pwa-installer.pwa-installer-nav{position:static;box-shadow:none;border:0;background:none;padding:0}
.pwa-installer-nav .btn{padding:6px 12px;font-size:13px}

/* résultats publiés sur une demande (espace) */
.resultats{margin-top:12px;padding:12px 14px;border:1px solid var(--line);border-radius:10px}
.resultats .res-titre{font-weight:600;margin-bottom:6px}
.resultats .res-resume{margin:0 0 8px;white-space:pre-line;color:var(--muted);font-size:14px}
.resultats ul{list-style:none;margin:0 0 8px;padding:0}
.resultats li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:6px 0;border-top:1px solid var(--line)}
.resultats li:first-child{border-top:0}
.resultats li .btn{flex:0 0 auto}

/* suivi du cavalier (graphiques SVG générés par app.js) */
.suivi h3{font-family:"Space Grotesk",sans-serif;margin:18px 0 8px;font-size:18px}
.sv-graph{width:100%;height:auto;display:block;background:var(--ink);border:1px solid var(--line);border-radius:10px;padding:6px}
.sv-grille{stroke:var(--line);stroke-width:1}
.sv-axe{fill:var(--muted);font-size:11px;font-family:Inter,system-ui,sans-serif}
.sv-lib{fill:var(--text);font-size:12px;font-family:Inter,system-ui,sans-serif}
.sv-moy{stroke:var(--text);stroke-width:1.5;stroke-dasharray:4 4;opacity:.7}
.sv-pt{cursor:help}
.sv-legende{display:flex;flex-wrap:wrap;gap:6px 16px;margin:10px 0 4px;font-size:14px;align-items:center}
.sv-legende i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.sv-legende svg{vertical-align:middle;margin-right:4px}
.sv-details{margin:10px 0}
.sv-details summary{cursor:pointer;color:var(--muted);font-size:14px}
.sv-scroll{overflow-x:auto;margin-top:8px}
.sv-point{border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin:10px 0}
.sv-point.commun{border-color:rgba(245,158,11,.55);box-shadow:inset 3px 0 0 #F59E0B}
.sv-point-titre{font-weight:600}
.sv-expl{margin:6px 0;font-size:14px;color:var(--text)}
.sv-sous{font-size:14px;margin-top:6px}
.sv-pistes{margin:4px 0 0;padding-left:20px;font-size:14px;color:var(--muted)}
