@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@500;600;700;800&display=swap');

:root {
  --ink: #08111d;
  --ink-2: #111c2d;
  --paper: #ffffff;
  --soft: #f3f6fb;
  --line: #dce4ef;
  --muted: #607087;
  --muted-light: #aebbd0;
  --blue: #4f79ff;
  --blue-2: #7c5cff;
  --cyan: #53d8ff;
  --green: #70e4b7;
  --radius: 24px;
  --shadow: 0 24px 80px rgba(8, 17, 29, 0.10);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: Inter, Arial, sans-serif;
  color: var(--ink);
  background: var(--paper);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
img { max-width: 100%; }

.site-shell { overflow: hidden; }

.container {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
}

.site-header {
  position: absolute;
  z-index: 50;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: min(1220px, calc(100% - 32px));
  height: 82px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  border-bottom: 1px solid rgba(255,255,255,.12);
  color: white;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  width: fit-content;
}

.brand-mark {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #4f79ff, #8a5cff);
  border-radius: 10px 10px 10px 3px;
  font-family: Manrope, Inter, sans-serif;
  font-weight: 800;
  color: white;
  box-shadow: 0 8px 30px rgba(79,121,255,.35);
}

.brand-text {
  display: grid;
  line-height: 1;
  gap: 3px;
  text-transform: uppercase;
  letter-spacing: .13em;
}

.brand-text strong {
  font: 800 13px/1 Manrope, Inter, sans-serif;
}

.brand-text span {
  font-size: 8px;
  opacity: .64;
  letter-spacing: .22em;
}

.desktop-nav {
  display: flex;
  align-items: center;
  gap: 30px;
  font-size: 14px;
  color: rgba(255,255,255,.82);
}

.desktop-nav a,
.text-link { transition: color .2s ease; }

.desktop-nav a:hover,
.text-link:hover { color: white; }

.header-actions {
  justify-self: end;
  display: flex;
  align-items: center;
  gap: 18px;
  font-size: 14px;
}

.menu-button,
.mobile-menu { display: none; }

.section-dark {
  position: relative;
  background:
    radial-gradient(circle at 20% 20%, rgba(79,121,255,.14), transparent 35%),
    radial-gradient(circle at 85% 35%, rgba(124,92,255,.12), transparent 32%),
    #07111f;
  color: white;
}

.hero {
  min-height: 780px;
  padding: 174px 0 110px;
  display: flex;
  align-items: center;
}

.hero-grid {
  display: grid;
  grid-template-columns: .94fr 1.06fr;
  gap: 70px;
  align-items: center;
}

.eyebrow {
  margin: 0 0 18px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #4266dc;
}

.eyebrow-light { color: #8ea8ff; }

.hero h1,
.section-heading h2,
.build-model-copy h2,
.enterprise-copy h2,
.company-statement h2,
.final-cta h2 {
  font-family: Manrope, Inter, sans-serif;
  letter-spacing: -.045em;
  line-height: .98;
}

.hero h1 {
  margin: 0;
  max-width: 740px;
  font-size: clamp(48px, 5.6vw, 80px);
  font-weight: 700;
}

.hero h1 span {
  background: linear-gradient(90deg, #fff 0%, #a7b9ff 52%, #7fe2ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.hero-lead {
  margin: 30px 0 0;
  max-width: 650px;
  font-size: 19px;
  line-height: 1.7;
  color: #b8c5d9;
}

.hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 34px;
}

.button {
  min-height: 52px;
  padding: 0 21px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  font-weight: 700;
  font-size: 14px;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.button:hover { transform: translateY(-2px); }

.button-primary {
  color: white;
  background: linear-gradient(135deg, var(--blue), var(--blue-2));
  box-shadow: 0 15px 38px rgba(79,121,255,.28);
}

.button-ghost {
  color: white;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.04);
}

.button-ghost:hover { background: rgba(255,255,255,.09); }

.button-light {
  color: #0b1422;
  background: white;
  box-shadow: 0 10px 30px rgba(0,0,0,.1);
}

.button-small {
  min-height: 40px;
  padding: 0 15px;
  border-radius: 10px;
}

.hero-note {
  margin: 34px 0 0;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .16em;
  color: #71819b;
}

.hero-visual {
  position: relative;
  min-width: 0;
}

.visual-window {
  position: relative;
  background: rgba(14,26,43,.82);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 40px 100px rgba(0,0,0,.34);
  border-radius: 26px;
  overflow: hidden;
  backdrop-filter: blur(18px);
}

.window-topbar {
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 18px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  color: #687992;
  font-size: 10px;
  letter-spacing: .16em;
}

.window-dots { display: flex; gap: 6px; }
.window-dots span { width: 7px; height: 7px; border-radius: 50%; background: #334155; }

.ecosystem-board {
  position: relative;
  height: 485px;
  background:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: 30px 30px;
}

.ecosystem-board::before,
.ecosystem-board::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 300px;
  height: 300px;
  border: 1px solid rgba(120,154,255,.12);
  border-radius: 50%;
  transform: translate(-50%,-50%);
}
.ecosystem-board::after { width: 410px; height: 410px; opacity: .5; }

.ecosystem-core {
  position: absolute;
  z-index: 3;
  left: 50%;
  top: 50%;
  width: 158px;
  height: 158px;
  transform: translate(-50%,-50%);
  border-radius: 38px;
  background: linear-gradient(145deg, rgba(79,121,255,.98), rgba(116,74,225,.96));
  box-shadow: 0 26px 70px rgba(78,99,255,.36), inset 0 1px 0 rgba(255,255,255,.35);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.core-mark {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 15px 15px 15px 5px;
  margin-bottom: 11px;
  background: rgba(255,255,255,.17);
  border: 1px solid rgba(255,255,255,.2);
  font: 800 23px Manrope, sans-serif;
}

.ecosystem-core small { font-size: 8px; letter-spacing: .26em; opacity: .7; }
.ecosystem-core strong { margin-top: 3px; font: 700 11px Manrope, sans-serif; letter-spacing: .13em; }

.orbit-card {
  position: absolute;
  z-index: 4;
  min-width: 126px;
  padding: 11px 13px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(8,17,29,.84);
  border-radius: 14px;
  box-shadow: 0 14px 35px rgba(0,0,0,.25);
  font-size: 11px;
}

.orbit-card > span {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: rgba(79,121,255,.13);
  color: #9fb4ff;
  font-size: 8px;
  font-weight: 800;
}
.orbit-card strong { font-size: 11px; white-space: nowrap; }

.orbit-1 { left: 8%; top: 14%; }
.orbit-2 { right: 7%; top: 15%; }
.orbit-3 { right: 2%; top: 46%; }
.orbit-4 { right: 12%; bottom: 11%; }
.orbit-5 { left: 8%; bottom: 12%; }
.orbit-6 { left: 1%; top: 47%; }

.visual-footer {
  min-height: 52px;
  padding: 0 17px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid rgba(255,255,255,.08);
  color: #6e7f98;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .12em;
}

.hero-glow {
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
  filter: blur(60px);
}
.hero-glow-one { width: 280px; height: 280px; background: rgba(79,121,255,.12); left: -100px; bottom: 60px; }
.hero-glow-two { width: 300px; height: 300px; background: rgba(96,214,255,.08); right: -80px; top: 90px; }

.trust-strip {
  border-bottom: 1px solid var(--line);
  background: white;
}
.trust-inner {
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  color: #8793a5;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-weight: 700;
}

.section { padding: 112px 0; }
.section-light { background: white; }
.section-soft { background: var(--soft); }

.section-heading {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 80px;
  align-items: end;
  margin-bottom: 52px;
}
.section-heading h2 {
  margin: 0;
  max-width: 680px;
  font-size: clamp(42px, 4vw, 62px);
  font-weight: 700;
}
.section-heading > p {
  margin: 0 0 5px;
  color: var(--muted);
  font-size: 17px;
  line-height: 1.72;
}
.section-heading-dark > p { color: #9eadc2; }

.product-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 18px;
}
.product-card {
  position: relative;
  min-height: 510px;
  padding: 34px;
  border: 1px solid #e1e7f0;
  border-radius: var(--radius);
  background: white;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.product-card:hover {
  transform: translateY(-4px);
  border-color: #cbd5e4;
  box-shadow: var(--shadow);
}
.product-card-featured {
  grid-column: span 2;
  display: grid;
  grid-template-columns: .75fr 1.25fr;
  grid-template-areas:
    "meta ui"
    "title ui"
    "copy ui"
    "link ui";
  column-gap: 55px;
  align-items: start;
  min-height: 460px;
  padding: 46px;
  background: linear-gradient(135deg, #f9fbff 0%, #f4f6ff 100%);
}
.product-card-featured .product-meta { grid-area: meta; }
.product-card-featured h3 { grid-area: title; }
.product-card-featured > p { grid-area: copy; }
.product-card-featured .card-link { grid-area: link; }
.product-card-featured .mini-ui { grid-area: ui; align-self: stretch; }

.product-meta {
  display: flex;
  align-items: center;
  gap: 11px;
  color: #7b899e;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
}
.product-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: #edf2ff;
  color: #4968d9;
  font-weight: 800;
  letter-spacing: 0;
  font-size: 10px;
}
.product-card h3 {
  margin: 25px 0 14px;
  font: 700 clamp(30px, 3vw, 42px)/1 Manrope, Inter, sans-serif;
  letter-spacing: -.04em;
}
.product-card > p {
  margin: 0;
  max-width: 580px;
  color: var(--muted);
  line-height: 1.72;
}
.card-link {
  position: absolute;
  left: 34px;
  bottom: 30px;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  font-size: 13px;
  font-weight: 800;
}
.product-card-featured .card-link { position: static; margin-top: 22px; }

.mini-ui {
  position: absolute;
  left: 34px;
  right: 34px;
  bottom: 75px;
  height: 190px;
  border-radius: 18px;
  border: 1px solid #dce4f0;
  background: #f7f9fc;
  overflow: hidden;
}
.product-card-featured .mini-ui {
  position: relative;
  left: auto; right: auto; bottom: auto;
  height: 100%;
  min-height: 330px;
  border-radius: 22px;
  box-shadow: 0 20px 60px rgba(47,68,110,.12);
}

.mini-ui-top {
  height: 62px;
  padding: 0 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #101d30;
  color: white;
}
.mini-ui-top strong { font-size: 13px; }
.mini-ui-top span { color: #8be2bb; font-size: 10px; text-transform: uppercase; letter-spacing: .1em; }

.metric-row {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 10px;
  padding: 20px;
}
.metric-row > div {
  padding: 15px;
  background: white;
  border: 1px solid #e3e9f2;
  border-radius: 12px;
}
.metric-row small { display: block; color: #8995a7; font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }
.metric-row strong { display: block; margin-top: 6px; font: 700 18px Manrope, sans-serif; }

.ui-lines { display: grid; gap: 8px; padding: 0 20px; }
.ui-lines i { height: 11px; border-radius: 5px; background: #e6ebf3; }
.ui-lines i:nth-child(2) { width: 76%; }
.ui-lines i:nth-child(3) { width: 54%; }

.ai-ui { padding: 22px; background: linear-gradient(145deg, #101827, #17233a); border-color: #1c2d47; }
.ai-prompt { width: 82%; padding: 15px; margin-left: auto; border-radius: 14px 14px 4px 14px; background: #3358d4; color: white; font-size: 11px; }
.ai-answer { width: 88%; margin-top: 18px; padding: 16px; border-radius: 4px 14px 14px 14px; background: #202f49; display: grid; gap: 7px; }
.ai-answer span { height: 7px; border-radius: 4px; background: #44556f; }
.ai-answer span:nth-child(2) { width: 84%; }
.ai-answer span:nth-child(3) { width: 60%; }

.pdf-ui { display: flex; align-items: center; justify-content: center; gap: 25px; }
.pdf-sheet {
  width: 92px; height: 124px; padding: 15px;
  border-radius: 8px; background: white; box-shadow: 0 12px 28px rgba(22,34,54,.12);
}
.pdf-sheet b { display: block; color: #c94a56; font-size: 12px; margin-bottom: 17px; }
.pdf-sheet i { display: block; height: 5px; margin-bottom: 7px; border-radius: 4px; background: #e4e9f1; }
.pdf-tools { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pdf-tools span { min-width: 64px; padding: 9px 10px; background: white; border: 1px solid #e2e8f0; border-radius: 8px; font-size: 9px; font-weight: 700; text-align: center; }

.pay-ui { padding: 22px; background: linear-gradient(145deg,#f7fbff,#eff3ff); }
.payment-link { padding: 17px; background: white; border: 1px solid #e1e8f2; border-radius: 13px; }
.payment-link small { display:block; color:#8a97a9; font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.payment-link strong { display:block; margin-top:7px; font-size:12px; }
.payment-status { margin-top:13px; display:flex; align-items:center; justify-content:space-between; padding:12px 15px; border-radius:11px; background:#eafaf3; color:#287859; font-size:10px; font-weight:800; }
.payment-status strong { width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:#7ad9b2; color:white; }

.site-ui { background:#edf3ff; }
.site-browser { height:28px; padding:0 12px; display:flex; align-items:center; gap:5px; background:#152238; }
.site-browser span { width:6px; height:6px; border-radius:50%; background:#53647c; }
.site-hero { display:flex; height:162px; flex-direction:column; align-items:center; justify-content:center; text-align:center; background:linear-gradient(135deg,#f4f7ff,#e9eeff); }
.site-hero b { font:700 20px Manrope,sans-serif; }
.site-hero small { margin-top:3px; color:#73839b; }
.site-hero i { width:70px; height:20px; margin-top:13px; border-radius:7px; background:#4f79ff; }

.workspace-ui { display:grid; grid-template-columns:56px 1fr; }
.workspace-nav { background:#122035; padding:18px 14px; display:grid; align-content:start; gap:12px; }
.workspace-nav span { height:8px; border-radius:4px; background:#40516a; }
.workspace-main { padding:24px; }
.workspace-main b { font-size:12px; }
.workspace-main i { display:block; height:10px; margin-top:13px; border-radius:5px; background:#e1e7f0; }
.workspace-main i:nth-of-type(2) { width:76%; }
.workspace-main i:nth-of-type(3) { width:58%; }

.market-ui { padding:22px; background:#0d1726; }
.chart-bars { height:105px; display:flex; align-items:end; gap:8px; }
.chart-bars i { flex:1; border-radius:4px 4px 1px 1px; background:linear-gradient(#6387ff,#3554ad); }
.chart-bars i:nth-child(1){height:32%}.chart-bars i:nth-child(2){height:52%}.chart-bars i:nth-child(3){height:41%}.chart-bars i:nth-child(4){height:77%}.chart-bars i:nth-child(5){height:68%}.chart-bars i:nth-child(6){height:91%}.chart-bars i:nth-child(7){height:80%}
.market-footer { margin-top:14px; display:flex; align-items:center; justify-content:space-between; color:#8fa0ba; font-size:9px; }
.market-footer strong { color:#78d6ad; }

.talent-ui { display:flex; align-items:center; justify-content:center; gap:25px; background:linear-gradient(135deg,#fff8fb,#f3f5ff); }
.avatar-stack { display:flex; }
.avatar-stack i { width:42px; height:42px; margin-left:-10px; border:3px solid white; border-radius:50%; background:linear-gradient(135deg,#778bff,#c17edc); }
.avatar-stack i:first-child { margin-left:0; }
.avatar-stack i:nth-child(2){background:linear-gradient(135deg,#65bdd5,#5f7be0)}
.avatar-stack i:nth-child(3){background:linear-gradient(135deg,#d69f72,#d2668e)}
.avatar-stack i:nth-child(4){background:linear-gradient(135deg,#92c58c,#5f9ea0)}
.talent-copy { display:grid; gap:4px; }
.talent-copy strong { font:700 14px Manrope,sans-serif; }
.talent-copy span { color:#8491a3; font-size:9px; }

.developer-section { padding: 118px 0; }
.sdk-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.sdk-card {
  min-height: 430px;
  padding: 30px;
  display:flex;
  flex-direction:column;
  border:1px solid rgba(255,255,255,.11);
  border-radius:22px;
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
}
.sdk-number { color:#50617a; font:700 12px Manrope,sans-serif; }
.sdk-type { margin:32px 0 10px; color:#8ea8ff; font-size:10px; text-transform:uppercase; letter-spacing:.13em; font-weight:800; }
.sdk-card h3 { margin:0; font:700 28px/1.1 Manrope,sans-serif; letter-spacing:-.035em; }
.sdk-card > p:not(.sdk-type) { color:#9faec3; font-size:14px; line-height:1.7; }
.sdk-tags { display:flex; flex-wrap:wrap; gap:7px; margin:10px 0 25px; }
.sdk-tags span { padding:7px 9px; border:1px solid rgba(255,255,255,.1); border-radius:8px; color:#8494ac; font-size:9px; }
.sdk-card a { margin-top:auto; font-size:12px; font-weight:800; color:white; }
.sdk-card a span { color:#8ea8ff; }

.developer-banner {
  margin-top:18px;
  padding:35px 38px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:22px;
  background:linear-gradient(100deg,rgba(79,121,255,.14),rgba(124,92,255,.08));
}
.developer-banner h3 { margin:0; font:700 25px Manrope,sans-serif; }
.developer-banner p:not(.eyebrow) { margin:8px 0 0; color:#98a8be; }

.solution-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.solution-card {
  min-height:300px;
  padding:34px;
  border:1px solid #dfe6ef;
  border-radius:22px;
  background:white;
}
.solution-kicker { display:block; margin-bottom:28px; color:#5774d8; font-size:10px; text-transform:uppercase; letter-spacing:.12em; font-weight:800; }
.solution-card h3 { margin:0; max-width:470px; font:700 29px/1.1 Manrope,sans-serif; letter-spacing:-.035em; }
.solution-card p { color:var(--muted); line-height:1.7; }
.solution-links { display:flex; flex-wrap:wrap; gap:16px; margin-top:26px; }
.solution-links a { font-size:12px; font-weight:800; text-decoration:underline; text-decoration-color:#ccd4e2; text-underline-offset:4px; }

.build-model-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:90px; align-items:start; }
.build-model-copy h2 { margin:0; font-size:clamp(42px,4vw,62px); }
.build-model-copy > p:last-child { max-width:520px; color:var(--muted); font-size:17px; line-height:1.72; }
.build-options { border-top:1px solid var(--line); }
.build-option { display:grid; grid-template-columns:54px 1fr; gap:18px; padding:28px 0; border-bottom:1px solid var(--line); }
.build-option > span { color:#93a0b1; font-size:11px; font-weight:800; }
.build-option h3 { margin:0; font:700 22px Manrope,sans-serif; }
.build-option p { margin:7px 0 0; color:var(--muted); }

.enterprise { padding:110px 0; }
.enterprise-grid { display:grid; grid-template-columns:1fr 1fr; gap:90px; align-items:center; }
.enterprise-copy h2 { margin:0; font-size:clamp(45px,4.5vw,68px); }
.enterprise-copy > p:not(.eyebrow) { max-width:580px; color:#aab8cb; font-size:17px; line-height:1.75; }
.enterprise-panel { border:1px solid rgba(255,255,255,.1); border-radius:22px; overflow:hidden; background:rgba(255,255,255,.035); }
.enterprise-row { min-height:67px; padding:0 22px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(255,255,255,.08); color:#c0cbda; font-size:13px; }
.enterprise-row:last-child { border-bottom:0; }
.enterprise-row b { color:#60718a; }

.company-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:90px; }
.company-statement h2 { margin:0; font-size:clamp(42px,4vw,62px); }
.company-copy { padding-top:30px; }
.company-copy p { color:var(--muted); font-size:16px; line-height:1.8; }
.inline-arrow { display:inline-flex; gap:8px; margin-top:13px; font-size:13px; font-weight:800; }

.final-cta { padding:120px 0; text-align:center; }
.final-cta-inner { display:flex; flex-direction:column; align-items:center; }
.final-cta h2 { margin:0; max-width:900px; font-size:clamp(48px,5.4vw,76px); }
.final-cta .hero-actions { justify-content:center; }

.site-footer { padding:55px 0 24px; background:#050b14; color:white; }
.footer-top { display:flex; justify-content:space-between; gap:30px; padding-bottom:38px; border-bottom:1px solid rgba(255,255,255,.09); }
.footer-top p { color:#738199; font-size:13px; }
.footer-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:40px; padding:45px 0; }
.footer-grid > div { display:grid; align-content:start; gap:11px; }
.footer-grid h4 { margin:0 0 7px; color:#e9edf4; font-size:11px; text-transform:uppercase; letter-spacing:.12em; }
.footer-grid a { color:#8290a6; font-size:12px; }
.footer-grid a:hover { color:white; }
.footer-bottom { padding-top:22px; border-top:1px solid rgba(255,255,255,.08); display:flex; justify-content:space-between; color:#59677c; font-size:10px; }

.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .7s ease, transform .7s ease;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 1000px) {
  .site-header { grid-template-columns:1fr auto; }
  .desktop-nav, .desktop-only { display:none; }
  .menu-button {
    width:42px; height:42px; padding:0; display:grid; place-content:center; gap:4px;
    border:1px solid rgba(255,255,255,.15); background:rgba(255,255,255,.04); border-radius:10px;
  }
  .menu-button span { width:17px; height:1px; background:white; }
  .mobile-menu {
    position:absolute; top:72px; left:0; right:0;
    padding:14px; display:none; grid-template-columns:1fr 1fr; gap:6px;
    background:#0b1626; border:1px solid rgba(255,255,255,.1); border-radius:16px;
    box-shadow:0 24px 60px rgba(0,0,0,.35);
  }
  .mobile-menu.open { display:grid; }
  .mobile-menu a { padding:13px; border-radius:9px; color:#b9c5d7; font-size:13px; }
  .mobile-menu a:hover { background:rgba(255,255,255,.05); color:white; }

  .hero { min-height:auto; padding-top:145px; }
  .hero-grid { grid-template-columns:1fr; gap:55px; }
  .hero-copy { max-width:760px; }
  .hero-visual { max-width:700px; width:100%; }
  .section-heading, .build-model-grid, .enterprise-grid, .company-grid { grid-template-columns:1fr; gap:40px; }
  .sdk-grid { grid-template-columns:1fr; }
  .sdk-card { min-height:300px; }
  .developer-banner { align-items:flex-start; flex-direction:column; }
}

@media (max-width: 760px) {
  .container { width:min(100% - 28px, 1180px); }
  .site-header { width:calc(100% - 24px); height:72px; }
  .hero { padding:125px 0 70px; }
  .hero h1 { font-size:clamp(42px,12vw,60px); }
  .hero-lead { font-size:16px; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .button { width:100%; }
  .ecosystem-board { height:390px; }
  .ecosystem-board::before { width:230px; height:230px; }
  .ecosystem-board::after { width:330px; height:330px; }
  .ecosystem-core { width:125px; height:125px; border-radius:30px; }
  .orbit-card { min-width:auto; padding:8px; }
  .orbit-card > span { width:28px; height:28px; }
  .orbit-card strong { display:none; }
  .visual-footer { gap:12px; flex-wrap:wrap; padding:13px 17px; }
  .trust-inner { padding:18px 0; justify-content:flex-start; flex-wrap:wrap; }
  .section, .developer-section { padding:78px 0; }
  .section-heading { margin-bottom:35px; }
  .section-heading h2, .build-model-copy h2, .company-statement h2 { font-size:40px; }
  .product-grid, .solution-grid { grid-template-columns:1fr; }
  .product-card, .product-card-featured { grid-column:auto; display:block; min-height:500px; padding:26px; }
  .product-card-featured .mini-ui { position:absolute; left:26px; right:26px; bottom:72px; height:190px; min-height:0; }
  .product-card-featured .card-link { position:absolute; left:26px; bottom:28px; margin:0; }
  .product-card .card-link { left:26px; }
  .mini-ui { left:26px; right:26px; }
  .product-card h3 { font-size:32px; }
  .sdk-card { padding:26px; }
  .developer-banner { padding:28px; }
  .enterprise { padding:82px 0; }
  .enterprise-copy h2 { font-size:44px; }
  .footer-top { flex-direction:column; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .footer-bottom { flex-direction:column; gap:12px; }
}

@media (max-width: 430px) {
  .brand-text strong { font-size:12px; }
  .mobile-menu { grid-template-columns:1fr; }
  .hero h1 { font-size:42px; }
  .ecosystem-board { height:350px; }
  .orbit-1 { left:7%; top:12%; }.orbit-2 { right:7%; top:12%; }.orbit-3 { right:2%; top:45%; }.orbit-4 { right:8%; bottom:10%; }.orbit-5 { left:8%; bottom:10%; }.orbit-6 { left:2%; top:45%; }
  .product-card { min-height:520px; }
  .footer-grid { grid-template-columns:1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .reveal { opacity:1; transform:none; transition:none; }
  .button, .product-card { transition:none; }
}

/* =========================================================
   Velvet Technologies — compact premium pass
   Keeps the existing visual system while shortening the page.
   ========================================================= */

.section {
  padding: 92px 0;
}

.product-grid {
  gap: 16px;
}

.product-card {
  min-height: 440px;
  padding: 30px;
}

.product-card-featured {
  min-height: 405px;
  padding: 40px;
  column-gap: 46px;
}

.product-card h3 {
  margin-top: 21px;
}

.product-card > p {
  line-height: 1.62;
}

.card-link {
  left: 30px;
  bottom: 25px;
}

.product-card-featured .card-link {
  margin-top: 15px;
}

.mini-ui {
  left: 30px;
  right: 30px;
  bottom: 66px;
  height: 152px;
}

.product-card-featured .mini-ui {
  min-height: 292px;
}

.developer-section {
  padding: 98px 0;
}

.sdk-card {
  min-height: 360px;
  padding: 28px;
}

.sdk-card .sdk-type {
  margin-top: 24px;
}

.developer-banner {
  margin-top: 16px;
  padding: 30px 34px;
}

.compact-solutions {
  padding: 96px 0 88px;
}

.compact-heading {
  margin-bottom: 38px;
}

.path-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.path-card {
  position: relative;
  min-height: 315px;
  padding: 30px;
  overflow: hidden;
  border: 1px solid #dfe6ef;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 16px 50px rgba(8,17,29,.045);
}

.path-card::after {
  content: "";
  position: absolute;
  width: 170px;
  height: 170px;
  right: -75px;
  bottom: -90px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(79,121,255,.10), transparent 68%);
  pointer-events: none;
}

.path-card-accent {
  color: #fff;
  border-color: rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 90% 10%, rgba(83,216,255,.12), transparent 34%),
    linear-gradient(145deg, #0d1a2c, #0a1321);
  box-shadow: 0 24px 60px rgba(8,17,29,.14);
}

.path-number {
  color: #9ba8ba;
  font: 800 10px Manrope, Inter, sans-serif;
  letter-spacing: .13em;
}

.path-card-accent .path-number {
  color: #63758f;
}

.path-icon {
  width: 42px;
  height: 42px;
  margin-top: 26px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: #edf2ff;
  color: #4f68d8;
  font: 800 13px Manrope, Inter, sans-serif;
}

.path-icon-sdk {
  font-size: 11px;
}

.path-icon-build {
  background: rgba(113,143,255,.13);
  color: #9cb0ff;
  border: 1px solid rgba(255,255,255,.08);
}

.path-card h3 {
  margin: 18px 0 10px;
  font: 700 24px/1.08 Manrope, Inter, sans-serif;
  letter-spacing: -.035em;
}

.path-card p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.68;
}

.path-card-accent p {
  color: #9faec3;
}

.path-links {
  position: absolute;
  left: 30px;
  bottom: 26px;
}

.path-links a {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  font-size: 12px;
  font-weight: 800;
}

.path-card-accent .path-links a {
  color: #fff;
}

.outcome-strip {
  min-height: 72px;
  margin-top: 16px;
  padding: 0 26px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: center;
  gap: 16px;
  border: 1px solid #dfe6ef;
  border-radius: 18px;
  background: rgba(255,255,255,.72);
  color: #7f8da1;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-align: center;
  text-transform: uppercase;
}

.enterprise {
  padding: 92px 0;
}

.company-grid {
  gap: 76px;
}

.company-copy {
  padding-top: 18px;
}

.final-cta {
  padding: 98px 0;
}

.site-footer {
  padding-top: 48px;
}

.footer-grid {
  padding: 38px 0;
}

@media (max-width: 1000px) {
  .path-grid {
    grid-template-columns: 1fr;
  }

  .path-card {
    min-height: 270px;
  }

  .outcome-strip {
    grid-template-columns: 1fr 1fr;
    padding: 20px;
  }
}

@media (max-width: 760px) {
  .section,
  .developer-section,
  .compact-solutions {
    padding: 72px 0;
  }

  .product-card,
  .product-card-featured {
    min-height: 470px;
    padding: 26px;
  }

  .product-card-featured .mini-ui {
    left: 26px;
    right: 26px;
    bottom: 70px;
    min-height: 0;
    height: 170px;
  }

  .mini-ui {
    left: 26px;
    right: 26px;
    bottom: 68px;
    height: 160px;
  }

  .path-card {
    min-height: 290px;
    padding: 26px;
  }

  .path-links {
    left: 26px;
  }

  .outcome-strip {
    grid-template-columns: 1fr;
    text-align: left;
    gap: 12px;
  }

  .enterprise,
  .final-cta {
    padding: 76px 0;
  }
}

/* Velvet Technologies — footer visibility pass */

.site-footer {
  color: #ffffff;
}

.footer-top p {
  color: #aebbd0;
  font-weight: 600;
}

.footer-grid h4 {
  color: #ffffff;
  font-size: 12px;
  font-weight: 800;
}

.footer-grid a {
  color: #c4cfdf;
  font-size: 13px;
  font-weight: 600;
}

.footer-grid a:hover {
  color: #ffffff;
}

.footer-bottom {
  color: #9eacc2;
  font-size: 11px;
  font-weight: 600;
  padding-bottom: 74px;
}

.back-to-top {
  position: fixed;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(12px);
  right: 24px;
  bottom: 24px;
  z-index: 999;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  background: rgba(13,26,44,.96);
  color: #ffffff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .02em;
  box-shadow: 0 14px 34px rgba(0,0,0,.28);
  backdrop-filter: blur(12px);
  transition: opacity .25s ease, visibility .25s ease, transform .25s ease, background .2s ease, box-shadow .2s ease;
}

.back-to-top::after {
  content: "\2191";
  margin-left: 8px;
  font-size: 14px;
}

.back-to-top:hover {
  background: #16243a;
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 18px 42px rgba(0,0,0,.34);
}

@media (max-width: 760px) {
  .back-to-top {
    right: 14px;
    bottom: 14px;
    min-height: 42px;
    padding: 0 14px;
  }

  .footer-bottom {
    padding-bottom: 68px;
  }
}
.back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}