/* Outil « Vérifiez votre devis » — même langage visuel que la page CESI
   (tokens repris de calculateur_ecs.css), scopé à .audit-wrap. */

.audit-wrap{
  --orange:#E8820C; --orange-50:#fdf4e7; --orange-700:#a95905; --yellow:#F4B400;
  --navy:#0F2D52; --navy-700:#1a3d6b; --navy-50:#eaf0f8; --ink:#0F2D52;
  --text:#27364b; --text-muted:#667085; --border:#e7ebf1; --border-strong:#d6dbe4;
  --bg:#ffffff; --bg-soft:#fbfaf7;
  --good:#117a57; --good-50:#e6f4ee; --good-bd:#bfe3d2;
  --warn:#b45309; --warn-50:#fef3c7; --warn-bd:#f3d999;
  --bad:#c0392b;  --bad-50:#fdecea;  --bad-bd:#f2c3bd;
  --na:#8a93a3;   --na-50:#f4f6f9;   --na-bd:#e3e8ef;
  --shadow-sm:0 1px 2px rgba(15,45,82,.05);
  --shadow-md:0 4px 20px -4px rgba(15,45,82,.1), 0 2px 4px rgba(15,45,82,.04);

  max-width:900px; margin:0 auto; padding:28px 20px 60px;
  color:var(--text); font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  -webkit-font-smoothing:antialiased;
}
.audit-wrap *{ box-sizing:border-box; }
.audit-wrap h1,.audit-wrap h2,.audit-wrap h3{ color:var(--ink); font-weight:700; letter-spacing:-.02em; margin:0; }
.audit-wrap p{ margin:0; }

.audit-wrap .card{ background:var(--bg); border:1px solid var(--border); border-radius:14px; box-shadow:var(--shadow-sm); padding:26px; margin-bottom:18px; }

/* Hero */
.audit-wrap .hero{ padding:0; overflow:hidden; position:relative; }
.audit-wrap .hero::before{ content:''; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--yellow),var(--orange)); }
.audit-wrap .hero-inner{ padding:34px 34px 28px; }
.audit-wrap .eyebrow{ display:inline-flex; align-items:center; gap:8px; font-size:11px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; color:var(--orange); padding:5px 11px; border-radius:999px; background:var(--orange-50); }
.audit-wrap .eyebrow .dot{ width:5px; height:5px; border-radius:999px; background:currentColor; }
.audit-wrap .hero h1{ font-size:clamp(26px,3.4vw,34px); margin-top:14px; line-height:1.2; }
.audit-wrap .hero p{ font-size:15px; line-height:1.65; color:var(--text-muted); margin-top:14px; max-width:660px; }

.audit-wrap .opt{ font-weight:500; color:var(--text-muted); font-size:12.5px; }

/* Fields */
.audit-wrap .field{ margin-bottom:18px; }
.audit-wrap .field:last-child{ margin-bottom:0; }
.audit-wrap .field label{ display:block; font-size:13px; font-weight:600; color:var(--ink); margin-bottom:7px; }
.audit-wrap input[type=text],.audit-wrap input[type=number],.audit-wrap select{
  border:1px solid var(--border-strong); border-radius:10px; padding:12px 14px; font-size:14px;
  width:100%; outline:none; background:var(--bg); color:var(--text); font-family:inherit;
  transition:border-color .15s,box-shadow .15s;
}
.audit-wrap input:focus,.audit-wrap select:focus{ border-color:var(--orange); box-shadow:0 0 0 3px rgba(232,130,12,.12); }
.audit-wrap .grid2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.audit-wrap .hint{ font-size:12px; color:var(--text-muted); margin-top:7px; line-height:1.5; }
.audit-wrap .check{ display:flex; align-items:center; gap:10px; font-size:14px; color:var(--text); cursor:pointer; padding:6px 0; }
.audit-wrap .check input{ width:18px; height:18px; accent-color:var(--orange); }

