:root {
  --ink: #07111f;
  --ink-2: #0d1b2b;
  --surface: #f5f2e9;
  --paper: #fffdf8;
  --text: #15253a;
  --muted: #526274;
  --muted-strong: #46586c;
  --dark-copy: #b7c3cf;
  --line: #d7d9d5;
  --line-dark: #263950;
  --accent: #1ebaa9;
  --accent-bright: #33d6c5;
  --blue: #5b8cff;
  --radius: 1.25rem;
  --shadow: 0 24px 70px rgba(7, 17, 31, .12);
  --container: min(1180px, calc(100vw - 40px));
}

* { box-sizing: border-box; }
html { overflow-x: clip; scroll-behavior: smooth; }
body { overflow-x: clip; margin: 0; background: var(--surface); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 17px; line-height: 1.65; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration-thickness: .08em; text-underline-offset: .2em; }
button, input, select, textarea { font: inherit; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
.skip-link { position: fixed; z-index: 100; top: 1rem; left: 1rem; transform: translateY(-180%); background: white; padding: .7rem 1rem; border-radius: .5rem; }
.skip-link:focus { transform: none; }
.shell { width: var(--container); margin-inline: auto; }
.section { padding: clamp(5rem, 9vw, 9rem) 0; }
.section, .page-hero, .hero, .footer { position: relative; z-index: 1; }
.ambient-depth { position: fixed; z-index: 0; inset: 0; overflow: hidden; pointer-events: none; opacity: .55; }
.ambient-orb { position: absolute; width: clamp(260px, 36vw, 620px); aspect-ratio: 1; border-radius: 50%; filter: blur(2px); transform: translate3d(var(--pointer-x, 0), calc(var(--parallax-y, 0px) + var(--pointer-y, 0px)), 0); will-change: transform; }
.ambient-orb-a { top: 18%; right: -22%; border: 1px solid rgba(30,186,169,.18); box-shadow: 0 0 90px rgba(30,186,169,.05), inset 0 0 80px rgba(30,186,169,.03); }
.ambient-orb-b { top: 58%; left: -25%; border: 1px solid rgba(91,140,255,.13); box-shadow: 0 0 100px rgba(91,140,255,.04); }
.ambient-orb-c { top: 84%; right: 8%; width: clamp(160px, 20vw, 340px); background: radial-gradient(circle, rgba(51,214,197,.06), transparent 68%); }
.section-sm { padding: 4rem 0; }
.dark { background: var(--ink); color: var(--surface); }
.eyebrow { display: inline-flex; align-items: center; gap: .65rem; color: var(--accent); font: 700 .75rem/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .16em; text-transform: uppercase; }
.eyebrow::before { content: ""; width: 1.6rem; height: 1px; background: currentColor; }
h1, h2, h3 { margin: 0; color: inherit; font-weight: 650; letter-spacing: -.045em; line-height: 1.02; text-wrap: balance; }
h1 { max-width: 980px; font-size: clamp(3rem, 7.4vw, 6.9rem); }
h2 { font-size: clamp(2.3rem, 5vw, 4.6rem); }
h3 { font-size: clamp(1.35rem, 2.2vw, 1.8rem); letter-spacing: -.025em; }
p { margin: 0; }
.lede { max-width: 710px; color: #c0cad5; font-size: clamp(1.15rem, 2vw, 1.45rem); }
.lede-dark { color: var(--muted); }
.accent-text { color: var(--accent-bright); }
.muted { color: var(--muted); }
.header { position: sticky; z-index: 30; top: 0; border-bottom: 1px solid rgba(255,255,255,.09); background: rgba(7,17,31,.92); color: white; backdrop-filter: blur(16px); }
.header-inner { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.brand { display: inline-flex; align-items: center; gap: .55rem; color: white; text-decoration: none; }
.brand-symbol { width: 45px; height: 39px; object-fit: contain; }
.brand-wordmark { color: #f5f2e9; font-size: .88rem; font-weight: 800; letter-spacing: .035em; line-height: 1; white-space: nowrap; }
.brand-wordmark small { color: inherit; font: inherit; }
.footer-brand .brand-symbol { width: 54px; height: 46px; }
.footer-brand .brand-wordmark { font-size: 1rem; }
.nav { display: flex; align-items: center; gap: 1.7rem; font-size: .91rem; }
.nav a { color: #c8d0da; text-decoration: none; }
.nav a:hover, .nav a[aria-current="page"] { color: white; }
.nav .button-primary { color: var(--ink); }
.button { display: inline-flex; max-width: 100%; min-height: 50px; align-items: center; justify-content: center; gap: .65rem; border: 1px solid transparent; border-radius: 999px; padding: .72rem 1.2rem; font-weight: 740; text-align: center; text-decoration: none; cursor: pointer; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--accent-bright); color: var(--ink); }
.button-primary:hover { background: #69e8db; }
.button-secondary { border-color: #496078; color: white; background: rgba(255,255,255,.03); }
.button-ink { background: var(--ink); color: white; }
.menu { display: none; width: 46px; height: 46px; border: 1px solid #3c4e62; border-radius: 50%; color: white; background: transparent; }
.hero { position: relative; overflow: hidden; min-height: calc(100svh - 82px); padding: 0; background: var(--ink); color: var(--surface); }
.hero::after { position: absolute; content: ""; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 68px 68px; mask-image: linear-gradient(to bottom, black, transparent 80%); }
.hero-grid { position: relative; z-index: 1; min-height: calc(100svh - 82px - 112px); display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; padding-block: clamp(2.5rem, 6vh, 4.5rem); }
.hero-grid > * { min-width: 0; }
.hero-copy { display: grid; gap: clamp(1rem, 2.2vh, 1.5rem); }
.hero-copy h1 { max-width: 100%; font-size: clamp(3.2rem, 5.7vw, 5.8rem); }
.hero-copy .lede { max-width: 640px; font-size: clamp(1.05rem, 1.55vw, 1.3rem); }
.hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; }
.system-scene { position: relative; width: 100%; height: min(480px, 56vh); min-height: 350px; isolation: isolate; }
.system-scene::before { position: absolute; content: ""; inset: 8% 4%; z-index: -2; border: 1px solid rgba(51,214,197,.18); border-radius: 50%; box-shadow: 0 0 0 55px rgba(91,140,255,.025), 0 0 0 110px rgba(51,214,197,.018); transform: translate3d(var(--pointer-x,0), calc(var(--parallax-y,0px) + var(--pointer-y,0px)), 0); }
.system-art { --motion-x: 0px; --motion-y: 0px; --motion-r: 0deg; --motion-scale: 1; position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; object-fit: contain; filter: saturate(.85) sepia(.05) hue-rotate(115deg) drop-shadow(0 30px 60px rgba(0,0,0,.35)); transform: translate3d(calc(var(--pointer-x,0px) + var(--motion-x)), calc(var(--parallax-y,0px) + var(--pointer-y,0px) + var(--motion-y)), 0) rotate(var(--motion-r)) scale(var(--motion-scale)); will-change: transform; }
.system-node { --motion-x: 0px; --motion-y: 0px; position: absolute; z-index: 2; display: grid; place-items: center; min-width: 92px; min-height: 42px; padding: .55rem .75rem; border: 1px solid rgba(112,222,211,.32); border-radius: .7rem; background: rgba(7,17,31,.78); color: #dce7ef; box-shadow: 0 14px 35px rgba(0,0,0,.25); backdrop-filter: blur(10px); font: 700 .66rem ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .08em; text-transform: uppercase; transform: translate3d(calc(var(--pointer-x,0px) + var(--motion-x)), calc(var(--parallax-y,0px) + var(--pointer-y,0px) + var(--motion-y)), 0); will-change: transform; }
.system-node::before { content: ""; width: 6px; height: 6px; margin-right: .45rem; display: inline-block; border-radius: 50%; background: var(--accent-bright); box-shadow: 0 0 14px var(--accent-bright); }
.system-node-crm { top: 9%; left: 6%; }
.system-node-ai { top: 17%; right: 8%; }
.system-node-growth { bottom: 9%; left: 16%; }
.system-pulse { position: absolute; z-index: 3; width: 8px; height: 8px; border-radius: 50%; background: var(--accent-bright); box-shadow: 0 0 18px var(--accent-bright); animation: systemPulse 4.8s ease-in-out infinite; }
.system-pulse-a { top: 34%; left: 28%; }
.system-pulse-b { right: 22%; bottom: 29%; animation-delay: -2.1s; }
@keyframes systemPulse { 0%,100% { opacity: .25; transform: scale(.65); } 45% { opacity: 1; transform: scale(1.35); } }
.proofbar { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 0; border-block: 1px solid var(--line-dark); }
.proof { padding: 1.5rem 1rem 1.5rem 0; }
.proof + .proof { border-left: 1px solid var(--line-dark); padding-left: 1.5rem; }
.proof strong { display: block; color: white; font-size: 1.15rem; }
.proof span { color: #8fa0b3; font-size: .85rem; }
.intro-grid, .split { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(3rem, 8vw, 8rem); align-items: start; }
.problem-list { border-top: 1px solid var(--line); }
.problem { display: grid; grid-template-columns: 50px 1fr; gap: 1rem; padding: 1.6rem 0; border-bottom: 1px solid var(--line); }
.problem span { color: var(--accent); font: 700 .82rem ui-monospace, monospace; }
.problem p { color: var(--muted); }
.section-head { display: flex; align-items: end; justify-content: space-between; gap: 3rem; margin-bottom: 3rem; }
.section-head p { max-width: 480px; color: var(--muted); }
.dark .section-head p { color: #98a8ba; }
.card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.card { min-height: 330px; display: flex; flex-direction: column; gap: 1rem; padding: clamp(1.5rem, 3vw, 2.2rem); border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); transition: transform .25s ease, box-shadow .25s ease; }
.card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.card-number { color: var(--accent); font: 700 .78rem ui-monospace, monospace; letter-spacing: .12em; }
.card p { color: var(--muted); }
.card a { margin-top: auto; font-weight: 700; text-decoration: none; }
.card-feature { grid-column: span 2; background: var(--ink-2); color: white; border-color: var(--line-dark); }
.card-feature p { color: #aebaca; }
.flow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; counter-reset: step; }
.flow-step { position: relative; padding: 1.7rem; border-top: 2px solid var(--line-dark); }
.flow-step::before { counter-increment: step; content: "0" counter(step); color: var(--accent-bright); font: 700 .78rem ui-monospace, monospace; }
.flow-step h3 { margin: 1.2rem 0 .7rem; color: white; }
.flow-step p { color: #96a7b9; font-size: .94rem; }
.platforms { display: flex; flex-wrap: wrap; gap: .65rem; }
.pill { border: 1px solid var(--line); border-radius: 999px; padding: .6rem .9rem; color: var(--muted); font-weight: 650; font-size: .9rem; background: var(--paper); }
.outcome { overflow: hidden; display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line-dark); border-radius: calc(var(--radius) * 1.2); }
.outcome-visual { min-height: 420px; padding: 2rem; background: radial-gradient(circle at 80% 20%, rgba(51,214,197,.23), transparent 38%), #0d1b2b; }
.mini-browser { width: 100%; height: 100%; border: 1px solid #3a526c; border-radius: 1rem; background: #0a1523; box-shadow: 0 25px 60px rgba(0,0,0,.35); }
.mini-bar { height: 42px; border-bottom: 1px solid #30445c; display: flex; gap: .35rem; align-items: center; padding: 0 1rem; }
.mini-bar i { width: 7px; height: 7px; border-radius: 50%; background: #62768d; }
.mini-content { display: grid; grid-template-columns: .65fr 1fr; gap: 1rem; padding: 1.5rem; }
.mini-content span { min-height: 115px; border-radius: .6rem; background: #152941; }
.mini-content span:first-child { background: linear-gradient(135deg, #33d6c5, #5b8cff); }
.outcome-copy { display: flex; flex-direction: column; justify-content: center; gap: 1.2rem; padding: clamp(2rem, 5vw, 5rem); background: var(--ink); }
.outcome-copy p { color: #9eb0c2; }
.note { border-left: 3px solid var(--accent); padding-left: 1rem; color: var(--muted); font-size: .9rem; }
.cta { overflow: hidden; position: relative; text-align: center; border-radius: 2rem; padding: clamp(3rem, 8vw, 7rem) 1.5rem; background: var(--ink); color: white; }
.cta::before { position: absolute; content: ""; width: 440px; height: 440px; border: 1px solid #24405a; border-radius: 50%; top: -280px; left: calc(50% - 220px); box-shadow: 0 0 0 70px rgba(51,214,197,.025), 0 0 0 140px rgba(91,140,255,.02); }
.cta > * { position: relative; z-index: 1; }
.cta h2 { max-width: 850px; margin: .8rem auto 1.3rem; }
.cta p { max-width: 620px; margin: 0 auto 2rem; color: #aebccc; }
.page-hero { padding: clamp(6rem, 12vw, 10rem) 0 5rem; background: var(--ink); color: white; }
.page-hero .lede { margin-top: 2rem; }
.page-hero h1 { max-width: 1050px; font-size: clamp(3rem, 6.5vw, 6rem); }
.content { max-width: 800px; }
.content h2 { margin: 3.5rem 0 1.3rem; font-size: clamp(2rem, 4vw, 3.2rem); }
.content h3 { margin: 2rem 0 .8rem; }
.content p, .content li { color: var(--muted); }
.content ul { padding-left: 1.2rem; }
.content li + li { margin-top: .55rem; }
.feature-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; margin-top: 3rem; }
.feature { padding: 1.7rem; border: 1px solid var(--line); border-radius: 1rem; background: var(--paper); }
.feature h3 { margin-bottom: .65rem; }
.feature p { color: var(--muted); }
.form { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; padding: clamp(1.5rem, 4vw, 3rem); border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); box-shadow: var(--shadow); }
.field { display: grid; gap: .45rem; }
.field-full { grid-column: 1 / -1; }
label { font-size: .9rem; font-weight: 700; }
input, select, textarea { width: 100%; border: 1px solid #aab3bd; border-radius: .7rem; background: white; color: var(--text); padding: .8rem .9rem; }
textarea { min-height: 150px; resize: vertical; }
.check { display: flex; gap: .7rem; align-items: flex-start; font-size: .9rem; font-weight: 400; color: var(--muted); }
.check input { width: auto; margin-top: .35rem; }
.form-status { min-height: 2.5rem; padding: .7rem; border-radius: .5rem; background: #e8f7f4; color: #105a51; }
.form-status[data-state="sending"] { background: #edf3fb; color: #264d79; }
.form-status[data-state="error"] { background: #fff0ee; color: #8b2e25; }
.form-status[data-state="success"] { background: #e8f7f4; color: #105a51; }
.form button:disabled { cursor: wait; opacity: .65; }
.form-trap { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.field-error { color: #a4372c; font-size: .82rem; font-weight: 650; }
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"] { border-color: #b64035; box-shadow: 0 0 0 3px rgba(182,64,53,.12); }
.check:has(input[aria-invalid="true"]) { color: #8b2e25; }
.footer { padding: 4rem 0 2rem; background: var(--ink); color: white; }
.footer-grid { display: grid; grid-template-columns: 1.2fr repeat(3, 1fr); gap: 3rem; }
.footer h3 { font-size: 1rem; margin-bottom: 1rem; }
.footer p, .footer a { color: #9cadbe; }
.footer a { display: block; width: fit-content; margin: .55rem 0; text-decoration: none; }
.footer-bottom { display: flex; justify-content: space-between; gap: 2rem; margin-top: 4rem; padding-top: 1.5rem; border-top: 1px solid var(--line-dark); color: #8193a6; font-size: .82rem; }
.home-chapter { position: relative; min-height: 100svh; display: flex; align-items: center; overflow: clip; isolation: isolate; }
.home-chapter > .shell { position: relative; z-index: 2; }
.chapter-copy { display: grid; gap: 1.5rem; }
.chapter-summary { max-width: 520px; color: var(--muted-strong); font-size: 1.08rem; }
.light-copy { color: var(--dark-copy); }
.chapter-action { margin-top: 2rem; }
.chapter-glow { position: absolute; z-index: -1; width: min(58vw, 760px); aspect-ratio: 1; right: -16%; top: 9%; border-radius: 50%; background: radial-gradient(circle, rgba(30,186,169,.13), transparent 68%); }
.chapter-grid { position: absolute; z-index: -1; inset: 0; opacity: .46; background-image: linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px); background-size: 72px 72px; mask-image: radial-gradient(circle at 72% 50%, black, transparent 72%); }
.home-motion-rail { position: fixed; z-index: 24; right: 1rem; top: 50%; display: grid; gap: .35rem; opacity: 0; visibility: hidden; pointer-events: none; transform: translate(12px,-50%); padding: .6rem; border: 1px solid rgba(255,255,255,.1); border-radius: 999px; background: rgba(7,17,31,.76); box-shadow: 0 18px 50px rgba(7,17,31,.22); backdrop-filter: blur(14px); transition: opacity .25s ease, visibility .25s ease, transform .25s ease; }
.home-motion-rail.is-visible { opacity: 1; visibility: visible; pointer-events: auto; transform: translate(0,-50%); }
.home-motion-rail a { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; color: #8fa0b3; font: 700 .64rem ui-monospace, monospace; text-decoration: none; transition: color .25s ease, background .25s ease, transform .25s ease; }
.home-motion-rail a b { position: absolute; right: 50px; opacity: 0; pointer-events: none; padding: .35rem .55rem; border-radius: .4rem; background: var(--ink); color: white; font: 650 .72rem/1 system-ui, sans-serif; transform: translateX(8px); transition: opacity .2s ease, transform .2s ease; }
.home-motion-rail a:hover b { opacity: 1; transform: none; }
.home-motion-rail a.is-active { background: var(--accent-bright); color: var(--ink); transform: scale(1.08); }
.chapter-problems { background: linear-gradient(135deg, #f5f2e9 0%, #fffdf8 54%, #e8f5f2 100%); }
.chapter-problems .intro-grid { grid-template-columns: .95fr 1.05fr; }
.chapter-problems .problem-list { border: 0; display: grid; gap: .8rem; perspective: 1200px; }
.chapter-problems .problem { grid-template-columns: 48px 1fr; padding: 1.55rem; border: 1px solid rgba(21,37,58,.12); border-radius: 1rem; background: rgba(255,253,248,.78); box-shadow: 0 18px 50px rgba(7,17,31,.06); backdrop-filter: blur(12px); }
.chapter-problems .problem p { color: var(--muted-strong); }
.chapter-services .shell { display: grid; grid-template-columns: .86fr 1.14fr; column-gap: clamp(3rem, 7vw, 7rem); align-items: center; }
.chapter-services .section-head { display: grid; align-content: center; margin: 0; }
.chapter-services .section-head p { margin-top: 1.4rem; color: var(--dark-copy); }
.motion-card-stack { position: relative; display: block; height: 440px; perspective: 1600px; }
.motion-card-stack .card { position: absolute; inset: 0; min-height: 440px; border-color: #31475f; background: linear-gradient(145deg, #13263b, #091624); color: white; box-shadow: 0 35px 90px rgba(0,0,0,.34); transform-origin: 50% 100%; }
.motion-card-stack .card:nth-child(2) { background: linear-gradient(145deg, #102c35, #091923); }
.motion-card-stack .card:nth-child(3) { background: linear-gradient(145deg, #17263f, #091523); }
.motion-card-stack .card:nth-child(4) { background: linear-gradient(145deg, #122a2f, #08151f); }
.motion-card-stack .card p { color: var(--dark-copy); }
.motion-card-stack .card a { color: var(--accent-bright); }
.stack-progress { grid-column: 1; grid-row: 2; display: flex; gap: .8rem; align-items: center; margin-top: 1.5rem; color: #9aabbb; font: 650 .72rem ui-monospace, monospace; letter-spacing: .08em; text-transform: uppercase; }
.stack-progress i { position: relative; width: 110px; height: 2px; overflow: hidden; background: #263a50; }
.stack-progress i::after { position: absolute; content: ""; inset: 0; background: var(--accent-bright); transform: scaleX(var(--stack-progress, 0)); transform-origin: left; }
.chapter-outcome { background: linear-gradient(180deg, #f5f2e9, #e9eeea); }
.chapter-outcome .outcome { box-shadow: 0 40px 100px rgba(7,17,31,.18); }
.outcome-signal { position: absolute; z-index: 2; top: 1.2rem; right: 1.2rem; display: flex; align-items: center; gap: .55rem; padding: .5rem .7rem; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; color: #dbe5ec; background: rgba(7,17,31,.7); font: 650 .65rem ui-monospace, monospace; letter-spacing: .06em; text-transform: uppercase; backdrop-filter: blur(12px); }
.outcome-signal i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent-bright); box-shadow: 0 0 12px var(--accent-bright); }
.chapter-outcome .outcome-visual { position: relative; }
.chapter-ai { background: radial-gradient(circle at 14% 80%, rgba(30,186,169,.12), transparent 34%), var(--ink); }
.ai-system { padding: clamp(1.35rem, 3vw, 2.25rem); border: 1px solid #2d4259; border-radius: 1.45rem; background: linear-gradient(145deg, rgba(18,39,58,.8), rgba(8,24,38,.62)); box-shadow: 0 34px 90px rgba(0,0,0,.24); backdrop-filter: blur(16px); }
.ai-system > .lede { color: #d5dee6; }
.chapter-ai .feature-list { position: relative; perspective: 1400px; }
.chapter-ai .feature { border-color: #2d4259; background: rgba(15,32,50,.84); box-shadow: 0 25px 70px rgba(0,0,0,.2); }
.chapter-ai .feature p { color: var(--dark-copy); }
.ai-orbit { position: absolute; z-index: -1; width: min(58vw, 780px); aspect-ratio: 1; left: -18%; bottom: -48%; border: 1px solid rgba(51,214,197,.14); border-radius: 50%; }
.ai-orbit i { position: absolute; inset: 15%; border: 1px solid rgba(91,140,255,.12); border-radius: inherit; }
.ai-orbit i:nth-child(2) { inset: 30%; }
.ai-orbit i:nth-child(3) { inset: 45%; background: rgba(51,214,197,.08); }
.chapter-agency { background: linear-gradient(145deg, #fffdf8 0%, #eef4f1 55%, #e6efef 100%); }
.chapter-agency .split { grid-template-columns: 1.05fr .95fr; }
.agency-content { padding: clamp(1.5rem, 4vw, 3rem); border: 1px solid rgba(21,37,58,.12); border-radius: 1.4rem; background: rgba(255,255,255,.66); box-shadow: 0 30px 80px rgba(7,17,31,.08); backdrop-filter: blur(16px); }
.agency-capabilities { margin-top: 2rem; }
.agency-capabilities .pill { color: var(--text); border-color: #c5cecb; }
.agency-meter { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .75rem; max-width: 430px; margin-top: 1rem; color: var(--muted-strong); font: 700 .72rem ui-monospace, monospace; letter-spacing: .08em; text-transform: uppercase; }
.agency-meter i { position: relative; height: 5px; overflow: hidden; border-radius: 9px; background: #ccd7d4; }
.agency-meter i::after { position: absolute; content: ""; inset: 0; background: linear-gradient(90deg, var(--accent), var(--blue)); transform: scaleX(var(--capacity, 0)); transform-origin: left; }
.agency-meter b { color: #087c70; }
.chapter-process { --flow-progress: 0; background: linear-gradient(145deg, #07111f, #0b1b2c 60%, #0c242b); }
.chapter-process .flow { position: relative; padding-top: 1rem; }
.chapter-process .flow::after { position: absolute; content: ""; height: 2px; top: 0; left: 0; right: 0; background: linear-gradient(90deg, var(--accent-bright), var(--blue)); transform: scaleX(var(--flow-progress)); transform-origin: left; box-shadow: 0 0 18px rgba(51,214,197,.3); }
.chapter-process .flow-step { min-height: 250px; border-top-color: #37506a; border-radius: 0 0 1rem 1rem; background: rgba(255,255,255,.025); }
.chapter-process .flow-step h3 { color: #f7f4eb; }
.chapter-process .flow-step p { color: var(--dark-copy); }
.process-platforms { margin-top: 3rem; justify-content: center; }
.chapter-process .pill { color: #c3cfda; border-color: #334a62; background: rgba(255,255,255,.025); }
.chapter-finale { background: radial-gradient(circle at 50% 50%, rgba(51,214,197,.13), transparent 42%), #e9eeea; }
.chapter-finale .cta { min-height: min(720px, 78svh); display: grid; place-content: center; }
.finale-rings { position: absolute; z-index: 0; width: min(68vw, 820px); aspect-ratio: 1; left: 50%; top: 50%; transform: translate(-50%,-50%); border: 1px solid rgba(51,214,197,.16); border-radius: 50%; }
.finale-rings i { position: absolute; inset: 13%; border: 1px solid rgba(91,140,255,.12); border-radius: inherit; }
.finale-rings i:nth-child(2) { inset: 27%; }
.finale-rings i:nth-child(3) { inset: 41%; background: rgba(51,214,197,.06); }
[data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
[data-reveal].is-visible { opacity: 1; transform: none; }
[data-parallax] { transform: translate3d(var(--pointer-x, 0), calc(var(--parallax-y, 0px) + var(--pointer-y, 0px)), 0); will-change: transform; }
@media (max-width: 900px) {
  .home-motion-rail { display: none; }
  .hero-grid { min-height: auto; padding-block: 5rem 1.5rem; }
  .home-chapter { min-height: auto; }
  .chapter-services .shell { display: block; }
  .motion-card-stack { display: grid; height: auto; }
  .motion-card-stack .card { position: relative; inset: auto; min-height: 330px; }
  .stack-progress { display: none; }
  .chapter-ai .feature-list { perspective: none; }
  .menu { display: grid; place-items: center; }
  .nav { display: none; position: absolute; inset: 82px 0 auto; flex-direction: column; align-items: stretch; gap: 0; padding: 1rem 20px 1.5rem; background: var(--ink); border-bottom: 1px solid var(--line-dark); }
  .nav[data-open] { display: flex; }
  .nav a { padding: .85rem 0; }
  .nav .button { margin-top: .6rem; }
  .hero-grid, .intro-grid, .split, .outcome { grid-template-columns: minmax(0, 1fr); }
  .system-scene { width: 100%; max-width: 620px; min-height: 460px; margin: 0 auto -4rem; }
  .proofbar { grid-template-columns: 1fr 1fr; }
  .proof:nth-child(3) { border-left: 0; }
  .proof:nth-child(n+3) { border-top: 1px solid var(--line-dark); }
  .card-grid { grid-template-columns: 1fr 1fr; }
  .flow { grid-template-columns: 1fr 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
  :root { --container: min(1180px, calc(100vw - 28px)); }
  body { font-size: 16px; }
  .header-inner { min-height: 72px; }
  .brand-symbol { width: 42px; height: 36px; }
  .brand-wordmark { font-size: .78rem; }
  .nav { top: 72px; padding-inline: 14px; }
  .hero { min-height: 0; padding: 0; }
  .hero-grid { padding-block: 4.5rem 1rem; }
  .hero-grid, .section-head { display: grid; }
  .home-chapter { padding-block: 5rem; }
  .chapter-summary { font-size: 1rem; }
  .chapter-problems .problem { padding: 1.2rem; }
  .agency-content { padding: 1.25rem; }
  .chapter-process .flow-step { min-height: 0; }
  .chapter-finale .cta { min-height: 600px; }
  .hero-actions { align-items: stretch; flex-direction: column; }
  .hero-actions .button { width: 100%; white-space: normal; }
  .system-art { margin-bottom: 0; }
  .system-scene { height: 350px; min-height: 350px; margin: 0 auto -1rem; }
  .system-node { min-width: 76px; min-height: 36px; font-size: .56rem; }
  .system-node-crm { left: 0; }
  .system-node-ai { right: 0; }
  .ambient-depth { opacity: .35; }
  .proofbar, .card-grid, .flow, .feature-list, .form, .footer-grid { grid-template-columns: 1fr; }
  .proof + .proof { border-left: 0; padding-left: 0; }
  .proof:nth-child(n+2) { border-top: 1px solid var(--line-dark); }
  .card-feature, .field-full { grid-column: auto; }
  .outcome-visual { min-height: 300px; padding: 1rem; }
  .footer-bottom { display: grid; }
}

@media (min-width: 901px) and (max-height: 820px) {
  .hero-grid { min-height: calc(100svh - 82px - 96px); padding-block: 2rem; }
  .hero-copy { gap: .9rem; }
  .hero-copy h1 { font-size: clamp(3rem, 5.1vw, 4.7rem); }
  .hero-copy .lede { font-size: 1.02rem; line-height: 1.55; }
  .system-scene { height: min(410px, 52vh); min-height: 320px; }
  .proof { padding-block: 1rem; }
  .proof strong { font-size: 1rem; }
  .proof span { font-size: .78rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  [data-parallax], .system-art, .system-node, .system-scene::before, .ambient-orb { transform: none !important; }
}
