.live-page{padding:2rem 1rem}
.live-section{max-width:72rem;margin:0 auto}
.live-section+.live-section{margin-top:2rem}
.live-panel,.live-hero-panel,.live-card,.live-mini-card,.live-visual-card{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.025)}
.live-hero-panel{border-color:rgba(255,255,255,.16);border-radius:1rem;padding:2rem 1.25rem;background:rgba(255,255,255,.035)}
.live-panel{border-radius:.75rem;padding:1.25rem}
.live-side-panel{min-width:0}
.live-card{border-radius:.75rem;padding:1.25rem}
.live-mini-card{border-radius:.5rem;background:rgba(0,0,0,.2);padding:.75rem}
.live-visual-card{margin-top:1rem;border-radius:.5rem;padding:1rem}
.live-demo-card{margin-top:1rem;border:1px solid rgba(255,255,255,.10);border-radius:.75rem;background:#050505;padding:.875rem}
.live-demo-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:.625rem;color:#fff;font-size:.75rem;font-weight:700}
.live-demo-status{display:inline-flex;align-items:center;gap:.35rem;color:#9ca3af;font-size:.6875rem;font-weight:600}
.live-demo-status span{width:.35rem;height:.35rem;border-radius:999px;background:#34d399}
.live-demo-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem;margin-top:.75rem}
.live-demo-metrics div{border:1px solid rgba(255,255,255,.08);border-radius:.5rem;background:rgba(255,255,255,.035);padding:.625rem}
.live-demo-metrics span{display:block;color:#6b7280;font-size:.625rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.live-demo-metrics strong{display:block;margin-top:.25rem;color:#fff;font-size:1rem;font-weight:800}
.live-demo-events{display:grid;gap:.45rem;margin-top:.75rem}
.live-demo-events div{display:flex;align-items:center;gap:.5rem;border:1px solid rgba(255,255,255,.07);border-radius:.5rem;background:rgba(255,255,255,.02);padding:.55rem;color:#d1d5db;font-size:.75rem}
.live-event-dot{width:.4rem;height:.4rem;flex-shrink:0;border-radius:999px;background:#34d399}
.live-event-dot-soft{background:#f5f5f5}
.live-demo-foot{margin-top:.75rem;color:#6b7280;font-size:.75rem;line-height:1.35}
.live-hero-grid{display:grid;gap:2rem}
.live-feature-grid{display:grid;gap:.75rem}
.live-stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
.live-stats-list,.live-signal-grid,.live-usecase-grid,.live-flow-grid{display:grid;gap:.5rem}
.live-stats-list{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:.75rem;color:#d1d5db;font-size:.875rem}
.live-split{display:flex;flex-direction:column;gap:1.25rem}
.live-split-copy{max-width:24rem}
.live-pill{display:inline-flex;align-items:center;gap:.5rem;border-radius:999px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);padding:.25rem .75rem;color:#d1d5db;font-size:.75rem;font-weight:600}
.live-dot{height:.375rem;width:.375rem;border-radius:999px;background:#34d399}
.live-h1{max-width:42rem;color:#fff;font-size:1.875rem;font-weight:700;line-height:1.12;letter-spacing:-.025em}
.live-copy{margin-top:.5rem;color:#6b7280;font-size:.875rem;line-height:1.5}
.live-lead{margin-top:1rem;max-width:42rem;color:#9ca3af;font-size:1rem;line-height:1.75}
.live-actions{margin-top:1.5rem;display:flex;flex-direction:column;gap:.75rem}
.live-btn{display:inline-flex;align-items:center;justify-content:center;border-radius:.5rem;padding:.75rem 1.25rem;font-size:.875rem;font-weight:700;transition:opacity .15s,background-color .15s,border-color .15s,color .15s}
.live-btn-primary{background:#fff;color:#000}
.live-btn-primary:hover{opacity:.9}
.live-btn-secondary{border:1px solid rgba(255,255,255,.12);color:#d1d5db}
.live-btn-secondary:hover{border-color:rgba(255,255,255,.24);color:#fff}
.live-btn-green{background:#059669;color:#fff}
.live-btn-green:hover{background:#10b981}
.live-overline{color:#6b7280;font-size:.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:.16em}
.live-stat-value{margin-top:.25rem;color:#fff;font-size:1.125rem;font-weight:700}
.live-card-title,.live-mini-title{color:#fff;font-size:.875rem;font-weight:600}
.live-card-body,.live-mini-body{margin-top:.5rem;color:#6b7280;font-size:.875rem;line-height:1.5}
.live-mini-body{margin-top:.25rem;font-size:.75rem}
.live-section-title{margin-top:.5rem;color:#fff;font-size:1.125rem;font-weight:600}
.live-final{text-align:center;background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.10)}
.live-final-title{color:#fff;font-size:1.25rem;font-weight:700}
.live-final-copy{margin:.5rem auto 0;max-width:42rem;color:#6b7280;font-size:.875rem;line-height:1.5}
.live-final-actions{margin-top:1.25rem;display:flex;flex-direction:column;justify-content:center;gap:.75rem}
.live-deferred-skel{margin-top:2rem}
.live-skel-card{height:8rem;border-radius:.75rem;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.025)}
@media (min-width:640px){
  .live-page{padding-left:1.5rem;padding-right:1.5rem}
  .live-hero-panel{padding-left:2rem;padding-right:2rem}
  .live-actions,.live-final-actions{flex-direction:row}
  .live-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .live-signal-grid,.live-usecase-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .live-flow-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .live-panel{padding:1.5rem}
  .live-h1{font-size:2.25rem}
}
@media (min-width:1024px){
  .live-page{padding-left:2rem;padding-right:2rem}
  .live-hero-panel{padding-left:2.5rem;padding-right:2.5rem}
  .live-hero-grid{grid-template-columns:1.05fr .95fr;align-items:center}
  .live-feature-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .live-signal-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .live-split{flex-direction:row;align-items:center;justify-content:space-between}
  .live-split-start{align-items:flex-start}
  .live-split-main{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:1.25rem}
  .live-flow-grid{min-width:32.5rem}
  .live-h1{font-size:3rem}
}