
:root{
  --bg:#090b11;
  --bg-soft:#0d1119;
  --text:#eef4ff;
  --muted:rgba(233,241,255,.74);
  --line:rgba(255,255,255,.09);
  --line-strong:rgba(255,255,255,.15);
  --white:#fff;
  --cyan:#75dfff;
  --cyan-2:#95f6ff;
  --violet:#9f86ff;
  --rose:#ff6f9f;
  --amber:#ffbf68;
  --gold:#ffd785;
  --mint:#7effcc;
  --shadow-xl:0 50px 120px rgba(0,0,0,.55);
  --shadow-lg:0 28px 70px rgba(0,0,0,.44);
  --radius-xl:34px;
  --radius-lg:26px;
  --radius-md:18px;
  --container:min(1240px, calc(100vw - 48px));
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 20% 0%, rgba(117,223,255,.08), transparent 32%),
    radial-gradient(circle at 80% 10%, rgba(159,134,255,.08), transparent 28%),
    radial-gradient(circle at 50% 100%, rgba(255,191,104,.06), transparent 35%),
    var(--bg);
  overflow-x:hidden;
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
canvas{display:block;width:100%;height:100%}

.page-shell{position:relative;overflow:hidden}
.global-glow{
  position:fixed;inset:auto auto 0 0;pointer-events:none;z-index:0;
  filter:blur(80px);opacity:.4;mix-blend-mode:screen
}
.global-glow-a{width:35vw;height:35vw;background:radial-gradient(circle, rgba(117,223,255,.26), transparent 70%);top:8%;left:-8%}
.global-glow-b{width:38vw;height:38vw;background:radial-gradient(circle, rgba(159,134,255,.22), transparent 70%);top:34%;right:-10%;left:auto}
.global-glow-c{width:34vw;height:34vw;background:radial-gradient(circle, rgba(255,191,104,.18), transparent 72%);bottom:8%;right:18%}

.container{width:var(--container);margin:0 auto;position:relative;z-index:2}
.section{position:relative;padding:120px 0;overflow:hidden;isolation:isolate}
.section-bg,.section-art{position:absolute;inset:0;z-index:1;pointer-events:none}
.section-wave{
  position:absolute;left:-8%;right:-8%;bottom:-12%;height:42%;
  opacity:.72;filter:blur(2px);
  background:
    radial-gradient(50% 100% at 20% 50%, rgba(255,255,255,.06), transparent 70%),
    radial-gradient(50% 100% at 80% 50%, rgba(255,255,255,.05), transparent 70%);
  transform:translateY(30px)
}
.wave-products{background:radial-gradient(50% 100% at 20% 50%, rgba(117,223,255,.10), transparent 72%),radial-gradient(50% 100% at 80% 50%, rgba(255,191,104,.08), transparent 72%)}
.wave-capabilities{background:radial-gradient(50% 100% at 20% 50%, rgba(159,134,255,.12), transparent 72%),radial-gradient(50% 100% at 80% 50%, rgba(117,223,255,.08), transparent 72%)}
.wave-metrics{background:radial-gradient(50% 100% at 20% 50%, rgba(255,255,255,.08), transparent 72%),radial-gradient(50% 100% at 80% 50%, rgba(117,223,255,.08), transparent 72%)}
.wave-usecases{background:radial-gradient(50% 100% at 20% 50%, rgba(159,134,255,.10), transparent 72%),radial-gradient(50% 100% at 80% 50%, rgba(255,111,159,.10), transparent 72%)}
.wave-video{background:radial-gradient(50% 100% at 20% 50%, rgba(255,191,104,.12), transparent 72%),radial-gradient(50% 100% at 80% 50%, rgba(117,223,255,.09), transparent 72%)}
.wave-enterprise{background:radial-gradient(50% 100% at 20% 50%, rgba(255,111,159,.12), transparent 72%),radial-gradient(50% 100% at 80% 50%, rgba(159,134,255,.10), transparent 72%)}

