:root{
  --bg:#06111f;
  --bg2:#0a1b2f;
  --surface:rgba(255,255,255,.07);
  --surface-2:rgba(255,255,255,.11);
  --line:rgba(255,255,255,.12);
  --text:#f5fbff;
  --muted:#a9bed0;
  --cyan:#39c6ff;
  --blue:#1677ff;
  --blue2:#0055da;
  --shadow:0 28px 90px rgba(0,0,0,.38);
  --max:1180px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{
  margin:0;
  min-height:100vh;
  color:var(--text);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  background:
    radial-gradient(circle at 14% 14%,rgba(34,167,255,.20),transparent 32rem),
    radial-gradient(circle at 88% 8%,rgba(27,96,255,.16),transparent 28rem),
    linear-gradient(180deg,#071321 0%,#091828 50%,#06111f 100%);
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.32;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom,black,transparent 78%);
}

a{color:inherit}
img{max-width:100%;display:block}
.shell{width:min(calc(100% - 40px),var(--max));margin:auto}

.header{
  position:fixed;
  z-index:50;
  inset:18px 0 auto;
}
.nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:12px 14px 12px 16px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(7,19,33,.66);
  backdrop-filter:blur(20px) saturate(150%);
  -webkit-backdrop-filter:blur(20px) saturate(150%);
  box-shadow:0 14px 40px rgba(0,0,0,.22);
}
.brand{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  font-weight:800;
  letter-spacing:-.02em;
}
.brand img{
  width:34px;height:34px;border-radius:10px;object-fit:cover;
  box-shadow:0 0 24px rgba(42,183,255,.28);
}
.navlinks{display:flex;align-items:center;gap:6px}
.navlinks a{
  text-decoration:none;
  color:#c7d7e4;
  padding:10px 14px;
  border-radius:999px;
  font-weight:650;
  font-size:.95rem;
  transition:.2s ease;
}
.navlinks a:hover{background:rgba(255,255,255,.07);color:white}
.navlinks .cta{
  color:white;
  background:linear-gradient(135deg,var(--cyan),var(--blue));
  box-shadow:0 10px 26px rgba(14,123,255,.30);
}

