/* Le test des 4 éléments sur le .com (16/10/2026) — même style que le diagnostic (diagnostic.css est aussi chargé). */
.q4-titre{font-size:clamp(26px,4vw,40px);letter-spacing:-.03em;margin:0 0 26px}
.q4-question{font-size:clamp(21px,3vw,28px);line-height:1.3;margin:0 0 26px}
.q4-reponses{list-style:none;padding:0;margin:0 0 10px;display:grid;gap:14px}
.q4-reponse{border:1px solid #2c2c33;border-radius:14px;padding:16px 18px;background:#0d0d10}
.q4-texte{display:block;font-size:17px;font-weight:600;line-height:1.45;color:#f5f5f7}
.q4-detail{display:block;color:#a1a1aa;font-size:14px;line-height:1.5;margin:6px 0 12px}
.q4-notes{display:flex;gap:8px}
.q4-notes button{width:44px;height:44px;border-radius:50%;border:1px solid #3a3a42;background:transparent;color:#d4d4d8;font:inherit;font-weight:600;cursor:pointer}
.q4-notes button:hover{border-color:#5a5a66}
.q4-notes button.choisi{background:var(--blue);border-color:var(--blue);color:#fff}
.q4-ordre{list-style:none;padding:0;margin:0 0 30px;display:grid;gap:12px}
.q4-el{display:grid;grid-template-columns:54px 1fr auto;align-items:center;gap:4px 14px;border:1px solid #2c2c33;border-radius:16px;padding:16px 18px;background:#0d0d10}
.q4-el b{font-size:22px}
.q4-rang{grid-row:span 2;font-size:15px;font-weight:700;color:#a1a1aa}
.q4-el:first-child .q4-rang{color:#fff}
.q4-pc{font-weight:700;font-size:18px}
.q4-jauge{grid-column:2 / 4;height:6px;background:#242429;border-radius:6px;overflow:hidden}
.q4-jauge i{display:block;height:100%;border-radius:6px}
.q4-feu .q4-jauge i{background:#ff6b3d}.q4-air .q4-jauge i{background:#d9d9e0}.q4-terre .q4-jauge i{background:#3ddc84}.q4-eau .q4-jauge i{background:#218bff}
.q4-telecharger{margin:0 0 44px}
.q4-fin h2{font-size:clamp(22px,3vw,30px);margin:0 0 16px}
.q4-fin p{color:#c7c7cc;font-size:16px;line-height:1.65}
.q4-colonnes{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:30px 0 10px}
.q4-colonne{border:1px solid #2c2c33;border-radius:14px;padding:14px 16px}
.q4-colonne h3{margin:0 0 8px;font-size:15px}
.q4-colonne p{margin:4px 0;color:#c7c7cc;font-size:14.5px}
.q4-boutons{flex-wrap:wrap}
.q4-boutons .button{margin-left:0}
.q4-boutons a.retour{text-decoration:none;display:inline-flex;align-items:center}
.q4-message{color:#3ddc84;margin-top:14px}
@media (max-width:640px){.q4-colonnes{grid-template-columns:1fr}.q4-notes button{width:40px;height:40px}}