.theme-hero{
  min-height:100svh;
  display:flex;align-items:center;
  background:
    linear-gradient(180deg, rgba(7,9,14,.1), rgba(7,9,14,.45)),
    radial-gradient(circle at 20% 20%, rgba(117,223,255,.14), transparent 28%),
    radial-gradient(circle at 78% 22%, rgba(159,134,255,.14), transparent 26%),
    radial-gradient(circle at 50% 80%, rgba(255,191,104,.12), transparent 30%);
}
.theme-statement{background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01)), radial-gradient(circle at 50% 50%, rgba(117,223,255,.08), transparent 40%), #070a10}
.theme-products{background:linear-gradient(180deg, rgba(8,15,24,.94), rgba(11,16,26,.96)), radial-gradient(circle at 15% 20%, rgba(117,223,255,.13), transparent 34%), radial-gradient(circle at 85% 50%, rgba(255,191,104,.10), transparent 28%)}
.theme-capabilities{background:linear-gradient(180deg, rgba(16,10,28,.96), rgba(12,14,29,.96)), radial-gradient(circle at 20% 20%, rgba(159,134,255,.18), transparent 32%), radial-gradient(circle at 80% 72%, rgba(117,223,255,.09), transparent 28%)}
.theme-metrics{background:linear-gradient(180deg, rgba(11,16,24,.98), rgba(8,10,16,.98)), radial-gradient(circle at 20% 40%, rgba(255,255,255,.06), transparent 34%), radial-gradient(circle at 80% 20%, rgba(117,223,255,.10), transparent 28%)}
.theme-usecases{background:linear-gradient(180deg, rgba(13,14,29,.98), rgba(8,9,18,.98)), radial-gradient(circle at 18% 18%, rgba(159,134,255,.15), transparent 34%), radial-gradient(circle at 82% 58%, rgba(255,111,159,.10), transparent 30%)}
.theme-video{background:linear-gradient(180deg, rgba(20,14,10,.98), rgba(10,12,18,.96)), radial-gradient(circle at 20% 24%, rgba(255,191,104,.18), transparent 34%), radial-gradient(circle at 80% 64%, rgba(117,223,255,.10), transparent 30%)}
.theme-enterprise{background:linear-gradient(180deg, rgba(22,10,18,.98), rgba(9,10,18,.98)), radial-gradient(circle at 18% 26%, rgba(255,111,159,.17), transparent 34%), radial-gradient(circle at 82% 64%, rgba(159,134,255,.14), transparent 30%)}
.theme-contact{background:linear-gradient(180deg, rgba(9,11,16,.98), rgba(6,8,12,1)), radial-gradient(circle at 50% 0%, rgba(117,223,255,.08), transparent 40%)}

.topbar{
  position:fixed;top:14px;left:50%;transform:translateX(-50%);
  width:min(1320px, calc(100vw - 26px));
  padding:14px 18px;border-radius:22px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  background:linear-gradient(180deg, rgba(12,15,24,.76), rgba(9,11,17,.58));
  border:1px solid rgba(255,255,255,.11);
  box-shadow:0 18px 45px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.07);
  backdrop-filter:blur(18px);
  z-index:90;
}
.brand{display:flex;align-items:center;gap:12px;font-weight:700}
.brand img{width:34px;height:34px;object-fit:contain}
.brand span{letter-spacing:.02em}
.nav{display:flex;gap:20px}
.nav a{color:rgba(244,247,255,.75);font-size:.96rem;position:relative;padding:8px 0;transition:.35s ease}
.nav a:after{
  content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;
  background:linear-gradient(90deg, rgba(117,223,255,0), rgba(117,223,255,.9), rgba(255,191,104,0));
  transform:scaleX(.18);transform-origin:left;opacity:0;transition:.35s ease
}
.nav a:hover{color:#fff;text-shadow:0 0 18px rgba(255,255,255,.22)}
.nav a:hover:after{opacity:1;transform:scaleX(1)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:54px;padding:0 22px;border-radius:999px;font-weight:700;
  border:1px solid rgba(255,255,255,.14);
  transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease, background .3s ease;
  position:relative;overflow:hidden
}
.btn:before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(110deg, transparent 15%, rgba(255,255,255,.18) 50%, transparent 85%);
  transform:translateX(-120%);transition:transform .8s ease;pointer-events:none
}
.btn:hover:before{transform:translateX(120%)}
.btn:hover{transform:translateY(-3px)}
.btn-primary{
  background:linear-gradient(135deg, rgba(117,223,255,.24), rgba(159,134,255,.22) 46%, rgba(255,191,104,.2));
  box-shadow:0 22px 54px rgba(117,223,255,.18), inset 0 1px 0 rgba(255,255,255,.18)
}
.btn-secondary{
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow:0 18px 36px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.08)
}
.btn-ghost{
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
}

