/* ==========================================================================
   Smart Solution Labs — home page (Home v2)
   Ported from the Claude Design source (Home v2.dc.html + Header/Footer).
   Dark is the base theme; `html[data-theme="light"]` flips the token set, and
   `.section--dark` keeps the dark palette as islands inside the light page.
   ========================================================================== */

/* ── Tokens ─────────────────────────────────────────────────────────────── */

:root {
  --bg:#030712; --bg2:#050812; --bg3:#0B1120; --card:#0E1530; --card2:#0A0F26;
  --ink:#EAF0FF; --ink2:#B8C1DE; --mut:#8A94B8; --mut2:#9BA3C4; --dim:#5A6488;
  --panel60:rgba(14,21,48,0.6); --deep60:rgba(7,11,24,0.6); --hdr:rgba(7,11,24,0.85);
  --teal-ink:#4EE0D0; --violet-ink:#B394FF; --blue-ink:#5B8CFF; --purple-ink:#8B5CF6;

  --line:rgba(91,140,255,0.12);
  --shell:1240px;
  --grad:linear-gradient(135deg,#4EE0D0,#5B8CFF 50%,#8B5CF6);
  --mono:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

html[data-theme="light"] {
  --bg:#EDF1F9; --bg2:#E9EDF8; --bg3:#F3EFFC; --card:#FFFFFF; --card2:#FBFCFF;
  --ink:#141B3C; --ink2:#3A4570; --mut:#5F6A92; --mut2:#4D577E; --dim:#98A1BF;
  --panel60:rgba(255,255,255,0.8); --deep60:rgba(244,247,255,0.85);
  /* The design omits --hdr in light mode, which leaves a near-black sticky
     header behind dark text. Light value carried over from the v1 palette. */
  --hdr:rgba(250,251,255,0.9);
  --teal-ink:#0B7E74; --violet-ink:#7442CC; --blue-ink:#2F5BD4; --purple-ink:#6C3BD6;
}

/* Dark islands: sections that stay dark even in the light theme. */
html[data-theme="light"] .section--dark,
html[data-theme="light"] .site-footer {
  background-color:#090D20;
  color:#EAF0FF;
  --bg:#030712; --bg2:#050812; --bg3:#0B1120; --card:#0E1530; --card2:#0A0F26;
  --ink:#EAF0FF; --ink2:#B8C1DE; --mut:#8A94B8; --mut2:#9BA3C4; --dim:#5A6488;
  --panel60:rgba(14,21,48,0.6); --deep60:rgba(7,11,24,0.6);
  --teal-ink:#4EE0D0; --violet-ink:#B394FF; --blue-ink:#5B8CFF; --purple-ink:#8B5CF6;
}

/* ── Base ───────────────────────────────────────────────────────────────── */

*, *::before, *::after { box-sizing:border-box; }

html { scroll-behavior:smooth; }

body {
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:'Readex Pro', system-ui, -apple-system, 'Segoe UI', sans-serif;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

body, section, footer, header { transition:background-color .35s ease; }

a { color:var(--teal-ink); }
a:hover { color:var(--purple-ink); }
::selection { background:#8B5CF6; color:#fff; }

img { max-width:100%; }
h1, h2, h3, h4 { margin:0; text-wrap:pretty; }
p { margin:0; }

.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;
}

.skip-link {
  position:fixed; inset-inline-start:12px; top:-60px; z-index:200;
  background:var(--card2); color:var(--ink); border:1px solid var(--teal-ink);
  border-radius:10px; padding:10px 18px; font-size:14px; text-decoration:none;
  transition:top .2s ease;
}
.skip-link:focus { top:12px; }

:where(a, button, input):focus-visible { outline:2px solid var(--teal-ink); outline-offset:3px; }

.center { display:flex; justify-content:center; }

/* ── Keyframes ──────────────────────────────────────────────────────────── */

@keyframes fadeUp { from { opacity:0; transform:translateY(28px); } to { opacity:1; transform:none; } }
@keyframes floatGlow { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-12px); } }
@keyframes gradShift { 0%,100% { background-position:0% 50%; } 50% { background-position:100% 50%; } }
@keyframes pulseDot { 0%,100% { box-shadow:0 0 6px #4EE0D0; } 50% { box-shadow:0 0 18px #4EE0D0, 0 0 30px rgba(78,224,208,0.5); } }
@keyframes ringPulse { 0% { transform:scale(0.55); opacity:0.8; } 100% { transform:scale(1.6); opacity:0; } }
@keyframes orbitSpin { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
@keyframes waveBar { 0%,100% { transform:scaleY(0.25); } 50% { transform:scaleY(1); } }
@keyframes auroraA { 0%,100% { transform:translate(0,0) scale(1); } 50% { transform:translate(70px,-40px) scale(1.15); } }
@keyframes auroraB { 0%,100% { transform:translate(0,0) scale(1); } 50% { transform:translate(-90px,40px) scale(1.2); } }
@keyframes markSheen { 0% { background-position:180% 0; } 55%, 100% { background-position:-80% 0; } }
@keyframes scanPass { 0% { background-position:0 -30%; opacity:0; } 15% { opacity:1; } 85% { opacity:1; } 100% { background-position:0 130%; opacity:0; } }
@keyframes lineFlow { to { background-position:24px 0; } }
@keyframes nodeFloat { 0%,100% { transform:var(--tf) translateY(0); } 50% { transform:var(--tf) translateY(-9px); } }

/* ── Header ─────────────────────────────────────────────────────────────── */

.site-header {
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:14px 20px;
  padding:16px 28px;
  background:var(--hdr);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
}

.brand { display:flex; align-items:center; gap:12px; text-decoration:none; }
.brand__mark { height:44px; width:auto; border-radius:8px; }
.brand__text { display:flex; flex-direction:column; line-height:1.1; }
.brand__name { font-size:16px; font-weight:700; letter-spacing:2px; color:var(--ink); }
.brand__sub { font-size:10px; letter-spacing:3px; color:var(--mut); }
.brand__accent { color:var(--purple-ink); }

.site-nav { display:flex; align-items:center; flex-wrap:wrap; gap:8px 16px; }
.site-nav__link { text-decoration:none; font-size:14px; color:var(--ink2); }
.site-nav__link:hover { color:var(--teal-ink); }
.site-nav__link.is-active { color:var(--teal-ink); font-weight:600; }

.site-header__actions { display:flex; align-items:center; gap:14px; }

.pill-btn {
  background:none;
  border:1px solid rgba(138,148,184,0.4);
  color:var(--mut);
  border-radius:999px;
  padding:7px 16px;
  font-size:13px; font-family:inherit;
  cursor:pointer;
  transition:color .2s, border-color .2s;
}
.pill-btn:hover { color:var(--ink); border-color:var(--teal-ink); }
.pill-btn--icon { padding:7px 12px; font-size:14px; line-height:1; }

/* ── Buttons & links ────────────────────────────────────────────────────── */

.btn {
  display:inline-block; text-decoration:none;
  border-radius:14px; padding:15px 32px; font-size:16px;
  transition:filter .2s, border-color .2s, color .2s, box-shadow .3s;
}
.btn--grad { background:var(--grad); color:#070B18; font-weight:700; }
.btn--grad:hover { filter:brightness(1.15); color:#070B18; }
.btn--glow { box-shadow:0 0 40px rgba(139,92,246,0.35); }
.btn--glow:hover { box-shadow:0 0 60px rgba(139,92,246,0.55); }
.btn--ghost { border:1px solid rgba(138,148,184,0.4); color:var(--ink); }
.btn--ghost:hover { border-color:var(--teal-ink); color:var(--teal-ink); }
.btn--lg { padding:16px 36px; }
.btn--pill { font-size:14px; border-radius:999px; padding:10px 22px; }

.text-link { text-decoration:none; color:var(--teal-ink); font-size:14.5px; font-weight:600; white-space:nowrap; }
.text-link--strong { font-size:15px; font-weight:700; }
.text-link--strong:hover { color:var(--violet-ink); }

/* ── Section furniture ──────────────────────────────────────────────────── */

.section { position:relative; padding:110px 48px; }
.section--bordered { border-top:1px solid rgba(91,140,255,0.08); }

.shell { max-width:var(--shell); margin:0 auto; display:flex; flex-direction:column; gap:48px; }
.shell--narrow { max-width:1140px; gap:56px; }
.shell--gap40 { gap:40px; }

.section__head { display:flex; flex-direction:column; gap:14px; max-width:680px; }
.section__head--center { align-items:center; text-align:center; max-width:none; }
.section__head--split {
  flex-direction:row; justify-content:space-between; align-items:flex-end;
  gap:24px; flex-wrap:wrap; max-width:none;
}
.section__lead { display:flex; flex-direction:column; gap:14px; }

.section__sub { color:var(--mut); font-size:15.5px; line-height:1.9; max-width:660px; }
.section__head--center .section__sub { max-width:640px; }
.section__sub--lg { color:var(--ink2); font-size:17px; max-width:600px; }
.section__sub--xl { color:var(--ink2); font-size:19px; line-height:1.9; max-width:600px; }

.h2 { font-size:38px; font-weight:800; }
.h2--lg { font-size:42px; line-height:1.35; }
.h2--xl { font-size:52px; line-height:1.3; }
.h2--cta { font-size:46px; line-height:1.4; }

/* Numbered section eyebrows: "01 — WHAT WE BUILD" */
.eyebrow {
  display:flex; align-items:center; gap:10px;
  color:var(--teal-ink); font-family:var(--mono);
  font-size:11.5px; letter-spacing:3px; font-weight:700;
}
.section__head--center .eyebrow { justify-content:center; }
.eyebrow--violet { color:var(--violet-ink); }
.eyebrow__rule { width:26px; height:1px; background:linear-gradient(90deg,transparent,#4EE0D0); }
.eyebrow__rule--violet { background:linear-gradient(90deg,transparent,#B394FF); }

.grad-text {
  background:linear-gradient(90deg,#4EE0D0,#5B8CFF,#8B5CF6,#4EE0D0);
  background-size:250% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:gradShift 6s ease-in-out infinite;
}

.icon { display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.icon--md {
  width:50px; height:50px; border-radius:14px; font-size:23px;
  background:linear-gradient(135deg,rgba(91,140,255,0.16),rgba(78,224,208,0.14));
  border:1px solid rgba(91,140,255,0.35);
}

.grid { display:grid; gap:20px; }

/* Scroll reveal. `.reveal-armed` is added by JS, so without scripting the
   sections stay visible instead of being stuck at opacity 0. */
.reveal-armed { opacity:0; transform:translateY(30px); transition:opacity .8s ease, transform .8s ease; }
.reveal-armed.is-visible { opacity:1; transform:none; }

/* ── Hero ───────────────────────────────────────────────────────────────── */

.hero {
  position:relative; overflow:hidden;
  padding:72px 48px 0;
  background-image:
    repeating-linear-gradient(0deg, rgba(91,140,255,0.045) 0 1px, transparent 1px 72px),
    repeating-linear-gradient(90deg, rgba(91,140,255,0.045) 0 1px, transparent 1px 72px);
}
.hero__blob { position:absolute; border-radius:50%; filter:blur(80px); pointer-events:none; }
.hero__blob--violet {
  top:-140px; inset-inline-end:8%; width:640px; height:520px;
  background:radial-gradient(circle at 40% 40%, rgba(139,92,246,0.4), transparent 62%);
  animation:auroraB 17s ease-in-out infinite;
}
.hero__blob--teal {
  bottom:-120px; inset-inline-start:4%; width:560px; height:460px;
  background:radial-gradient(circle at 45% 45%, rgba(78,224,208,0.28), transparent 60%);
  animation:auroraA 14s ease-in-out infinite;
}
.hero__vignette {
  position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse 70% 55% at 50% 0%, transparent 30%, var(--bg) 100%);
}
html[data-theme="light"] .hero__vignette {
  background:radial-gradient(ellipse 70% 55% at 50% 0%, transparent 30%, #090D20 100%);
}

.hero__inner { position:relative; max-width:1280px; margin:0 auto; display:flex; flex-direction:column; gap:56px; }
.hero__cols { display:flex; align-items:center; gap:40px; flex-wrap:wrap; padding-top:24px; }
.hero__copy {
  flex:1.05; min-width:400px;
  display:flex; flex-direction:column; gap:26px;
  align-items:flex-start; text-align:start;
}

.badge {
  display:flex; align-items:center; gap:10px;
  border:1px solid rgba(78,224,208,0.3);
  background:rgba(78,224,208,0.06);
  color:var(--ink2);
  border-radius:999px; padding:9px 22px;
  font-size:13px; letter-spacing:1px;
  animation:fadeUp .7s ease both;
}
.badge__dot { width:8px; height:8px; border-radius:50%; background:#4EE0D0; animation:pulseDot 2s ease-in-out infinite; }
.badge__strong { color:var(--teal-ink); font-weight:600; letter-spacing:2px; }
.badge__sep { color:var(--dim); }

.hero__title {
  font-size:clamp(38px,4vw,58px); font-weight:800; line-height:1.24;
  letter-spacing:-0.5px; max-width:620px;
  animation:fadeUp .7s ease .12s both;
}
.hero__sub {
  color:var(--ink2); font-size:17.5px; line-height:1.85; max-width:600px;
  animation:fadeUp .7s ease .26s both;
}
.hero__ctas { display:flex; gap:16px; flex-wrap:wrap; animation:fadeUp .7s ease .4s both; }

/* ── Hero orbit ─────────────────────────────────────────────────────────── */

.orbit {
  flex:1; min-width:380px; position:relative; height:540px;
  display:flex; align-items:center; justify-content:center;
  animation:fadeUp .8s ease .4s both;
}
.orbit__ring {
  position:absolute; width:min(56%,250px); aspect-ratio:1; border-radius:50%;
  border:1.5px solid; animation:ringPulse 3.4s ease-out infinite;
}
.orbit__ring--teal { border-color:rgba(78,224,208,0.4); }
.orbit__ring--violet { border-color:rgba(139,92,246,0.4); animation-delay:1.7s; }

.orbit__path { position:absolute; aspect-ratio:1; border-radius:50%; }
.orbit__path--dashed {
  width:calc(var(--orb,180px) * 2);
  border:1px dashed rgba(91,140,255,0.22);
  animation:orbitSpin 40s linear infinite;
}
.orbit__path--solid {
  width:calc(var(--orb,180px) * 1.45);
  border:1px solid rgba(91,140,255,0.12);
  animation:orbitSpin 28s linear infinite reverse;
}

.orbit__core { position:absolute; width:250px; height:190px; animation:floatGlow 7s ease-in-out infinite; }
.orbit__core img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 0 44px rgba(139,92,246,0.55)); }
.orbit__sheen, .orbit__scan {
  position:absolute; inset:0;
  mask-image:url(../logo-mark-cut.png); -webkit-mask-image:url(../logo-mark-cut.png);
  mask-size:contain; -webkit-mask-size:contain;
  mask-repeat:no-repeat; -webkit-mask-repeat:no-repeat;
  mask-position:center; -webkit-mask-position:center;
}
.orbit__sheen {
  background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,0.35) 50%,transparent 65%);
  background-size:260% 100%; mix-blend-mode:overlay;
  animation:markSheen 5.5s ease-in-out infinite;
}
.orbit__scan {
  background:linear-gradient(180deg,transparent 0%,rgba(78,224,208,0.55) 48%,rgba(139,92,246,0.5) 52%,transparent 100%);
  background-size:100% 26%; background-repeat:no-repeat; mix-blend-mode:screen;
  animation:scanPass 4.6s ease-in-out infinite;
}

/* Nodes sit on a circle of radius --orb; --a is each node's angle. */
.orbit-node {
  --tf:translate(-50%,-50%) rotate(var(--a)) translateX(var(--orb,180px)) rotate(calc(-1 * var(--a)));
  position:absolute; top:50%; left:50%;
  transform:var(--tf);
  border:1px solid var(--cb);
  background:var(--card2);
  color:var(--c);
  border-radius:10px; padding:7px 14px;
  font-family:var(--mono); font-size:11px; letter-spacing:2px; font-weight:700;
  white-space:nowrap;
  box-shadow:0 0 20px var(--cs);
  animation-name:nodeFloat;
  animation-timing-function:ease-in-out;
  animation-iteration-count:infinite;
}

/* ── Hero proof strip ───────────────────────────────────────────────────── */

.proof {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  border-top:1px solid rgba(91,140,255,0.14);
  padding:28px 0 34px;
}
.proof__item {
  display:flex; flex-direction:column; gap:5px;
  align-items:center; text-align:center;
  padding:0 18px;
  border-inline-start:1px solid rgba(91,140,255,0.1);
}
.proof__n {
  font-size:32px; font-weight:800;
  background:linear-gradient(90deg,#4EE0D0,#8B5CF6);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.proof__l { color:var(--mut); font-size:12.5px; }

/* ── 01 · Capability rows ───────────────────────────────────────────────── */

.caps { display:flex; flex-direction:column; }
.cap {
  position:relative;
  display:flex; align-items:baseline; gap:36px; flex-wrap:wrap;
  padding:34px 8px;
  border-top:1px solid var(--line);
  transition:background .3s;
}
.cap:hover { background:linear-gradient(90deg,rgba(78,224,208,0.04),transparent 60%); }
.caps__end { border-top:1px solid var(--line); }
.cap__n { font-family:var(--mono); font-size:15px; font-weight:800; color:var(--dim); letter-spacing:2px; width:44px; }
.cap__title { font-size:28px; font-weight:800; min-width:280px; flex:0.8; }
.cap__desc { color:var(--mut2); font-size:15px; line-height:1.9; flex:1.4; min-width:320px; }
.cap__line {
  position:absolute; bottom:-1px; inset-inline-start:0;
  width:0; height:1px;
  background:linear-gradient(90deg,#4EE0D0,#8B5CF6);
  transition:width .5s ease;
}
.cap:hover .cap__line { width:100%; }

/* ── 02 · Najeeb ────────────────────────────────────────────────────────── */

.section--najeeb {
  overflow:hidden;
  background:linear-gradient(180deg,var(--bg3),var(--bg));
  border-top:1px solid rgba(139,92,246,0.2);
}
.najeeb__glow {
  position:absolute; top:0; inset-inline-start:28%;
  width:640px; height:420px; pointer-events:none;
  background:radial-gradient(ellipse,rgba(139,92,246,0.18),transparent 70%);
}
.section--najeeb .shell, .section--platform .shell { position:relative; gap:52px; }

.najeeb__stage { display:flex; flex-direction:column; align-items:center; gap:24px; }
.phases { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; }
.phase {
  font-family:var(--mono); font-size:12px; letter-spacing:2.5px; font-weight:800;
  border-radius:999px; padding:8px 20px;
  color:var(--dim); border:1px solid rgba(138,148,184,0.25);
  transition:all .5s;
}
.phase.is-active {
  color:#070B18;
  background:linear-gradient(135deg,#4EE0D0,#5B8CFF);
  border-color:transparent;
  box-shadow:0 0 24px rgba(78,224,208,0.35);
}
.najeeb__wave {
  display:flex; align-items:center; justify-content:center; gap:5px;
  height:76px; width:100%; max-width:640px;
}
.najeeb__bar {
  display:inline-block; width:6px; border-radius:3px;
  transform-origin:center;
  transition:height .6s ease;
}
.najeeb__caption { color:var(--teal-ink); font-size:15px; font-weight:700; min-height:24px; text-align:center; }

.grid--njcaps { grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:16px; }
.njcap {
  background:var(--card2);
  border:1px solid rgba(139,92,246,0.22);
  border-radius:16px; padding:24px;
  display:flex; flex-direction:column; gap:9px;
  transition:border-color .25s, transform .25s;
}
.njcap:hover { border-color:var(--violet-ink); transform:translateY(-4px); }
.njcap__icon { font-size:24px; }
.njcap__title { font-size:16.5px; font-weight:700; }
.njcap__desc { color:var(--mut); font-size:13px; line-height:1.8; }

/* ── 03 · Platform flow ─────────────────────────────────────────────────── */

.section--platform { background:var(--bg2); border-top:1px solid rgba(91,140,255,0.1); }

.flow { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; row-gap:36px; }
.flow__node { display:flex; flex-direction:column; align-items:center; gap:12px; padding:0 8px; }
.flow__leg { display:flex; align-items:center; }
.flow__core { position:relative; width:150px; height:118px; display:flex; align-items:center; justify-content:center; }
.flow__core img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 0 30px rgba(139,92,246,0.5)); }
.flow__label { font-family:var(--mono); font-size:12px; letter-spacing:2px; font-weight:800; color:var(--ink); }
.flow__biz {
  width:150px; height:118px; border-radius:20px;
  border:1.5px solid rgba(91,140,255,0.45);
  background:radial-gradient(circle at 50% 30%, rgba(91,140,255,0.16), rgba(14,21,48,0.6));
  display:flex; align-items:center; justify-content:center;
  font-size:38px;
  box-shadow:0 0 40px rgba(91,140,255,0.18);
}
.flow__wire { width:56px; height:2px; animation:lineFlow .9s linear infinite; }
.flow__wire--teal { background:repeating-linear-gradient(90deg,#4EE0D0 0 8px,transparent 8px 16px); }
.flow__wire--blue { background:repeating-linear-gradient(90deg,#5B8CFF 0 8px,transparent 8px 16px); }
.flow__wire--violet { background:repeating-linear-gradient(90deg,#8B5CF6 0 8px,transparent 8px 16px); }
.flow__stack { display:flex; flex-direction:column; gap:10px; padding:0 8px; }
.flow__chip {
  border-radius:10px; text-align:center;
  font-family:var(--mono); letter-spacing:2px; font-weight:700;
}
.flow__chip--teal {
  border:1px solid rgba(78,224,208,0.35); background:rgba(78,224,208,0.06);
  color:var(--teal-ink); padding:9px 22px; font-size:12px;
}
.flow__chip--violet {
  border:1px solid rgba(139,92,246,0.35); background:rgba(139,92,246,0.08);
  color:var(--violet-ink); padding:8px 20px; font-size:11.5px;
}

.metarow { display:flex; justify-content:center; gap:10px; flex-wrap:wrap; }
.metachip {
  color:var(--dim); font-family:var(--mono);
  font-size:11.5px; letter-spacing:1.5px;
  border:1px solid rgba(138,148,184,0.2);
  border-radius:999px; padding:5px 14px;
}

/* ── 04 · Industries ────────────────────────────────────────────────────── */

.grid--industries { grid-template-columns:repeat(auto-fit,minmax(420px,1fr)); }
.industry {
  position:relative; overflow:hidden;
  background:var(--card);
  border:1px solid rgba(91,140,255,0.16);
  border-radius:20px; padding:32px;
  display:flex; flex-direction:column; gap:14px;
  transition:border-color .25s, transform .25s;
}
.industry:hover { border-color:rgba(78,224,208,0.5); transform:translateY(-4px); }
.industry__head { display:flex; align-items:center; gap:14px; }
.industry__title { font-size:21px; font-weight:800; }
.industry__desc { color:var(--mut2); font-size:14px; line-height:1.9; }
.industry__foot {
  display:flex; align-items:center; justify-content:space-between;
  gap:14px; flex-wrap:wrap;
  margin-top:auto; padding-top:14px;
  border-top:1px solid var(--line);
}
.industry__result { color:var(--teal-ink); font-size:13px; font-weight:700; }
.industry__cta { text-decoration:none; color:var(--mut); font-size:12.5px; font-weight:600; }
.industry__cta:hover { color:var(--teal-ink); }

/* ── 05 · Case studies ──────────────────────────────────────────────────── */

.section--cases { background:var(--bg3); border-top:1px solid rgba(139,92,246,0.14); }
.cases { display:flex; flex-direction:column; gap:28px; }
.case {
  display:flex; flex-wrap:wrap;
  background:var(--card2);
  border:1px solid rgba(91,140,255,0.16);
  border-radius:24px; overflow:hidden;
  transition:border-color .25s;
}
.case:hover { border-color:rgba(78,224,208,0.45); }
.case__media {
  flex:1; min-width:320px; min-height:240px;
  display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(circle at 50% 45%, rgba(91,140,255,0.14), transparent 70%),
    repeating-linear-gradient(0deg, rgba(91,140,255,0.05) 0 1px, transparent 1px 40px),
    repeating-linear-gradient(90deg, rgba(91,140,255,0.05) 0 1px, transparent 1px 40px);
}
.case__logo { width:200px; height:90px; object-fit:contain; filter:brightness(1.1); }
/* Shown by JS when the hotlinked logo fails to load. */
.case__mark {
  font-family:var(--mono); font-size:22px; font-weight:800;
  letter-spacing:3px; text-transform:uppercase;
  background:linear-gradient(90deg,#4EE0D0,#8B5CF6);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.case__body {
  flex:1.3; min-width:340px;
  display:flex; flex-direction:column; gap:12px; align-items:flex-start;
  padding:44px 40px;
}
.case__outcome { color:var(--teal-ink); font-size:12.5px; font-weight:700; letter-spacing:1px; }
.case__title { font-size:26px; font-weight:800; }
.case__desc { color:var(--mut2); font-size:14.5px; line-height:1.9; }
.case__link { margin-top:auto; padding-top:8px; font-size:14px; }

/* ── 06 · Enterprise ────────────────────────────────────────────────────── */

.proofbar {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:1px;
  background:rgba(91,140,255,0.16);
  border:1px solid rgba(91,140,255,0.16);
  border-radius:18px; overflow:hidden;
}
.proofbar__cell {
  background:var(--card2);
  padding:26px 22px;
  display:flex; flex-direction:column; gap:6px;
  transition:background .25s;
}
.proofbar__cell:hover { background:var(--card); }
.proofbar__n { font-family:var(--mono); font-size:12px; font-weight:800; letter-spacing:1.5px; color:var(--teal-ink); }
.proofbar__k { color:var(--ink); font-size:15px; font-weight:700; }
.proofbar__v { color:var(--mut); font-size:12.5px; line-height:1.7; }

.partner {
  display:flex; align-items:center; gap:22px; flex-wrap:wrap;
  background:var(--panel60);
  border:1px solid rgba(91,140,255,0.14);
  border-radius:18px; padding:26px 30px;
}
.partner__logo { height:28px; width:auto; }
.partner__body { color:var(--mut2); font-size:13.5px; line-height:1.9; flex:1; min-width:320px; }
.badges { display:flex; gap:8px; flex-wrap:wrap; }
.badge-chip {
  border:1px solid rgba(138,148,184,0.3);
  color:var(--mut2);
  border-radius:8px; padding:5px 12px;
  font-size:11.5px; letter-spacing:1px; font-weight:600;
}

/* ── 07 · How we work ───────────────────────────────────────────────────── */

.steps { position:relative; padding:10px 12px 0; }
.steps__rail {
  position:absolute; top:36px; inset-inline-start:12%; inset-inline-end:12%; height:1px;
  background:linear-gradient(90deg,transparent,rgba(78,224,208,0.5),rgba(91,140,255,0.5),rgba(139,92,246,0.5),transparent);
}
.steps__grid {
  position:relative; list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:32px 20px;
}
.step { display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center; padding:0 12px; }
.step__n {
  width:52px; height:52px; flex-shrink:0; border-radius:50%;
  background:var(--bg3);
  border:1px solid rgba(78,224,208,0.4);
  box-shadow:0 0 0 6px var(--bg), 0 0 26px rgba(78,224,208,0.18);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--mono); font-size:15px; font-weight:800; color:var(--teal-ink);
}
.step__title { font-size:17px; font-weight:700; color:var(--ink); }
.step__desc { color:var(--mut); font-size:13px; line-height:1.8; max-width:250px; }

/* ── 08 · Insights ──────────────────────────────────────────────────────── */

.section--insights { padding-block:100px; }
.grid--posts { grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); }
.post {
  text-decoration:none; color:var(--ink);
  background:var(--card);
  border:1px solid rgba(91,140,255,0.14);
  border-radius:18px; padding:28px;
  display:flex; flex-direction:column; gap:12px; align-items:flex-start;
  transition:border-color .25s, transform .25s;
}
.post:hover { border-color:rgba(78,224,208,0.5); transform:translateY(-4px); color:var(--ink); }
.post__tag {
  color:var(--violet-ink); font-family:var(--mono);
  font-size:11px; letter-spacing:2px; font-weight:700;
  border:1px solid rgba(139,92,246,0.3);
  border-radius:6px; padding:4px 10px;
}
.post__title { font-size:18.5px; font-weight:700; line-height:1.55; }
.post__excerpt { color:var(--mut); font-size:13.5px; line-height:1.85; }

/* ── Final CTA ──────────────────────────────────────────────────────────── */

.section--cta {
  overflow:hidden;
  padding:130px 48px;
  background-color:var(--bg2);
  border-top:1px solid rgba(139,92,246,0.18);
  background-image:
    repeating-linear-gradient(0deg, rgba(91,140,255,0.05) 0 1px, transparent 1px 56px),
    repeating-linear-gradient(90deg, rgba(91,140,255,0.05) 0 1px, transparent 1px 56px);
}
.cta__blob {
  position:absolute; top:-160px; inset-inline-start:30%;
  width:640px; height:480px; border-radius:50%; pointer-events:none;
  background:radial-gradient(circle,rgba(139,92,246,0.3),transparent 65%);
  filter:blur(80px);
  animation:auroraB 18s ease-in-out infinite;
}
.cta {
  position:relative; max-width:820px; margin:0 auto;
  display:flex; flex-direction:column; align-items:center; gap:24px; text-align:center;
}
.cta__btns { display:flex; gap:16px; flex-wrap:wrap; justify-content:center; }

/* ── Footer ─────────────────────────────────────────────────────────────── */

.site-footer { background:var(--bg2); border-top:1px solid var(--line); padding:56px 48px 32px; }
.site-footer__top { display:flex; flex-wrap:wrap; gap:48px; justify-content:space-between; max-width:var(--shell); margin:0 auto; }
.site-footer__brand { display:flex; flex-direction:column; gap:16px; max-width:320px; }
.site-footer__brand img { height:56px; width:74px; object-fit:cover; border-radius:10px; }
.site-footer__blurb { color:var(--mut); font-size:14px; line-height:1.8; }

.site-footer__nav { display:grid; grid-template-columns:1fr 1fr; gap:12px 40px; align-content:start; }
.site-footer__nav a { color:var(--ink2); text-decoration:none; font-size:14px; }
.site-footer__nav a:hover { color:var(--teal-ink); }

.site-footer__signup { display:flex; flex-direction:column; gap:14px; min-width:280px; }
.site-footer__hi { color:var(--ink); font-weight:700; font-size:16px; }
.site-footer__hi-sub { color:var(--mut); font-size:13px; }
.site-footer__field { display:flex; gap:8px; }
.site-footer__field input {
  flex:1; min-width:0;
  background:var(--card);
  border:1px solid rgba(138,148,184,0.25);
  border-radius:10px; padding:11px 14px;
  color:var(--ink); font-size:13px; font-family:inherit; outline:none;
}
.site-footer__field button {
  background:linear-gradient(135deg,#4EE0D0,#8B5CF6);
  border:none; color:#070B18; font-weight:700;
  border-radius:10px; padding:11px 18px;
  font-size:13px; font-family:inherit; cursor:pointer;
}
.site-footer__field button:hover { filter:brightness(1.1); }
.site-footer__copy {
  max-width:var(--shell); margin:40px auto 0;
  padding-top:20px;
  border-top:1px solid rgba(138,148,184,0.12);
  color:var(--dim); font-size:12px; text-align:center;
}

/* ── Responsive ─────────────────────────────────────────────────────────── */

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

@media (max-width:900px) {
  .section { padding:80px 28px; }
  .hero { padding:48px 28px 0; }
  .section--cta { padding:96px 28px; }
  .site-header { padding:12px 20px; gap:10px 16px; }
  /* One scrollable row instead of three wrapped ones — the header is sticky,
     so wrapped nav links would eat a third of a phone viewport. */
  .site-nav {
    order:3; width:100%; flex-wrap:nowrap; gap:18px;
    overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch;
  }
  .site-nav::-webkit-scrollbar { display:none; }
  .site-nav__link { white-space:nowrap; }

  .hero__copy, .orbit, .case__media, .case__body { min-width:100%; }
  .orbit { height:420px; }
  .h2, .h2--lg, .h2--xl, .h2--cta { font-size:30px; }
  .cap { gap:12px 24px; padding:26px 4px; }
  .cap__title { font-size:22px; min-width:0; flex:1 1 100%; }
  .cap__desc { min-width:0; flex:1 1 100%; }
  .case__body { padding:28px 24px; }
  .steps__rail { display:none; }
  .site-footer { padding:44px 24px 28px; }
}

@media (max-width:640px) {
  .section { padding:64px 18px; }
  .hero { padding:40px 18px 0; }
  .section--cta { padding:80px 18px; }
  .orbit { height:380px; }
  .orbit__core { width:180px; height:140px; }
  .orbit-node { font-size:9.5px; letter-spacing:1px; padding:6px 10px; }
  .btn { padding:13px 24px; font-size:15px; }
  .site-footer__nav { grid-template-columns:1fr; }
  .flow__wire { display:none; }
}

/* ── Reduced motion ─────────────────────────────────────────────────────── */

@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after {
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
  .reveal-armed { opacity:1; transform:none; }
}