:root {
  --bg: #09070d;
  --bg-soft: #0f0b16;
  --surface: #13101a;
  --surface-2: #18131f;
  --border: rgba(255,255,255,.09);
  --border-strong: rgba(174,122,255,.26);
  --text: #f4f0f8;
  --muted: #aaa2b5;
  --accent: #a16af7;
  --accent-2: #c6a5ff;
  --good: #77d8a1;
  --max: 1240px;
  --radius: 22px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background:
    radial-gradient(circle at 75% 5%, rgba(115,66,181,.15), transparent 28rem),
    radial-gradient(circle at 15% 20%, rgba(76,40,112,.08), transparent 24rem),
    var(--bg);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.6;
}
a { color: inherit; }
img { max-width: 100%; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.site-shell { min-height: 100vh; overflow: hidden; }
.site-header {
  width: min(calc(100% - 40px), var(--max));
  margin: 20px auto 0;
  min-height: 74px;
  padding: 0 18px;
  border: 1px solid var(--border);
  background: rgba(12,9,17,.76);
  backdrop-filter: blur(20px);
  border-radius: 18px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 28px;
  position: relative;
  z-index: 20;
}
.brand { display:inline-flex; align-items:center; gap:10px; text-decoration:none; }
.brand-mark {
  width: 38px; height:38px; border-radius: 11px;
  display:grid; place-items:center; font-weight:800; font-size:21px;
  background: linear-gradient(145deg, #c099ff, #7040bc 70%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 10px 28px rgba(100,53,166,.25);
}
.brand-copy { display:flex; flex-direction:column; line-height:1; }
.brand-copy strong { font-size: 18px; letter-spacing: -.02em; }
.brand-copy small { margin-top: 4px; color: var(--muted); font-size: 10px; text-transform:uppercase; letter-spacing:.2em; }
.site-nav { display:flex; justify-content:center; gap: 26px; }
.site-nav a { color:#c8c2cf; text-decoration:none; font-size:14px; transition:.2s ease; }
.site-nav a:hover { color:#fff; }
.nav-toggle { display:none; }
.button {
  display:inline-flex; align-items:center; justify-content:center;
  min-height:48px; padding: 0 22px; border-radius: 12px;
  background: linear-gradient(135deg, #a16af7, #7e48cd);
  color:#fff; text-decoration:none; font-weight:700; font-size:14px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow: 0 12px 36px rgba(111,63,177,.24);
}
.button:hover { transform: translateY(-1px); }
.button-small { min-height:40px; padding:0 16px; }
.button-outline { background:transparent; border-color:var(--border-strong); box-shadow:none; }
.button-ghost { background:transparent; border-color:var(--border); box-shadow:none; color:#ddd7e4; }

.section-pad { width:min(calc(100% - 40px), var(--max)); margin:0 auto; padding:110px 0; }
.hero {
  min-height: 730px; display:grid; grid-template-columns: 1.15fr .85fr;
  align-items:center; gap:70px; padding-top:95px;
}
.eyebrow {
  color:var(--accent-2); font-size:11px; letter-spacing:.19em;
  font-weight:800; text-transform:uppercase;
}
.hero h1, .page-hero h1 {
  font-size: clamp(52px, 6.6vw, 88px);
  line-height:.98; letter-spacing:-.055em; margin:18px 0 26px; max-width:920px;
}
.hero h1 span { color:#b68afa; }
.hero-lead, .page-hero p {
  max-width:720px; color:var(--muted); font-size:19px; line-height:1.7;
}
.hero-actions { display:flex; gap:12px; margin-top:34px; flex-wrap:wrap; }
.trust-row { display:flex; gap:22px; flex-wrap:wrap; margin-top:36px; color:#827a8d; font-size:12px; }
.trust-row span::before { content:""; display:inline-block; width:5px; height:5px; border-radius:50%; background:var(--accent); margin-right:8px; vertical-align:middle; }

.hero-panel {
  border:1px solid var(--border-strong); border-radius:24px;
  background: linear-gradient(160deg, rgba(25,18,34,.95), rgba(13,10,18,.98));
  box-shadow: 0 30px 100px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.04);
  overflow:hidden; transform: perspective(1100px) rotateY(-4deg) rotateX(1deg);
}
.terminal-bar { height:46px; display:flex; align-items:center; gap:7px; padding:0 16px; border-bottom:1px solid var(--border); }
.terminal-bar span { width:8px; height:8px; border-radius:50%; background:#494150; }
.terminal-bar small { margin-left:auto; color:#756d7f; font: 10px ui-monospace, SFMono-Regular, Menlo, monospace; }
.platform-stack { padding:22px; }
.stack-row { display:flex; justify-content:space-between; align-items:center; padding:22px; border:1px solid var(--border); border-radius:15px; background:#100c16; }
.stack-row strong { display:block; margin-top:4px; font-size:16px; }
.stack-kicker, .stack-grid article > span, .mini-label { color:#766c83; font-size:9px; font-weight:800; letter-spacing:.16em; }
.status-dot { color:var(--good); font-size:10px; font-weight:800; }
.status-dot::before { content:""; display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--good); margin-right:6px; box-shadow:0 0 12px rgba(119,216,161,.5); }
.stack-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:10px; }
.stack-grid article { min-height:108px; padding:18px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.018); display:flex; flex-direction:column; justify-content:center; }
.stack-grid strong { font-size:16px; margin-top:6px; }
.stack-grid small { color:var(--good); margin-top:4px; font-size:11px; }

.section-surface { position:relative; }
.section-surface::before {
  content:""; position:absolute; inset:0 50% 0 50%; width:100vw; transform:translateX(-50%);
  background:linear-gradient(180deg, rgba(255,255,255,.018), rgba(255,255,255,.006));
  border-top:1px solid var(--border); border-bottom:1px solid var(--border); z-index:-1;
}
.section-heading { max-width:760px; margin-bottom:46px; }
.section-heading.narrow { max-width:650px; }
.section-heading h2, .statement-section h2, .cta-section h2 {
  font-size:clamp(34px,4vw,54px); line-height:1.08; letter-spacing:-.04em; margin:12px 0 16px;
}
.section-heading p { color:var(--muted); font-size:17px; }
.service-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.service-card {
  min-height:310px; padding:28px; border:1px solid var(--border); border-radius:var(--radius);
  background:linear-gradient(150deg, rgba(255,255,255,.025), rgba(255,255,255,.008));
  text-decoration:none; display:flex; flex-direction:column; transition:.22s ease;
}
.service-card:hover { border-color:var(--border-strong); transform:translateY(-4px); background:linear-gradient(150deg, rgba(161,106,247,.08), rgba(255,255,255,.01)); }
.service-number { color:#61586c; font:700 11px ui-monospace, monospace; }
.service-card h3 { font-size:22px; margin:54px 0 10px; letter-spacing:-.025em; }
.service-card p { color:var(--muted); font-size:14px; }
.card-link { margin-top:auto; color:var(--accent-2); font-size:13px; font-weight:700; }

.architecture-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.architecture-copy > p { color:var(--muted); font-size:17px; }
.check-list { list-style:none; padding:0; margin:30px 0; }
.check-list li { margin:12px 0; color:#d7d0df; }
.check-list li::before { content:"✓"; color:var(--good); margin-right:12px; font-weight:900; }
.text-link { color:var(--accent-2); text-decoration:none; font-weight:700; }
.control-card { border:1px solid var(--border); border-radius:20px; padding:24px; background:#100c16; box-shadow:0 24px 80px rgba(0,0,0,.22); }
.control-card-head { display:flex; justify-content:space-between; gap:20px; align-items:center; }
.control-card-head strong { display:block; margin-top:5px; }
.ready-pill { color:var(--good); border:1px solid rgba(119,216,161,.25); background:rgba(119,216,161,.07); padding:7px 10px; border-radius:999px; font-size:9px; font-weight:900; }
.progress-track { height:5px; border-radius:99px; background:#28222e; margin:22px 0; overflow:hidden; }
.progress-track span { display:block; width:100%; height:100%; background:linear-gradient(90deg,var(--accent),var(--good)); }
.control-list div { display:flex; justify-content:space-between; padding:13px 0; border-top:1px solid var(--border); color:#b8b0c0; font-size:13px; }
.control-list b { color:var(--good); font-size:11px; text-transform:uppercase; letter-spacing:.08em; }

.statement-section { display:grid; grid-template-columns:1.1fr .9fr; gap:80px; align-items:end; border-top:1px solid var(--border); }
.statement-section p { color:var(--muted); font-size:18px; margin:0 0 8px; }
.cta-section { display:flex; justify-content:space-between; align-items:center; gap:50px; border-top:1px solid var(--border); }
.cta-section.compact { padding-top:80px; padding-bottom:80px; }
.cta-actions { display:flex; gap:10px; flex-wrap:wrap; flex-shrink:0; }

.page-hero { padding-top:130px; padding-bottom:90px; }
.page-hero h1 { max-width:1000px; }
.content-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.content-card { padding:36px; min-height:230px; border:1px solid var(--border); border-radius:var(--radius); background:linear-gradient(155deg,rgba(255,255,255,.025),rgba(255,255,255,.008)); }
.content-card h2 { font-size:24px; letter-spacing:-.025em; }
.content-card p { color:var(--muted); }
.contact-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:18px; }
.contact-copy,.contact-panel { border:1px solid var(--border); border-radius:var(--radius); padding:40px; background:rgba(255,255,255,.015); }
.contact-copy h2 { font-size:34px; margin-top:0; }
.contact-copy p { color:var(--muted); max-width:650px; margin-bottom:28px; }
.legal-page { min-height:520px; }

.site-footer { width:min(calc(100% - 40px),var(--max)); margin:0 auto; padding:70px 0 28px; border-top:1px solid var(--border); }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:50px; }
.footer-grid h3 { font-size:12px; text-transform:uppercase; letter-spacing:.12em; color:#81778b; margin:0 0 18px; }
.footer-grid > div > a:not(.brand) { display:block; color:#bdb5c5; text-decoration:none; font-size:13px; margin:10px 0; }
.footer-note { color:#746b7f; max-width:330px; font-size:13px; }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; border-top:1px solid var(--border); margin-top:55px; padding-top:20px; color:#625a6b; font-size:11px; }

@media (max-width: 980px) {
  .site-header { grid-template-columns:auto auto; justify-content:space-between; }
  .site-nav, .header-cta { display:none; }
  .site-nav.open { display:flex; position:absolute; left:0; right:0; top:82px; flex-direction:column; padding:20px; background:#100c16; border:1px solid var(--border); border-radius:16px; }
  .nav-toggle { display:flex; width:42px; height:42px; flex-direction:column; gap:5px; align-items:center; justify-content:center; background:transparent; border:1px solid var(--border); border-radius:10px; }
  .nav-toggle span:not(.sr-only) { width:18px; height:1px; background:#ddd; }
  .hero { grid-template-columns:1fr; min-height:0; gap:30px; }
  .hero-panel { transform:none; max-width:680px; }
  .service-grid { grid-template-columns:1fr 1fr; }
  .architecture-grid, .statement-section, .contact-grid { grid-template-columns:1fr; gap:35px; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}

@media (max-width: 640px) {
  .site-header, .section-pad, .site-footer { width:min(calc(100% - 24px),var(--max)); }
  .site-header { margin-top:12px; }
  .section-pad { padding:76px 0; }
  .hero { padding-top:80px; }
  .hero h1, .page-hero h1 { font-size:clamp(42px,14vw,62px); }
  .hero-lead, .page-hero p { font-size:16px; }
  .service-grid, .content-grid { grid-template-columns:1fr; }
  .service-card { min-height:250px; }
  .stack-grid { grid-template-columns:1fr; }
  .cta-section { align-items:flex-start; flex-direction:column; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; }
}