.eyebrow{
  display:inline-flex;align-items:center;gap:12px;
  text-transform:uppercase;letter-spacing:.22em;
  font-size:.76rem;color:rgba(241,248,255,.78);font-weight:700
}
.eyebrow:before{
  content:"";width:46px;height:1px;
  background:linear-gradient(90deg, rgba(117,223,255,0), rgba(117,223,255,.95), rgba(255,191,104,.88));
  box-shadow:0 0 16px rgba(117,223,255,.35)
}
.section-head{max-width:860px;margin-bottom:42px}
.section-head h2,.metrics-copy h2,.contact-card h2,.enterprise-copy h2{margin:16px 0 12px;font-size:clamp(2rem,4.2vw,4.35rem);line-height:.98;letter-spacing:-.05em}
.section-head p,.metrics-copy p,.contact-card p,.enterprise-copy p,.hero-copy p,.slide-copy p{max-width:760px;color:var(--muted);font-size:1.06rem;line-height:1.75}

.hero-grid{
  display:grid;grid-template-columns:1.02fr .98fr;gap:48px;align-items:center;min-height:100svh;padding-top:90px
}
.hero-copy h1{
  font-size:clamp(3rem,7.1vw,7.2rem);
  line-height:.9;letter-spacing:-.07em;margin:16px 0 18px;max-width:900px
}
.hero-copy h1 span{
  background:linear-gradient(90deg, #fff, var(--cyan-2) 28%, #fff 52%, #c6b6ff 70%, #ffe2a8);
  -webkit-background-clip:text;background-clip:text;color:transparent
}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
.hero-actions.center{justify-content:center}
.hero-tech{
  display:flex;flex-wrap:wrap;gap:12px;margin-top:26px
}
.hero-tech span{
  padding:11px 14px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);
  color:rgba(240,246,255,.82);font-weight:600;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)
}

.hero-smoke,.hero-gradient{
  position:absolute;border-radius:50%;filter:blur(54px);mix-blend-mode:screen;opacity:.75
}
.hero-smoke-a{width:38vw;height:38vw;left:-8%;top:10%;background:radial-gradient(circle, rgba(117,223,255,.16), transparent 62%)}
.hero-smoke-b{width:40vw;height:40vw;right:-10%;bottom:5%;background:radial-gradient(circle, rgba(159,134,255,.18), transparent 62%)}
.hero-gradient-a{width:44vw;height:44vw;right:18%;top:16%;background:radial-gradient(circle, rgba(255,191,104,.13), transparent 60%)}
.hero-gradient-b{width:30vw;height:30vw;right:0;top:2%;background:radial-gradient(circle, rgba(117,223,255,.13), transparent 60%)}
.hero-gradient-c{width:24vw;height:24vw;left:28%;bottom:10%;background:radial-gradient(circle, rgba(255,111,159,.12), transparent 62%)}

#heroGrid,#heroParticles,#heroRays,#statementLines,#productsCanvas,#capabilitiesCanvas,#metricsCanvas,#carouselCanvas,#videoCanvas,#enterpriseCanvas,#contactCanvas{position:absolute;inset:0}