/* CTA submit */
.audit-wrap .cta{ display:inline-flex; align-items:center; justify-content:center; gap:9px; background:var(--orange); color:#fff; padding:15px 26px; border-radius:11px; font-weight:600; font-size:15px; border:none; cursor:pointer; box-shadow:0 1px 0 rgba(255,255,255,.2) inset,0 8px 20px -6px rgba(232,130,12,.45); transition:transform .15s ease; font-family:inherit; width:100%; }
.audit-wrap .cta:hover{ transform:translateY(-1px); }
.audit-wrap .spin{ display:none; width:16px; height:16px; border:2px solid rgba(255,255,255,.5); border-top-color:#fff; border-radius:50%; animation:aspin .7s linear infinite; }
.audit-wrap .htmx-request .spin{ display:inline-block; }
.audit-wrap .htmx-request .cta-label{ opacity:.85; }
@keyframes aspin{ to{ transform:rotate(360deg); } }

.audit-wrap .avert{ font-size:12px; color:var(--text-muted); line-height:1.6; margin-top:18px; padding:14px 16px; background:var(--bg-soft); border:1px solid var(--border); border-radius:11px; }
.audit-wrap .errbox{ padding:15px 17px; border-radius:11px; background:var(--bad-50); border:1px solid var(--bad-bd); color:#7a271f; font-size:13.5px; line-height:1.55; }
.audit-wrap .errbox ul{ margin:8px 0 0; padding-left:20px; }

.audit-wrap .crosscta{ display:flex; align-items:center; justify-content:center; gap:8px; margin-top:18px; padding:15px 22px; border-radius:12px; background:linear-gradient(135deg,#0F2D52,#1a3d6b); color:#fff; font-weight:600; font-size:14px; text-decoration:none; box-shadow:var(--shadow-md); }
.audit-wrap .crosscta:hover{ filter:brightness(1.08); }

@media (max-width:640px){ .audit-wrap .grid2{ grid-template-columns:1fr; } .audit-wrap .hero-inner{ padding:26px 22px; } .audit-wrap .card{ padding:20px; } }

/* ══════════ Autocomplétion, bascule panneau, retour ══════════ */

/* Autocomplétion adresse */
.audit-wrap .ac{ position:relative; }
.audit-wrap .ac-sug{ position:absolute; left:0; right:0; top:100%; margin-top:6px; z-index:20;
  background:var(--bg); border:1px solid var(--border); border-radius:10px; box-shadow:var(--shadow-md); overflow:hidden; }
.audit-wrap .ac-item{ padding:11px 14px; font-size:13.5px; color:var(--text); cursor:pointer; border-bottom:1px solid var(--border); }
.audit-wrap .ac-item:last-child{ border-bottom:0; }
.audit-wrap .ac-item:hover{ background:var(--orange-50); color:var(--orange-700); }

/* Erreurs de champ */
.audit-wrap .ferr{ font-size:12px; color:var(--bad); margin-top:6px; font-weight:600; }

/* Bascule formulaire ↔ résultats (page courte) */
.audit-wrap .apanel.show-results .aform{ display:none; }
.audit-wrap .apanel:not(.show-results) .aout{ display:none; }

/* Bouton retour */
.audit-wrap .aback{ display:inline-flex; align-items:center; gap:7px; background:var(--bg); color:var(--navy-700);
  border:1px solid var(--border-strong); border-radius:9px; padding:9px 15px; font-size:13px; font-weight:600;
  cursor:pointer; font-family:inherit; margin-bottom:16px; transition:.15s; }
.audit-wrap .aback:hover{ border-color:var(--navy); color:var(--navy); background:var(--navy-50); }

/* ═══════════ Direction B : formulaire 2 colonnes ═══════════ */
.audit-wrap .fcols{ display:grid; grid-template-columns:1.08fr 1fr; gap:28px; }
.audit-wrap .annonce{ background:var(--bg-soft); border:1px solid #eef0f3; border-radius:14px; padding:20px; align-self:start; }
.audit-wrap .grp-title{ display:flex; align-items:center; gap:10px; font-size:15px; font-weight:700; color:var(--ink); margin-bottom:14px; flex-wrap:wrap; }
.audit-wrap .grp-title .gn{ width:26px; height:26px; border-radius:8px; background:var(--orange-50); color:var(--orange); display:inline-flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; flex-shrink:0; }

/* ═══════════ Direction B : scorecard résultats ═══════════ */
.audit-wrap .scorecard{ display:flex; align-items:center; gap:28px; background:var(--bg); border:1px solid var(--border); border-radius:16px; box-shadow:0 4px 20px -6px rgba(15,45,82,.10); padding:24px 26px; margin-bottom:16px; }
.audit-wrap .donut{ position:relative; width:140px; height:140px; flex-shrink:0; }
.audit-wrap .donut svg{ display:block; }
.audit-wrap .donut-c{ position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.audit-wrap .donut-c b{ font-size:30px; font-weight:800; color:var(--ink); line-height:1; }
.audit-wrap .donut-c span{ font-size:11px; font-weight:600; color:var(--text-muted); text-transform:uppercase; letter-spacing:.06em; margin-top:3px; }
.audit-wrap .sc-body{ flex:1; min-width:0; }
.audit-wrap .sc-pill{ display:inline-flex; align-items:center; font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; padding:5px 12px; border-radius:999px; }
.audit-wrap .sc-pill.rouge{ color:var(--bad); background:var(--bad-50); }
.audit-wrap .sc-pill.orange{ color:var(--warn); background:var(--warn-50); }
.audit-wrap .sc-pill.vert{ color:var(--good); background:var(--good-50); }
.audit-wrap .sc-body h2{ font-size:22px; font-weight:800; color:var(--ink); letter-spacing:-.02em; margin-top:12px; }
.audit-wrap .sc-body p{ font-size:13px; color:var(--text-muted); margin-top:6px; }
.audit-wrap .sc-legend{ display:flex; flex-wrap:wrap; gap:18px; margin-top:15px; }
.audit-wrap .sc-legend span{ display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:var(--text); }
.audit-wrap .sc-legend i{ width:10px; height:10px; border-radius:3px; display:inline-block; }

.audit-wrap .sc-detail{ background:var(--bg); border:1px solid var(--border); border-radius:16px; box-shadow:var(--shadow-sm); overflow:hidden; }
.audit-wrap .grp-h{ padding:17px 24px 5px; font-size:11.5px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--na); }
.audit-wrap .vrow{ display:flex; align-items:flex-start; gap:15px; padding:14px 24px; border-top:1px solid #f0f2f5; }
.audit-wrap .dot{ width:9px; height:9px; border-radius:999px; flex-shrink:0; margin-top:5px; }
.audit-wrap .dot.rouge{ background:var(--bad); }
.audit-wrap .dot.orange{ background:var(--warn); }
.audit-wrap .dot.vert{ background:var(--good); }
.audit-wrap .dot.non_evalue{ background:var(--na-bd); }
.audit-wrap .vrow-main{ flex:1; min-width:0; }
.audit-wrap .vrow-t{ font-size:14px; font-weight:700; color:var(--ink); }
.audit-wrap .vrow-m{ font-size:12.5px; color:var(--text); margin-top:3px; line-height:1.5; }
.audit-wrap .vrow-m.na{ color:var(--text-muted); }
.audit-wrap .vrow-s{ font-size:11px; color:var(--na); margin-top:4px; font-style:italic; }
.audit-wrap .vrow-end{ text-align:right; flex-shrink:0; padding-left:8px; }
.audit-wrap .vend{ font-size:14px; font-weight:700; color:var(--ink); }
.audit-wrap .vend.rouge{ color:var(--bad); }
.audit-wrap .vend.orange{ color:var(--warn); }
.audit-wrap .vend.vert{ color:var(--good); }
.audit-wrap .vsub{ font-size:11px; color:var(--na); margin-top:2px; white-space:nowrap; }

@media (max-width:640px){
  .audit-wrap .fcols{ grid-template-columns:1fr; }
  .audit-wrap .scorecard{ flex-direction:column; text-align:center; }
  .audit-wrap .sc-legend{ justify-content:center; }
  .audit-wrap .vrow-s{ white-space:normal; }
}