
:root{
  --blue:#213d65;
  --lightblue:#7395c4;
  --pink:#bf366d;
  --lightpink:#d66f98;
  --yellow:#f6a000;
  --bg:#f7f9fc;
  --danger:#d93025;
}
*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;margin:0;background:var(--bg);color:#222}
.header{background:var(--blue);color:#fff;padding:18px 16px;display:flex;align-items:center}
.header .logo{height:32px;width:auto;margin-right:12px}
.container{max-width:960px;margin:0 auto;padding:16px}
.card{background:#fff;border-radius:14px;box-shadow:0 6px 18px rgba(0,0,0,.06);padding:18px;margin:14px 0}
h1{font-size:22px;margin:0}
h2{font-size:18px;color:#213d65;margin:6px 0 10px}
.subtitle{color:#fff;opacity:0.95;margin-top:4px}
label{display:block;margin:10px 0 6px;font-weight:600}
.req{color:var(--danger);margin-left:4px}
input[type=text],input[type=email],input[type=tel]{width:100%;padding:10px 12px;border:1px solid #d9e1ec;border-radius:10px}
.consent{display:block;margin:8px 0 0}
.consent label{display:block;margin:8px 0}
.btn{display:inline-block;background:var(--pink);color:#fff;border:0;border-radius:12px;padding:10px 16px;font-weight:700;cursor:pointer}
.btn.secondary{background:var(--blue)}
.q{padding:12px 0;border-bottom:1px dashed #e7edf6}
.q:last-child{border-bottom:0}
.q .q-label{font-size:18px;line-height:1.4}
.scale{display:flex;gap:6px;margin-top:8px;flex-wrap:nowrap}
.scale input{display:none}
.scale label{min-width:42px;text-align:center;padding:8px;border:1px solid #d9e1ec;border-radius:12px;cursor:pointer;font-weight:700}
.scale input:checked + label{background:var(--lightpink);color:#fff;border-color:var(--pink)}
.scale-caption{display:flex;justify-content:space-between;font-size:12px;color:#555;margin-top:6px}
.progress{height:12px;background:#eef2f8;border-radius:999px;overflow:hidden}
.bar{height:100%;background:var(--yellow);width:0;transition:width .4s ease}
.kpi{display:flex;align-items:center;justify-content:space-between;margin:8px 0}
.kpi strong{color:#213d65}
.footer{font-size:12px;color:#444;line-height:1.4}
.notice{background:#fff3cd;border:1px solid #ffeeba;padding:8px;border-radius:10px}
.small{font-size:12px}
.section-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.section-badge{display:inline-block;background:#7395c4;color:#fff;font-weight:700;padding:4px 8px;border-radius:999px;font-size:12px}
.grid{display:grid;grid-template-columns:1fr 1fr; gap:12px}
@media (max-width:700px){ .grid{grid-template-columns:1fr} }

/* Couleurs de barres par niveau */
.bar.lvl-red > i    { background: linear-gradient(90deg,#e53935,#ef5350); }
.bar.lvl-orange > i { background: linear-gradient(90deg,#fb8c00,#ffb300); }
.bar.lvl-green > i  { background: linear-gradient(90deg,#43a047,#66bb6a); }
.bar.lvl-blue > i   { background: linear-gradient(90deg,#1e3a8a,#3b82f6); }
