/* =====================================================
   WebAnimalier — Module de capture de leads (wa-leads)
   Multi-étapes · Audit gratuit · Exit-intent · Barre mobile
   Dépend des variables :root de style.css
   ===================================================== */

/* ---------- Overlay + modale ---------- */
.wa-ov{position:fixed;inset:0;background:rgba(15,15,15,.72);z-index:10000;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .25s}
.wa-ov.is-open{opacity:1}
.wa-modal{background:var(--paper);color:var(--ink);width:100%;max-width:640px;max-height:calc(100vh - 40px);overflow:auto;border:1.5px solid var(--ink);position:relative;transform:translateY(16px);transition:transform .3s;font-family:'Inter',sans-serif}
.wa-ov.is-open .wa-modal{transform:none}
.wa-close{position:absolute;top:12px;right:12px;width:40px;height:40px;border:1px solid var(--line-2);background:var(--paper);cursor:pointer;font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center;color:var(--ink);z-index:2}
.wa-close:hover{background:var(--ink);color:var(--paper)}
.wa-body{padding:40px 40px 36px}
.wa-eyebrow{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--orange);margin-bottom:14px;display:flex;align-items:center;gap:10px;padding-right:48px}
.wa-eyebrow::before{content:"";width:28px;height:1.5px;background:var(--orange)}
.wa-title{font-family:'Fraunces',serif;font-weight:700;font-size:clamp(26px,3.4vw,36px);line-height:1.05;letter-spacing:-.02em;margin-bottom:12px}
.wa-title em{color:var(--orange);font-style:italic;font-weight:600}
.wa-sub{font-size:15px;color:var(--ink-3);line-height:1.55;margin-bottom:26px}

/* ---------- Progression ---------- */
.wa-progress{display:flex;gap:6px;margin-bottom:28px}
.wa-progress span{flex:1;height:3px;background:var(--line-2)}
.wa-progress span.done{background:var(--orange)}
.wa-stepnum{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-bottom:8px}

