/* ═══════════════════════════════════════════════════════════
   OMNIS Website Components CSS
   Proof Bar · Live Demo · Vertical Selector
   ═══════════════════════════════════════════════════════════ */

/* ── Proof Bar (bottom strip, all public pages) ── */
.omnis-proof-bar{position:fixed;bottom:0;left:0;right:0;z-index:800;
  background:rgba(3,3,5,.92);backdrop-filter:blur(16px);
  border-top:1px solid rgba(255,255,255,.04);padding:0;
  transform:translateY(100%);transition:transform .4s cubic-bezier(.16,1,.3,1)}
.omnis-proof-bar.visible{transform:none}
.proof-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;
  justify-content:center;gap:2rem;padding:10px 2rem;flex-wrap:wrap}
.proof-stat{display:flex;align-items:center;gap:6px;white-space:nowrap}
.proof-num{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:14px;
  letter-spacing:-.02em;background:linear-gradient(135deg,#E8E8EC,#9F6CF7);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.proof-label{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--t3,#4A4A54);
  text-transform:uppercase;letter-spacing:.05em}
.proof-dot{width:4px;height:4px;border-radius:50%;flex-shrink:0}
.proof-dot.live{background:#2DD4A8;box-shadow:0 0 6px rgba(45,212,168,.4);animation:proofPulse 2s infinite}
@keyframes proofPulse{0%,100%{opacity:1}50%{opacity:.4}}
.proof-cta{font-family:'Figtree',sans-serif;font-size:12px;font-weight:600;
  padding:6px 18px;border-radius:100px;background:var(--c,#E8234A);color:#fff;
  text-decoration:none;transition:all .15s;border:none;cursor:pointer;white-space:nowrap}
.proof-cta:hover{background:var(--cd,#C41D3E);transform:translateY(-1px)}

@media(max-width:640px){
  .proof-inner{gap:1rem;padding:8px 1rem;justify-content:space-between}
  .proof-stat:nth-child(n+4){display:none}
}

/* ── Live Demo (animated mini-dashboard) ── */
.live-demo-wrap{background:var(--s1,#08080B);border:1px solid rgba(255,255,255,.045);
  border-radius:14px;overflow:hidden;max-width:700px;width:100%;
  box-shadow:0 20px 60px rgba(0,0,0,.4)}
.live-demo-titlebar{display:flex;align-items:center;gap:6px;padding:8px 12px;
  border-bottom:1px solid rgba(255,255,255,.04);background:rgba(8,8,11,.6)}
.live-demo-dots{display:flex;gap:4px}
.live-demo-dots span{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.08)}
.live-demo-dots span:first-child{background:#E84545}
.live-demo-dots span:nth-child(2){background:#E5A011}
.live-demo-dots span:nth-child(3){background:#2DD4A8}
.live-demo-label{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--t3,#4A4A54);
  letter-spacing:.06em;text-transform:uppercase;margin-left:auto}
.live-demo-body{display:grid;grid-template-columns:1fr 200px;min-height:320px}
.live-demo-main{padding:12px;display:flex;flex-direction:column;gap:8px;border-right:1px solid rgba(255,255,255,.03)}
.live-demo-sidebar{padding:10px;display:flex;flex-direction:column;gap:6px;overflow:hidden}

/* Demo KPI cards */
.demo-kpi{display:flex;gap:6px}
.demo-kpi-card{flex:1;background:rgba(255,255,255,.015);border:1px solid rgba(255,255,255,.04);
  border-radius:8px;padding:8px 10px}
.demo-kpi-val{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:16px;
  letter-spacing:-.02em;color:var(--t1,#E8E8EC)}
.demo-kpi-label{font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--t3,#4A4A54);
  text-transform:uppercase;letter-spacing:.04em;margin-top:2px}

/* Demo dock/entity rows */
.demo-entity{display:flex;align-items:center;gap:8px;padding:6px 8px;
  border-radius:6px;background:rgba(255,255,255,.01);
  animation:demoSlide .3s cubic-bezier(.16,1,.3,1) both}
@keyframes demoSlide{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}
.demo-entity-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.demo-entity-name{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--t1,#E8E8EC);
  flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.demo-entity-status{font-family:'JetBrains Mono',monospace;font-size:8px;padding:2px 6px;
  border-radius:100px;white-space:nowrap}
.demo-entity-status.active{color:#2DD4A8;background:rgba(45,212,168,.06);border:1px solid rgba(45,212,168,.1)}
.demo-entity-status.pending{color:#E5A011;background:rgba(229,160,17,.06);border:1px solid rgba(229,160,17,.1)}
.demo-entity-status.ai{color:#9F6CF7;background:rgba(159,108,247,.06);border:1px solid rgba(159,108,247,.1)}

/* Demo AI feed (sidebar) */
.demo-ai-msg{padding:6px 8px;border-radius:6px;background:rgba(159,108,247,.03);
  border:1px solid rgba(159,108,247,.06);
  animation:demoFade .4s cubic-bezier(.16,1,.3,1) both}
@keyframes demoFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.demo-ai-tag{font-family:'JetBrains Mono',monospace;font-size:7px;color:#9F6CF7;
  text-transform:uppercase;letter-spacing:.06em;margin-bottom:3px}
.demo-ai-text{font-family:'Figtree',sans-serif;font-size:10px;color:var(--t2,#7C7C86);line-height:1.5}
.demo-ai-conf{font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--t3,#4A4A54);margin-top:3px}

@media(max-width:640px){
  .live-demo-body{grid-template-columns:1fr}
  .live-demo-sidebar{display:none}
}

/* ── Vertical Selector ── */
.vert-section{padding:5rem 0;text-align:center}
.vert-section h2{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;
  font-size:clamp(1.6rem,4vw,2.4rem);letter-spacing:-.03em;margin-bottom:.5rem}
.vert-section p{font-size:.9rem;color:var(--t2,#7C7C86);max-width:520px;margin:0 auto 2.5rem;line-height:1.7}

.vert-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px;
  max-width:1000px;margin:0 auto;padding:0 2rem}
.vert-card{background:var(--s1,#08080B);border:1px solid rgba(255,255,255,.04);
  border-radius:12px;padding:1.2rem;text-align:left;cursor:pointer;
  transition:all .2s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden}
.vert-card:hover{border-color:rgba(159,108,247,.15);transform:translateY(-2px)}
.vert-card.selected{border-color:rgba(159,108,247,.3);background:rgba(159,108,247,.03)}
.vert-icon{font-size:1.5rem;margin-bottom:8px;display:block}
.vert-name{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:13px;
  color:var(--t1,#E8E8EC);margin-bottom:4px}
.vert-desc{font-family:'Figtree',sans-serif;font-size:11px;color:var(--t3,#4A4A54);line-height:1.5}
.vert-metric{font-family:'JetBrains Mono',monospace;font-size:9px;color:#9F6CF7;margin-top:6px}

.vert-detail{max-width:1000px;margin:2rem auto 0;padding:0 2rem;text-align:left;display:none}
.vert-detail.active{display:block;animation:vertFade .3s cubic-bezier(.16,1,.3,1) both}
@keyframes vertFade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.vert-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:1rem}
.vert-use-case{background:var(--s1,#08080B);border:1px solid rgba(255,255,255,.04);
  border-radius:10px;padding:1rem}
.vert-use-case h4{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:12px;
  margin-bottom:6px;display:flex;align-items:center;gap:6px}
.vert-use-case p{font-size:11px;color:var(--t2,#7C7C86);line-height:1.6}
.vert-before-after{display:grid;grid-template-columns:1fr auto 1fr;gap:1rem;align-items:center;
  margin-top:1.5rem}
.vert-before,.vert-after{background:var(--s1,#08080B);border:1px solid rgba(255,255,255,.04);
  border-radius:10px;padding:1rem}
.vert-before h5,.vert-after h5{font-family:'JetBrains Mono',monospace;font-size:9px;
  text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}
.vert-before h5{color:#E84545}
.vert-after h5{color:#2DD4A8}
.vert-ba-stat{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:18px;
  letter-spacing:-.02em}
.vert-ba-label{font-size:10px;color:var(--t3,#4A4A54);margin-top:2px}
.vert-arrow{font-size:20px;color:var(--t3,#4A4A54)}

@media(max-width:640px){
  .vert-grid{grid-template-columns:1fr 1fr}
  .vert-detail-grid,.vert-before-after{grid-template-columns:1fr}
  .vert-arrow{transform:rotate(90deg)}
}