.hero{
  position:relative;
  min-height:100vh;
  display:grid;
  align-items:center;
  padding:140px 0 82px;
}
.hero-grid{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(460px,1.08fr);
  gap:46px;
  align-items:center;
}
.kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:22px;
  color:#8fdcff;
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.kicker::before{
  content:"";
  width:26px;height:2px;border-radius:99px;
  background:linear-gradient(90deg,var(--cyan),var(--blue));
}
h1{
  margin:0;
  font-size:clamp(3.1rem,5.8vw,5.7rem);
  line-height:.90;
  letter-spacing:-.075em;
  font-weight:850;
}
.gradient-text{
  background:linear-gradient(110deg,#fff 5%,#8fddff 48%,#2583ff 88%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.lead{
  max-width:650px;
  margin:30px 0 0;
  color:var(--muted);
  font-size:clamp(1.02rem,1.35vw,1.18rem);
  line-height:1.65;
}
.actions{
  display:flex;flex-wrap:wrap;gap:14px;margin-top:36px;
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:0 22px;
  border-radius:999px;
  text-decoration:none;
  font-weight:760;
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.button:hover{transform:translateY(-2px)}
.primary{
  background:linear-gradient(135deg,var(--cyan),var(--blue));
  color:white;
  box-shadow:0 16px 38px rgba(0,110,255,.30);
}
.secondary{
  border:1px solid var(--line);
  background:rgba(255,255,255,.05);
  color:#d9e8f3;
}

.hero-card{
  position:relative;
  min-height:540px;
  border-radius:40px;
  overflow:hidden;
  isolation:isolate;
  border:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(circle at 50% 50%,rgba(25,171,255,.18),transparent 46%),
    linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025));
  box-shadow:var(--shadow);
}
.hero-card::before{
  content:"";
  position:absolute;
  inset:-20%;
  z-index:-1;
  background:conic-gradient(from 90deg,transparent 0 18%,rgba(45,191,255,.20) 28%,transparent 42% 62%,rgba(40,103,255,.16) 72%,transparent 84%);
  animation:rotate 16s linear infinite;
}
.hero-card::after{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:39px;
  z-index:-1;
  background:linear-gradient(145deg,rgba(8,25,43,.93),rgba(7,17,31,.88));
}
.logo-stage{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  padding:45px;
}
.logo-stage img{
  width:116%;
  max-width:none;
  filter:contrast(1.04) saturate(1.08);
  mix-blend-mode:screen;
}
.orbit{
  position:absolute;
  border:1px solid rgba(74,193,255,.22);
  border-radius:50%;
  animation:float 7s ease-in-out infinite;
}
.orbit.one{width:360px;height:360px;left:50%;top:50%;transform:translate(-50%,-50%)}
.orbit.two{width:465px;height:465px;left:50%;top:50%;transform:translate(-50%,-50%);animation-delay:-2s}
.orbit.three{width:560px;height:560px;left:50%;top:50%;transform:translate(-50%,-50%);animation-delay:-4s}
.badge{
  position:absolute;
  left:22px;bottom:22px;
  display:flex;align-items:center;gap:10px;
  padding:12px 16px;
  border-radius:999px;
  background:rgba(8,24,42,.64);
  border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(16px);
  color:#dff6ff;
  font-weight:760;
  box-shadow:0 14px 36px rgba(0,0,0,.26);
}
.dot{width:9px;height:9px;border-radius:50%;background:#40d2ff;box-shadow:0 0 0 7px rgba(64,210,255,.12)}

.section{padding:88px 0}
.heading{max-width:760px;margin-bottom:32px}
.heading .label{
  margin:0 0 13px;
  color:#78d3ff;
  font-size:.83rem;
  font-weight:800;
  letter-spacing:.15em;
  text-transform:uppercase;
}
h2{
  margin:0;
  font-size:clamp(2rem,3.6vw,3.45rem);
  line-height:.98;
  letter-spacing:-.06em;
}
.heading p{
  margin:22px 0 0;
  color:var(--muted);
  font-size:1.08rem;
  line-height:1.75;
}

.editorial{
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(420px,1.18fr);
  gap:52px;
  align-items:start;
  padding:34px 0 10px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.editorial-copy{
  max-width:520px;
}
.editorial-copy p{
  margin:0;
  color:var(--muted);
  line-height:1.78;
  font-size:1.02rem;
}
.capability-list{
  display:grid;
  gap:0;
}
.capability{
  display:grid;
  grid-template-columns:52px 1fr;
  gap:18px;
  align-items:start;
  padding:22px 0;
  border-top:1px solid var(--line);
}
.capability:first-child{border-top:0;padding-top:0}
.capability:last-child{padding-bottom:0}
.capability .num{
  color:#63d1ff;
  font-size:.8rem;
  font-weight:850;
  letter-spacing:.12em;
}
.capability h3{
  margin:0 0 7px;
  font-size:1.1rem;
  letter-spacing:-.02em;
}
.capability p{
  margin:0;
  color:var(--muted);
  line-height:1.65;
  font-size:.96rem;
}

.apps-box{
  position:relative;
  min-height:470px;
  display:grid;
  place-items:center;
  overflow:hidden;
  padding:40px;
  border-radius:38px;
  border:1px solid var(--line);
  background:
    radial-gradient(circle at 50% 45%,rgba(44,174,255,.18),transparent 30rem),
    linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025));
  box-shadow:var(--shadow);
}
.apps-box::before,.apps-box::after{
  content:"";
  position:absolute;
  width:220px;height:220px;
  border-radius:55px;
  border:1px solid rgba(89,200,255,.18);
  background:rgba(255,255,255,.035);
  transform:rotate(18deg);
}
.apps-box::before{left:-60px;bottom:-80px}
.apps-box::after{right:-70px;top:-90px;transform:rotate(-16deg)}
.apps-copy{position:relative;z-index:2;max-width:700px;text-align:center}
.apps-copy h3{margin:0;font-size:clamp(2rem,3.7vw,3.55rem);letter-spacing:-.06em}
.apps-copy p{margin:20px auto 0;max-width:560px;color:var(--muted);font-size:1.08rem;line-height:1.75}