.hero-visual{display:flex;justify-content:center}
.orbital-shell{
  position:relative;width:min(680px, 88vw);aspect-ratio:1/1;border-radius:50%;
  filter:drop-shadow(0 0 70px rgba(117,223,255,.18))
}
.orbital-halo,.orbital-ring,.orbital-spokes,.orbital-sweep,.orbital-core,.orbital-badge{position:absolute}
.orbital-halo{inset:10%;border-radius:50%;filter:blur(40px);opacity:.75}
.halo-a{background:radial-gradient(circle, rgba(117,223,255,.16), transparent 58%)}
.halo-b{background:radial-gradient(circle, rgba(159,134,255,.13), transparent 62%);inset:22%}
.orbital-ring{
  border-radius:50%;border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 0 18px rgba(255,255,255,.03), 0 0 28px rgba(255,255,255,.03)
}
.ring-xl{inset:0;border-color:rgba(255,255,255,.12)}
.ring-lg{inset:11%}
.ring-md{inset:23%}
.ring-sm{inset:35%}
.orbital-spokes{
  inset:6%;border-radius:50%;
  background:repeating-conic-gradient(from 0deg, rgba(255,255,255,.12) 0 .5deg, transparent .5deg 12deg);
  mask:radial-gradient(circle, transparent 0 36%, #000 37% 100%);
  animation:spinSlow 60s linear infinite
}
.orbital-sweep{
  inset:7%;border-radius:50%;
  background:conic-gradient(from 40deg, transparent 0deg, rgba(117,223,255,.28) 46deg, transparent 88deg, transparent 360deg);
  filter:blur(18px);animation:spinSlowReverse 18s linear infinite
}
.orbital-core{
  inset:39%;border-radius:50%;
  display:grid;place-items:center;
  background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.16), rgba(117,223,255,.08) 45%, rgba(13,17,25,.85) 75%);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 0 45px rgba(117,223,255,.16), inset 0 1px 0 rgba(255,255,255,.16)
}
.orbital-core img{width:42%;opacity:.95}
.orbital-badge{
  padding:14px 18px;border-radius:999px;background:rgba(13,18,28,.72);backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.11);font-weight:700;font-size:.92rem;
  box-shadow:0 14px 28px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08)
}
.badge-a{top:10%;right:14%}
.badge-b{left:4%;top:36%}
.badge-c{right:-2%;top:50%}
.badge-d{left:14%;bottom:12%}
.badge-e{right:24%;bottom:4%}

.statement-grid{
  display:grid;grid-template-columns:1fr minmax(260px, 420px) 1fr;align-items:center;gap:22px;min-height:360px
}
.statement-side{
  font-family:"Space Grotesk", Inter, sans-serif;
  font-size:clamp(2.7rem,6vw,7rem);letter-spacing:-.06em;font-weight:700;line-height:.92;
  color:rgba(245,248,255,.92)
}
.statement-side-right{text-align:right}
.statement-center{display:flex;justify-content:center}
.statement-circle{
  position:relative;width:min(420px, 62vw);aspect-ratio:1/1;border-radius:50%;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 0 45px rgba(117,223,255,.15), inset 0 0 60px rgba(255,255,255,.02)
}
.statement-circle-inner{
  position:absolute;inset:12%;border-radius:50%;border:1px solid rgba(255,255,255,.12)
}
.statement-cross{
  position:absolute;inset:50% auto auto 50%;width:1px;height:1px
}
.statement-cross:before,.statement-cross:after{
  content:"";position:absolute;background:linear-gradient(180deg, transparent, rgba(255,255,255,.42), transparent)
}
.statement-cross:before{width:1px;height:240%;left:0;top:-120%}
.statement-cross:after{height:1px;width:240%;top:0;left:-120%;background:linear-gradient(90deg, transparent, rgba(255,255,255,.42), transparent)}
.statement-ray{
  position:absolute;left:50%;top:50%;height:1px;transform-origin:left center;
  background:linear-gradient(90deg, rgba(117,223,255,.0), rgba(117,223,255,.95), rgba(255,255,255,0));
  box-shadow:0 0 12px rgba(117,223,255,.42)
}
.ray-a{width:56%;transform:rotate(-34deg)}
.ray-b{width:48%;transform:rotate(22deg);background:linear-gradient(90deg, rgba(159,134,255,.0), rgba(159,134,255,.95), rgba(255,255,255,0))}
.ray-c{width:62%;transform:rotate(130deg);background:linear-gradient(90deg, rgba(255,191,104,.0), rgba(255,191,104,.95), rgba(255,255,255,0))}

