/* Test de niveau (T-TEST), d'après les écrans Cobalt d'Ulysse (01-DA/cobalt-test-niveau/source/test-cobalt.css). */

/* Accueil : petit bouton secondaire sous « Essayez gratuitement » (demande de Ben) */
.hero .tn-accueil-btn{margin-top:10px;min-height:48px;font-size:16px}
@media(min-width:900px){ .hero .tn-accueil-btn{display:flex;width:fit-content;padding:12px 24px} }

/* Écrans du test */
.tn .tn-etape,.tn-etape{font:800 13px/1.3 var(--titre);letter-spacing:.06em;text-transform:uppercase;color:var(--gris);margin:0}
.tn h1{margin:6px 0 12px}
.tn-bandeau .da-art{height:180px;border-radius:12px;margin:0 0 16px}
.tn-faits{list-style:none;padding:4px 16px;margin:16px 0;background:var(--blanc);border:1px solid var(--trait);border-radius:12px}
.tn-faits li{display:flex;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--trait);font-size:17px}
.tn-faits li:first-child{border-top:0}
.tn-faits b{font:800 20px/1 var(--titre);min-width:36px;color:var(--bleu)}

.tn-haut .tn-compteur,.tn-compteur{font:800 16px/1 var(--titre);color:var(--encre)}
.tn-compteur span{color:var(--gris);font-weight:700}
.tn-progres{height:8px;border-radius:4px;background:var(--zone);margin:10px auto 0;max-width:var(--lecture);overflow:hidden}
.tn-progres i{display:block;height:100%;background:var(--bleu);border-radius:4px}
.tn-domaine{display:inline-block;font:800 12px/1 var(--titre);letter-spacing:.06em;text-transform:uppercase;color:var(--bleu-f);background:var(--bleu-p);border-radius:3px;padding:6px 8px;margin:0 0 12px}
.tn-situation{background:var(--blanc);border:1px solid var(--trait);border-radius:12px;padding:14px 16px;font-size:18px;margin:0 0 14px}
.tn h1.tn-q{font-size:25px;margin:0 0 14px}
.tn-choix{display:grid;gap:10px}
.tn-opt{display:flex;gap:12px;align-items:flex-start;background:var(--blanc);border:2px solid var(--contour);border-radius:12px;padding:12px 14px;min-height:56px;cursor:pointer;font-size:17px;line-height:1.4;position:relative}
.tn-opt input{position:absolute;opacity:0;pointer-events:none}
.tn-opt .rond{flex:none;width:24px;height:24px;border-radius:50%;border:2px solid var(--contour);background:var(--blanc);margin-top:1px;display:grid;place-items:center}
.tn-opt:has(input:checked){border-color:var(--bleu);background:var(--bleu-p)}
.tn-opt:has(input:checked) .rond{border-color:var(--bleu)}
.tn-opt:has(input:checked) .rond::after{content:"";width:12px;height:12px;border-radius:50%;background:var(--bleu)}
.tn-opt:has(input:focus-visible){outline:3px solid var(--bleu);outline-offset:2px}
.barre-bas .petit.centre{margin:8px 0 0;font-size:14px;color:var(--gris)}

.tn-note{display:flex;align-items:baseline;gap:8px;margin:8px 0 6px}
.tn-note b{font:800 76px/1 var(--titre);letter-spacing:-.03em;color:var(--encre)}
.tn-note span{font:800 28px/1 var(--titre);color:var(--gris)}
.tn-verdict{font-size:19px;margin:0 0 16px}
.tn-carte{background:var(--blanc);border:1px solid var(--trait);border-radius:12px;padding:16px;display:grid;gap:12px;margin:0 0 14px}
.tn-carte h2{font-size:21px;margin:0}
.tn-dom{display:grid;gap:6px}
.tn-dom .l{display:flex;justify-content:space-between;gap:10px;font-size:17px}
.tn-dom .l b{font-family:var(--titre);font-weight:800;white-space:nowrap}
.tn-jauge{display:block;height:10px;border-radius:5px;background:var(--zone);overflow:hidden}
.tn-jauge i{display:block;height:100%;background:var(--bleu)}
.tn-points{list-style:none;padding:0;margin:0;display:grid;gap:10px;counter-reset:p}
.tn-points li{counter-increment:p;display:grid;grid-template-columns:30px 1fr;gap:10px;font-size:17px;line-height:1.4}
.tn-points li::before{content:counter(p);width:28px;height:28px;border-radius:50%;background:var(--bleu-p);color:var(--bleu-f);font:800 15px/28px var(--titre);text-align:center}
.tn-points small{display:block;color:var(--gris);font-size:15px}

.tn-corr{background:var(--blanc);border:1px solid var(--trait);border-radius:12px;padding:14px 16px;display:grid;gap:8px;margin:0 0 12px}
.tn-corr p{margin:0}
.tn-corr .tete{display:flex;justify-content:space-between;gap:8px;align-items:center}
.tn-lib{font:800 12px/1 var(--titre);letter-spacing:.05em;text-transform:uppercase;border-radius:3px;padding:6px 8px;white-space:nowrap}
.tn-lib.ok{background:#E9F2EC;color:#176C50}
.tn-lib.ko{background:#F9EBE7;color:#AD362B}
.tn-corr .tn-sit{font-size:16px;line-height:1.45}
.tn-corr .rep{font-size:16px;line-height:1.4}
.tn-corr .rep.ko{color:#AD362B}
.tn-corr .rep.ok{color:#176C50;font-weight:700}
.tn-corr .expl{font-size:16px;line-height:1.45}
.tn-corr .src{font-size:14px;color:var(--gris)}
.tn-corr .src a{color:var(--gris);display:inline-block;min-height:44px;padding:10px 0}

.tn-histo{list-style:none;padding:4px 16px;margin:12px 0 16px;background:var(--blanc);border:1px solid var(--trait);border-radius:12px}
.tn-histo li{display:grid;grid-template-columns:96px 1fr 56px;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--trait);font-size:16px}
.tn-histo li:first-child{border-top:0}
.tn-histo .d{color:var(--gris)}
.tn-histo .n{font:800 19px/1 var(--titre);text-align:right}
.tn-histo .n small{font-size:13px;color:var(--gris)}
.tn-histo li.dernier .n{color:var(--bleu)}
.tn-histo li.dernier .d{color:var(--encre);font-weight:700}
.tn-encart{font-size:16px;border-radius:8px;padding:12px 14px;background:var(--bleu-p);color:var(--bleu-f);margin:0 0 12px}
main.tn .btn{margin-top:8px}
