/* Page Test HTML email */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.test-hero{padding:56px 0 120px}
.test-hero-wrap{display:block!important;max-width:880px}
.test-hero h1{font-size:clamp(30px,4.2vw,50px)}
.test-promesses{list-style:none;display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:22px;font-size:15px;color:rgba(255,255,255,.85)}
.test-promesses li::before{content:"✓";color:var(--mint);font-weight:800;margin-right:8px}

.test-zone{padding:0 0 60px;margin-top:-80px;position:relative;z-index:2}
.test-card{background:#fff;border-radius:22px;box-shadow:0 30px 70px rgba(16,46,74,.18);padding:26px;border:1px solid var(--line)}
.test-tabs{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.test-tabs button{border:1px solid var(--line);background:var(--bg-soft);color:var(--navy);font:600 15px/1 var(--font,inherit);padding:11px 18px;border-radius:999px;cursor:pointer;font-family:inherit}
.test-tabs button.actif{background:var(--navy);color:#fff;border-color:var(--navy)}
#code-html{width:100%;min-height:260px;border:1px solid var(--line);border-radius:14px;padding:16px;font:13px/1.5 ui-monospace,Consolas,Menlo,monospace;background:#fbfcfd;color:var(--ink);resize:vertical}
#code-html:focus{outline:2px solid var(--accent);border-color:transparent}
.test-depot{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:260px;border:2px dashed #c4d0dc;border-radius:14px;cursor:pointer;color:var(--muted);text-align:center;padding:20px}
.test-depot strong{color:var(--navy);font-size:18px}
.test-depot.survol{border-color:var(--accent);background:#fff6f1}
.test-depot input{position:absolute;opacity:0;width:1px;height:1px}
.test-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:18px}
.test-actions .btn{border:0;cursor:pointer;font-family:inherit}
.test-actions .btn-outline{background:transparent}
.test-note{font-size:14px;color:var(--muted)}
.test-note.erreur{color:#d64545;font-weight:600}

.test-scan{max-width:560px;margin:36px auto 0;background:var(--navy);color:#fff;border-radius:20px;padding:26px 28px}
.test-scan ol{list-style:none;display:grid;gap:10px;margin:0 0 16px;font-size:16px}
.test-scan li{display:flex;align-items:center;gap:12px;opacity:.95;animation:apparait .25s ease-out}
.test-scan li::before{content:"";width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:var(--accent);animation:tourne .7s linear infinite;flex:0 0 auto}
.test-scan li.fait::before{border:0;animation:none;background:var(--mint);content:"✓";color:#0b2238;font-size:11px;font-weight:800;display:grid;place-items:center}
.test-skip{background:none;border:0;color:rgba(255,255,255,.7);text-decoration:underline;cursor:pointer;font:14px inherit;font-family:inherit;padding:0}
@keyframes tourne{to{transform:rotate(360deg)}}
@keyframes apparait{from{opacity:0;transform:translateY(4px)}}

.test-resultats{margin-top:40px}
.test-synthese{display:grid;grid-template-columns:200px 1fr;gap:36px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:22px;padding:30px;margin-bottom:26px}
.jauge{position:relative;width:200px;height:200px}
.jauge svg{width:100%;height:100%;transform:rotate(-90deg)}
.jauge circle{fill:none;stroke-width:10}
.jauge-fond{stroke:var(--bg-soft)}
.jauge-valeur{stroke-linecap:round;transition:stroke .3s}
.jauge-texte{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.jauge-texte strong{font-size:58px;font-weight:800;color:var(--navy);line-height:1}
.jauge-texte span{color:var(--muted);font-size:15px}
.test-verdict h2{margin:6px 0 8px;font-size:clamp(22px,2.6vw,30px)}
.test-verdict #compteurs{color:var(--muted);margin-bottom:16px}
.test-chiffres{list-style:none;display:flex;flex-wrap:wrap;gap:10px}
.test-chiffres li{background:var(--bg-soft);border-radius:12px;padding:10px 14px;display:flex;flex-direction:column;min-width:110px}
.test-chiffres span{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:700}
.test-chiffres strong{font-size:18px;color:var(--navy)}

.cat{background:#fff;border:1px solid var(--line);border-radius:18px;padding:8px 24px 14px;margin-bottom:16px}
.cat-tete{display:flex;justify-content:space-between;align-items:center;padding:14px 0 8px;border-bottom:1px solid var(--line);opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s}
.cat-tete h3{color:var(--navy);font-size:19px;margin:0}
.cat-score{font-weight:800;font-size:17px}
.cat ul{list-style:none}
.ligne{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line);opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s}
.ligne:last-child{border-bottom:0}
.ligne.visible,.cat-tete.visible{opacity:1;transform:none}
.ligne strong{color:var(--navy);display:block}
.ligne p{color:var(--muted);font-size:15px;margin-top:4px}
.pastille{flex:0 0 auto;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;padding:5px 9px;border-radius:999px;min-width:84px;text-align:center;margin-top:2px}
.niv-critique .pastille{background:#fde3e3;color:#b42323}
.niv-warning .pastille{background:#fff0dc;color:#a35c00}
.niv-info .pastille{background:#e6eef7;color:#1d4468}
.niv-ok .pastille{background:#d9f6ec;color:#11785b}
.test-imprimer{text-align:center;margin-top:20px}
.test-imprimer .btn{border:2px solid var(--navy);background:transparent;cursor:pointer;font-family:inherit}

.test-avis{background:var(--bg-soft);padding:70px 0}
.test-avis-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:start}
.test-avis p{color:var(--muted);margin-bottom:14px}
.test-signature{font-weight:700;color:var(--navy)!important}
.test-form{background:#fff;border-radius:22px;padding:28px;border:1px solid var(--line);display:grid;gap:14px}
.test-form label{display:grid;gap:6px;font-size:14px;font-weight:600;color:var(--navy)}
.test-form input,.test-form select,.test-form textarea{font:15px/1.4 inherit;font-family:inherit;padding:11px 12px;border:1px solid #d3dce5;border-radius:10px;background:#fbfcfd;color:var(--ink);width:100%}
.test-form input:focus,.test-form select:focus,.test-form textarea:focus{outline:2px solid var(--accent);border-color:transparent}
.champ-double{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.test-form .case{display:flex;gap:10px;align-items:flex-start;font-weight:400;color:var(--muted);font-size:13px}
.test-form .case input{width:auto;margin-top:3px}
.test-form .case a{color:var(--accent-dark)}
.test-form .btn{border:0;cursor:pointer;justify-content:center;font-family:inherit}
.test-form .btn:disabled{opacity:.6;cursor:default}
.hp{position:absolute!important;left:-9999px!important}
.form-message{font-size:15px;margin:0}
.form-message.succes{color:#11785b;font-weight:600}
.form-message.erreur{color:#b42323;font-weight:600}

@media (max-width:860px){
  .test-synthese{grid-template-columns:1fr;justify-items:center;text-align:center}
  .test-chiffres{justify-content:center}
  .test-avis-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .test-card{padding:18px}
  .champ-double{grid-template-columns:1fr}
  .cat{padding:6px 16px 10px}
  .ligne{flex-direction:column;gap:8px}
  .jauge{width:170px;height:170px}
}
@media (prefers-reduced-motion:reduce){.ligne,.cat-tete{transition:none}.test-scan li::before{animation:none}}

@media print{
  .topbar,footer,.test-hero,.test-card,.test-avis,.test-contenu,.steps,.faq,#contact,.test-imprimer,#cc-main{display:none!important}
  body{background:#fff}
  .test-zone{margin:0;padding:0}
  .test-resultats{margin:0}
  .test-resultats::before{content:"Rapport de test HTML email · pole-emailing.fr";display:block;font-weight:800;color:#102e4a;font-size:18px;margin-bottom:14px}
  .ligne,.cat-tete{opacity:1!important;transform:none!important}
  .cat,.test-synthese{break-inside:avoid;box-shadow:none}
  .pastille{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}