:root{
  --bg:#0A0A16;
  --card:#12112A;
  --card-border:rgba(184,174,234,0.14);
  --violet:#4B27DF;
  --violet-dark:#2422AA;
  --violet-soft:#C9BBFF;
  --cyan:#15C6EA;
  --cyan-dark:#0E93B0;
  --ink:#071A1E;
  --white:#F6F5FB;
  --muted:#9C93C4;
  --dot-red:#FF5F57;
  --dot-amber:#FFBD2E;
  --dot-cyan:#15C6EA;
  --display:'Poppins',sans-serif;
  --body:'Montserrat',sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);
  color:var(--white);
  font-family:var(--body);
  overflow-x:hidden;
  line-height:1.55;
}
h1,h2,h3{font-family:var(--display);font-weight:800;line-height:1.12;text-wrap:balance;letter-spacing:-0.01em;}
h1{font-size:clamp(2.3rem,5vw,3.9rem);}
h2{font-size:clamp(1.7rem,3.2vw,2.6rem);}
h3{font-size:1.15rem;margin-bottom:.5rem;font-weight:700;}
p{color:var(--muted);font-size:1.02rem;max-width:36em;}
a{text-decoration:none;color:inherit;}
ul{list-style:none;}
::selection{background:var(--cyan);color:var(--ink);}

/* NAV */
.nav{position:sticky;top:0;z-index:50;backdrop-filter:blur(14px);background:rgba(10,10,22,0.72);border-bottom:1px solid var(--card-border);}
.nav-inner{max-width:1160px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:18px 32px;}
.logo{font-family:var(--display);font-weight:800;font-size:1.1rem;letter-spacing:-0.01em;}
.logo-accent{color:var(--cyan);}
.nav-links{display:flex;gap:30px;}
.nav-links a{color:var(--muted);font-size:.92rem;transition:color .2s;}
.nav-links a:hover{color:var(--white);}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 26px;border-radius:999px;font-family:var(--display);font-weight:700;font-size:.92rem;transition:transform .18s ease, box-shadow .18s ease;white-space:nowrap;}
.btn:hover{transform:translateY(-2px);}
.btn:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;}
.btn-lg{padding:15px 32px;font-size:1rem;}
.btn-cta{background:linear-gradient(135deg,var(--cyan),var(--cyan-dark));color:var(--ink);box-shadow:0 0 22px rgba(21,198,234,.4);}
.btn-cta:hover{box-shadow:0 0 32px rgba(21,198,234,.6);}
.btn-ghost{background:transparent;border:1.5px solid var(--violet-soft);color:var(--white);}
.arrow{transition:transform .18s ease;}
.btn:hover .arrow{transform:translateX(4px);}

/* BADGES */
.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 16px;border-radius:999px;font-size:.78rem;font-weight:700;letter-spacing:.03em;margin-bottom:22px;}
.badge-violet{background:rgba(75,39,223,.16);color:var(--violet-soft);border:1px solid rgba(75,39,223,.4);}
.badge-cyan{background:rgba(21,198,234,.1);color:var(--cyan);border:1px solid rgba(21,198,234,.4);}

/* GLOWS */
.glow{position:absolute;border-radius:50%;filter:blur(120px);opacity:.32;z-index:0;pointer-events:none;}
.glow-violet{background:var(--violet);}
.hero-glow{width:640px;height:640px;top:-220px;left:50%;transform:translateX(-50%);}
.cta-glow{width:720px;height:420px;top:0;left:50%;transform:translateX(-50%);}

/* SECTIONS */
.section{position:relative;max-width:1160px;margin:0 auto;padding:100px 32px;text-align:center;}
.hero{position:relative;max-width:1160px;margin:0 auto;padding:120px 32px 96px;text-align:center;overflow:hidden;}
.subhead{margin:20px auto 34px;}

/* HERO NETWORK CANVAS */
.hero-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;opacity:.55;}

/* PRODUCT WINDOW */
.product-window{background:var(--card);border:1px solid var(--card-border);border-radius:16px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.55);text-align:left;position:relative;z-index:1;}
.hero-window{max-width:800px;margin:56px auto 0;}
.window-bar{display:flex;align-items:center;gap:7px;padding:12px 16px;background:rgba(255,255,255,.03);border-bottom:1px solid var(--card-border);}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block;}
.dot-red{background:var(--dot-red);}
.dot-amber{background:var(--dot-amber);}
.dot-cyan{background:var(--dot-cyan);box-shadow:0 0 6px rgba(21,198,234,.7);}
.window-title{margin-left:8px;font-size:.78rem;color:var(--muted);}
.window-body{padding:22px;}

.metric-row{display:flex;gap:14px;margin-bottom:18px;flex-wrap:wrap;}
.metric-row.two-col .metric-tile{flex:1 1 45%;}
.metric-tile{background:rgba(255,255,255,.03);border:1px solid var(--card-border);border-radius:12px;padding:14px 16px;flex:1;display:flex;flex-direction:column;gap:4px;min-width:120px;}
.metric-label{font-size:.73rem;color:var(--muted);}
.metric-value{font-family:var(--display);font-weight:800;font-size:1.4rem;font-variant-numeric:tabular-nums;}
.cyan-text{color:var(--cyan);}
.violet-text{color:var(--violet-soft);}
.metric-delta{font-size:.73rem;font-weight:700;}
.metric-delta.up{color:var(--cyan);}

/* ANIMATED LINE CHARTS */
.chart-area{height:96px;}
.chart-svg{width:100%;height:100%;overflow:visible;}
.chart-line{fill:none;stroke-width:3;stroke:var(--cyan);filter:drop-shadow(0 0 6px rgba(21,198,234,.55));
  stroke-dasharray:var(--len,600);stroke-dashoffset:var(--len,600);
  transition:stroke-dashoffset 1.7s cubic-bezier(.4,0,.2,1);}
