/* ===== HOME PAGE ===== */

/* -------- HERO -------- */
.hero{ padding-top:clamp(120px,16vh,180px); padding-bottom:clamp(40px,7vw,90px); overflow:hidden; }
.hero-aurora{
  position:absolute; inset:-20% -10% auto -10%; height:120%; z-index:-1; pointer-events:none;
  background:
    radial-gradient(620px 420px at 78% 30%, rgba(243,100,49,.22), transparent 62%),
    radial-gradient(560px 380px at 88% 62%, rgba(224,123,58,.20), transparent 60%);
  filter:blur(8px);
  animation:auroraDrift 18s ease-in-out infinite alternate;
}
@keyframes auroraDrift{ from{ transform:translate3d(0,0,0) scale(1);} to{ transform:translate3d(-26px,18px,0) scale(1.06);} }

.hero-grid{
  display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(32px,5vw,72px);
  align-items:center;
}
.hero-copy{ max-width:640px; }
.hero .chip{ margin-bottom:26px; }
.h-hero{ margin:0; }
.hero-lead{ margin-top:26px; max-width:540px; }
.hero-cta{ display:flex; gap:14px; margin-top:34px; flex-wrap:wrap; }
.hero-cta.center{ justify-content:center; }

.hero-meta{ display:flex; gap:34px; margin-top:46px; flex-wrap:wrap; }
.hero-meta > div{ display:flex; flex-direction:column; gap:3px; }
.hero-meta b{ font-family:'Sora',sans-serif; font-size:26px; font-weight:600; letter-spacing:-.03em; }
.hero-meta span{ font-size:13px; color:var(--muted); }
.hero-meta > div + div{ padding-left:34px; border-left:1px solid var(--line); }

/* rotator — row height padded so the display font's caps + descenders aren't clipped */
.rotator{ display:inline-block; height:1.24em; overflow:hidden; vertical-align:bottom; }
.rot-track{ display:flex; flex-direction:column; animation:rot 9s steps(1) infinite; }
.rot-track span{ height:1.24em; line-height:1.24; color:var(--aqua); white-space:nowrap; }
@keyframes rot{ 0%,22%{transform:translateY(0);} 25%,47%{transform:translateY(-1.24em);} 50%,72%{transform:translateY(-2.48em);} 75%,97%{transform:translateY(-3.72em);} 100%{transform:translateY(0);} }

