
:root{
  --bg:#07100E;
  --bg-soft:#0B1714;
  --surface:#0F1C19;
  --surface-2:#14241F;
  --line:rgba(255,255,255,.08);
  --text:#EEF8F4;
  --muted:#94A9A1;
  --green:#25D29A;
  --mint:#65F0C1;
  --cyan:#58C9D8;
  --shadow:0 24px 80px rgba(0,0,0,.35);
  --radius:24px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  overflow-x:hidden;
  color:var(--text);
  background:
    radial-gradient(circle at 65% -15%, rgba(37,210,154,.13), transparent 34%),
    linear-gradient(180deg,#06100D 0%,#081310 55%,#06100D 100%);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.28;
  background-image:
    linear-gradient(rgba(101,240,193,.03) 1px, transparent 1px),
    linear-gradient(90deg,rgba(101,240,193,.03) 1px, transparent 1px);
  background-size:54px 54px;
  mask-image:linear-gradient(to bottom,#000,transparent 82%);
}
.container{width:min(1180px,calc(100% - 40px));margin:auto;position:relative;z-index:2}
.ambient{position:fixed;border-radius:50%;filter:blur(90px);opacity:.12;pointer-events:none}
.ambient-a{width:430px;height:430px;background:var(--green);top:20%;right:-200px}
.ambient-b{width:330px;height:330px;background:var(--cyan);bottom:5%;left:-180px}
.site-header{
  position:relative;
  z-index:5;
  border-bottom:1px solid var(--line);
  background:rgba(6,16,13,.72);
  backdrop-filter:blur(18px);
}
.header-inner{height:92px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand img{display:block;width:min(310px,55vw);height:auto}
.header-status{
  display:flex;align-items:center;gap:9px;
  color:#A7B9B2;font-size:11px;letter-spacing:.06em;text-transform:uppercase
}
.status-dot{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 18px var(--green)}
.hero{padding:84px 0 76px;min-height:690px;display:flex;align-items:center}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}
.eyebrow{color:var(--mint);font-size:10px;letter-spacing:.16em;font-weight:800}
.hero h1{
  margin:16px 0 22px;
  font-size:clamp(48px,6vw,78px);
  line-height:.98;
  letter-spacing:-.058em;
}
.hero h1 span{color:var(--mint)}
.hero-copy>p{max-width:700px;color:var(--muted);font-size:17px;line-height:1.72;margin:0}
.service-row{display:flex;flex-wrap:wrap;gap:9px;margin:28px 0}
.service-row span{
  padding:8px 11px;border:1px solid var(--line);border-radius:999px;
  background:rgba(255,255,255,.025);color:#B6C7C1;font-size:11px
}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.btn-primary,.btn-secondary{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:46px;padding:0 18px;border-radius:13px;text-decoration:none;font-weight:800;font-size:12px
}
.btn-primary{background:linear-gradient(135deg,var(--mint),var(--green));color:#06100D;box-shadow:0 14px 35px rgba(37,210,154,.18)}
.btn-secondary{border:1px solid var(--line);color:var(--text);background:rgba(255,255,255,.03)}
.hero-visual{min-height:510px;position:relative;display:grid;place-items:center}
.visual-card{
  width:min(360px,80vw);aspect-ratio:1/1;border:1px solid rgba(101,240,193,.16);
  border-radius:36px;background:linear-gradient(145deg,rgba(37,210,154,.11),rgba(255,255,255,.025));
  display:grid;place-items:center;padding:34px;position:relative;box-shadow:var(--shadow);overflow:hidden
}
.visual-card:before{
  content:"";position:absolute;inset:-20%;background:conic-gradient(from 0deg,transparent,rgba(101,240,193,.08),transparent 36%);
  animation:spin 18s linear infinite
}
.visual-card img{width:72%;position:relative;z-index:1;filter:drop-shadow(0 20px 45px rgba(37,210,154,.18))}
.visual-copy{position:absolute;left:28px;right:28px;bottom:25px;z-index:2;padding-top:18px;border-top:1px solid var(--line)}
.visual-copy small,.visual-copy span{display:block}.visual-copy small{color:var(--mint);font-weight:800;letter-spacing:.12em}
.visual-copy strong{display:block;margin:5px 0 3px;font-size:15px}.visual-copy span{font-size:10px;color:var(--muted)}
.orbital{position:absolute;border:1px solid rgba(101,240,193,.11);border-radius:50%}
.orbital-1{width:470px;height:470px}.orbital-2{width:390px;height:390px;border-style:dashed}
.metric-chip{
  position:absolute;display:flex;align-items:center;gap:10px;min-width:180px;
  border:1px solid var(--line);border-radius:16px;background:rgba(10,24,20,.86);
  backdrop-filter:blur(12px);padding:12px 14px;box-shadow:0 12px 35px rgba(0,0,0,.25)
}
.chip-a{top:64px;right:-3px}.chip-b{left:-14px;bottom:120px}.chip-c{right:15px;bottom:45px}
.chip-icon{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:rgba(37,210,154,.1);color:var(--mint)}
.metric-chip b,.metric-chip small{display:block}.metric-chip b{font-size:11px}.metric-chip small{font-size:9px;color:var(--muted);margin-top:2px}
.solutions{padding:76px 0;background:rgba(255,255,255,.012);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-heading{max-width:790px;margin-bottom:34px}
.section-heading h2,.transition h2{font-size:clamp(32px,4vw,48px);line-height:1.08;letter-spacing:-.045em;margin:10px 0 12px}
.section-heading p,.transition p{color:var(--muted);line-height:1.7;margin:0}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.card{border:1px solid var(--line);border-radius:22px;padding:22px;background:linear-gradient(160deg,rgba(255,255,255,.035),rgba(255,255,255,.015));min-height:190px}
.card.featured{border-color:rgba(37,210,154,.24);background:linear-gradient(145deg,rgba(37,210,154,.11),rgba(255,255,255,.02))}
.card-icon{width:42px;height:42px;border-radius:13px;background:rgba(37,210,154,.09);color:var(--mint);display:grid;place-items:center;font-size:18px}
.card h3{margin:18px 0 8px;font-size:17px}.card p{color:var(--muted);line-height:1.6;font-size:12px;margin:0}
.transition{padding:86px 0}
.transition-inner{
  display:grid;grid-template-columns:1fr 260px;gap:55px;align-items:center;
  border:1px solid var(--line);border-radius:30px;padding:38px;
  background:linear-gradient(120deg,rgba(37,210,154,.08),rgba(255,255,255,.018))
}
.transition-mark{height:200px;display:grid;place-items:center;position:relative}
.transition-mark:before{content:"";position:absolute;width:190px;height:190px;border-radius:50%;border:1px solid rgba(101,240,193,.15);box-shadow:0 0 0 28px rgba(101,240,193,.025)}
.transition-mark img{width:150px;position:relative;filter:drop-shadow(0 18px 35px rgba(37,210,154,.16))}
footer{border-top:1px solid var(--line);padding:28px 0 38px}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
.footer-logo{width:210px;display:block}.footer-inner p{color:var(--muted);font-size:10px;margin:4px 0 0 54px}
.footer-note{text-align:right}.footer-note strong,.footer-note span{display:block}.footer-note strong{font-size:12px}.footer-note span{font-size:9px;color:var(--muted);margin-top:4px}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:980px){
  .hero-grid{grid-template-columns:1fr}.hero{padding-top:58px}.hero-visual{min-height:470px}
  .cards{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:620px){
  .container{width:min(100% - 28px,1180px)}
  .header-status{display:none}.header-inner{height:78px}.brand img{width:245px}
  .hero{padding:54px 0}.hero h1{font-size:49px}
  .hero-copy>p{font-size:15px}.hero-visual{min-height:410px}
  .visual-card{width:285px;border-radius:28px}.orbital-1{width:360px;height:360px}.orbital-2{width:310px;height:310px}
  .metric-chip{min-width:150px;padding:10px}.chip-a{top:40px;right:-2px}.chip-b{left:-2px;bottom:90px}.chip-c{right:0;bottom:20px}
  .cards{grid-template-columns:1fr}.transition-inner{grid-template-columns:1fr;padding:28px}.transition-mark{height:150px}
  .footer-inner{align-items:flex-start;flex-direction:column}.footer-note{text-align:left}.footer-inner p{margin-left:0}
}