.chart-line.draw{stroke-dashoffset:0;}
.chart-dot{fill:var(--cyan);opacity:0;transition:opacity .4s ease 1.5s;filter:drop-shadow(0 0 5px rgba(21,198,234,.8));}
.chart-line.draw ~ .chart-dot,.draw .chart-dot{opacity:1;}

/* ANIMATED BARS */
.bars{display:flex;align-items:flex-end;gap:8px;height:84px;}
.bars span{flex:1;background:linear-gradient(180deg,var(--cyan),var(--violet));border-radius:4px 4px 0 0;height:0;opacity:.9;transition:height 1s cubic-bezier(.4,0,.2,1);}
.bars.grow span{height:var(--h);}

/* ANIMATED CALENDAR */
.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:18px;}
.calendar-grid span{aspect-ratio:1;border-radius:6px;background:rgba(255,255,255,.04);opacity:0;transform:scale(.5);transition:opacity .4s ease, transform .4s ease;}
.calendar-grid.pop span{opacity:1;transform:scale(1);}
.calendar-grid .filled{background:rgba(75,39,223,.35);}
.calendar-grid .today{background:var(--cyan);box-shadow:0 0 12px rgba(21,198,234,.65);}

/* PROBLEM ICONS */
.icon-row{display:flex;justify-content:center;gap:20px;margin-top:34px;flex-wrap:wrap;}
.icon-chip{width:64px;height:64px;display:flex;align-items:center;justify-content:center;border-radius:18px;background:var(--card);border:1px solid var(--card-border);
  opacity:0;transform:scale(.6) translateY(10px);transition:opacity .5s ease, transform .5s cubic-bezier(.34,1.56,.64,1), box-shadow .3s ease;}
.icon-chip svg{width:26px;height:26px;stroke:var(--cyan);}
.icon-row.pop .icon-chip{opacity:1;transform:scale(1) translateY(0);}
.icon-row.pop .icon-chip{animation:pulseGlow 3.2s ease-in-out infinite;}
.icon-row.pop .icon-chip:nth-child(1){animation-delay:.1s;}
.icon-row.pop .icon-chip:nth-child(2){animation-delay:.5s;}
.icon-row.pop .icon-chip:nth-child(3){animation-delay:.9s;}
.icon-row.pop .icon-chip:nth-child(4){animation-delay:1.3s;}
@keyframes pulseGlow{
  0%,100%{box-shadow:0 0 0 rgba(21,198,234,0);}
  50%{box-shadow:0 0 22px rgba(21,198,234,.35);}
}

/* FEATURE SECTIONS */
.feature{display:flex;align-items:center;gap:60px;text-align:left;padding:96px 32px;}
.feature-rev{flex-direction:row-reverse;}
.feature-text{flex:1;min-width:280px;}
.feature-visual{flex:1;min-width:280px;}
.feature p{margin:16px 0 26px;}

/* STEPS */
.steps h2{margin-bottom:52px;}
.steps-row{display:flex;gap:36px;justify-content:center;flex-wrap:wrap;margin-top:18px;}
.step{max-width:270px;}
.step-circle{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:800;margin:0 auto 16px;background:var(--card);border:1px solid var(--card-border);font-size:.95rem;
  opacity:0;transform:scale(.5);transition:opacity .5s ease, transform .5s cubic-bezier(.34,1.56,.64,1);}
.steps-row.pop .step-circle{opacity:1;transform:scale(1);}
.steps-row.pop .step:nth-child(1) .step-circle{transition-delay:.05s;}
.steps-row.pop .step:nth-child(2) .step-circle{transition-delay:.25s;}
.steps-row.pop .step:nth-child(3) .step-circle{transition-delay:.45s;}
.glow-ring-violet{box-shadow:0 0 28px rgba(75,39,223,.5);}
.glow-ring-cyan{box-shadow:0 0 28px rgba(21,198,234,.5);}
.step p{margin:0 auto;font-size:.94rem;text-align:center;}
.step h3{text-align:center;}

/* RECAP */
.recap-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:880px;margin:36px auto 0;}
.recap-tile{align-items:center;text-align:center;}
.fine-print{font-size:.78rem;color:var(--muted);opacity:.75;margin:22px auto 0;max-width:100%;text-align:center;}

/* CTA FINAL */
.cta-final{padding:130px 32px;}
.gradient-text{background:linear-gradient(90deg,var(--cyan),var(--violet-soft));-webkit-background-clip:text;background-clip:text;color:transparent;}
.cta-buttons{display:flex;gap:16px;justify-content:center;margin:34px 0 18px;flex-wrap:wrap;}

/* FOOTER */
.footer{border-top:1px solid var(--card-border);padding:30px 32px;}
.footer-inner{max-width:1160px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;font-size:.82rem;color:var(--muted);flex-wrap:wrap;gap:10px;}

/* REVEAL */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .6s ease, transform .6s ease;}
.reveal.visible{opacity:1;transform:translateY(0);}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none;}
  .btn,.arrow,.icon-chip,.step-circle,.chart-line,.bars span,.calendar-grid span{transition:none;animation:none;}
  .chart-line{stroke-dashoffset:0;}
  .bars span{height:var(--h);}
  .calendar-grid span{opacity:1;transform:none;}
  .icon-chip{opacity:1;transform:none;}
  .step-circle{opacity:1;transform:none;}
}

@media (max-width:900px){
  .feature,.feature-rev{flex-direction:column;text-align:center;}
  .feature-text p{margin-left:auto;margin-right:auto;}
  .nav-links{display:none;}
  .recap-grid{grid-template-columns:repeat(2,1fr);}
}