/* ---------- Choix (chips) ---------- */
.wa-choices{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:24px}
.wa-choice{border:1.5px solid var(--line-2);background:var(--paper-3);padding:16px 16px 14px;cursor:pointer;text-align:left;font:inherit;color:var(--ink);transition:border-color .2s,background .2s;display:flex;flex-direction:column;gap:4px;min-height:72px}
.wa-choice strong{font-family:'Fraunces',serif;font-weight:700;font-size:17px;letter-spacing:-.01em;line-height:1.15}
.wa-choice small{font-size:12.5px;color:var(--muted);line-height:1.35}
.wa-choice:hover{border-color:var(--ink)}
.wa-choice:focus{outline:none}
.wa-choice:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.wa-choice.is-sel{border-color:var(--orange);background:#fff;box-shadow:inset 0 0 0 1px var(--orange)}
.wa-choices.cols-1{grid-template-columns:1fr}
.wa-choices.cols-3{grid-template-columns:repeat(3,1fr)}

/* ---------- Champs ---------- */
.wa-field{margin-bottom:16px}
.wa-field label{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--ink-3);margin-bottom:7px}
.wa-field input,.wa-field textarea,.wa-field select{width:100%;font:inherit;font-size:16px;padding:13px 14px;border:1.5px solid var(--line-2);background:#fff;color:var(--ink);outline:none;transition:border-color .2s}
.wa-field input:focus,.wa-field textarea:focus{border-color:var(--orange)}
.wa-field textarea{min-height:90px;resize:vertical}
.wa-field .err{display:none;color:var(--orange-deep);font-size:12.5px;margin-top:5px}
.wa-field.has-err input{border-color:var(--orange-deep)}
.wa-field.has-err .err{display:block}
.wa-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.wa-consent{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;color:var(--ink-3);line-height:1.45;margin:6px 0 20px}
.wa-consent input{margin-top:3px;width:16px;height:16px;flex-shrink:0;accent-color:var(--orange)}
.wa-hp{position:absolute;left:-9999px;opacity:0;height:0;width:0}

/* ---------- Boutons ---------- */
.wa-actions{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.wa-btn{background:var(--orange);color:#fff;border:1.5px solid var(--orange);padding:15px 26px;font:inherit;font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;display:inline-flex;align-items:center;gap:10px;transition:background .2s,border-color .2s}
.wa-btn:hover{background:var(--orange-deep);border-color:var(--orange-deep)}
.wa-btn[disabled]{opacity:.55;cursor:wait}
.wa-btn.ghost{background:transparent;color:var(--ink);border-color:var(--line-2)}
.wa-btn.ghost:hover{border-color:var(--ink);background:transparent}
.wa-btn.dark{background:var(--ink);border-color:var(--ink)}
.wa-btn.dark:hover{background:#000}
.wa-link{background:none;border:0;font:inherit;font-size:13px;color:var(--ink-3);text-decoration:underline;cursor:pointer;padding:0}
.wa-note{font-size:12px;color:var(--muted);margin-top:14px;line-height:1.45}

/* ---------- Audit : scores ---------- */
.wa-scores{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:22px 0}
.wa-score{background:#fff;border:1px solid var(--line);padding:16px 8px 12px;text-align:center}
.wa-ring{width:64px;height:64px;margin:0 auto 8px;position:relative}
.wa-ring svg{transform:rotate(-90deg);width:64px;height:64px}
.wa-ring circle{fill:none;stroke-width:6}
.wa-ring .bg{stroke:var(--paper-2)}
.wa-ring .fg{stroke:var(--orange);stroke-linecap:round;stroke-dasharray:163.4;stroke-dashoffset:163.4;transition:stroke-dashoffset 1s ease}
.wa-ring.good .fg{stroke:#2e8b57}
.wa-ring.mid .fg{stroke:#e0a020}
.wa-ring.bad .fg{stroke:var(--orange-deep)}
.wa-ring b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Fraunces',serif;font-size:19px;font-weight:700}
.wa-score span{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--ink-3)}
.wa-issues{list-style:none;margin:0 0 22px;padding:0;border-top:1px solid var(--line)}
.wa-issues li{padding:12px 0;border-bottom:1px solid var(--line);display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.45}
.wa-issues li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--orange);flex-shrink:0;margin-top:7px}
.wa-issues li.ok::before{background:#2e8b57}
.wa-issues li strong{display:block;font-family:'Fraunces',serif;font-weight:700;font-size:15.5px;margin-bottom:2px}
.wa-loader{padding:36px 0;text-align:center;color:var(--ink-3);font-size:15px}
.wa-loader .bar{height:3px;background:var(--line-2);margin:18px auto 0;max-width:280px;overflow:hidden;position:relative}
.wa-loader .bar::after{content:"";position:absolute;left:-40%;width:40%;top:0;bottom:0;background:var(--orange);animation:wa-slide 1.4s infinite}
@keyframes wa-slide{to{left:100%}}
.wa-lock{background:var(--paper-2);border:1px solid var(--line);padding:22px;margin-top:6px}
.wa-lock h4{font-family:'Fraunces',serif;font-weight:700;font-size:20px;letter-spacing:-.01em;margin-bottom:6px}
.wa-lock p{font-size:13.5px;color:var(--ink-3);margin-bottom:14px;line-height:1.5}

/* ---------- Succès ---------- */
.wa-success{text-align:center;padding:16px 0 8px}
.wa-success .ico{width:64px;height:64px;border-radius:50%;background:var(--orange);color:#fff;font-size:30px;display:flex;align-items:center;justify-content:center;margin:0 auto 20px}
.wa-success p{color:var(--ink-3);font-size:15px;line-height:1.55;max-width:420px;margin:0 auto 18px}

/* ---------- Bloc audit inline (dans une page) ---------- */
.wa-inline{background:var(--ink);color:var(--paper);padding:56px 48px;border-top:1px solid var(--ink)}
.wa-inline-inner{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
.wa-inline .wa-eyebrow{color:var(--orange)}
.wa-inline h2{font-family:'Fraunces',serif;font-weight:700;font-size:clamp(32px,4vw,54px);line-height:1;letter-spacing:-.025em;margin-bottom:18px}
.wa-inline h2 em{color:var(--orange);font-style:italic}
.wa-inline-copy p{color:rgba(245,240,230,.78);font-size:16px;line-height:1.6;margin-bottom:22px}
.wa-inline-copy ul{list-style:none;padding:0;margin:0;display:grid;gap:8px;font-size:14px;color:rgba(245,240,230,.85)}
.wa-inline-copy ul li::before{content:"✓ ";color:var(--orange);font-weight:700}
.wa-inline-form{background:var(--paper);color:var(--ink);padding:32px;border:1px solid rgba(245,240,230,.15)}
.wa-inline-form .wa-field{margin-bottom:12px}
.wa-inline-form .wa-note{margin-top:12px}
.wa-inline-form .wa-btn{width:100%;justify-content:center}
.wa-inline-form .wa-note{text-align:center}

/* ---------- Barre mobile collante ---------- */
.wa-bar{position:fixed;left:0;right:0;bottom:0;z-index:8000;display:none;grid-template-columns:1fr 1fr;background:var(--ink);border-top:1px solid rgba(245,240,230,.15);transform:translateY(100%);transition:transform .3s;padding-bottom:env(safe-area-inset-bottom)}
.wa-bar.is-on{transform:none}
.wa-bar a,.wa-bar button{font:inherit;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:16px 8px;text-align:center;color:var(--paper);background:transparent;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}
.wa-bar .primary{background:var(--orange);color:#fff}
body.wa-has-bar{padding-bottom:58px}

/* ---------- Pastille flottante (desktop) ---------- */
.wa-fab{position:fixed;right:24px;bottom:24px;z-index:8000;background:var(--ink);color:var(--paper);border:1.5px solid var(--ink);padding:14px 20px;font:inherit;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;display:none;align-items:center;gap:10px;box-shadow:0 8px 30px rgba(0,0,0,.18);transition:background .2s}
.wa-fab:hover{background:var(--orange);border-color:var(--orange);color:#fff}
.wa-fab .dot{width:8px;height:8px;border-radius:50%;background:var(--orange);animation:wa-pulse 1.8s infinite}
.wa-fab:hover .dot{background:#fff}
@keyframes wa-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.5}}

/* ---------- Responsive ---------- */
@media(max-width:980px){
  .wa-inline{padding:48px 24px}
  .wa-inline-inner{grid-template-columns:1fr;gap:32px}
}
@media(max-width:720px){
  .wa-ov{padding:0;align-items:flex-end}
  .wa-modal{max-height:100vh;max-height:100dvh;border-left:0;border-right:0;border-bottom:0}
  .wa-body{padding:30px 22px 32px}
  .wa-choices,.wa-choices.cols-3{grid-template-columns:1fr 1fr}
  .wa-scores{grid-template-columns:repeat(2,1fr)}
  .wa-row{grid-template-columns:1fr}
  .wa-bar{display:grid}
  .wa-fab{display:none !important}
}
@media(min-width:721px){
  .wa-fab.is-on{display:inline-flex}
}
@media(prefers-reduced-motion:reduce){
  .wa-ov,.wa-modal,.wa-ring .fg,.wa-bar{transition:none}
  .wa-fab .dot,.wa-loader .bar::after{animation:none}
}