.product-grid,.capability-grid,.metrics-grid,.media-grid-premium{
  display:grid;gap:22px
}
.product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.capability-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.metrics-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.media-grid-premium{grid-template-columns:1.45fr 1fr 1fr}
.media-card-large{grid-row:span 2;min-height:560px}

.product-card,.capability-card,.metric-card,.media-card,.contact-card,.enterprise-panel,.enterprise-copy{
  position:relative;border-radius:var(--radius-xl);overflow:hidden;
  background:linear-gradient(180deg, rgba(18,22,34,.72), rgba(8,11,18,.82));
  border:1px solid rgba(255,255,255,.11);
  box-shadow:var(--shadow-lg), inset 0 1px 0 rgba(255,255,255,.09)
}
.product-card,.capability-card,.metric-card,.media-card{padding:28px}
.product-card{
  min-height:320px;display:flex;flex-direction:column;justify-content:flex-end;gap:12px;
  transition:transform .32s ease, box-shadow .32s ease, border-color .32s ease
}
.product-card:hover,.capability-card:hover,.metric-card:hover,.media-card:hover{
  box-shadow:0 34px 90px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.05), inset 0 1px 0 rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.18)
}
.card-gradient,.card-noise,.card-shine{position:absolute;inset:0;pointer-events:none}
.card-gradient{background:radial-gradient(circle at 20% 15%, rgba(255,255,255,.12), transparent 28%)}
.card-noise{opacity:.22;background-image:radial-gradient(rgba(255,255,255,.16) .5px, transparent .5px);background-size:10px 10px;mix-blend-mode:soft-light}
.card-shine{
  inset:-50%;background:conic-gradient(from 0deg, transparent, rgba(255,255,255,.14), transparent 16%);
  transform:translateX(-60%) rotate(12deg);transition:transform 1.1s ease
}
.product-card:hover .card-shine{transform:translateX(60%) rotate(12deg)}
.product-meta{font-size:.8rem;text-transform:uppercase;letter-spacing:.2em;color:rgba(255,255,255,.72);font-weight:700}
.product-card h3,.capability-card h3,.media-card h3{margin:0;font-size:1.45rem;line-height:1.06;letter-spacing:-.03em}
.product-card p,.capability-card p,.metric-card span,.media-card span,.enterprise-points li,.panel-metrics span{color:var(--muted);line-height:1.72}
.product-link{margin-top:auto;font-weight:700}
.accent-cyan{background:linear-gradient(180deg, rgba(12,24,32,.82), rgba(8,11,18,.88))}
.accent-violet{background:linear-gradient(180deg, rgba(23,18,38,.82), rgba(10,10,18,.9))}
.accent-amber{background:linear-gradient(180deg, rgba(32,21,12,.82), rgba(11,11,18,.9))}
.accent-rose{background:linear-gradient(180deg, rgba(36,15,25,.82), rgba(11,10,18,.9))}
.accent-cyan:before,.accent-violet:before,.accent-amber:before,.accent-rose:before{
  content:"";position:absolute;inset:auto -8% -20% -8%;height:54%;
  filter:blur(40px)
}
.accent-cyan:before{background:radial-gradient(circle, rgba(117,223,255,.24), transparent 68%)}
.accent-violet:before{background:radial-gradient(circle, rgba(159,134,255,.24), transparent 68%)}
.accent-amber:before{background:radial-gradient(circle, rgba(255,191,104,.24), transparent 68%)}
.accent-rose:before{background:radial-gradient(circle, rgba(255,111,159,.22), transparent 68%)}

.capability-card{min-height:250px}
.cap-index{
  display:inline-flex;align-items:center;justify-content:center;
  width:48px;height:48px;border-radius:16px;margin-bottom:18px;
  background:linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.1);font-weight:800
}

