:root {
  --bg: #050607;
  --panel: #0a0c0e;
  --panel-2: #0d0f11;
  --text: #f2f2f2;
  --muted: #9b9da2;
  --line: rgba(255,255,255,.13);
  --line-soft: rgba(255,255,255,.06);
  --red: #ff2329;
  --red-soft: rgba(255,35,41,.22);
  --silver: linear-gradient(180deg,#fff 0%,#d8d9db 52%,#8d8f94 100%);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  background:
    radial-gradient(circle at 82% 28%, rgba(255, 25, 30, .09), transparent 25%),
    radial-gradient(circle at 35% 65%, rgba(255,255,255,.025), transparent 28%),
    var(--bg);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  min-height: 100vh;
  overflow-x: hidden;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .19;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, transparent 0, #000 9%, #000 72%, transparent 100%);
}

a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
.site-shell { width: min(1480px, 100%); margin: 0 auto; position: relative; }

.topbar {
  height: 92px;
  padding: 0 clamp(24px, 5.5vw, 84px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(5,6,7,.88);
  backdrop-filter: blur(14px);
}
.brand { display: inline-flex; align-items: center; gap: 18px; font-size: 16px; font-weight: 750; letter-spacing: .16em; }
.brand-logo { width: 58px; height: 58px; object-fit: contain; filter: drop-shadow(0 0 12px rgba(255,35,41,.10)); }
.nav { display: flex; gap: clamp(26px, 3.6vw, 54px); align-items: center; font-size: 12px; letter-spacing: .08em; }
.nav a { color: #d4d5d7; transition: color .2s ease; }
.nav a:hover { color: #fff; }
.nav-contact { border: 1px solid var(--red); border-radius: 999px; padding: 13px 33px; }
.nav-toggle { display: none; background: transparent; border: 0; padding: 10px; }
.nav-toggle span { display: block; width: 24px; height: 1px; background: #fff; margin: 6px 0; }

.hero {
  min-height: 545px;
  display: grid;
  grid-template-columns: 1.06fr .94fr;
  border-bottom: 1px solid var(--line-soft);
  position: relative;
}
.hero-copy { padding: clamp(54px, 6vw, 86px) 20px 38px clamp(24px, 6.6vw, 96px); position: relative; z-index: 2; }
.hero h1 { margin: 0; line-height: .88; letter-spacing: -.045em; }
.hero h1 span { display: block; font-size: clamp(72px, 8.7vw, 132px); font-weight: 780; background: var(--silver); color: transparent; -webkit-background-clip: text; background-clip: text; }
.red-dash { width: 38px; height: 3px; background: var(--red); margin: 35px 0 25px; box-shadow: 0 0 16px rgba(255,35,41,.35); }
.kicker { font-size: 16px; font-weight: 600; letter-spacing: .34em; margin: 0 0 28px; white-space: nowrap; }
.kicker b { color: var(--red); font-size: 18px; margin: 0 .45em; }
.lead { color: #aaaeb4; font-size: 18px; line-height: 1.75; margin: 0 0 31px; }
.hero-actions { display: flex; gap: 28px; align-items: center; }
.button { min-width: 215px; min-height: 54px; padding: 0 20px; display: inline-flex; align-items: center; justify-content: space-between; border-radius: 6px; font-size: 13px; font-weight: 750; letter-spacing: .04em; transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.button:hover { transform: translateY(-2px); }
.button span { font-size: 25px; line-height: 1; }
.button-primary { background: linear-gradient(135deg, #e71920, #ff3137); box-shadow: 0 0 28px rgba(255,35,41,.15); }
.button-primary:hover { box-shadow: 0 8px 30px rgba(255,35,41,.25); }
.button-secondary { background: rgba(255,255,255,.015); border: 1px solid rgba(255,255,255,.25); }
.button-secondary:hover { border-color: rgba(255,255,255,.45); }

.hero-visual { position: relative; overflow: hidden; min-height: 545px; }
.hero-visual::after {
  content: ""; position: absolute; width: 46%; height: 80%; right: -15%; top: 8%;
  background: radial-gradient(ellipse, rgba(255,30,35,.16), transparent 65%); filter: blur(15px);
}
.tech-grid { position: absolute; inset: 0; opacity: .55; background-image: radial-gradient(circle, rgba(255,255,255,.12) 1px, transparent 1px); background-size: 18px 18px; mask-image: radial-gradient(circle at 62% 50%, #000 0 38%, transparent 72%); }
.tech-grid::before, .tech-grid::after { content:""; position:absolute; inset:0; background: linear-gradient(90deg, transparent 0 15%, rgba(255,255,255,.07) 15% 15.15%, transparent 15.15% 35%, rgba(255,255,255,.05) 35% 35.1%, transparent 35.1%), linear-gradient(0deg, transparent 0 20%, rgba(255,35,41,.13) 20% 20.2%, transparent 20.2% 66%, rgba(255,255,255,.05) 66% 66.1%, transparent 66.1%); }
.logo-halo { position: absolute; left: 48%; top: 49%; transform: translate(-50%,-50%); width: min(390px, 70%); aspect-ratio: 1; border-radius: 50%; display:grid; place-items:center; border:1px solid rgba(255,255,255,.55); box-shadow: 0 0 25px rgba(255,255,255,.08), 0 0 52px rgba(255,35,41,.07), inset 0 0 50px rgba(255,255,255,.025); z-index:3; }
.logo-halo::before { content:""; position:absolute; inset:-22px; border-radius:50%; border:1px solid rgba(255,255,255,.08); }
.logo-halo img { width: 82%; height: 82%; object-fit: contain; filter: drop-shadow(0 0 24px rgba(255,35,41,.08)); }
.orbit { position:absolute; border:1px solid rgba(255,255,255,.08); border-radius:50%; left:48%; top:49%; transform:translate(-50%,-50%); }
.orbit-one { width: 480px; aspect-ratio:1; }
.orbit-two { width: 565px; aspect-ratio:1; border-style:dashed; border-color:rgba(255,35,41,.12); }
.node { position:absolute; width:5px; height:5px; border:1px solid var(--red); box-shadow:0 0 10px rgba(255,35,41,.6); z-index:5; }
.n1{top:20%;right:13%}.n2{top:52%;right:6%}.n3{bottom:18%;left:34%}.n4{top:11%;left:32%}

.cards { display:grid; grid-template-columns: repeat(4,1fr); gap:16px; padding: 34px clamp(24px, 5.5vw, 80px) 20px; }
.card { min-height:250px; position:relative; overflow:hidden; padding:24px 24px 20px; border:1px solid rgba(255,255,255,.2); border-radius:7px; background:linear-gradient(135deg,rgba(255,255,255,.035),rgba(255,255,255,.012)); transition:transform .22s ease,border-color .22s ease,background .22s ease; }
.card:hover { transform:translateY(-4px); border-color:rgba(255,255,255,.34); background:linear-gradient(135deg,rgba(255,255,255,.055),rgba(255,255,255,.015)); }
.card-top { display:flex; align-items:flex-start; justify-content:space-between; height:45px; }
.num { color:#9b9da0; font-size:12px; }
.card h2 { margin:6px 0 12px; font-size:20px; font-weight:650; letter-spacing:.02em; }
.mini-dash { width:27px; height:2px; background:var(--red); margin-bottom:17px; }
.card p { color:#a9aaad; font-size:14px; line-height:1.55; margin:0; }
.card>a { position:absolute; bottom:24px; left:24px; right:24px; color:var(--red); font-size:11px; font-weight:700; letter-spacing:.04em; display:flex; justify-content:space-between; z-index:3; }
.code-icon { color:var(--red); font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size:24px; font-weight:300; }
.layers { position:relative; width:27px; height:17px; border:2px solid var(--red); transform:rotate(30deg) skew(-8deg); }
.layers::before,.layers::after{content:"";position:absolute;width:23px;height:13px;border:2px solid var(--red);left:1px;top:5px}.layers::after{top:11px}
.person-icon { width:22px; height:22px; border:2px solid var(--red); border-radius:50%; position:relative; margin-left:4px; transform:scale(.65); transform-origin:top left; }
.person-icon::after { content:"";position:absolute;width:34px;height:20px;border:2px solid var(--red);border-bottom:0;border-radius:22px 22px 0 0;left:-8px;top:30px; }
.plane-icon { color:var(--red); font-size:32px; line-height:1; transform:rotate(-28deg); display:inline-block; }
.card-orbit { position:absolute;width:210px;height:210px;border-radius:50%;border:1px dotted rgba(255,255,255,.08);right:-55px;bottom:-60px; }
.circuit-lines { position:absolute; right:10px; bottom:50px; width:130px; height:50px; opacity:.15; background:repeating-linear-gradient(0deg,transparent 0 7px,rgba(255,255,255,.45) 7px 8px); clip-path:polygon(0 20%,55% 20%,55% 0,100% 0,100% 100%,40% 100%,40% 78%,0 78%); }
.radar { position:absolute; width:130px; height:130px; right:-8px; bottom:5px; border:1px solid rgba(255,255,255,.035); border-radius:50%; box-shadow:inset 0 0 0 26px rgba(255,255,255,.008),inset 0 0 0 50px rgba(255,255,255,.008); }
.dot-field { position:absolute; right:13px; top:78px; width:100px; height:100px; opacity:.18; background-image:radial-gradient(circle,rgba(255,255,255,.7) 1px,transparent 1px); background-size:7px 7px; mask-image:radial-gradient(circle,#000,transparent 70%); }

.trait-strip { margin:0 clamp(24px,5.5vw,80px); padding:17px 0 23px; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); }
.trait { min-height:78px; display:flex; align-items:center; gap:20px; padding:0 26px; border-right:1px solid var(--line); }
.trait:first-child{padding-left:8px}.trait:last-child{border-right:0}
.trait h3 { color:var(--red); font-size:11px; letter-spacing:.06em; margin:0 0 7px; }
.trait p { color:#85878c; font-size:12px; line-height:1.45; margin:0; }
.terminal { width:48px;height:48px;border:1px solid var(--line);border-radius:7px;display:grid;place-items:center;color:#9fa2a6;font-family:monospace;font-size:19px; }
.chip,.target,.bulb { width:42px;height:42px;flex:0 0 42px;position:relative;opacity:.65; }
.chip { border:2px solid #83868a;border-radius:6px;box-shadow:inset 0 0 0 7px var(--bg);outline:1px solid #3f4245; }
.chip::before,.chip::after{content:"";position:absolute;inset:-7px;background:repeating-linear-gradient(90deg,transparent 0 5px,#555 5px 6px,transparent 6px 10px);z-index:-1;opacity:.4}
.bulb { border:2px solid #85888c;border-radius:50% 50% 43% 43%; width:30px;height:34px;margin:0 6px; }
.bulb::after { content:""; position:absolute; width:14px;height:8px;border-top:2px solid #85888c;border-bottom:2px solid #85888c;left:6px;bottom:-10px; }
.target { border:1px solid #888;border-radius:50%;box-shadow:inset 0 0 0 8px var(--bg),inset 0 0 0 9px #666; }
.target::after{content:"";position:absolute;width:4px;height:4px;border:1px solid #888;border-radius:50%;left:18px;top:18px}

.detail-grid { padding:70px clamp(24px,5.5vw,80px) 80px; display:grid;grid-template-columns:1fr 1fr;gap:18px; }
.detail-panel { border:1px solid var(--line);border-radius:8px;padding:38px;background:rgba(255,255,255,.018);min-height:260px; }
.detail-wide { grid-column:1/-1; min-height:220px; }
.eyebrow { color:var(--red);font-size:11px;font-weight:750;letter-spacing:.14em; }
.detail-panel h2 { font-size:clamp(28px,3vw,44px);letter-spacing:-.035em;max-width:670px;margin:20px 0 16px; }
.detail-panel p { color:#9da0a4;line-height:1.75;max-width:720px;margin:0; }

footer { min-height:66px;padding:0 clamp(24px,5.5vw,80px);display:grid;grid-template-columns:1fr 2fr 1fr;align-items:center;color:#777b80;font-size:12px; }
footer a { text-align:right; }
.footer-signal { display:flex;align-items:center;justify-content:center; }
.footer-signal::before,.footer-signal::after{content:"";height:1px;background:linear-gradient(90deg,transparent,rgba(255,35,41,.2));width:42%}.footer-signal::after{transform:scaleX(-1)}
.footer-signal i{width:5px;height:5px;border-radius:50%;background:var(--red);box-shadow:0 0 12px var(--red)}

.reveal { opacity:0; transform:translateY(12px); transition:opacity .6s ease, transform .6s ease; }
.reveal.visible { opacity:1; transform:none; }

@media (max-width: 1050px) {
  .hero { grid-template-columns:1fr; }
  .hero-visual { min-height:480px; }
  .hero-copy { padding-right:clamp(24px,6.6vw,96px); }
  .cards { grid-template-columns:repeat(2,1fr); }
  .trait-strip { grid-template-columns:repeat(2,1fr); }
  .trait:nth-child(2){border-right:0}.trait:nth-child(-n+2){border-bottom:1px solid var(--line-soft)}
}

@media (max-width: 760px) {
  .topbar { height:76px; }
  .brand { gap:10px; font-size:13px; }
  .brand-logo { width:44px; height:44px; }
  .nav-toggle { display:block; z-index:31; }
  .nav { position:fixed; top:76px; left:0; right:0; display:none; flex-direction:column; gap:0; align-items:stretch; padding:15px 24px 28px; background:rgba(5,6,7,.98); border-bottom:1px solid var(--line); }
  .nav.open { display:flex; }
  .nav a { padding:15px 4px; border-bottom:1px solid var(--line-soft); }
  .nav-contact { border:1px solid var(--red)!important; text-align:center; margin-top:14px; }
  .hero-copy { padding-top:54px; }
  .hero h1 span { font-size:clamp(64px,20vw,96px); }
  .kicker { white-space:normal; line-height:2; letter-spacing:.21em; }
  .desktop-break { display:none; }
  .hero-actions { flex-direction:column; align-items:stretch; gap:12px; }
  .button { width:100%; }
  .hero-visual { min-height:390px; }
  .logo-halo { width:280px; }
  .orbit-one { width:340px; }.orbit-two{width:400px}
  .cards { grid-template-columns:1fr; padding-top:22px; }
  .card { min-height:230px; }
  .trait-strip { grid-template-columns:1fr; }
  .trait { border-right:0!important; border-bottom:1px solid var(--line-soft); padding:18px 8px; }
  .trait:last-child { border-bottom:0; }
  .detail-grid { grid-template-columns:1fr; padding-top:48px; }
  .detail-wide { grid-column:auto; }
  .detail-panel { padding:28px; }
  footer { grid-template-columns:1fr 1fr; gap:10px; padding-top:20px; padding-bottom:20px; }
  .footer-signal { display:none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .reveal { opacity:1; transform:none; transition:none; }
  * { transition-duration:0.01ms!important; }
}