/* -------- LIVE STAGE -------- */
.stage{ position:relative; justify-self:center; width:min(100%,360px); aspect-ratio:9/16; }
.stage-frame{
  position:absolute; inset:0; border-radius:26px; overflow:hidden;
  border:1px solid var(--line-2);
  box-shadow:0 40px 100px -40px rgba(243,100,49,.4), 0 30px 80px -30px rgba(0,0,0,.8);
  background:#0a0d14;
}
.stage-human{ position:absolute; inset:0; width:100%; height:100%; }
video.stage-human{ object-fit:cover; object-position:center; border-radius:22px; background:#0a0d14; transition:opacity .5s linear; }
.stage-human-alt{ opacity:0; }
.stage-frame::after{ /* vignette */
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(180deg, rgba(7,9,14,.5) 0%, transparent 22% 60%, rgba(7,9,14,.85) 100%);
}

.stage-top{ position:absolute; top:14px; left:14px; right:14px; display:flex; justify-content:space-between; z-index:3; }
.onair{ display:inline-flex; align-items:center; gap:8px; font-family:'Space Mono',monospace; font-size:11px; font-weight:700; letter-spacing:.14em; padding:6px 11px; border-radius:999px; background:rgba(255,90,69,.16); border:1px solid rgba(255,90,69,.5); color:#FFD9C2; }
.viewers{ display:inline-flex; align-items:center; gap:7px; font-size:12.5px; color:var(--fg-soft); padding:6px 11px; border-radius:999px; background:rgba(7,9,14,.5); border:1px solid var(--line); backdrop-filter:blur(8px); }
.viewers svg{ width:14px; height:14px; color:var(--aqua); }
.viewers b{ color:#fff; font-weight:700; font-variant-numeric:tabular-nums; }

.wave{ position:absolute; left:18px; right:18px; bottom:74px; height:30px; display:flex; align-items:flex-end; justify-content:space-between; z-index:3; opacity:.85; }
.wave span{ flex:0 0 5px; background:linear-gradient(180deg,var(--aqua),rgba(243,100,49,.18)); border-radius:3px; height:30%; animation:wv 1s ease-in-out infinite; }
.wave span:nth-child(2n){ animation-duration:.8s; }
.wave span:nth-child(3n){ animation-duration:1.3s; }
.wave span:nth-child(4n){ animation-duration:.65s; }
.wave span:nth-child(odd){ background:linear-gradient(180deg,#FF8A4D,rgba(243,100,49,.18)); }
@keyframes wv{ 0%,100%{ height:18%;} 50%{ height:90%;} }

.chat{ position:absolute; left:16px; right:16px; bottom:18px; height:46px; z-index:3; overflow:hidden; }
.chat .bubble{ display:inline-flex; align-items:center; gap:7px; max-width:100%; padding:6px 11px; border-radius:999px; background:rgba(7,9,14,.62); border:1px solid var(--line); backdrop-filter:blur(8px); font-size:12.5px; color:var(--fg-soft); animation:bubbleUp .5s var(--ease); }
.chat .bubble i{ width:18px; height:18px; border-radius:50%; flex:none; background:var(--grad-soft); }
.chat .bubble b{ color:#fff; font-weight:600; }
@keyframes bubbleUp{ from{ opacity:0; transform:translateY(14px);} to{ opacity:1; transform:none;} }

/* floating glass cards */
.float-card{
  position:absolute; z-index:5; display:flex; align-items:center; gap:12px;
  padding:12px 14px; border-radius:16px;
  background:rgba(13,16,22,.78); border:1px solid var(--line-2);
  backdrop-filter:blur(14px); box-shadow:0 24px 60px -26px rgba(0,0,0,.85);
  animation:floaty 6s ease-in-out infinite;
}
.fc-label{ display:block; font-family:'Space Mono',monospace; font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--aqua); margin-bottom:3px; }
.float-card b{ font-family:'Sora',sans-serif; font-size:14px; font-weight:600; display:block; }
.fc-product{ left:-28px; bottom:96px; }
.fc-thumb{ width:38px; height:38px; border-radius:9px; background:linear-gradient(135deg,#1c2740,#0f1626); border:1px solid var(--line); flex:none; }
.fc-price{ display:block; font-size:13px; color:var(--fg-soft); margin-top:2px; }
.fc-price i{ font-style:normal; color:var(--aqua); font-weight:700; font-size:11px; margin-left:4px; }
.fc-cart{ display:grid; place-items:center; width:34px; height:34px; border-radius:10px; background:var(--aqua); color:#ffffff; }
.fc-cart svg{ width:17px; height:17px; }
.fc-engine{ right:-22px; top:64px; animation-delay:-3s; }
.fc-engine .pulse-ring{ width:26px; height:26px; border-radius:50%; background:rgba(224,123,58,.18); border:1px solid var(--violet); display:grid; place-items:center; position:relative; flex:none; }
.fc-engine .pulse-ring::after{ content:""; width:9px; height:9px; border-radius:50%; background:var(--violet-2); box-shadow:0 0 12px var(--violet); }
@keyframes floaty{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-12px);} }

/* -------- STAT BAND -------- */
.statband-kicker{ text-align:center; font-size:14px; color:var(--muted); font-family:'Space Mono',monospace; letter-spacing:.04em; }
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin-top:34px; }
.stat{ text-align:center; padding:26px 16px; border:1px solid var(--line); border-radius:var(--r-md); background:var(--surface); }
.stat b{ display:block; font-family:'Sora',sans-serif; font-size:clamp(34px,4.4vw,52px); font-weight:700; letter-spacing:-.04em; color:var(--fg); }
.stat span{ display:block; margin-top:8px; font-size:13.5px; color:var(--muted); }

/* -------- SOLUTIONS -------- */
.sol-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:54px; }
.sol-card{ padding:34px 30px 30px; display:flex; flex-direction:column; }
.sol-card .h3{ margin:22px 0 12px; }
.sol-card > p{ color:var(--muted); font-size:15.5px; }
.ticks{ list-style:none; margin:22px 0 26px; padding:0; display:flex; flex-direction:column; gap:11px; }
.ticks li{ position:relative; padding-left:26px; font-size:14.5px; color:var(--fg-soft); }
.ticks li::before{ content:""; position:absolute; left:0; top:7px; width:15px; height:15px; border-radius:50%; background:var(--grad-soft); }
.ticks li::after{ content:""; position:absolute; left:5px; top:10px; width:5px; height:8px; border-right:2px solid var(--aqua); border-bottom:2px solid var(--aqua); transform:rotate(40deg); }
.sol-card .arrow-link{ margin-top:auto; }

/* -------- PLATFORM ORBIT -------- */
.platform{ background:linear-gradient(180deg, transparent, rgba(224,123,58,.045), transparent); }
.orbit-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; margin-top:64px; }
.orbit{ position:relative; width:min(100%,420px); aspect-ratio:1; justify-self:center; }
.orbit-lines{ position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:0; }
.orbit-lines line{ stroke:var(--line-2); stroke-width:1; }

.orbit-core{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:128px; height:128px; border-radius:50%; z-index:2;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  background:radial-gradient(circle at 50% 40%, rgba(243,100,49,.18), rgba(13,16,22,.9));
  border:1px solid rgba(243,100,49,.4);
  text-align:center;
}
.orbit-core span:last-child{ font-family:'Space Mono',monospace; font-size:10px; letter-spacing:.1em; color:var(--fg-soft); text-transform:uppercase; }
.core-mark{ width:46px; height:46px; border-radius:50%; display:grid; place-items:center; background:var(--aqua); color:#fff; font-family:'Sora',sans-serif; font-weight:800; font-size:16px; letter-spacing:-.03em; }
.core-mark svg{ width:22px; height:22px; }
.core-ring{ position:absolute; inset:-14px; border-radius:50%; border:1px solid rgba(243,100,49,.22); animation:spin 22s linear infinite; }
.core-ring.r2{ inset:-30px; border-style:dashed; border-color:rgba(224,123,58,.2); animation-duration:34s; animation-direction:reverse; }
@keyframes spin{ to{ transform:rotate(360deg);} }

.node{
  position:absolute; left:50%; top:50%; z-index:3;
  width:78px; height:78px; margin:-39px; border-radius:18px;
  transform:rotate(var(--a)) translate(168px) rotate(calc(-1 * var(--a)));
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
  background:var(--ink-3); border:1px solid var(--line);
  color:var(--fg-soft); transition:transform .4s var(--ease), border-color .3s, color .3s, background .3s, box-shadow .3s;
}
.node svg{ width:24px; height:24px; }
.node span{ font-family:'Sora',sans-serif; font-size:11.5px; font-weight:600; }
.node:hover{ border-color:var(--line-2); color:#fff; }
.node.on{ border-color:var(--aqua); color:#fff; background:linear-gradient(180deg, rgba(243,100,49,.16), var(--ink-3)); box-shadow:var(--shadow-glow); }
.node.on svg{ color:var(--aqua); }

.engine-detail{ padding:34px 32px; min-height:240px; }
.ed-tag{ font-family:'Space Mono',monospace; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--aqua); }
.engine-detail .h3{ margin:14px 0 14px; }
#edBody{ color:var(--muted); font-size:16px; }
.ed-spec{ display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.ed-spec .chip{ background:var(--surface); }

/* -------- ENTERPRISE -------- */
.feat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:54px; }
.feat{ padding:30px 28px; }
.feat h4{ font-family:'Sora',sans-serif; font-size:18.5px; font-weight:600; margin:20px 0 10px; }
.feat p{ font-size:14.5px; color:var(--muted); }

/* -------- INDUSTRIES -------- */
.ind-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:54px; }
.ind{ padding:34px 30px; position:relative; overflow:hidden; }
.ind-num{ font-family:'Space Mono',monospace; font-size:13px; color:var(--muted-2); letter-spacing:.1em; position:absolute; top:26px; right:28px; }
.ind .icon-tile{ margin-bottom:22px; }
.ind .h3{ margin-bottom:12px; font-size:22px; }
.ind p{ color:var(--muted); font-size:15px; }

/* -------- CTA BAND -------- */
.cta-band{ position:relative; overflow:hidden; text-align:center; padding:clamp(56px,7vw,92px) var(--pad); border-radius:var(--r-xl); border:1px solid var(--line-2); background:radial-gradient(900px 500px at 50% -30%, rgba(243,100,49,.16), transparent 60%), var(--ink-2); }
.cta-band .eyebrow{ margin-bottom:22px; }
.cta-band .h1{ margin:0 auto; }
.cta-band .lead{ margin:22px auto 0; max-width:460px; }
.cta-band .hero-cta{ margin-top:36px; }
.cta-grid-glow{ position:absolute; inset:0; z-index:-1; opacity:.5; background-image:linear-gradient(rgba(243,100,49,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(243,100,49,.06) 1px,transparent 1px); background-size:46px 46px; -webkit-mask-image:radial-gradient(circle at 50% 0,#000,transparent 70%); mask-image:radial-gradient(circle at 50% 0,#000,transparent 70%); }

/* -------- RESPONSIVE -------- */
@media (max-width:1080px){
  .feat-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:920px){
  .hero-grid{ grid-template-columns:1fr; gap:48px; }
  .hero-copy{ max-width:680px; }
  .stage{ width:min(100%,400px); }
  .orbit-wrap{ grid-template-columns:1fr; gap:40px; }
  .sol-grid, .ind-grid{ grid-template-columns:1fr; }
  .stats{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:600px){
  .feat-grid{ grid-template-columns:1fr; }
  .hero-meta > div + div{ padding-left:0; border-left:none; }
  .hero-meta{ gap:20px; }
  .float-card{ display:none; }
}