.metrics-layout{display:grid;grid-template-columns:1fr 1.15fr;gap:28px;align-items:start}
.metric-card{min-height:176px;display:flex;flex-direction:column;justify-content:flex-end}
.metric-card strong{
  font-size:clamp(1.8rem,4.8vw,3.8rem);line-height:.92;letter-spacing:-.06em;margin-bottom:10px;
  background:linear-gradient(90deg,#fff,var(--cyan-2),#fff,var(--gold));
  -webkit-background-clip:text;background-clip:text;color:transparent
}

.carousel{
  position:relative;margin-top:24px;min-height:720px
}
.carousel-track{position:relative;min-height:720px}
.carousel-slide{
  position:absolute;inset:0;opacity:0;pointer-events:none;transform:scale(1.03);
  transition:opacity .7s ease, transform .9s ease
}
.carousel-slide.is-active{opacity:1;pointer-events:auto;transform:scale(1)}
.slide-backdrop,.slide-overlay{position:absolute;inset:0}
.slide-backdrop{
  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.08), transparent 26%),
    linear-gradient(135deg, rgba(17,22,34,.72), rgba(7,9,15,.86)),
    linear-gradient(115deg, rgba(117,223,255,.18), rgba(159,134,255,.12) 48%, rgba(255,191,104,.14));
  transform:scale(1.08)
}
.slide-1{background:
 radial-gradient(circle at 18% 30%, rgba(117,223,255,.18), transparent 26%),
 linear-gradient(135deg, rgba(10,14,24,.86), rgba(7,9,14,.92)),
 linear-gradient(120deg, rgba(117,223,255,.20), rgba(22,29,46,.16) 52%, rgba(255,191,104,.10))}
.slide-2{background:
 radial-gradient(circle at 72% 26%, rgba(255,191,104,.18), transparent 26%),
 linear-gradient(135deg, rgba(13,14,24,.86), rgba(7,9,14,.92)),
 linear-gradient(120deg, rgba(255,191,104,.18), rgba(25,18,34,.18) 52%, rgba(159,134,255,.12))}
.slide-3{background:
 radial-gradient(circle at 26% 20%, rgba(159,134,255,.18), transparent 26%),
 linear-gradient(135deg, rgba(11,13,26,.86), rgba(7,9,14,.92)),
 linear-gradient(120deg, rgba(159,134,255,.18), rgba(24,28,44,.18) 52%, rgba(117,223,255,.11))}
.slide-4{background:
 radial-gradient(circle at 72% 70%, rgba(255,111,159,.18), transparent 26%),
 linear-gradient(135deg, rgba(12,12,24,.86), rgba(7,9,14,.92)),
 linear-gradient(120deg, rgba(255,111,159,.16), rgba(25,18,34,.18) 52%, rgba(117,223,255,.10))}
.slide-overlay{
  background:
    linear-gradient(90deg, rgba(5,7,10,.14), rgba(5,7,10,.66) 48%, rgba(5,7,10,.4)),
    radial-gradient(circle at 70% 50%, rgba(255,255,255,.05), transparent 30%)
}
.slide-grid{
  position:relative;z-index:2;
  min-height:720px;display:grid;grid-template-columns:1fr .95fr;gap:40px;align-items:center
}
.slide-copy h3{font-size:clamp(2.1rem,4.4vw,5.2rem);line-height:.95;letter-spacing:-.06em;margin:16px 0}
.slide-media{display:flex;justify-content:flex-end}
.media-frame{
  position:relative;width:min(520px, 92%);aspect-ratio:1.05/1;
  border-radius:30px;overflow:hidden;border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(10,12,18,.72), rgba(16,20,30,.78));
  box-shadow:var(--shadow-xl), inset 0 1px 0 rgba(255,255,255,.1)
}
.media-screen,.video-screen,.media-placeholder{
  position:absolute;inset:18px;border-radius:24px;
  border:1px solid rgba(255,255,255,.1);
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.01)),
    radial-gradient(circle at 18% 18%, rgba(255,255,255,.08), transparent 22%),
    linear-gradient(130deg, rgba(117,223,255,.12), rgba(13,17,25,.2) 45%, rgba(159,134,255,.14) 70%, rgba(255,191,104,.10));
  display:grid;place-items:end start;padding:24px;color:rgba(255,255,255,.72);font-weight:700;letter-spacing:.08em;text-transform:uppercase
}
.media-gridlines{
  position:absolute;inset:18px;border-radius:24px;
  background-image:linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:34px 34px;opacity:.22
}
.media-glow{
  position:absolute;inset:auto -14% -18% 14%;height:56%;
  background:radial-gradient(circle, rgba(117,223,255,.18), transparent 68%);
  filter:blur(40px)
}