.contact-panel{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  padding:46px;
  border-radius:36px;
  background:
    radial-gradient(circle at 80% 0%,rgba(63,216,255,.28),transparent 22rem),
    linear-gradient(135deg,#0b2036,#073a72 58%,#075dc0);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 30px 90px rgba(0,0,0,.32);
}
.contact-panel p{color:#b9d0e2;line-height:1.7}
.contact-panel .button{background:white;color:#07509a;flex:0 0 auto}

.footer{padding:34px 0 44px}
.footer-row{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding-top:24px;border-top:1px solid var(--line);
  color:#8097a9;font-size:.93rem;
}
.footer-links{display:flex;gap:18px}
.footer-links a{text-decoration:none}
.footer-links a:hover{color:white}

.page-hero{padding:175px 0 72px}
.page-hero h1{font-size:clamp(3rem,5.4vw,5rem)}
.page-content{padding:0 0 110px}
.prose{
  max-width:860px;
  padding:40px;
  border-radius:30px;
  border:1px solid var(--line);
  background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
  box-shadow:0 24px 70px rgba(0,0,0,.20);
}
.prose h2{margin:38px 0 10px;font-size:1.6rem;letter-spacing:-.035em}
.prose h2:first-child{margin-top:0}
.prose p,.prose li{color:var(--muted);line-height:1.8}
.prose a{color:#7ad8ff;text-underline-offset:3px}
.email-box{
  display:inline-flex;
  margin-top:16px;
  padding:15px 19px;
  border-radius:15px;
  border:1px solid rgba(81,193,255,.22);
  background:rgba(44,171,255,.10);
  color:#9fe5ff;
  font-weight:800;
  text-decoration:none;
}

@keyframes rotate{to{transform:rotate(360deg)}}
@keyframes float{
  0%,100%{opacity:.62;transform:translate(-50%,-50%) scale(1)}
  50%{opacity:.94;transform:translate(-50%,-50%) scale(1.025)}
}
@keyframes rise{
  from{opacity:0;transform:translateY(18px)}
  to{opacity:1;transform:translateY(0)}
}
@media(prefers-reduced-motion:no-preference){
  .hero-copy,.hero-card,.feature,.apps-box{animation:rise .85s cubic-bezier(.2,.7,.2,1) both}
  .hero-card{animation-delay:.08s}
  .feature:nth-child(2){animation-delay:.07s}
  .feature:nth-child(3){animation-delay:.14s}
}

@media(max-width:980px){
  .hero-grid{grid-template-columns:1fr}
  .hero-card{min-height:520px}
  .editorial{grid-template-columns:1fr;gap:30px}
}
@media(max-width:700px){
  .shell{width:min(calc(100% - 24px),var(--max))}
  .header{inset:10px 0 auto}
  .navlinks a:not(.cta){display:none}
  .hero{padding-top:112px}
  h1{font-size:clamp(3rem,14vw,4.5rem)}
  .hero-card{min-height:370px}
  .logo-stage{padding:20px}
  .section{padding:76px 0}
  .contact-panel{flex-direction:column;align-items:flex-start;padding:30px}
  .footer-row{flex-direction:column;align-items:flex-start}
  .prose{padding:25px}
}

@media(max-width:700px){
  .editorial{padding:26px 0 8px}
  .capability{grid-template-columns:42px 1fr;gap:12px}
}