/* Orbit 3D site — extends the launch placeholder's design system.
   Geist Mono on #0E1012, green accent #6ACBA8, bordered 90s chrome. */

*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{
  background:#0E1012;color:#C8CCD0;
  font-family:'Geist Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  -webkit-font-smoothing:antialiased;
  display:flex;flex-direction:column;
  background-image:radial-gradient(120% 90% at 70% -10%,#14201b 0%,#0E1012 55%);
}
::selection{background:#1F3A30;color:#7FD8B6}
a{color:#6ACBA8;text-decoration:none}
a:hover{color:#7FD8B6}
img{max-width:100%;display:block}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── Nav ─────────────────────────────────────────── */
nav{
  border-bottom:1px solid #000;box-shadow:inset 0 -1px 0 #23282c;
  background:#131619;
}
.nav-in{
  max-width:1100px;margin:0 auto;padding:14px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.nav-brand{
  display:flex;align-items:center;gap:10px;
  font-size:13px;font-weight:700;letter-spacing:.18em;color:#C8CCD0;
}
.nav-brand:hover{color:#fff}
.nav-brand .three{color:#6ACBA8}
.nav-links{display:flex;gap:22px;font-size:10px;letter-spacing:.2em;text-transform:uppercase}
.nav-links a{color:#80868A}
.nav-links a:hover,.nav-links a.active{color:#6ACBA8}

/* ── Shared bits ─────────────────────────────────── */
.badge{
  display:inline-flex;align-items:center;gap:8px;border:1px solid #000;background:#131619;
  box-shadow:inset 0 1px 0 #23282c;padding:6px 12px;font-size:10px;letter-spacing:.2em;
  color:#6ACBA8;text-transform:uppercase;
}
.dot{width:6px;height:6px;background:#6ACBA8;display:block}
.wrap{flex:1;width:100%;max-width:1100px;margin:0 auto;padding:0 24px}
.section-label{
  font-size:10px;letter-spacing:.3em;color:#80868A;text-transform:uppercase;
  margin:64px 0 18px;display:flex;align-items:center;gap:12px;
}
.section-label::after{content:"";flex:1;height:1px;background:#23282c}
.prose{font-size:14px;line-height:1.8;color:#A8AEB2;max-width:72ch}
.prose strong{color:#C8CCD0;font-weight:700}
.prose h2{font-size:14px;letter-spacing:.12em;color:#C8CCD0;margin:34px 0 10px;text-transform:uppercase}
.prose p{margin:0 0 16px}

/* ── Hero (home) ─────────────────────────────────── */
.hero{display:flex;flex-direction:column;align-items:center;text-align:center;padding:64px 0 20px}
.hero h1{font-size:clamp(40px,8vw,76px);font-weight:700;letter-spacing:.04em;margin:26px 0 0;line-height:1}
.hero h1 .three{color:#6ACBA8}
.hero .tag{font-size:9px;letter-spacing:.34em;color:#80868A;text-transform:uppercase;margin:16px 0 0}
.hero .lede{font-size:14px;line-height:1.75;color:#A8AEB2;max-width:52ch;margin:28px auto 0;text-wrap:pretty}
.logo-spin{width:88px;height:88px}
.hero-shot{
  margin:44px 0 0;border:1px solid #000;box-shadow:inset 0 1px 0 #23282c,0 20px 60px rgba(0,0,0,.5);
  background:#131619;padding:8px;width:100%;
}
.hero-shot img{width:100%}
.shot-caption{font-size:9px;letter-spacing:.2em;color:#80868A;text-transform:uppercase;padding:10px 4px 2px;text-align:left}

/* ── Hero carousel ───────────────────────────────── */
.carousel-stage{position:relative;aspect-ratio:16/9;background:#0E1012;overflow:hidden}
.carousel-stage img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:contain;
  opacity:0;transition:opacity .9s ease;
}
.carousel-stage img.active{opacity:1}
.carousel-bar{display:flex;align-items:center;justify-content:space-between;gap:12px}
.carousel-dots{display:flex;gap:8px;padding:10px 4px 2px}
.carousel-dots button{
  width:8px;height:8px;padding:0;border:1px solid #2a3136;background:#1c2125;cursor:pointer;
}
.carousel-dots button.active{background:#6ACBA8;border-color:#6ACBA8}
.carousel-dots button:hover{border-color:#6ACBA8}

/* ── Feature grid ────────────────────────────────── */
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.feature{
  border:1px solid #000;background:#131619;box-shadow:inset 0 1px 0 #23282c;
  padding:18px;
}
.feature h3{
  margin:0 0 8px;font-size:11px;letter-spacing:.16em;color:#6ACBA8;text-transform:uppercase;
  display:flex;align-items:center;gap:8px;
}
.feature p{margin:0;font-size:12px;line-height:1.7;color:#A8AEB2}

/* ── Screenshot grid ─────────────────────────────── */
.shots{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}
.shot{border:1px solid #000;background:#131619;box-shadow:inset 0 1px 0 #23282c;padding:6px}
.shot img{width:100%}
.shot .shot-caption{padding:8px 4px 2px}

/* ── Spec table ──────────────────────────────────── */
.specs{border:1px solid #000;background:#131619;box-shadow:inset 0 1px 0 #23282c;max-width:560px}
.spec-row{display:flex;justify-content:space-between;gap:16px;padding:12px 16px;border-bottom:1px solid #1c2125;font-size:12px}
.spec-row:last-child{border-bottom:none}
.spec-row .k{color:#80868A;letter-spacing:.12em;text-transform:uppercase;font-size:10px;padding-top:2px}
.spec-row .v{color:#C8CCD0;text-align:right}

/* ── Status strip ────────────────────────────────── */
.status{
  margin:64px 0;border:1px solid #6ACBA8;background:linear-gradient(180deg,#2A4A3A,#16281F);
  box-shadow:inset 0 1px 0 #6ACBA8;padding:20px 24px;
  display:flex;flex-wrap:wrap;align-items:center;gap:10px 24px;
}
.status .headline{font-size:12px;font-weight:700;letter-spacing:.16em;color:#7FD8B6;text-transform:uppercase}
.status .sub{font-size:12px;color:#A8AEB2}

/* ── Contact / email ─────────────────────────────── */
.email-chip{
  display:inline-flex;align-items:center;gap:10px;margin:18px 0 0;
  border:1px solid #6ACBA8;background:linear-gradient(180deg,#2A4A3A,#16281F);
  box-shadow:inset 0 1px 0 #6ACBA8;color:#7FD8B6;
  padding:14px 22px;font-size:13px;font-weight:700;letter-spacing:.08em;
}

/* ── Footer ──────────────────────────────────────── */
footer{border-top:1px solid #000;box-shadow:inset 0 1px 0 #23282c;background:#131619;margin-top:72px}
.foot-in{
  max-width:1100px;margin:0 auto;padding:16px 24px;display:flex;justify-content:space-between;
  align-items:center;flex-wrap:wrap;gap:10px;font-size:10px;letter-spacing:.06em;color:#80868A;
}
.foot-links{display:flex;gap:18px;text-transform:uppercase;letter-spacing:.14em}
.foot-links a{color:#80868A}
.foot-links a:hover{color:#6ACBA8}

/* ── Page headers (subpages) ─────────────────────── */
.page-head{padding:56px 0 8px}
.page-head h1{font-size:clamp(26px,4vw,40px);letter-spacing:.06em;margin:14px 0 0}
.page-head h1 .three{color:#6ACBA8}