.carousel-arrow{
  position:absolute;top:50%;transform:translateY(-50%);z-index:5;
  width:64px;height:64px;border-radius:50%;border:1px solid rgba(255,255,255,.14);
  background:rgba(11,14,21,.58);backdrop-filter:blur(12px);color:#fff;font-size:2rem;cursor:pointer
}
.carousel-arrow.prev{left:24px}
.carousel-arrow.next{right:24px}
.carousel-dots{position:absolute;left:50%;bottom:30px;transform:translateX(-50%);display:flex;gap:10px;z-index:5}
.carousel-dots button{
  width:44px;height:4px;border:none;border-radius:99px;background:rgba(255,255,255,.18);cursor:pointer
}
.carousel-dots button.active{background:linear-gradient(90deg, var(--cyan), var(--amber))}

.media-card{min-height:270px;display:flex;flex-direction:column;justify-content:flex-end;gap:10px}
.media-placeholder{position:relative;inset:auto;min-height:180px;margin-bottom:16px}
.media-dark{background:linear-gradient(130deg, rgba(117,223,255,.14), rgba(8,10,18,.82) 48%, rgba(159,134,255,.18))}
.media-cyan{background:linear-gradient(130deg, rgba(117,223,255,.22), rgba(8,10,18,.82) 48%, rgba(255,191,104,.14))}
.media-violet{background:linear-gradient(130deg, rgba(159,134,255,.24), rgba(8,10,18,.82) 48%, rgba(255,111,159,.16))}

.enterprise-shell{display:grid;grid-template-columns:1fr 1.05fr;gap:26px;align-items:stretch}
.enterprise-copy{padding:38px}
.enterprise-points{margin:22px 0 0;padding-left:20px;display:grid;gap:10px}
.enterprise-panel{padding:20px}
.panel-shell{
  position:relative;min-height:100%;padding:18px;border-radius:30px;
  background:linear-gradient(180deg, rgba(14,16,25,.72), rgba(8,10,18,.86));
  border:1px solid rgba(255,255,255,.08);overflow:hidden
}
.panel-top{display:flex;gap:8px}
.panel-top span{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.32)}
.panel-beam{
  position:absolute;inset:12% -30% auto -30%;height:120px;
  background:linear-gradient(90deg, transparent, rgba(255,111,159,.12), rgba(159,134,255,.12), rgba(117,223,255,.12), transparent);
  filter:blur(20px);animation:beamMove 9s linear infinite
}
.panel-grid{
  position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:28px 28px;opacity:.24
}
.panel-metrics{
  position:relative;z-index:2;margin-top:58px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px
}
.panel-metrics div{
  padding:20px;border-radius:20px;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(12px)
}
.panel-metrics strong{display:block;margin-bottom:10px;font-size:1.16rem}

.contact-card{
  max-width:980px;margin:0 auto;padding:52px;text-align:center;
  background:
    linear-gradient(180deg, rgba(15,19,28,.82), rgba(8,10,16,.9)),
    radial-gradient(circle at 50% 0%, rgba(117,223,255,.12), transparent 42%);
  box-shadow:var(--shadow-xl), inset 0 1px 0 rgba(255,255,255,.1)
}

