:root {
  --ink: #111827;
  --muted: #667085;
  --paper: #f7f8fa;
  --white: #ffffff;
  --blue: #3157ff;
  --acid: #b8ff3d;
  --cyan: #60e4ff;
  --line: rgba(17, 24, 39, 0.15);
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scrollbar-width: none; }
html::-webkit-scrollbar { display: none; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--sans); -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }

.nav-shell { position: relative; z-index: 50; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; min-height: 82px; padding: 0 5vw; background: var(--white); border-bottom: 1px solid var(--line); }
.logo { display: inline-flex; align-items: center; gap: 10px; width: fit-content; font-size: 15px; font-weight: 750; }
.logo-box { position: relative; display: grid; place-items: center; width: 48px; height: 36px; color: white; background: var(--blue); font-family: var(--mono); font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.logo-box::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--acid); }
.nav-shell nav { display: flex; gap: 34px; font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: .06em; }
.nav-shell nav a { position: relative; }
.nav-shell nav a::before { content: ""; position: absolute; left: -11px; top: 5px; width: 5px; height: 5px; border-radius: 50%; background: var(--blue); transform: scale(0); transition: transform .2s; }
.nav-shell nav a:hover::before { transform: scale(1); }
.nav-cta { justify-self: end; display: flex; align-items: center; gap: 28px; padding: 14px 16px; color: white; background: var(--blue); font-size: 12px; font-weight: 700; }
.nav-cta b { font-size: 17px; }
.menu-toggle { display: none; align-items: center; gap: 6px; padding: 13px 14px; color: var(--ink); background: transparent; border: 1px solid var(--line); cursor: pointer; }
.menu-toggle .menu-label { margin-right: 5px; font-family: var(--mono); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.menu-toggle i { display: block; width: 17px; height: 1px; background: currentColor; transition: transform .2s ease; }

.hero { position: relative; display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; min-height: calc(100vh - 82px); padding: 80px 5vw 75px; background: var(--white); overflow: hidden; }
.hero-grid { position: absolute; inset: 0; opacity: .5; background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 70px 70px; mask-image: linear-gradient(to bottom, black, transparent 92%); }
.signal { position: absolute; z-index: 1; height: 2px; width: 46vw; background: linear-gradient(90deg, transparent, var(--blue), transparent); animation: signalMove 5s linear infinite; }
.signal-a { top: 32%; left: -50vw; }
.signal-b { top: 67%; left: -50vw; animation-delay: 2.3s; }
@keyframes signalMove { to { transform: translateX(160vw); } }
.hero-content { position: relative; z-index: 3; max-width: 820px; }
.status { display: inline-flex; align-items: center; font-family: var(--mono); font-size: 10px; letter-spacing: .07em; text-transform: uppercase; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin: 32px 0 30px; font-size: clamp(72px, 9.2vw, 150px); font-weight: 650; line-height: .81; letter-spacing: -.075em; }
h1 span { color: var(--blue); -webkit-text-stroke: 0; }
.hero-content > p { max-width: 620px; color: var(--muted); font-size: clamp(18px,1.4vw,22px); line-height: 1.55; }
.hero-actions { display: flex; align-items: center; gap: 30px; margin-top: 40px; }
.primary-button { display: flex; align-items: center; justify-content: space-between; min-width: 230px; padding: 19px 20px; color: white; background: var(--ink); font-size: 13px; font-weight: 700; transition: background .2s, transform .2s; }
.primary-button:hover { background: var(--blue); transform: translateY(-3px); }
.plain-link { display: flex; gap: 20px; padding-bottom: 6px; border-bottom: 1px solid; font-size: 12px; font-weight: 700; }
.system-visual { position: relative; z-index: 3; width: min(42vw, 600px); aspect-ratio: 1; justify-self: end; }
.orbit { position: absolute; inset: 9%; border: 1px solid rgba(49,87,255,.32); border-radius: 50%; }
.orbit-inner { inset: 25%; border-style: dashed; }
.dot-orbit { position: absolute; inset: 9%; border-radius: 50%; pointer-events: none; animation: nodeOrbit 16s linear infinite; will-change: transform; }
.dot-orbit-inner { inset: 25%; animation-duration: 10s; animation-direction: reverse; }
.orbit-node { position: absolute; left: 50%; width: 11px; height: 11px; margin-left: -5px; border-radius: 50%; background: var(--acid); box-shadow: 0 0 0 8px rgba(184,255,61,.14); }
.orbit-node.node-a { top: -5px; }
.orbit-node.node-b { bottom: -5px; }
.orbit-node::after { content:""; position:absolute; inset:-2px; border:2px solid var(--acid); border-radius:50%; opacity:0; }
.orbit-node.hit { background: var(--acid); box-shadow: 0 0 0 10px rgba(184,255,61,.18); }
.orbit-node.hit::after { animation: nodeImpact .95s cubic-bezier(.16,.8,.3,1); }
@keyframes nodeOrbit { to { transform: rotate(360deg); } }
@keyframes nodeImpact { 0% { transform:scale(.75);opacity:1; } 100% { transform:scale(6);opacity:0; } }
.core { --move-x: 0px; --move-y: 0px; position: absolute; inset: 38%; background: var(--acid); border-radius: 50%; box-shadow: 0 0 0 25px rgba(184,255,61,.10); transform: translate3d(var(--move-x), var(--move-y), 0); transition: transform .24s cubic-bezier(.22,.61,.36,1); will-change: transform; }
.data-label { position: absolute; display: flex; align-items: center; gap: 8px; padding: 8px 10px; background: white; border: 1px solid var(--line); box-shadow: 0 10px 30px rgba(17,24,39,.08); font-family: var(--mono); font-size: 9px; animation: float 4s ease-in-out infinite; }
.data-label b { padding: 2px 4px; color: var(--ink); background: var(--acid); }
.label-one { left: 0; top: 26%; }
.label-two { right: 0; top: 38%; animation-delay: -1.2s; }
.label-three { left: 14%; bottom: 12%; animation-delay: -2.4s; }
@keyframes float { 50% { transform: translateY(-12px); } }
.core .pulse-ring { position: absolute; inset: 0; border: 1px solid var(--acid); border-radius: 50%; animation: pulseRing 3.2s ease-out infinite; pointer-events:none; }
@keyframes pulseRing { to { transform: scale(3.5); opacity: 0; } }
.hero-footer { position: absolute; z-index: 4; left: 5vw; right: 5vw; bottom: 24px; display: flex; justify-content: space-between; font-family: var(--mono); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.scroll-indicator { display: flex; align-items: center; gap: 8px; }
.scroll-indicator i { width: 28px; height: 1px; background: var(--ink); animation: scrollLine 1.7s ease-in-out infinite; transform-origin: left; }
@keyframes scrollLine { 50% { transform: scaleX(.35); } }

.section-pad { padding: 130px 5vw; }
.section-title { display: grid; grid-template-columns: .65fr 1.5fr .75fr; gap: 5vw; align-items: end; margin-bottom: 75px; }
.section-code { font-family: var(--mono); font-size: 10px; font-weight: 700; letter-spacing: .1em; }
h2 { margin-bottom: 0; font-size: clamp(56px,6.4vw,104px); font-weight: 600; line-height: .9; letter-spacing: -.065em; }
h2 em { color: var(--blue); font-style: normal; }
.section-title > p { margin-bottom: 0; color: var(--muted); font-size: 16px; line-height: 1.6; }
.capability-stack { border-top: 1px solid var(--ink); }
.capability { position: relative; display: grid; grid-template-columns: .35fr 1.6fr .75fr; gap: 30px; align-items: center; min-height: 230px; padding: 34px 10px; border-bottom: 1px solid var(--line); overflow: hidden; }
.cap-number { align-self: start; font-family: var(--mono); font-size: 10px; }
.cap-tag { display: inline-block; width: fit-content; margin-bottom: 12px; padding: 3px 5px; color: var(--ink); background: var(--acid); font-family: var(--mono); font-size: 9px; letter-spacing: .12em; }
.cap-copy h3 { margin-bottom: 14px; font-size: clamp(30px,3.5vw,54px); font-weight: 550; letter-spacing: -.045em; }
.cap-copy p { max-width: 690px; margin-bottom: 0; color: var(--muted); line-height: 1.55; transition: color .3s; }
.cap-graphic { position: relative; height: 120px; overflow: hidden; background: #f0f3ff; border: 1px solid rgba(49,87,255,.18); }
.bars { display: flex; align-items: end; justify-content: center; gap: 8px; padding: 24px; }
.bars i { width: 13px; height: 25%; background: var(--blue); transform-origin: bottom; animation: graphicPulse 2.4s ease-in-out infinite alternate; }
.bars i:nth-child(2) { height: 48%; animation-delay: -.45s; }.bars i:nth-child(3) { height: 78%; background: var(--acid); animation-delay: -.9s; }.bars i:nth-child(4) { height: 58%; animation-delay: -1.35s; }.bars i:nth-child(5) { height: 100%; animation-delay: -1.8s; }
@keyframes graphicPulse { to { transform: scaleY(.55); opacity: .72; } }
.nodes i { position: absolute; width: 13px; height: 13px; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 7px rgba(49,87,255,.13); animation: nodeFloat 2.8s ease-in-out infinite alternate; }
.nodes i:nth-child(1){left:12%;top:22%}.nodes i:nth-child(2){left:48%;top:12%;background:var(--acid);box-shadow:0 0 0 7px rgba(184,255,61,.15);animation-delay:-.7s}.nodes i:nth-child(3){left:72%;top:60%;animation-delay:-1.4s}.nodes i:nth-child(4){left:24%;top:72%;animation-delay:-2.1s}
.nodes::before, .nodes::after { content:""; position:absolute; left:15%; top:28%; width:62%; height:2px; background:rgba(49,87,255,.48); transform:rotate(24deg); transform-origin:left; }.nodes::after{transform:rotate(-31deg);top:78%;left:27%;width:50%}
@keyframes nodeFloat { to { transform: translate3d(0,-9px,0); } }
.rings { display:grid; place-items:center; }.rings i { position:absolute; width:64px; height:64px; border:2px solid var(--blue); border-radius:50%; animation:ringWave 3.2s ease-out infinite; will-change:transform,opacity; }.rings i:nth-child(2){border-color:var(--acid);animation-delay:1.05s}.rings i:nth-child(3){animation-delay:2.1s}
@keyframes ringWave { 0% { transform:scale(.65);opacity:0; } 18% { opacity:1; } 100% { transform:scale(1.65);opacity:0; } }
.waveform { display:flex; align-items:center; justify-content:center; gap:8px; padding:22px; }.waveform i{width:5px;height:25%;background:var(--blue);transform-origin:center;animation:wave 2.2s ease-in-out infinite alternate}.waveform i:nth-child(2){height:65%;animation-delay:-.35s}.waveform i:nth-child(3){height:90%;background:var(--acid);animation-delay:-.7s}.waveform i:nth-child(4){height:48%;animation-delay:-1.05s}.waveform i:nth-child(5){height:78%;animation-delay:-1.4s}.waveform i:nth-child(6){height:32%;animation-delay:-1.75s}
@keyframes wave { to { transform:scaleY(.42);opacity:.72; } }

.method { color: white; background: var(--ink); }
.method-intro { display: grid; grid-template-columns: .65fr 1.5fr .75fr; gap: 5vw; align-items: end; }
.light-code { color: var(--acid); }
.method-intro h2 em { color: var(--acid); }
.method-intro p { margin: 0; color: #a8b0be; line-height: 1.6; }
.method-flow { position: relative; display: grid; grid-template-columns: repeat(4,1fr); margin-top: 100px; }
.method-flow::before { content:""; position:absolute; left:0; right:0; top:31px; height:1px; background:#3d4655; }
.method-flow article { position:relative; padding-right:40px; }
.method-toggle { width:100%; padding:0; color:inherit; background:transparent; border:0; text-align:left; pointer-events:none; }
.method-toggle b { font-family:var(--mono); font-size:9px; color:#929bab; }
.method-toggle i { position:relative; z-index:2; display:block; width:14px; height:14px; margin:20px 0 28px; background:var(--acid); border-radius:50%; box-shadow:0 0 0 8px rgba(184,255,61,.1); }
.method-toggle > span { display:none; }
.method-flow h3 { margin-bottom:12px; font-size:27px; }
.method-flow p { color:#929bab; font-size:14px; line-height:1.6; }
.method-panel[hidden] { display:none; }
.method-console { max-width:900px; margin:110px auto 0; border:1px solid #3b4655; background:#0c121c; box-shadow:0 30px 80px rgba(0,0,0,.3); font-family:var(--mono); }
.console-top { display:flex; justify-content:space-between; padding:14px 18px; color:#8d96a5; border-bottom:1px solid #313a48; font-size:9px; letter-spacing:.08em; }
.console-lines { padding:20px 25px; }
.console-lines p { display:grid; grid-template-columns:35px 1fr auto; margin:0; padding:13px 0; border-bottom:1px solid #242c38; color:#aeb6c3; font-size:11px; }
.console-lines p:last-child { border:0; }.console-lines p span{color:#525d6d}.console-lines p b{color:var(--acid);font-weight:400}

.perspective { display:grid; grid-template-columns:.45fr 1.75fr .65fr; gap:5vw; align-items:start; background:var(--white); }
.perspective blockquote { margin:0; font-size:clamp(42px,5vw,78px); font-weight:550; line-height:1.05; letter-spacing:-.055em; }
.perspective blockquote em { color:var(--blue); font-style:normal; }
.perspective-aside p { color:var(--muted); line-height:1.65; }
.mini-diagram { width: 230px; margin-top: 50px; }
.mini-diagram svg { display: block; width: 100%; height: auto; overflow: visible; }
.venn-circle { fill: none; stroke: var(--blue); stroke-width: 1.8; }
.value-lens { fill: var(--acid); fill-opacity: .72; }
.venn-label, .value-label { font-family: var(--mono); font-size: 10px; dominant-baseline: middle; text-anchor: middle; }
.venn-label { fill: var(--blue); }
.value-label { fill: #3e6500; font-weight: 800; }

.contact { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:12vw; color:white; background:var(--blue); overflow:hidden; }
.contact-bg { position:absolute; inset:0; opacity:.16; background-image:linear-gradient(rgba(255,255,255,.4) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.4) 1px,transparent 1px); background-size:64px 64px; animation:gridDrift 9s linear infinite; }
@keyframes gridDrift { to { background-position:64px 64px; } }
.contact-copy,.contact-form{position:relative;z-index:2}.contact-copy h2{margin:30px 0}.contact-copy h2 em{color:var(--acid)}.contact-copy p{max-width:510px;color:rgba(255,255,255,.72);font-size:17px;line-height:1.6}
.contact-form { display:flex; flex-direction:column; gap:25px; }.contact-form label{display:flex;flex-direction:column;gap:8px}.contact-form label span{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase}.contact-form input,.contact-form textarea{padding:11px 0;color:white;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.5);border-radius:0;outline:none;resize:vertical}.contact-form input:focus,.contact-form textarea:focus{border-color:var(--acid)}.contact-form input::placeholder,.contact-form textarea::placeholder{color:rgba(255,255,255,.5)}.contact-form button{align-self:flex-start;display:flex;justify-content:space-between;min-width:210px;padding:18px 20px;color:var(--ink);background:var(--acid);border:0;font-weight:800;cursor:pointer;transition:transform .2s}.contact-form button:hover{transform:translateY(-3px)}.form-status{min-height:18px;margin:0;font-size:12px}

footer { display:grid; grid-template-columns:1fr auto; gap:30px; padding:60px 5vw 28px; color:white; background:#080c13; }
.footer-logo{font-size:15px}.footer-logo+p{grid-column:2;margin:8px 0 0;color:#8f98a6;font-size:12px}.footer-logo~div{grid-column:1/-1;display:flex;justify-content:space-between;padding-top:28px;border-top:1px solid #2b3441;color:#818a98;font-family:var(--mono);font-size:9px;text-transform:uppercase}.footer-actions{display:flex;gap:28px}.footer-actions a{transition:color .2s ease}.footer-actions a:hover{color:var(--acid)}
.reveal { opacity:0; transform:translateY(26px); transition:opacity .75s ease, transform .75s ease; }.reveal.visible{opacity:1;transform:none}

@media (max-width:900px){
  .nav-shell{grid-template-columns:1fr auto}.nav-shell .nav-cta{display:none}.menu-toggle{display:flex}.nav-shell nav{position:absolute;top:100%;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;padding:10px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 18px 45px rgba(17,24,39,.12)}.nav-shell.open nav{display:flex}.nav-shell nav a{padding:17px 12px;border-bottom:1px solid var(--line);font-size:12px}.nav-shell nav a:last-child{border-bottom:0}.nav-shell nav a::before{display:none}.nav-shell.open .menu-toggle i:nth-last-child(2){transform:translateX(11px) rotate(45deg)}.nav-shell.open .menu-toggle i:last-child{transform:translateX(-12px) rotate(-45deg)}.hero{grid-template-columns:1fr;gap:70px;padding-top:80px}.system-visual{width:min(82vw,560px);justify-self:center}.section-title,.method-intro{grid-template-columns:1fr 2fr}.section-title>p,.method-intro>p{grid-column:2}.capability{grid-template-columns:45px 1fr 150px}.method-flow{grid-template-columns:1fr 1fr;gap:50px}.method-flow::before{display:none}.perspective{grid-template-columns:1fr 3fr}.perspective-aside{grid-column:2}.contact{gap:7vw}
}
@media (max-width:620px){
  .nav-shell{min-height:68px;padding:0 22px}.menu-toggle .menu-label{display:none}.hero{display:block;isolation:isolate;min-height:760px;padding:70px 22px;overflow:hidden}.hero-content{position:relative;z-index:3}.hero h1{font-size:64px}.hero-actions{align-items:flex-start;flex-direction:column}.system-visual{position:absolute;z-index:1;top:285px;right:-250px;width:560px;margin:0;opacity:.18;pointer-events:none}.system-visual .data-label{box-shadow:none}.system-visual .core{box-shadow:0 0 0 25px rgba(184,255,61,.07)}.hero-footer{display:none}.section-pad{padding:90px 22px}.section-title,.method-intro{display:block}.section-title h2,.method-intro h2{margin:30px 0}.capability{grid-template-columns:30px 1fr;min-height:230px;padding:30px 0}.cap-number,.cap-copy{position:relative;z-index:2}.cap-copy{grid-column:2}.cap-graphic{position:absolute;z-index:1;right:-12px;top:50%;width:125px;height:100px;opacity:.22;transform:translateY(-50%);border-color:rgba(49,87,255,.25)}.method-flow{display:block;margin-top:65px;border-top:1px solid #3d4655}.method-flow article{padding:0;border-bottom:1px solid #3d4655}.method-flow::before{display:none}.method-toggle{display:grid;grid-template-columns:30px 16px 1fr auto;align-items:center;gap:12px;padding:21px 0;pointer-events:auto;cursor:pointer}.method-toggle b{grid-column:1}.method-toggle i{grid-column:2;width:10px;height:10px;margin:0;box-shadow:0 0 0 5px rgba(184,255,61,.08)}.method-toggle h3{grid-column:3;margin:0;font-size:23px}.method-toggle>span{display:block;grid-column:4;color:var(--acid);font-size:25px;font-weight:300;transition:transform .2s ease}.method-toggle[aria-expanded="true"]>span{transform:rotate(45deg)}.method-panel p{margin:0;padding:0 35px 22px 58px}.method-console{max-width:100%;margin-top:65px;overflow:hidden}.console-top{gap:15px;flex-wrap:wrap}.console-lines{padding:14px}.console-lines p{grid-template-columns:25px 1fr;font-size:9px}.console-lines p b{display:none}.perspective{display:block}.perspective blockquote{margin:35px 0 55px}.contact{grid-template-columns:1fr;gap:70px}footer{grid-template-columns:1fr}.footer-logo+p{grid-column:1}.footer-logo~div{flex-direction:column;gap:16px}
}
@media (max-width:620px){
  .mini-diagram { width: min(340px, 92vw); margin: 65px auto 0; }
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}
