/* DEMO · lead — styles added during the capability upgrade. Loaded after demos.css. */

/* ---------- THE RACE: Clozo AI vs. typical agency ---------- */
.d2-race{padding:20px 22px}
.d2-race-h{display:flex;align-items:baseline;gap:12px;margin-bottom:14px;font-family:'Space Grotesk',sans-serif;flex-wrap:wrap}
.d2-race-h b{font-size:14.5px}
.d2-race-h span{font-size:11.5px;color:#9aa3c7}
.d2-lane{position:relative;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);overflow:hidden}
.d2-lane + .d2-lane{margin-top:12px}
.d2-lane-lab{display:flex;align-items:center;gap:10px;margin-bottom:8px;flex-wrap:wrap}
.d2-lane-lab b{font-family:'Space Grotesk',sans-serif;font-size:13.5px}
.d2-lane-t{font-size:11px;color:#9aa3c7;transition:color .4s}
.d2-lane-sub{font-size:10.5px;color:rgba(154,163,199,.7);margin-top:6px;letter-spacing:.04em}
.d2-track{height:10px;border-radius:6px;background:rgba(255,255,255,.06);overflow:hidden}
.d2-fill{height:100%;width:0;border-radius:6px;transition:width .18s linear}
.d2-fill.a{background:linear-gradient(90deg,#7c3aed,#22d3ee);box-shadow:0 0 14px rgba(34,211,238,.45)}
.d2-fill.b{background:linear-gradient(90deg,#6b7280,#9aa3c7)}
.d2-lane.win{border-color:rgba(52,211,153,.5);box-shadow:0 0 24px rgba(52,211,153,.1)}
.d2-lane.win .d2-lane-t{color:#34d399}
.d2-lane.b{transition:opacity .5s,filter .5s}
.d2-lane.b.lost{opacity:.55;filter:grayscale(.6)}
.d2-lane.b .d2-lane-lab{padding-right:150px}
.d2-b-steps{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:5px 18px}
.d2-b-steps li{font-size:11.5px;color:#9aa3c7;display:flex;gap:6px;align-items:center}
.d2-b-steps li b{color:#c9cfe8;font-weight:500}
.d2-b-steps li.done{color:#d1d5e8}
.d2-b-steps li.done::after{content:"✓";color:#34d399;margin-left:2px}
.d2-stamp{position:absolute;right:16px;top:10px;padding:6px 16px;border:2.5px solid #ef4444;border-radius:8px;color:#ef4444;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:16px;letter-spacing:.14em;transform:rotate(-8deg) scale(2.4);opacity:0;transition:transform .35s cubic-bezier(.2,1.4,.4,1),opacity .25s;pointer-events:none;background:rgba(5,6,15,.55)}
.d2-stamp.show{opacity:1;transform:rotate(-8deg) scale(1)}
@media(max-width:700px){.d2-lane.b .d2-lane-lab{padding-right:0}.d2-stamp{position:static;display:inline-block;margin-top:10px}}

/* stopwatch card hugs its content instead of stretching to timeline height */
.stopwatch-row{align-items:start}

/* ---------- live qualifying mini chat (inside step 3) ---------- */
.d2-mini{display:flex;flex-direction:column;gap:6px;margin-top:10px;max-width:520px}
.d2-mb{max-width:88%;padding:7px 12px;border-radius:12px;font-size:12px;line-height:1.45;animation:dfade .4s ease both}
.d2-mb.ai{align-self:flex-start;background:rgba(124,58,237,.16);border:1px solid rgba(124,58,237,.32);border-bottom-left-radius:4px}
.d2-mb.lead{align-self:flex-end;background:rgba(34,211,238,.1);border:1px solid rgba(34,211,238,.28);border-bottom-right-radius:4px}

/* ---------- score breakdown card ---------- */
.d2-score{margin-top:10px;padding:16px 18px}
.d2-score-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.d2-score-h b{font-family:'Space Grotesk',sans-serif;font-size:13.5px}
.d2-sf{display:grid;grid-template-columns:160px 1fr 42px;gap:12px;align-items:center;padding:5px 0}
.d2-sf-lab{font-size:11.5px;color:#9aa3c7}
.d2-sf-track{height:7px;border-radius:5px;background:rgba(255,255,255,.07);overflow:hidden}
.d2-sf-track i{display:block;height:100%;width:0;border-radius:5px;background:linear-gradient(90deg,#7c3aed,#22d3ee);transition:width .7s cubic-bezier(.2,.8,.2,1)}
.d2-sf-pts{font-family:'Space Grotesk',sans-serif;font-size:13px;color:#22d3ee;text-align:right}
.d2-score-tot{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.08);font-size:12px;color:#9aa3c7}
.d2-score-tot b{font-family:'Space Grotesk',sans-serif;font-size:16px;color:#eef1ff}
.d2-score-tot b span{font-size:22px}
.d2-score-tot.hot b span{color:#f87171}
.d2-score-tot.warm b span{color:#fbbf24}
@media(max-width:560px){.d2-sf{grid-template-columns:1fr;gap:5px}.d2-sf-pts{text-align:left}}

/* ---------- outcome row: WhatsApp + revenue impact ---------- */
.d2-outrow{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
@media(max-width:700px){.d2-outrow{grid-template-columns:1fr}}
.d2-impact{padding:18px 20px;border-color:rgba(52,211,153,.3)}
.d2-impact-h{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#34d399;margin-bottom:8px}
.d2-impact p{font-size:13.5px;line-height:1.6;color:#c9cfe8}
.d2-impact p b{color:#eef1ff}
.lead-form.locked{opacity:.55;pointer-events:none}