.footer{
  position:relative;z-index:2;width:var(--container);margin:0 auto;padding:26px 0 48px;
  display:flex;justify-content:space-between;gap:16px;align-items:center;color:rgba(240,246,255,.72)
}
.footer-left{display:flex;align-items:center;gap:14px}
.footer-left img{width:42px;height:42px;object-fit:contain}
.footer-left strong{display:block;color:#fff}
.footer-right{display:flex;gap:18px;flex-wrap:wrap}

.site-loader{
  position:fixed;inset:0;z-index:999;background:#07090f;display:grid;place-items:center;
  transition:opacity .8s ease, visibility .8s ease
}
.site-loader.is-hidden{opacity:0;visibility:hidden}
.loader-backdrop,.loader-grid,.loader-smoke{position:absolute;inset:0}
.loader-grid{
  background-image:linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:28px 28px;opacity:.32
}
.loader-smoke-a{background:radial-gradient(circle at 30% 40%, rgba(117,223,255,.14), transparent 38%);filter:blur(60px)}
.loader-smoke-b{background:radial-gradient(circle at 70% 60%, rgba(159,134,255,.12), transparent 38%);filter:blur(60px)}
.loader-core{
  position:relative;width:min(520px, calc(100vw - 36px));padding:54px 32px;border-radius:32px;text-align:center;
  background:linear-gradient(180deg, rgba(16,19,28,.7), rgba(9,11,17,.88));
  border:1px solid rgba(255,255,255,.1);box-shadow:var(--shadow-xl)
}
.loader-ring{position:absolute;inset:14px;border-radius:30px;border:1px solid rgba(255,255,255,.06)}
.ring-a{animation:spinSlow 18s linear infinite}
.ring-b{inset:30px;border-style:dashed;animation:spinSlowReverse 26s linear infinite}
.ring-c{inset:52px}
.ring-d{inset:72px;border-color:rgba(117,223,255,.14)}
.loader-logo{width:88px;height:88px;margin:0 auto 18px;object-fit:contain;filter:drop-shadow(0 0 30px rgba(117,223,255,.18))}
.loader-copy span{display:block;font-size:.8rem;letter-spacing:.25em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.loader-copy strong{display:block;font-size:1.6rem;margin:10px 0 8px}
.loader-copy small{color:var(--muted)}
.loader-bar{
  margin:26px auto 0;height:8px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;border:1px solid rgba(255,255,255,.06)
}
.loader-bar span{
  display:block;height:100%;width:100%;
  background:linear-gradient(90deg, var(--cyan), var(--violet), var(--amber));
  transform-origin:left center;animation:loaderBar 1.9s ease infinite
}

.reveal{opacity:0;transform:translateY(38px);transition:opacity .9s ease, transform .9s ease}
.reveal.is-visible{opacity:1;transform:none}

@keyframes spinSlow{to{transform:rotate(360deg)}}
@keyframes spinSlowReverse{to{transform:rotate(-360deg)}}
@keyframes loaderBar{0%{transform:scaleX(.05)}50%{transform:scaleX(.88)}100%{transform:scaleX(.18)}}
@keyframes beamMove{0%{transform:translateX(-18%)}50%{transform:translateX(18%)}100%{transform:translateX(-18%)}}

@media (max-width: 1180px){
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .capability-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .media-grid-premium{grid-template-columns:1fr 1fr}
  .media-card-large{grid-column:1/-1;grid-row:auto;min-height:360px}
  .hero-grid,.metrics-layout,.enterprise-shell,.slide-grid{grid-template-columns:1fr}
  .hero-visual{order:-1}
  .slide-grid{padding-top:90px;padding-bottom:90px}
  .slide-media{justify-content:flex-start}
}

@media (max-width: 860px){
  .topbar{padding:12px 14px}
  .nav{display:none}
  .section{padding:96px 0}
  .statement-grid{grid-template-columns:1fr;gap:24px;text-align:center}
  .statement-side-right{text-align:center}
  .product-grid,.capability-grid,.metrics-grid,.media-grid-premium,.panel-metrics{grid-template-columns:1fr}
  .carousel,.carousel-track,.slide-grid{min-height:auto}
  .carousel-slide{position:relative;display:none}
  .carousel-slide.is-active{display:block}
  .carousel-arrow{width:54px;height:54px}
  .carousel-arrow.prev{left:12px}
  .carousel-arrow.next{right:12px}
  .slide-grid{min-height:unset;padding:100px 0 120px}
  .hero-copy h1{font-size:clamp(2.5rem,12vw,4.5rem)}
  .section-head h2,.metrics-copy h2,.contact-card h2,.enterprise-copy h2{font-size:clamp(2rem,10vw,3.3rem)}
  .contact-card{padding:34px}
  .footer{flex-direction:column;align-items:flex-start}
}

@media (prefers-reduced-motion: reduce){
  *,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
