:root{--bg:#06111d;--panel:#0b1e2c;--line:#25445b;--ink:#eaf6ff;--muted:#8faabc;--cyan:#22d9ef;--lime:#9ee94f;--gold:#ffc65b;--purple:#a77bff;--max:1260px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 82% 0,#172751,transparent 33%),radial-gradient(circle at 15% 38%,#15382e,transparent 28%),var(--bg);color:var(--ink);font-family:Manrope,system-ui,sans-serif}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.25;background-image:linear-gradient(#2ccbe516 1px,transparent 1px),linear-gradient(90deg,#2ccbe516 1px,transparent 1px);background-size:48px 48px}a{color:inherit;text-decoration:none}header{position:sticky;z-index:10;top:0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px max(22px,calc((100vw - var(--max))/2));background:#06111de8;border-bottom:1px solid var(--line);backdrop-filter:blur(14px);font-size:12px}.brand{display:flex;align-items:center;gap:10px}.brand b{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--cyan);border-radius:50%;color:var(--cyan)}.brand span{font-weight:800;letter-spacing:.13em}.back{color:var(--muted)}main{position:relative;z-index:1}.hero{max-width:var(--max);margin:auto;padding:88px 0 55px;display:grid;grid-template-columns:1fr 310px;gap:70px;align-items:end}.eyebrow{font-size:10px;color:var(--cyan);font-weight:800;letter-spacing:.18em}.hero h1,.project h2,.method h2{font-family:Space Grotesk;line-height:1.05;letter-spacing:-.04em}.hero h1{max-width:850px;margin:16px 0;font-size:clamp(45px,6vw,78px)}em{color:var(--lime);font-style:normal}.hero>div>p:not(.eyebrow){max-width:750px;color:#a7bdc9;font-size:16px;line-height:1.65}.stack{color:#91acb8;font-size:11px}.stack i{color:var(--cyan);font-style:normal;margin:0 5px}.hero-stat{display:grid;grid-template-columns:auto 1fr;gap:8px 15px;padding:25px;border:1px solid var(--line);border-radius:16px;background:#0a1d2a}.hero-stat strong{font-family:Space Grotesk;color:var(--gold);font-size:26px}.hero-stat span{align-self:center;color:var(--muted);font-size:11px}.tabs{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:6px;border:1px solid var(--line);border-radius:13px;background:#071722}.tabs button{border:0;border-radius:8px;padding:13px;background:transparent;color:#8da8b7;font:600 12px Manrope;cursor:pointer}.tabs button.active{background:linear-gradient(100deg,var(--lime),var(--cyan));color:#06111d}.project{display:none;max-width:var(--max);margin:24px auto 75px;padding:35px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,#0b2130ee,#071722ee)}.project.active{display:block;animation:enter .45s ease}@keyframes enter{from{opacity:0;transform:translateY(8px)}}.project-head{display:flex;justify-content:space-between;gap:40px;align-items:end}.project h2{margin:10px 0;font-size:clamp(32px,4vw,51px)}.project-head p:not(.eyebrow){max-width:760px;color:var(--muted);line-height:1.55}.project-head>a{white-space:nowrap;border:1px solid #3d7284;padding:10px 12px;border-radius:7px;color:var(--cyan);font-size:11px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:28px 0}.metrics article{padding:18px;border:1px solid #244e62;border-radius:10px;background:#071722}.metrics small,.metrics strong,.metrics span{display:block}.metrics small{color:#75a0af;font-size:9px;letter-spacing:.1em}.metrics strong{margin:5px 0;color:var(--gold);font:700 26px Space Grotesk}.metrics span{color:#a5bdc7;font-size:10px}.visuals{display:grid;grid-template-columns:1fr 1fr;gap:12px}.visuals figure{margin:0;background:#eef3f3;border-radius:12px;overflow:hidden}.visuals img{display:block;width:100%;height:390px;object-fit:contain}.visuals figcaption{padding:9px 13px;background:#0b1b26;color:#9fb8c3;font-size:10px}.explain{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.explain article{padding:19px;background:#0b202c;border:1px solid #1e4354;border-radius:10px}.explain h3{margin:0;color:var(--lime);font-size:13px}.explain p{color:var(--muted);font-size:11px;line-height:1.6}.method{max-width:var(--max);margin:0 auto 90px;padding:35px;border:1px solid #4f4776;border-radius:18px;background:linear-gradient(120deg,#111e32,#1a1830);display:grid;grid-template-columns:.8fr 1.2fr;gap:50px}.method h2{font-size:32px}.method ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.method li{padding:14px;background:#0b1725;border:1px solid #333d5a;border-radius:8px;color:#a4b9c5;font-size:11px}.method li b{display:block;color:var(--purple);margin-bottom:5px}footer{max-width:var(--max);margin:auto;padding:25px 0 45px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:18px;color:#718e9c;font-size:10px}@media(max-width:900px){.hero,.method{grid-template-columns:1fr}.hero,.project,.method,footer{margin-left:18px;margin-right:18px}.tabs{margin-left:18px;margin-right:18px}.metrics{grid-template-columns:repeat(2,1fr)}.visuals{grid-template-columns:1fr}.explain{grid-template-columns:1fr}.project-head{align-items:flex-start;flex-direction:column}.method ol{grid-template-columns:repeat(2,1fr)}}@media(max-width:560px){header .brand span{display:none}.hero{padding-top:55px}.tabs{grid-template-columns:1fr 1fr}.project{padding:20px}.visuals img{height:260px}.method ol{grid-template-columns:1fr}footer{flex-direction:column}}
