@font-face{font-family:'Geist';font-weight:100 900;font-style:normal;font-display:swap;src:url(/fonts/geist.woff2) format('woff2')}
@font-face{font-family:'Geist Mono';font-weight:100 900;font-style:normal;font-display:swap;src:url(/fonts/geist-mono.woff2) format('woff2')}
:root{--i-about-stefan:url(/img/about-stefan.jpg);--i-live-full:url(/img/live-full.jpg);--i-nature:url(/img/nature.jpg);--i-ref-out1:url(/img/ref-out1.jpg);--i-ref-out2:url(/img/ref-out2.jpg);--i-ref-resolve:url(/img/ref-resolve.jpg);--i-tisax-dot:url(/img/tisax-dot.png);--i-tisax-letters:url(/img/tisax-letters.png);--i-ui-comments:url(/img/ui-comments.jpg);--i-ui-composer:url(/img/ui-composer.jpg);--i-ui-full:url(/img/ui-full.jpg);--i-ui-header:url(/img/ui-header.jpg);--i-ui-note:url(/img/ui-note.jpg);--i-ui-pop:url(/img/ui-pop.jpg);--i-ui-preview:url(/img/ui-preview.jpg);--i-ui-rect:url(/img/ui-rect.jpg);--i-ui-strip:url(/img/ui-strip.jpg);--i-ui-timeline:url(/img/ui-timeline.jpg);--i-ui-viewer:url(/img/ui-viewer.jpg);--i-w-desk:url(/img/w-desk.jpg);--i-w-folders:url(/img/w-folders.jpg);--i-w-overview:url(/img/w-overview.jpg);--i-w-share:url(/img/w-share.jpg)}
:root{
  --primary:#84cc16;--primary-hover:#a3e635;--on-primary:#09090b;--primary-bg:#84cc161a;--primary-border:#84cc164d;
  --bg:#09090b;--surface:#131316;--surface-light:#1e1e23;--surface-lighter:#2a2a32;--surface-hover:#3a3a44;
  --text:#d4d4db;--text-2:#8a8a97;--border:#ffffff1a;--border-subtle:#ffffff0f;--border-hover:#3f3f47;
  --orange:#f97316;--success:#4ade80;
  --r-sm:6px;--r-md:8px;--r-lg:10px;--r-xl:14px;--r-2xl:18px;--r-3xl:22px;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;--s8:32px;--s10:40px;--s12:48px;--s24:96px;
  --sh-md:0 4px 16px #0000004d;--sh-lg:0 8px 32px #00000066;--sh-xl:0 16px 48px #00000080;--glow:0 0 40px #84cc1626;
  --ease:cubic-bezier(.4,0,.2,1);--ease-out:cubic-bezier(.16,1,.3,1);--ease-in:cubic-bezier(.4,0,1,1);--ease-spring:cubic-bezier(.34,1.56,.64,1);
  --fast:150ms;--base:250ms;--slow:350ms;
  --sans:'Geist',system-ui,sans-serif;--mono:'Geist Mono',ui-monospace,monospace;
  --pad:clamp(20px,4.5vw,72px);--navh:64px;--nav:64px;
  color-scheme:dark;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{font-family:var(--sans);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:clip;font-size:16px;line-height:1.5}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
a{color:inherit}
:focus-visible{outline:2px solid var(--primary);outline-offset:3px;border-radius:var(--r-md);box-shadow:var(--glow)}
.eyebrow{font-size:12px;font-weight:500;line-height:1.5;letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
.h-xl{font-weight:700;font-size:clamp(40px,7.4vw,128px);line-height:.95;letter-spacing:-.01em;color:var(--text)}
.h-l{font-weight:700;font-size:clamp(40px,6.4vw,112px);line-height:.95;letter-spacing:-.01em;color:var(--text)}
.h-m{font-weight:700;font-size:clamp(28px,3.6vw,52px);line-height:1.05;letter-spacing:-.01em;color:var(--text)}
.lede{font-size:clamp(16px,1.3vw,18px);line-height:1.5;color:var(--text-2);max-width:42ch}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:48px;padding:0 var(--s5);border-radius:var(--r-lg);font-size:15px;font-weight:600;text-decoration:none;
  transition:background var(--fast) var(--ease),box-shadow var(--base) var(--ease),transform var(--base) var(--ease-out);will-change:transform}
.btn span{display:inline-block;pointer-events:none}
.btn-primary{background:var(--primary);color:var(--on-primary)}
.btn-primary:hover{background:var(--primary-hover);box-shadow:var(--glow)}
.btn-ghost{background:var(--surface-light);color:var(--text)}
.btn-ghost:hover{background:var(--surface-lighter)}
.btn-sm{min-height:40px;padding:0 var(--s4);font-size:14px}
.row{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center}
.nav{position:fixed;inset:0 0 auto 0;z-index:50;height:var(--navh);display:flex;align-items:center;gap:var(--s6);padding:0 var(--pad);
  background:#09090bd9;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color var(--base) var(--ease),transform var(--slow) var(--ease-out)}
.nav.scrolled{border-bottom-color:var(--border)}
.nav.hide{transform:translateY(-100%)}
.brand{display:flex;align-items:center;gap:var(--s3);font-size:18px;font-weight:700;letter-spacing:-.01em;text-decoration:none;color:var(--text)}
.brand svg{width:28px;height:28px}
.nav-links{display:flex;gap:var(--s1);margin-left:var(--s3)}
.nav-links a{min-height:40px;display:flex;align-items:center;padding:0 var(--s3);border-radius:var(--r-lg);font-size:14px;font-weight:500;text-decoration:none;color:var(--text-2);transition:background var(--fast) var(--ease),color var(--fast) var(--ease)}
.nav-links a:hover{background:var(--surface-light);color:var(--text)}
.nav-links a[aria-current]{color:var(--text);background:var(--surface-light)}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:var(--s3)}
.burger{display:none;width:44px;height:44px;border-radius:var(--r-lg);align-items:center;justify-content:center}
.burger i{display:block;width:20px;height:2px;background:var(--text);position:relative;transition:background var(--fast)}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:20px;height:2px;background:var(--text);transition:transform var(--base) var(--ease-out)}
.burger i::before{top:-6px}.burger i::after{top:6px}
.burger[aria-expanded=true] i{background:transparent}
.burger[aria-expanded=true] i::before{transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded=true] i::after{transform:translateY(-6px) rotate(-45deg)}
.drawer{position:fixed;inset:var(--navh) 0 0 0;z-index:49;background:var(--bg);padding:var(--s6) var(--pad) var(--s10);display:flex;flex-direction:column;
  transform:translateY(-8px);opacity:0;pointer-events:none;transition:opacity var(--base) var(--ease),transform var(--base) var(--ease-out)}
.drawer.open{opacity:1;transform:none;pointer-events:auto}
.drawer a{font-size:clamp(36px,10vw,56px);font-weight:700;letter-spacing:-.01em;line-height:1.1;text-decoration:none;padding:var(--s3) 0;border-bottom:1px solid var(--border)}
.drawer .btn{margin-top:var(--s6);align-self:flex-start;font-size:15px;border:0;line-height:1}
@media (max-width:1040px){.nav-links,.nav-right .menu,.nav-right .btn{display:none}.burger{display:flex}}
.rm .ticker div{animation:none}
.sec{padding:clamp(88px,13vh,160px) var(--pad);position:relative}
.sec.alt{background:var(--surface)}
.tint{position:relative;isolation:isolate;overflow:clip}
.tint::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(40vmax 30vmax at var(--ax) 10vmax,rgb(var(--ta) / .085),transparent 70%),radial-gradient(34vmax 26vmax at var(--bx) calc(100% - 8vmax),rgb(var(--tb) / .06),transparent 70%);
  animation:tint var(--dur) var(--ease) var(--del) infinite alternate}
@keyframes tint{to{transform:translate3d(var(--dx),-2.5%,0) scale(1.05)}}
.rm .tint::before{animation:none}
.wrap{max-width:1320px;margin:0 auto}
.scene{position:relative}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.hero{height:230vh}
.hero-head{position:absolute;left:var(--pad);top:calc(var(--nav) + clamp(20px,5vh,56px));z-index:3;max-width:min(640px,92vw);pointer-events:none}
.hero-head .row{pointer-events:auto;margin-top:var(--s6)}
.roll{position:relative;display:block;height:1em;clip-path:inset(0 -100vw -.1em 0);margin-top:var(--s3)}
.roll span{position:absolute;left:0;top:0;white-space:nowrap;line-height:1;will-change:transform}
.h-xl .prod{display:inline-block;font-weight:700;line-height:1;padding-bottom:.08em;background:linear-gradient(100deg,#d8c8ff 0%,#b6d8ff 40%,#eef2ff 50%,#b6d8ff 60%,#d8c8ff 100%) 0 0/250% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 9s var(--ease) infinite}
@keyframes sheen{0%,100%{background-position:100% 0}50%{background-position:0 0}}
.rm .h-xl .prod{animation:none}
.hero .lede{margin-top:var(--s5);max-width:32ch}
.cam{position:absolute;inset:0;perspective:1700px;perspective-origin:62% 38%}
.stack{--aw:min(960px,58vw);position:absolute;left:66%;top:64%;width:var(--aw);aspect-ratio:16/9;margin-left:calc(var(--aw)/-2);margin-top:calc(var(--aw)*-.28125);transform-style:preserve-3d;will-change:transform}
.lay{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none}
.lay .ghost{position:absolute;inset:0;border-radius:var(--r-xl);border:1px dashed var(--border-hover);opacity:var(--ex,1)}
.pc{position:absolute;background-size:100% 100%}
.pc.ring{transform:translateZ(2px)}
.pc.ring svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none}
.pc.ring ellipse{stroke:currentColor;stroke-width:2px;vector-effect:non-scaling-stroke}
.pc.ring .halo{stroke:#09090b55;stroke-width:4px}
.shell{position:absolute;inset:0;border-radius:var(--r-xl);background:var(--bg);box-shadow:var(--sh-xl);pointer-events:none}
.flat{position:absolute;inset:0;border-radius:var(--r-xl);background-size:100% 100%;opacity:0;pointer-events:none;box-shadow:0 0 0 1px var(--border),var(--sh-xl)}
.tag{position:absolute;left:-14px;top:0;transform:translate(-100%,-50%);white-space:nowrap;font-size:12px;font-weight:500;line-height:1;
  background:var(--text);color:var(--bg);padding:var(--s2) var(--s3);border-radius:var(--r-md);opacity:var(--ex,1)}
.tag b{font-weight:500;opacity:.55;margin-right:6px;font-family:var(--mono)}
.hero-cap{position:absolute;left:var(--pad);bottom:clamp(20px,5vh,48px);max-width:34ch;font-size:14px;color:var(--text-2);z-index:3}
.logos{background:var(--surface);padding:var(--s8) 0;overflow:hidden;border-block:1px solid var(--border-subtle)}
.logos .eyebrow{text-align:center;margin-bottom:var(--s5)}
.lg-track{display:flex;gap:64px;width:max-content;align-items:center;will-change:transform}
.lg-track img{height:28px;width:auto;opacity:.6;filter:grayscale(1) brightness(1.6)}
.walk{height:360vh}
.walk-head{position:absolute;left:var(--pad);top:calc(var(--nav) + clamp(16px,4vh,48px));z-index:2;max-width:92vw}
.tcam{position:absolute;inset:0;perspective:1400px}
.track{position:absolute;left:0;top:58%;display:flex;gap:4vw;padding-left:50vw;transform-style:preserve-3d;will-change:transform}
.card{flex:none;width:min(58vw,700px);border-radius:var(--r-3xl);padding:var(--s4);display:flex;flex-direction:column;gap:var(--s4);background:var(--surface);border:1px solid var(--border);
  box-shadow:var(--sh-lg);transform-style:preserve-3d;margin-top:calc(min(58vw,700px)*-.4);cursor:pointer;text-align:left;transition:border-color var(--base) var(--ease)}
.card.cur{border-color:var(--primary-border);box-shadow:var(--sh-lg),var(--glow)}
.card .shot{width:100%;aspect-ratio:16/9;border-radius:var(--r-xl);background-size:cover;background-position:top center;position:relative;overflow:hidden}
.card .zoom{position:absolute;right:var(--s3);bottom:var(--s3);display:flex;align-items:center;gap:6px;background:#09090bcc;color:var(--text);font-size:12px;font-weight:500;padding:6px 10px;border-radius:var(--r-md);
  opacity:0;transform:translateY(4px);transition:opacity var(--base) var(--ease-out),transform var(--base) var(--ease-out)}
.card.cur .zoom{opacity:1;transform:none}
.card-foot{display:flex;align-items:baseline;gap:var(--s3);padding:0 var(--s2) var(--s2)}
.card-foot small{font-family:var(--mono);font-size:12px;color:var(--text-2)}
.card h3{font-size:clamp(22px,2.6vw,36px);font-weight:700;letter-spacing:-.01em;line-height:1.1;color:var(--text)}
.card p{font-size:14px;color:var(--text-2);margin-left:auto;text-align:right;max-width:24ch}
.wctl{position:absolute;left:0;right:0;bottom:clamp(20px,5vh,44px);display:flex;justify-content:center;align-items:center;gap:var(--s4);z-index:3}
.wbtn{width:48px;height:48px;border-radius:var(--r-lg);background:var(--surface-light);display:grid;place-items:center;transition:background var(--fast) var(--ease)}
.wbtn:hover{background:var(--surface-lighter)}
.wbtn:disabled{opacity:.35;cursor:default}
.dots{display:flex;gap:6px}
.dots button{width:44px;height:44px;display:grid;place-items:center}
.dots button i{display:block;width:8px;height:8px;border-radius:999px;background:var(--surface-hover);transition:width var(--base) var(--ease-out),background var(--fast) var(--ease)}
.dots button[aria-current=true] i{width:28px;background:var(--primary)}
.wcount{font-family:var(--mono);font-size:13px;color:var(--text-2);min-width:56px;text-align:center}
.lb{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:clamp(12px,4vw,48px);background:#09090be6;opacity:0;pointer-events:none;transition:opacity var(--base) var(--ease)}
.lb.open{opacity:1;pointer-events:auto}
.lb-box{width:min(1280px,100%);background:var(--surface);border:1px solid var(--border);border-radius:var(--r-3xl);box-shadow:var(--sh-xl);padding:var(--s4);display:grid;gap:var(--s4);
  transform:scale(.97);transition:transform var(--slow) var(--ease-out)}
.lb.open .lb-box{transform:none}
.lb-img{aspect-ratio:16/9;border-radius:var(--r-xl);background-size:contain;background-repeat:no-repeat;background-position:center;background-color:var(--bg)}
.lb-foot{display:flex;align-items:center;gap:var(--s4);flex-wrap:wrap;padding:0 var(--s2) var(--s1)}
.lb-foot h3{font-size:22px;font-weight:700;letter-spacing:-.01em}
.lb-foot p{color:var(--text-2);font-size:14px}
.lb-foot .row{margin-left:auto}
.live-shot{position:relative;max-width:1200px;margin:clamp(36px,6vh,72px) auto 0;aspect-ratio:16/9;border-radius:var(--r-xl);background-size:100% 100%;box-shadow:0 0 0 1px var(--border),var(--sh-xl);overflow:hidden;will-change:transform}
.cursor{position:absolute;left:0;top:0;pointer-events:none;will-change:transform;z-index:5}
.cursor svg{width:20px;height:20px;display:block;filter:drop-shadow(0 1px 2px #000a)}
.cursor span{position:absolute;left:16px;top:18px;white-space:nowrap;font-size:12px;font-weight:600;line-height:1;color:var(--on-primary);padding:5px 8px;border-radius:999px 999px 999px 4px}
.cursor.flip span{left:auto;right:4px;border-radius:999px 999px 4px 999px}
.ink{position:absolute;inset:0;pointer-events:none;z-index:4;overflow:visible}
.ink path{fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;transition:opacity 600ms var(--ease)}
.ripple{position:absolute;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:2px solid;pointer-events:none;animation:rip 600ms var(--ease-out) forwards;z-index:4}
@keyframes rip{from{transform:scale(.2);opacity:1}to{transform:scale(1.3);opacity:0}}
.ref .h-l{max-width:14ch;margin-top:var(--s4)}
.ref .lede{margin-top:var(--s6);max-width:56ch}
.ref .btn{margin-top:var(--s8)}
.flow{position:relative;margin-top:clamp(48px,9vh,96px);display:grid;grid-template-columns:minmax(0,1.25fr) minmax(90px,.5fr) auto minmax(90px,.5fr) minmax(0,1.25fr);align-items:center;gap:var(--s4)}
.net{position:absolute;inset:-80px calc(-1 * var(--pad));width:calc(100% + 2 * var(--pad));height:calc(100% + 160px);pointer-events:none;opacity:.9}
.dev{position:relative;border-radius:var(--r-xl);background:var(--surface);border:1px solid var(--border);box-shadow:var(--sh-lg);overflow:hidden;will-change:transform,opacity}
.dev .bar{display:flex;align-items:center;gap:6px;height:40px;padding:0 var(--s4);border-bottom:1px solid var(--border-subtle);font-family:var(--mono);font-size:13px;color:var(--text)}
.dev .bar i{width:10px;height:10px;border-radius:50%;background:var(--surface-lighter)}
.dev .bar .ttl{margin-left:var(--s2);transition:opacity var(--base) var(--ease)}
.dev .bar .led{width:9px;height:9px;border-radius:50%;background:var(--primary);box-shadow:0 0 12px var(--primary);animation:led 2s var(--ease) infinite}
@keyframes led{50%{opacity:.45}}
.dev .bar b{font-weight:500;letter-spacing:.14em;color:var(--primary)}
.scr{position:relative;aspect-ratio:16/9;background:#000}
.rot{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transform:scale(1.03);transition:opacity 900ms var(--ease),transform 1600ms var(--ease-out)}
.rot.on{opacity:1;transform:none}
.mon .scr{margin:0}
.conn{display:grid;gap:var(--s3);justify-items:center;text-align:center}
.conn span{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--text);line-height:1.5;transition:opacity var(--slow) var(--ease)}
.conn svg{width:100%;height:14px;overflow:visible}
.conn .ln{stroke:var(--primary);stroke-opacity:.55;stroke-width:2;stroke-dasharray:110;stroke-dashoffset:110}
.conn polygon{fill:var(--primary);transition:opacity var(--base) var(--ease)}
.conn .pulse{fill:var(--primary);filter:drop-shadow(0 0 4px var(--primary));opacity:0}
.flow.live .conn .pulse{opacity:1;animation:pls 1.8s linear infinite}
.flow.live .conn:last-of-type .pulse{animation-delay:.9s}
@keyframes pls{from{transform:translateX(0)}to{transform:translateX(108px)}}
.hub{position:relative;width:clamp(96px,9vw,128px);aspect-ratio:1;display:grid;place-items:center;will-change:transform,opacity}
.hub-ring{position:absolute;inset:0;border-radius:50%;border:1px solid var(--primary-border);background:radial-gradient(circle,#84cc1614 0,#84cc1605 60%,transparent 70%);box-shadow:var(--glow);animation:breathe 3.2s var(--ease) infinite}
.hub-ring::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:1px solid #84cc1633;animation:halo 3.2s var(--ease-out) infinite}
@keyframes breathe{50%{box-shadow:0 0 60px #84cc1633}}
@keyframes halo{from{transform:scale(.9);opacity:.9}to{transform:scale(1.25);opacity:0}}
.hub svg{width:44%;height:44%;position:relative}
.nature{background:var(--bg);overflow:hidden}
.nat-bg{position:absolute;inset:0;pointer-events:none}
.nat-img{position:absolute;inset:-8% 0;background:var(--i-nature) center 60%/cover;opacity:.3;filter:saturate(.8);will-change:transform}
.nat-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(var(--bg) 0%,#09090b99 22%,#09090b40 55%,#09090b99 82%,var(--bg) 100%)}
.mist{position:absolute;width:70%;height:45%;border-radius:50%;background:radial-gradient(closest-side,#dfe8e21a,transparent);filter:blur(40px);animation:drift 38s ease-in-out infinite alternate}
.mist.m1{left:-10%;top:18%}.mist.m2{right:-15%;top:48%;animation-duration:52s;animation-direction:alternate-reverse}
@keyframes drift{to{transform:translateX(18%)}}
.rm .mist{animation:none}
.nature .wrap{position:relative;z-index:1}
.nature .eyebrow{color:#a7c4b0}
.nature .spot{background:#0d130f;border-color:#4ade8014}
.nature .stat{background:#0d130f;border-color:#4ade800f;transition:transform var(--base) var(--ease-out),border-color var(--fast) var(--ease),opacity var(--base) var(--ease)}
.nature .stat:hover{transform:translateY(-3px);border-color:#4ade8029}
.menu{position:relative}
.menu-btn{min-height:40px;display:flex;align-items:center;gap:6px;padding:0 var(--s3);border-radius:var(--r-lg);font-size:14px;font-weight:500;color:var(--text-2);transition:background var(--fast) var(--ease),color var(--fast) var(--ease)}
.menu-btn:hover,.menu.open .menu-btn{color:var(--text);background:var(--surface-light)}
.menu-btn.btn{color:var(--text)}
.menu-btn svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--base) var(--ease-out)}
.menu.open .menu-btn svg{transform:rotate(180deg)}
.menu-panel{position:absolute;left:0;top:calc(100% + 8px);min-width:260px;padding:var(--s2);border-radius:var(--r-xl);background:var(--surface-light);border:1px solid var(--border);box-shadow:var(--sh-lg);
  display:grid;gap:2px;opacity:0;transform:translateY(-6px) scale(.98);transform-origin:top left;pointer-events:none;transition:opacity var(--base) var(--ease),transform var(--base) var(--ease-out);z-index:5}
.menu-panel.right{left:auto;right:0;transform-origin:top right}
.menu.open .menu-panel{opacity:1;transform:none;pointer-events:auto}
.menu-panel a{display:flex;align-items:center;gap:var(--s3);min-height:44px;padding:0 var(--s3);border-radius:var(--r-lg);font-size:14px;font-weight:500;color:var(--text);text-decoration:none;transition:background var(--fast) var(--ease)}
.menu-panel a:hover{background:var(--surface-lighter)}
.menu-panel .dot{width:8px;height:8px;border-radius:50%;background:var(--primary)}
.dr-label{margin-top:var(--s6);font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
.dr-logins{display:grid;gap:var(--s2);margin-top:var(--s3)}
.drawer .dr-logins a{font-size:18px;font-weight:600;padding:var(--s3) var(--s4);border:1px solid var(--border);border-radius:var(--r-lg)}
.drawer{overflow-y:auto}
.drawer>a:not(.btn){font-size:clamp(28px,8vw,44px)}
.drawer .dr-sub{font-size:20px!important;font-weight:600;color:var(--text-2)}
.nav-links{display:grid}
.nav-links .grp{grid-area:1/1;display:flex;gap:var(--s1);opacity:0;visibility:hidden;transform:translateY(4px);transition:opacity var(--base) var(--ease),transform var(--slow) var(--ease-out),visibility 0s linear var(--base)}
.nav-links .grp.on{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.nav .btn,.nav .menu-btn,.nav-links a{white-space:nowrap}
.subnav{position:fixed;left:0;right:0;top:var(--navh);z-index:48;height:52px;display:none;align-items:center;padding:0 var(--pad);background:#09090bd9;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--border-subtle);transition:transform var(--slow) var(--ease-out)}
html.has-sub{--nav:116px}
html.has-sub .subnav{display:flex}
.nav.hide+.subnav{transform:translateY(calc(-1 * var(--navh)))}
.subnav .sgrp{display:none;align-items:center;gap:var(--s6);width:100%}
.subnav .sgrp.on{display:flex}
.subnav b{font-size:15px;font-weight:600;white-space:nowrap}
.subnav nav{display:flex;gap:2px;margin-left:auto}
.subnav nav a{min-height:36px;display:flex;align-items:center;padding:0 var(--s3);border-radius:var(--r-lg);font-size:13px;font-weight:500;color:var(--text-2);text-decoration:none;white-space:nowrap;transition:background var(--fast) var(--ease),color var(--fast) var(--ease)}
.subnav nav a:hover{color:var(--text)}
.subnav nav a[aria-current]{color:var(--text);background:var(--surface-light)}
:root.has-sub .nav{border-bottom-color:transparent}
:root.has-sub .nav-links .ind{height:calc(var(--navh) - 12px);border-radius:var(--r-lg) var(--r-lg) 0 0;background:var(--surface);transition:transform var(--slow) var(--ease-out),width var(--slow) var(--ease-out),height var(--base) var(--ease),border-radius var(--base) var(--ease)}
:root .subnav{background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom-color:var(--border-subtle)}
:root .subnav .sgrp{gap:var(--s4);animation:none}
:root .subnav nav{position:relative;margin-left:0}
:root .subnav nav a{position:relative;z-index:1;background:transparent}
:root .subnav .btn{margin-left:auto}
.sind{position:absolute;left:0;top:50%;height:34px;margin-top:-17px;border-radius:var(--r-lg);background:var(--surface-light);opacity:0;transition:transform var(--slow) var(--ease-out),width var(--slow) var(--ease-out),opacity var(--base) var(--ease)}
.plock{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);flex:none}
.pmark{position:relative;width:28px;height:28px;border-radius:7px;background:var(--surface-light);box-shadow:inset 0 0 0 1px var(--border);transition:box-shadow var(--base) var(--ease)}
.plock:hover .pmark{box-shadow:inset 0 0 0 1px var(--pa)}
.pmark i{position:absolute;left:22%;height:12.5%;border-radius:1.5px;background:linear-gradient(90deg,var(--pa),var(--pb));transform-origin:0 50%}
.pmark i:nth-child(1){top:25%;width:56%}.pmark i:nth-child(2){top:43.75%;width:56%}.pmark i:nth-child(3){top:62.5%;width:22%}
.pnm{display:grid;overflow:hidden;line-height:1.1}
.pnm b{font-size:15px;font-weight:650;letter-spacing:-.01em;white-space:nowrap;background:linear-gradient(90deg,var(--text) 50%,var(--pb));-webkit-background-clip:text;background-clip:text;color:transparent}
.sprog{position:absolute;left:0;right:0;bottom:-1px;height:1.5px;background:linear-gradient(90deg,var(--pa),var(--pb));transform-origin:0 50%;transform:scaleX(var(--p,0));opacity:.85;pointer-events:none}
:root .sgrp.on .pmark i{animation:barin 700ms var(--ease-spring) both}
:root .sgrp.on .pmark i:nth-child(2){animation-delay:70ms}:root .sgrp.on .pmark i:nth-child(3){animation-delay:140ms}
:root .sgrp.on .pnm b{animation:nmin 600ms var(--ease-out) both}
:root .sgrp.on .pnm b{animation-delay:80ms}
:root .sgrp.on nav a{animation:lkin 500ms var(--ease-out) both;animation-delay:calc(160ms + var(--i) * 40ms)}
@keyframes barin{from{transform:scaleX(0)}}
@keyframes nmin{from{transform:translateY(110%);opacity:0}}
@keyframes lkin{from{opacity:0;transform:translateY(6px)}}
.tmark{position:relative;flex:none;width:14px;height:12px;margin-right:8px}
.tmark i{position:absolute;left:0;height:2.5px;border-radius:1px;background:var(--text-2);opacity:.55;transform-origin:0 50%;transition:opacity var(--base) var(--ease)}
.tmark i:nth-child(1){top:0;width:14px}.tmark i:nth-child(2){top:4.5px;width:14px}.tmark i:nth-child(3){top:9px;width:5.5px}
.nav-links a[aria-current] .tmark i{background:linear-gradient(90deg,var(--pa),var(--pb));opacity:1;animation:barin 600ms var(--ease-spring) both}
.nav-links a[aria-current] .tmark i:nth-child(2){animation-delay:60ms}.nav-links a[aria-current] .tmark i:nth-child(3){animation-delay:120ms}
:root .srow{position:relative;display:flex;align-items:center;gap:var(--s3);transform:translateX(var(--sx,0px));transition:transform 520ms var(--ease-out)}
:root .plock{opacity:0;transform:translateX(-10px);pointer-events:none;transition:opacity var(--base) var(--ease),transform var(--slow) var(--ease-out)}
:root .pmark{width:24px;height:24px;border-radius:6px}
:root .pnm b{font-size:14px}
:root .nav.hide+.subnav .srow{transform:none}
:root .nav.hide+.subnav .plock{opacity:1;transform:none;pointer-events:auto}
.rm .nav-links a[aria-current] .tmark i{animation:none}
@media (max-width:1040px){:root .srow{transform:none;min-width:0}:root .plock{opacity:1;transform:none;pointer-events:auto}}
@media (max-width:1040px){:root .subnav nav{-webkit-mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 28px),transparent)}}
.rm :root .sgrp.on .pmark i,.rm :root .sgrp.on .pnm b,.rm :root .sgrp.on nav a{animation:none}
@media (max-width:1180px){.nav{gap:var(--s4)}}
@media (max-width:1040px){.nav .nav-links{display:none}.subnav .btn{display:none}.subnav .sgrp{gap:var(--s3)}.subnav nav{margin-left:0;overflow-x:auto;scrollbar-width:none}.subnav nav::-webkit-scrollbar{display:none}}
@media (max-width:560px){.subnav b{font-size:13px}}
.foot-brand p{margin-top:var(--s3);font-size:14px;color:var(--text-2);max-width:30ch}
.foot-brand .made{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;max-width:none;white-space:nowrap}
.social{display:flex;gap:var(--s2);margin-top:var(--s4)}
.foot .social a{width:40px;height:40px;display:grid;place-items:center;border-radius:var(--r-lg);background:var(--surface-light);padding:0;transition:background var(--fast) var(--ease)}
.foot .social a:hover{background:var(--surface-lighter)}
.foot .strip a:hover{background:var(--surface-lighter);color:var(--text)}
.social svg{width:18px;height:18px}
.totop{margin-top:var(--s4);display:inline-flex;align-items:center;gap:var(--s2);min-height:40px;padding:0 var(--s3);border-radius:var(--r-lg);background:var(--surface-light);font-size:13px;color:var(--text)}
.totop svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.strip{max-width:1320px;margin:var(--s10) auto 0;padding-top:var(--s6);border-top:1px solid var(--border-subtle);display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center}
.foot .strip a,.foot .strip .chip{display:inline-flex;align-items:center;min-height:32px;padding:0 var(--s3);border-radius:999px;background:var(--surface-light);border:1px solid var(--border-subtle);font-size:12px;color:var(--text);text-decoration:none}
.strip .built{margin-left:auto;display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;font-size:12px;color:var(--text-2)}
.strip .built b{font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--text)}
.strip .built i{font-style:normal;padding:2px var(--s2);border-radius:var(--r-sm);background:var(--surface-light);color:var(--text)}
.paths{display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);margin-top:clamp(28px,5vh,56px)}
.path{border-radius:var(--r-3xl);padding:clamp(24px,3vw,40px);background:var(--surface);border:1px solid var(--border);display:grid;gap:var(--s4);align-content:start}
.path.hl{border-color:var(--primary-border);box-shadow:var(--glow)}
.path h3{font-size:clamp(24px,2.6vw,36px);font-weight:700;letter-spacing:-.01em;line-height:1.1;color:var(--text)}
.path ul{list-style:none;display:grid;gap:var(--s3)}
.path li{padding-left:24px;position:relative;color:var(--text-2)}
.path li::before{content:"";position:absolute;left:2px;top:.5em;width:11px;height:6px;border-left:2px solid var(--primary);border-bottom:2px solid var(--primary);transform:rotate(-45deg)}
.path a.go{font-weight:600;color:var(--primary);text-decoration:none;font-size:15px}
.h-l .accent{color:var(--text-2)}
.h-l.cmp{font-size:clamp(36px,4.4vw,76px)}
.sub-hero>*{min-width:0}
.m-vs{display:grid;gap:var(--s3);justify-items:center;width:min(100%,340px);padding:var(--s6);border-radius:var(--r-3xl);background:var(--surface);border:1px solid var(--border);box-shadow:var(--sh-xl)}
.m-vs>div{width:100%;display:grid;gap:6px;justify-items:center;padding:var(--s5);border-radius:var(--r-2xl);background:var(--surface-light);text-align:center}
.m-vs .vs-us{box-shadow:inset 0 0 0 1px var(--primary-border)}
.m-vs svg{width:36px;height:36px}
.m-vs b{font-size:18px;font-weight:650;color:var(--text)}.m-vs small{font-size:12px;color:var(--text-2)}
.m-vs i{font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-2);font-style:normal}
.cmp-tbl{margin-top:clamp(28px,5vh,48px);border:1px solid var(--border);border-radius:var(--r-2xl)}
.cmp-tbl table{width:100%;min-width:640px;border-collapse:collapse;font-size:14px;line-height:1.5}
.cmp-tbl th,.cmp-tbl td{text-align:left;vertical-align:top;padding:14px 18px;border-bottom:1px solid var(--border-subtle)}
.cmp-tbl tr:last-child td{border-bottom:0}
.cmp-tbl th{font-weight:600;color:var(--text)}
.cmp-tbl td:first-child{width:28%;color:var(--text-2)}
.cmp-tbl .us{background:var(--surface-light);color:var(--text)}
.cmp-tbl td.no{color:var(--text-2)}
.cmp-tbl tbody tr{opacity:0;transform:translateY(6px);transition:opacity var(--slow) var(--ease-out),transform var(--slow) var(--ease-out);transition-delay:calc(var(--r) * var(--stag))}
.cmp-tbl.in tbody tr{opacity:1;transform:none}
.rm .cmp-tbl tbody tr{opacity:1;transform:none;transition:none}
.steps{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);margin-top:clamp(28px,5vh,56px)}
.steps::before{content:"";position:absolute;left:8%;right:8%;top:34px;height:2px;background:var(--surface-lighter)}
.steps .fill{position:absolute;left:8%;top:34px;height:2px;width:84%;background:var(--primary);box-shadow:var(--glow);transform-origin:0 50%;transform:scaleX(0)}
.step{position:relative;border-radius:var(--r-3xl);padding:var(--s6);background:var(--surface);border:1px solid var(--border-subtle);display:grid;gap:var(--s3);align-content:start}
.step .num{justify-self:start;font-family:var(--mono);font-size:12px;letter-spacing:.08em;padding:6px 10px;border-radius:999px;background:var(--bg);border:1px solid var(--border);color:var(--text);transition:border-color var(--base) var(--ease),color var(--base) var(--ease),box-shadow var(--base) var(--ease)}
.step.lit .num{border-color:var(--primary-border);color:var(--primary);box-shadow:var(--glow)}
.step h3{font-size:22px;font-weight:700;letter-spacing:-.01em;color:var(--text)}
.step p{color:var(--text-2);font-size:15px}
.step a{font-size:14px;font-weight:600;color:var(--primary);text-decoration:none}
.label-stage{perspective:1000px;display:grid;place-items:center;min-height:360px}
.label{position:relative;width:min(420px,86vw);border-radius:var(--r-3xl);background:#fff;padding:36px 36px 22px;box-shadow:var(--sh-xl),0 0 80px #84cc1614;transform-style:preserve-3d;will-change:transform;overflow:hidden}
.label .wm{position:relative;aspect-ratio:452/164}
.label .wm i{position:absolute;inset:0;background-size:100% 100%;background-repeat:no-repeat}
.label .letters{background-image:var(--i-tisax-letters)}
.label .dot{background-image:var(--i-tisax-dot);animation:dotland 1.2s var(--ease-spring) .3s both}
@keyframes dotland{0%{transform:translateY(-90%);opacity:0}60%{opacity:1}100%{transform:none;opacity:1}}
.label .ring{position:absolute;width:34px;height:34px;border-radius:50%;border:2px solid #f39200;left:var(--dx,21%);top:var(--dy,4%);transform:translate(-50%,-50%) scale(.4);opacity:0;animation:ring 3.6s var(--ease-out) 1.6s infinite}
@keyframes ring{0%{transform:translate(-50%,-50%) scale(.4);opacity:.9}60%{opacity:0;transform:translate(-50%,-50%) scale(2.2)}100%{opacity:0}}
.label .shine{position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,#ffffff99 50%,transparent 60%);transform:translateX(-120%);animation:shine 6s var(--ease) 2s infinite}
@keyframes shine{0%,70%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.label footer{display:flex;justify-content:space-between;gap:var(--s3);margin-top:18px;padding-top:14px;border-top:1px solid #0000001a;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#3f3f47}
.label footer b{color:#004e91;font-weight:500}
.rm .label .dot,.rm .label .ring,.rm .label .shine{animation:none}.rm .label .ring,.rm .label .shine{display:none}
.topo{position:relative;margin-top:clamp(40px,7vh,80px);aspect-ratio:1200/520}
.topo>svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.topo path{fill:none;stroke-width:2;stroke-linecap:round}
.topo path.base{stroke:var(--surface-lighter)}
.topo path.lit{stroke:var(--primary);filter:drop-shadow(0 0 4px #84cc1680);transition:opacity var(--slow) var(--ease)}
.topo path.lit.off{opacity:.12}
.topo circle{fill:var(--primary)}
.tn{position:absolute;display:flex;align-items:center;gap:var(--s3);padding:var(--s3) var(--s4) var(--s3) var(--s3);border-radius:var(--r-2xl);background:var(--surface);border:1px solid var(--border);box-shadow:var(--sh-md);
  transform:translate(-50%,-50%);width:max-content;white-space:nowrap;transition:border-color var(--slow) var(--ease),opacity var(--slow) var(--ease),box-shadow var(--slow) var(--ease)}
.tn .ic{width:40px;height:40px;border-radius:var(--r-lg);background:var(--surface-light);display:grid;place-items:center;flex:none}
.tn .ic svg{width:20px;height:20px;fill:none;stroke:var(--text);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.tn b{display:block;font-size:15px;font-weight:600;color:var(--text)}
.tn small{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;color:var(--text-2)}
.tn.on{border-color:var(--primary-border);box-shadow:var(--sh-md),var(--glow)}
.tn.on .ic svg{stroke:var(--primary)}.tn.on small{color:var(--primary)}
.tn.dim{opacity:.45}
.tn.core{padding:var(--s4) var(--s5) var(--s4) var(--s4);border-color:var(--primary-border);box-shadow:var(--sh-lg),0 0 60px #84cc1626}
.tn.core .ic{width:52px;height:52px;border-radius:50%;background:var(--bg);border:1px solid var(--primary-border)}
.tn.core .ic svg{width:26px;height:26px;stroke:none}
.tn.core small{color:var(--primary)}
.t-or{position:absolute;transform:translate(-50%,-50%);font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-2);background:var(--surface);padding:4px 10px;border-radius:999px;border:1px solid var(--border-subtle)}
.t-link{position:absolute;transform:translate(-50%,-50%);font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--primary);background:var(--surface);padding:4px 10px;border-radius:999px;border:1px solid var(--primary-border)}
.photo{aspect-ratio:1023/1537;max-height:560px;justify-self:end;width:min(100%,420px);border-radius:var(--r-3xl);background:var(--i-about-stefan) center/cover;box-shadow:var(--sh-xl)}
.person{display:grid;grid-template-columns:auto 1fr;gap:var(--s5);align-items:center;margin-top:var(--s8);padding:var(--s6);border-radius:var(--r-3xl);background:var(--surface);border:1px solid var(--border-subtle)}
.person .av{width:72px;height:72px;border-radius:50%;background:var(--i-about-stefan) center 20%/cover}
.person b{font-size:18px;color:var(--text)}.person small{display:block;font-size:13px;color:var(--primary);margin:2px 0 8px}.person p{font-size:14px;color:var(--text-2)}
.prose{max-width:62ch;margin-top:var(--s6);display:grid;gap:var(--s4);color:var(--text-2);font-size:17px}
.prose a{color:var(--text)}.prose strong{color:var(--text);font-weight:600}
.layers{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);margin-top:clamp(28px,5vh,56px)}
.layer{border-radius:var(--r-3xl);padding:var(--s6);background:var(--surface);border:1px solid var(--border-subtle);display:grid;gap:var(--s3);align-content:start}
.layer small{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--text-2)}
.layer h3{font-size:24px;font-weight:700;letter-spacing:-.01em;color:var(--text)}
.layer p{color:var(--text-2);font-size:15px}
.layer em{justify-self:start;font-style:normal;font-size:11px;font-weight:500;padding:4px 10px;border-radius:999px;background:var(--primary-bg);border:1px solid var(--primary-border);color:var(--primary)}
.ticker{margin-top:var(--s6);overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.ticker div{display:flex;gap:var(--s2);width:max-content;animation:tick 28s linear infinite}
.ticker span{display:inline-flex;align-items:center;gap:var(--s2);min-height:36px;padding:0 var(--s3);border-radius:999px;background:var(--surface-light);font-family:var(--mono);font-size:12px;color:var(--text);white-space:nowrap}
.ticker span::before{content:"✓";color:var(--success)}
@keyframes tick{to{transform:translateX(-50%)}}
.doc{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(32px,5vw,72px);max-width:1180px;margin:0 auto}
.toc{position:sticky;top:96px;align-self:start;display:grid;gap:2px;max-height:calc(100vh - 120px);overflow:auto}
.toc p{font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--text-2);margin:0 0 var(--s2) var(--s3)}
.toc a{position:relative;z-index:1;font-size:13px;line-height:1.35;color:var(--text-2);text-decoration:none;padding:7px var(--s3);border-radius:var(--r-md);transition:color var(--base) var(--ease)}
.toc a:hover{color:var(--text)}
.toc a.on{color:var(--text)}
.toc .tind{position:absolute;left:0;top:0;width:0;height:0;border-radius:var(--r-md);background:var(--surface-light);pointer-events:none;opacity:0;
  transition:transform var(--slow) var(--ease-out),width var(--slow) var(--ease-out),height var(--slow) var(--ease-out),opacity var(--base) var(--ease)}
.ldoc{min-width:0;color:var(--text-2);font-size:16px;line-height:1.7;overflow-wrap:anywhere}
.ldoc>*:first-child{margin-top:0}
.ldoc h2{font-size:clamp(22px,2vw,26px);font-weight:600;line-height:1.3;letter-spacing:-.01em;color:var(--text);margin:56px 0 14px;scroll-margin-top:96px;padding-top:24px;border-top:1px solid var(--border-subtle)}
.ldoc h2:first-child{border-top:0;padding-top:0}
.ldoc h3{font-size:18px;font-weight:600;color:var(--text);margin:28px 0 8px}
.ldoc h4{font-size:15px;font-weight:600;color:var(--text);margin:20px 0 6px}
.ldoc p{margin:0 0 14px}.ldoc ul,.ldoc ol{margin:0 0 16px;padding-left:22px;display:grid;gap:6px}
.ldoc li::marker{color:var(--text-2)}
.ldoc a{color:var(--primary);text-underline-offset:3px}
.ldoc strong,.ldoc b{color:var(--text);font-weight:600}
.ldoc address{font-style:normal}
.ldoc table{width:100%;border-collapse:separate;border-spacing:0;margin:16px 0 24px;font-size:14px;line-height:1.5;border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden}
.ldoc th,.ldoc td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid var(--border-subtle)}
.ldoc th{background:var(--surface-light);color:var(--text);font-weight:600}
.ldoc tr:last-child td{border-bottom:0}
.ldoc td:first-child{color:var(--text)}
.tbl{overflow-x:auto}
.ldoc dl{display:grid;grid-template-columns:180px 1fr;gap:10px var(--s6);padding:var(--s6);margin:8px 0 24px;border-radius:var(--r-2xl);background:var(--surface);border:1px solid var(--border-subtle)}
.ldoc dt{font-size:13px;font-weight:500;color:var(--text-2)}.ldoc dd{color:var(--text)}
.doc-note{margin-bottom:32px;padding:var(--s4) var(--s5);border-radius:var(--r-xl);background:var(--surface-light);border:1px solid var(--border);font-size:14px;color:var(--text-2)}
.motif{display:grid;place-items:center;min-height:320px;perspective:1000px}
.motif>*{transform-style:preserve-3d;will-change:transform}
.m-card{width:min(400px,86vw);aspect-ratio:1.75;border-radius:var(--r-2xl);padding:28px;background:linear-gradient(145deg,var(--surface-light),var(--surface));border:1px solid var(--border);box-shadow:var(--sh-xl);display:flex;flex-direction:column;justify-content:space-between}
.m-card .top{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--text)}.m-card svg{width:28px;height:28px}
.m-card p{font-family:var(--mono);font-size:12px;line-height:1.7;color:var(--text-2)}.m-card p b{color:var(--text);font-weight:500}
.m-docs{position:relative;width:260px;height:320px}
.m-docs i{position:absolute;inset:0;border-radius:var(--r-xl);background:var(--surface-light);border:1px solid var(--border);box-shadow:var(--sh-lg);padding:26px 22px;display:grid;align-content:start;gap:10px;animation:fan 900ms var(--ease-out) both}
.m-docs i::before{content:"";height:10px;width:60%;border-radius:4px;background:var(--surface-hover)}
.m-docs i::after{content:"";height:60%;border-radius:4px;background:repeating-linear-gradient(var(--surface-lighter) 0 6px,transparent 6px 16px)}
.m-docs i:nth-child(1){--r:-10deg;--x:-34px}.m-docs i:nth-child(2){--r:-3deg;--x:-12px;animation-delay:80ms}.m-docs i:nth-child(3){--r:5deg;--x:14px;animation-delay:160ms;background:var(--surface-lighter)}
@keyframes fan{from{transform:none;opacity:0}to{transform:translateX(var(--x)) rotate(var(--r));opacity:1}}
.m-docs b{position:absolute;right:-18px;bottom:36px;transform:rotate(-8deg);font-size:12px;font-weight:600;letter-spacing:.06em;color:var(--primary);border:1.5px solid var(--primary);padding:6px 10px;border-radius:var(--r-md);background:var(--bg);animation:stamp 500ms var(--ease-spring) 700ms both}
@keyframes stamp{from{transform:rotate(-8deg) scale(1.8);opacity:0}}
.m-sheet{width:280px;height:340px;border-radius:var(--r-xl);background:var(--surface-light);border:1px solid var(--border);box-shadow:var(--sh-xl);padding:28px;display:flex;flex-direction:column;gap:10px}
.m-sheet i{height:8px;border-radius:4px;background:var(--surface-lighter)}.m-sheet i:nth-child(3n){width:70%}
.m-sheet svg{margin-top:auto;width:100%;height:70px;overflow:visible}
.m-sheet path{fill:none;stroke:var(--primary);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.8s var(--ease-out) .4s forwards}
.m-sheet small{font-family:var(--mono);font-size:11px;color:var(--text-2);border-top:1px solid var(--border);padding-top:8px}
@keyframes draw{to{stroke-dashoffset:0}}
.m-svg svg{width:min(260px,70vw);height:auto;overflow:visible}
.m-svg .ln{fill:none;stroke:var(--primary);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.6s var(--ease-out) .2s forwards}
.m-svg .fill{fill:var(--surface-light);stroke:var(--border-hover);stroke-width:1.5}
.m-eu{position:relative;width:280px;height:280px;display:grid;place-items:center}
.m-eu .ring{position:absolute;inset:14%;border-radius:50%;animation:spin 40s linear infinite}
.m-eu .ring span{position:absolute;left:50%;top:50%;width:18px;height:18px;margin:-9px;color:var(--primary);font-size:18px;line-height:18px;text-align:center}
.m-eu b{font-size:44px;font-weight:700;color:var(--text);letter-spacing:-.01em}.m-eu small{display:block;font-size:12px;color:var(--text-2);text-align:center;letter-spacing:.08em;text-transform:uppercase}
@keyframes spin{to{transform:rotate(360deg)}}
.m-rack{width:280px;display:grid;gap:8px;padding:14px;border-radius:var(--r-2xl);background:var(--surface);border:1px solid var(--border);box-shadow:var(--sh-xl)}
.m-rack div{height:44px;border-radius:var(--r-md);background:linear-gradient(var(--surface-light),var(--surface-lighter));border:1px solid var(--border);display:flex;align-items:center;gap:8px;padding:0 12px}
.m-rack div i{width:6px;height:6px;border-radius:50%;background:var(--surface-hover)}
.m-rack div i.l{background:var(--primary);box-shadow:0 0 8px var(--primary);animation:blink 1.4s steps(2) infinite}
.m-rack div:nth-child(2) i.l{animation-delay:.3s}.m-rack div:nth-child(3) i.l{animation-delay:.7s}.m-rack div:nth-child(4) i.l{animation-delay:1.1s}
.m-rack div span{margin-left:auto;height:6px;width:40%;border-radius:3px;background:repeating-linear-gradient(90deg,var(--surface-hover) 0 4px,transparent 4px 7px)}
.m-rack small{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--primary);text-align:center;padding-top:4px}
@keyframes blink{50%{opacity:.25}}
.rm .m-docs i,.rm .m-docs b,.rm .m-sheet path,.rm .m-svg .ln,.rm .m-eu .ring,.rm .m-rack i.l{animation:none!important;stroke-dashoffset:0;opacity:1}
.rm .m-docs i:nth-child(1){transform:translateX(-34px) rotate(-10deg)}.rm .m-docs i:nth-child(2){transform:translateX(-12px) rotate(-3deg)}.rm .m-docs i:nth-child(3){transform:translateX(14px) rotate(5deg)}
.btn:active{transform:scale(.97)}
.wbtn,.dots button,.faq summary{-webkit-tap-highlight-color:transparent}
.wbtn:active{transform:scale(.94)}
.nav-links{position:relative}
.nav-links .ind{position:absolute;left:0;top:0;height:40px;border-radius:var(--r-lg);background:var(--surface-light);transition:transform var(--slow) var(--ease-out),width var(--slow) var(--ease-out),opacity var(--base) var(--ease);pointer-events:none}
.nav-links a{position:relative;z-index:1}
.nav-links a[aria-current]{background:transparent}
.drawer a{opacity:0;transform:translateY(10px);transition:opacity var(--base) var(--ease-out),transform var(--slow) var(--ease-out)}
.drawer.open a{opacity:1;transform:none}
.drawer.open a:nth-child(2){transition-delay:40ms}.drawer.open a:nth-child(3){transition-delay:80ms}.drawer.open a:nth-child(4){transition-delay:120ms}.drawer.open a:nth-child(5){transition-delay:160ms}
.faq details{overflow:hidden}
.lb-img{transition:opacity 180ms var(--ease)}
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);margin-top:clamp(36px,6vh,64px);align-items:start}
.plan{border-radius:var(--r-3xl);padding:var(--s6);display:flex;flex-direction:column;gap:var(--s5);background:var(--surface);border:1px solid var(--border)}
.sec.alt .plan{background:var(--surface-light)}
.plan.feat{border-color:var(--primary-border);box-shadow:var(--glow)}
.plan-name{font-size:12px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
.plan-price{font-size:clamp(44px,4.6vw,64px);font-weight:700;line-height:1;letter-spacing:-.01em;color:var(--text)}
.plan-price small{font-size:14px;font-weight:400;letter-spacing:0;margin-left:6px;color:var(--text-2)}
.plan-extra{margin-top:-10px;font-size:14px;color:var(--text-2)}
.plan-desc{font-size:15px;color:var(--text)}
.fg{display:grid;gap:var(--s2)}
.fg h4{font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
.fg ul{list-style:none;display:grid;gap:6px}
.fg li{font-size:14px;line-height:1.5;padding-left:22px;position:relative}
.fg li::before{content:"";position:absolute;left:2px;top:.45em;width:11px;height:6px;border-left:2px solid var(--primary);border-bottom:2px solid var(--primary);transform:rotate(-45deg)}
.payg{border-radius:var(--r-xl);background:var(--surface-light);padding:var(--s4);display:grid;gap:var(--s2)}
.sec.alt .payg{background:var(--surface-lighter)}
.payg b{font-size:14px;font-weight:600}
.payg p{font-size:13px;color:var(--text-2)}
.payg div{display:flex;justify-content:space-between;gap:var(--s3);font-size:13px}
.note{margin-top:var(--s5);font-size:14px;color:var(--text-2)}
.note a{color:var(--text)}
.spot{margin-top:clamp(36px,6vh,64px);border-radius:var(--r-3xl);background:var(--surface-light);border:1px solid var(--border-subtle);padding:clamp(24px,4vw,56px);display:grid;gap:var(--s6)}
.spot h3{font-size:clamp(30px,4vw,56px);font-weight:700;line-height:1.05;letter-spacing:-.01em;max-width:18ch;color:var(--text)}
.spot p{color:var(--text-2);max-width:56ch}
.sb{display:grid;grid-template-columns:1.3fr 1fr;gap:var(--s4);align-items:stretch}
.sb-bars{display:grid;gap:18px;align-content:center}
.sb-row{display:grid;grid-template-columns:150px 1fr;align-items:center;gap:var(--s4)}
.sb-row small{font:500 12px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-2)}
.sb-track{height:44px;border-radius:12px;background:#0a0e0b;border:1px solid #4ade800f;position:relative;overflow:hidden}
.sb-fill{position:absolute;inset:0 auto 0 0;width:100%;border-radius:11px;background:#d4d4db22;display:flex;align-items:center;padding:0 14px;font:600 13px/1 var(--mono);white-space:nowrap;color:var(--text);transition:width 1400ms var(--ease-out) 1000ms,background 600ms var(--ease) 1000ms}
.spot.play .sb-fill{width:9.5%;background:var(--primary)}
.sb-before{transition:opacity 300ms var(--ease) 900ms}
.spot.play .sb-before{opacity:0}
.sb-after{position:absolute;left:calc(100% + 14px);color:var(--primary);opacity:0;transition:opacity 400ms var(--ease) 2300ms}
.spot.play .sb-after{opacity:1}
.sb-co2{font-size:clamp(36px,4.6vw,72px);font-weight:700;line-height:1;letter-spacing:-.01em;font-variant-numeric:tabular-nums;color:var(--text)}
.sb-saved{border-radius:var(--r-2xl);background:#0a0e0b;border:1px solid #4ade800f;padding:var(--s6);display:grid;align-content:space-between;gap:var(--s3)}
.sb-saved b{font-size:clamp(48px,6.4vw,104px);font-weight:700;line-height:1;letter-spacing:-.01em;font-variant-numeric:tabular-nums;color:var(--primary)}
.rm .sb-fill,.rm .sb-before,.rm .sb-after{transition:none}
.src{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5);font-size:12.5px}
.src a{color:var(--text-2)}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);margin-top:var(--s5)}
.stat{background:var(--surface);border:1px solid var(--border-subtle);border-radius:var(--r-2xl);padding:var(--s6);display:grid;gap:var(--s2);align-content:start}
.stat b{font-size:clamp(34px,3.6vw,52px);font-weight:700;line-height:1;letter-spacing:-.01em;color:var(--text)}
.stat h4{font-size:15px;font-weight:600;color:var(--text)}
.stat p{font-size:14px;color:var(--text-2)}
.stat a{font-size:12.5px;color:var(--text-2)}
.faq-list{margin-top:clamp(28px,5vh,56px);border-top:1px solid var(--border);max-width:980px}
.faq details{border-bottom:1px solid var(--border)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:var(--s5);align-items:center;padding:var(--s5) 0;font-size:clamp(17px,1.6vw,22px);font-weight:600;letter-spacing:-.01em;min-height:44px;color:var(--text)}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:none;width:28px;height:28px;border-radius:var(--r-md);background:var(--surface-light);position:relative;transition:transform var(--base) var(--ease-out),background var(--fast) var(--ease)}
.faq summary:hover i{background:var(--surface-lighter)}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:8px;top:13px;width:12px;height:2px;background:var(--text)}
.faq summary i::after{transform:rotate(90deg)}
.faq details[open] summary i{transform:rotate(45deg)}
.faq details p{padding:0 0 var(--s5);max-width:70ch;color:var(--text-2)}
.cta{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--s8);align-items:center}
.cta .lede{margin-top:var(--s5)}
.cta .row{margin-top:var(--s8)}
.logo3d{height:clamp(240px,32vw,440px);perspective:1100px;display:grid;place-items:center}
.lg{position:relative;width:0;height:0;transform-style:preserve-3d;will-change:transform}
.lg .bx>i{background:linear-gradient(90deg,#d8c8ff,#b6d8ff 25%,#c8f5d8 50%,#ffe9b8 75%,#f5c8d8)}
.lg .bx-top{filter:brightness(1.05)}.lg .bx-left,.lg .bx-right{filter:brightness(.7)}
.foot{background:var(--surface);border-top:1px solid var(--border-subtle);padding:var(--s12) var(--pad) var(--s10)}
.foot-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:var(--s8);max-width:1320px;margin:0 auto}
.foot h4{font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--text-2);margin-bottom:var(--s3)}
.foot a{display:block;text-decoration:none;font-size:14px;padding:6px 0;color:var(--text-2)}
.foot a:hover{color:var(--text)}
.foot .brand{display:flex;align-items:center;gap:var(--s3);padding:0;font-size:18px;font-weight:700;color:var(--text)}
.foot .brand+p{margin-top:var(--s5)}
.foot small{display:block;max-width:1320px;margin:var(--s10) auto 0;font-size:12px;color:var(--text-2)}
.bx{position:absolute;left:0;top:0;transform-style:preserve-3d}
.bx>i{position:absolute;left:0;top:0;display:block;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.bx-front{transform-origin:50% 100%;transform:rotateX(-90deg)}
.bx-right{transform-origin:100% 50%;transform:rotateY(90deg)}
.bx-left{transform-origin:0 50%;transform:rotateY(-90deg)}
.sub-hero{padding:calc(var(--nav) + clamp(48px,10vh,120px)) var(--pad) clamp(56px,9vh,110px);display:grid;grid-template-columns:1.15fr .85fr;gap:var(--s8);align-items:center;border-bottom:1px solid var(--border-subtle)}
.sub-hero .lede{margin-top:var(--s5)}
.sub-hero .row{margin-top:var(--s8)}
.chips{display:flex;flex-wrap:wrap;gap:var(--s2);margin-top:var(--s6)}
.chips span{min-height:32px;display:inline-flex;align-items:center;padding:0 var(--s3);border-radius:999px;background:var(--surface-light);border:1px solid var(--border-subtle);font-size:13px;color:var(--text)}
.small-note{margin-top:var(--s3);font-size:13px;color:var(--text-2)}
.pipe{height:clamp(300px,34vw,460px);perspective:1200px;display:grid;place-items:center;overflow:hidden}
.pfloor{position:relative;width:0;height:0;transform-style:preserve-3d;will-change:transform}
.pgrid{position:absolute;transform:translateZ(-1px);background:repeating-linear-gradient(0deg,#ffffff0a 0 1px,transparent 1px 28px),repeating-linear-gradient(90deg,#ffffff0a 0 1px,transparent 1px 28px);
  -webkit-mask:radial-gradient(closest-side,#000 30%,transparent 100%);mask:radial-gradient(closest-side,#000 30%,transparent 100%)}
.phalo{position:absolute;border-radius:50%;background:radial-gradient(closest-side,#84cc1640,#84cc1612 55%,transparent 72%);animation:halo2 3.2s var(--ease) infinite}
@keyframes halo2{50%{transform:scale(1.18);opacity:.7}}
.pfloor .bx>i{box-shadow:inset 0 0 0 1px #ffffff10}
.n-enc .bx-top{background:linear-gradient(135deg,#2e2e36,#1f1f25)!important}
.n-enc .bx-front{background:linear-gradient(#232329,#18181d)!important;display:flex!important;align-items:center;justify-content:space-between;padding:0 10%}
.n-enc .bx-left,.n-enc .bx-right{background:#141418!important}
.n-enc .disp{position:absolute;left:10%;top:22%;right:10%;height:34%;border-radius:4px;background:#0b0f0b;border:1px solid #84cc1633;display:flex;align-items:center;gap:5px;padding:0 6px;white-space:nowrap;overflow:hidden;font:500 8px/1 var(--mono);letter-spacing:.06em;color:var(--primary)}
.n-enc .disp em{width:6px;height:6px;border-radius:50%;background:#f87171;animation:blink 1.2s steps(2) infinite}
.pfloor .leds{display:flex;gap:4px}.pfloor .leds i{width:5px;height:5px;border-radius:50%;background:var(--surface-hover)}
.pfloor .leds i:nth-child(odd){background:var(--primary);box-shadow:0 0 6px var(--primary);animation:blink 1.6s steps(2) infinite}
.pfloor .leds i:nth-child(3){animation-delay:.5s}.pfloor .leds i:nth-child(5){animation-delay:.9s}
.n-enc .ports{display:flex;gap:5px}.n-enc .ports i{width:9px;height:6px;border-radius:2px;background:#0b0b0d;box-shadow:inset 0 0 0 1px #ffffff1a}
.n-srv .bx-top{background:linear-gradient(135deg,#34343d,#24242b)!important;display:grid!important;place-items:center}
.n-srv .bx-top svg{width:46%;height:46%}
.n-srv .bx-front{background:linear-gradient(#2a2a31,#1d1d22)!important;display:flex!important;align-items:center;gap:10%;padding:0 10%}
.n-srv .bx-left,.n-srv .bx-right{background:#17171b!important}
.n-srv .bay{flex:1;height:30%;border-radius:2px;background:repeating-linear-gradient(90deg,#0d0d10 0 3px,#26262c 3px 6px)}
.n-std .bx-top,.n-std .bx-front{background:#26262c!important}.n-std .bx-left,.n-std .bx-right{background:#18181c!important}
.pmon{position:absolute;transform-origin:50% 100%;border-radius:8px;background:#0e0e11;border:1px solid #ffffff1f;box-shadow:0 30px 60px -20px #000;padding:5px;display:flex;flex-direction:column;gap:4px;backface-visibility:hidden}
.pmon .bar{display:flex;align-items:center;gap:3px;height:12%;padding:0 4px;border-radius:3px;background:#1e1e23}
.pmon .bar i{width:4px;height:4px;border-radius:50%;background:#ffffff33}
.pmon .bar b{margin-left:6px;font:500 7px/1 var(--mono);color:#ffffff80;font-weight:500}
.pmon .scr{flex:1;border-radius:3px;background:var(--i-ref-out1) center/cover}
.pmon .live{position:absolute;right:10px;bottom:10px;font:600 7px/1 var(--mono);color:#fff;background:#dc2626;padding:3px 4px;border-radius:3px}
.pbill{position:absolute;left:0;top:0;transform-origin:0 0;white-space:nowrap;pointer-events:none}
.plab{display:grid;gap:3px;padding:8px 12px;border-radius:var(--r-lg);background:#131316e6;border:1px solid var(--border);box-shadow:var(--sh-md)}
.plab small{font:500 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--primary)}
.plab b{font-size:13px;font-weight:600;color:var(--text)}
.ptag{font:500 10px/1 var(--mono);letter-spacing:.12em;color:var(--primary);background:var(--bg);border:1px solid var(--primary-border);padding:4px 8px;border-radius:999px}
.plat{font-size:12px;color:var(--text-2);background:var(--surface);border:1px solid var(--primary-border);box-shadow:var(--glow);padding:7px 12px;border-radius:999px}
.plat b{font-size:15px;color:var(--primary);margin-right:4px}
.pcable{position:absolute;height:6px;margin-top:-3px;border-radius:3px;background:var(--surface-lighter);transform-origin:0 50%}
.pcable i{position:absolute;inset:0;border-radius:3px;background:linear-gradient(90deg,#84cc1680,var(--primary));box-shadow:0 0 14px #84cc1666;transform-origin:0 50%;transform:scaleX(0)}
.pcable b{position:absolute;left:0;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#ecfccb;box-shadow:0 0 10px 3px #84cc16cc;opacity:0}
.pfloor.live .pcable b{animation:packet 1.65s linear infinite}
@keyframes packet{0%{transform:translateX(0);opacity:0}12%{opacity:1}88%{opacity:1}100%{transform:translateX(var(--w));opacity:0}}
.rm .pcable b,.rm .phalo,.rm .pfloor .leds i,.rm .n-enc .disp em{animation:none!important}
.feat3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);margin-top:clamp(28px,5vh,56px)}
.feat3 article{border-radius:var(--r-3xl);padding:clamp(22px,2.4vw,32px);display:grid;gap:var(--s3);align-content:start;min-height:220px;background:var(--surface);border:1px solid var(--border-subtle)}
.feat3 h3{font-size:clamp(22px,2.2vw,32px);font-weight:700;letter-spacing:-.01em;line-height:1.1;color:var(--text)}
.feat3 p{color:var(--text-2)}
.feat3 a{font-size:14px;font-weight:600;color:var(--primary);text-decoration:none}
.fx article{padding:var(--s3) var(--s3) clamp(22px,2.4vw,32px);transition:transform var(--base) var(--ease-out),border-color var(--fast) var(--ease)}
.fx article>:not(.viz){padding:0 clamp(10px,1.2vw,20px)}
.fx article:hover{transform:translateY(-4px);border-color:var(--border)}
.viz{position:relative;height:170px;border-radius:var(--r-xl);background:var(--bg);border:1px solid var(--border-subtle);overflow:hidden;margin-bottom:var(--s3)}
.v-uhd .fr{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);border:1.5px solid var(--surface-hover);border-radius:6px;font:500 10px/1 var(--mono);letter-spacing:.1em;color:var(--text-2);display:flex;align-items:flex-start;justify-content:flex-end;padding:5px 6px;animation:frame 4.8s var(--ease) infinite}
.v-uhd .f1{width:22%;aspect-ratio:16/9}.v-uhd .f2{width:40%;aspect-ratio:16/9;animation-delay:.6s}.v-uhd .f3{width:58%;aspect-ratio:16/9;animation-delay:1.2s}
@keyframes frame{0%,15%{border-color:var(--surface-hover);color:var(--text-2);box-shadow:none}30%,55%{border-color:var(--primary);color:var(--primary);box-shadow:0 0 18px #84cc1633}75%,100%{border-color:var(--surface-hover);color:var(--text-2);box-shadow:none}}
.v-uhd .spark{position:absolute;left:0;bottom:12px;width:200%;height:30px;animation:spark 6s linear infinite}
.v-uhd .spark path{fill:none;stroke:var(--primary);stroke-width:1.5;opacity:.7}
@keyframes spark{to{transform:translateX(-50%)}}
.v-uhd .rate{position:absolute;left:10px;top:10px;font:500 10px/1 var(--mono);letter-spacing:.08em;color:var(--primary);background:var(--primary-bg);border:1px solid var(--primary-border);padding:4px 7px;border-radius:999px}
.v-map{background:radial-gradient(circle,#ffffff1c 1px,transparent 1.5px) 0 0/14px 14px,var(--bg)}
.v-map svg{position:absolute;inset:0;width:100%;height:100%}
.v-map .route{fill:none;stroke:var(--primary);stroke-width:1.5;stroke-dasharray:4 5;opacity:.7;animation:dash 1.6s linear infinite}
@keyframes dash{to{stroke-dashoffset:-18}}
.pin{position:absolute;transform:translate(-50%,-50%)}
.pin i{display:block;width:10px;height:10px;border-radius:50%;background:var(--primary);box-shadow:0 0 0 4px #84cc1626,0 0 14px var(--primary)}
.pin i::after{content:"";position:absolute;left:5px;top:5px;width:34px;height:34px;margin:-17px;border-radius:50%;border:1.5px solid var(--primary);animation:ping 2.4s var(--ease-out) infinite}
.p-nue i::after{animation-delay:1.2s}
@keyframes ping{from{transform:scale(.2);opacity:1}to{transform:scale(1.4);opacity:0}}
.pin em{position:absolute;left:50%;top:18px;transform:translateX(-50%);white-space:nowrap;font:500 10px/1 var(--mono);font-style:normal;letter-spacing:.06em;color:var(--text);background:var(--surface-light);border:1px solid var(--border);padding:4px 7px;border-radius:6px}
.v-slots{display:grid;align-content:center;gap:12px;padding:0 22px}
.slots{display:grid;grid-template-columns:repeat(12,1fr);gap:6px}
.slots i{height:36px;border-radius:5px;background:var(--surface-light);border:1px solid var(--border-subtle)}
.slots i.ok{animation:slot 4.8s var(--ease) infinite;animation-delay:var(--d)}
.slots i.cap{background:repeating-linear-gradient(135deg,transparent 0 4px,#ffffff0d 4px 8px);border-style:dashed;border-color:var(--border)}
@keyframes slot{0%,5%{background:var(--surface-light)}15%,80%{background:var(--primary);box-shadow:0 0 10px #84cc1640}95%,100%{background:var(--surface-light)}}
.v-slots .capline{justify-self:end;margin-right:calc(33.3% - 22px);font:500 10px/1 var(--mono);letter-spacing:.08em;color:var(--text-2);border-right:1.5px solid var(--primary);padding-right:6px}
.v-slots .q{display:flex;align-items:center;gap:8px;font:500 10px/1 var(--mono);letter-spacing:.08em;color:var(--text-2)}
.v-slots .q em{flex:1;height:2px;background:linear-gradient(90deg,var(--primary),#84cc1655);border-radius:2px}
.rm .viz *,.rm .viz *::after{animation:none!important}
.dl-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s4);margin-top:clamp(28px,5vh,56px)}
.dl{border-radius:var(--r-3xl);padding:clamp(22px,2.4vw,32px);display:grid;gap:var(--s3);align-content:start;background:var(--surface);border:1px solid var(--border-subtle);transition:transform var(--base) var(--ease-out),border-color var(--fast) var(--ease)}
.sec.alt .dl{background:var(--surface-light)}
.dl:hover{border-color:var(--border)}
.dl h3{font-size:clamp(22px,2.2vw,30px);font-weight:700;letter-spacing:-.01em;line-height:1.1;color:var(--text)}
.dl p{color:var(--text-2);font-size:15px}
.dl .btn{justify-self:start;margin-top:var(--s1)}
.dl-grid.four{grid-template-columns:repeat(4,1fr)}
.proc{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--s3);margin-top:var(--s6)}
.proc article{background:var(--surface);border:1px solid var(--border-subtle);border-radius:var(--r-xl);padding:var(--s5);display:grid;gap:var(--s2);align-content:start;transition:transform var(--base) var(--ease-out),border-color var(--fast) var(--ease)}
.proc article:hover{border-color:var(--border)}
.proc header{display:flex;justify-content:space-between;align-items:center;gap:var(--s3)}
.proc h3{font-size:18px;font-weight:600;line-height:1.375;color:var(--text)}
.proc em{font-size:10px;font-weight:500;font-style:normal;letter-spacing:.06em;padding:3px var(--s2);border-radius:999px;background:var(--surface-light);border:1px solid var(--border);white-space:nowrap;color:var(--text)}
.proc p{font-size:14px;color:var(--text-2)}
.notes{margin-top:var(--s6);display:grid;gap:var(--s3);max-width:900px;counter-reset:n;list-style:none}
.notes li{counter-increment:n;color:var(--text-2);padding-left:36px;position:relative}
.notes li::before{content:counter(n,decimal-leading-zero);position:absolute;left:0;top:.2em;font-family:var(--mono);font-size:12px;color:var(--text)}
.notes a{color:var(--text)}
@media (max-width:900px){
  .hero{height:200vh}
  .stack{--aw:94vw;left:50%;top:74%}.cam{perspective-origin:50% 40%}
  .tag{font-size:9.5px;padding:5px 6px;left:0;top:-2px;transform:translateY(-100%)}
  .hero-cap{display:none}
  .card{width:80vw;margin-top:-34vw}.card p{display:none}
  .wbtn{width:44px;height:44px}.dots button{width:28px}
  .cursor span{font-size:10px;padding:4px 6px;left:13px;top:14px}.cursor svg{width:16px;height:16px}
  .flow{grid-template-columns:1fr;justify-items:center;gap:var(--s2)}.dev{width:100%}
  .conn{width:100%;grid-template-columns:1fr auto 1fr;align-items:center}.conn span{grid-column:3;justify-self:start;text-align:left}
  .conn svg{grid-column:2;grid-row:1;width:56px;height:14px;transform:rotate(90deg);margin:21px 0}
  .nav-links .ind{display:none}
  .paths,.steps,.layers{grid-template-columns:1fr}.steps::before,.steps .fill{display:none}.photo{justify-self:start}
  .topo{aspect-ratio:auto;display:grid;gap:var(--s3);padding-left:22px}.topo>svg{display:none}
  .topo::before{content:"";position:absolute;left:6px;top:20px;bottom:20px;width:2px;background:linear-gradient(var(--primary),var(--surface-lighter))}
  .tn,.t-or,.t-link{position:relative;left:auto!important;top:auto!important;transform:none;white-space:normal;width:auto}.t-or,.t-link{justify-self:start}
  .label-stage{min-height:0;justify-items:start}
  .doc{grid-template-columns:1fr}.toc{position:sticky;top:var(--nav);z-index:4;margin:0 calc(-1 * var(--pad));padding:10px var(--pad);max-height:none;display:flex;flex-wrap:nowrap;overflow-x:auto;gap:6px;background:#09090bf2;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border-subtle);scrollbar-width:none}
  .toc::-webkit-scrollbar{display:none}.toc p{display:none}.toc a{white-space:nowrap;border:1px solid var(--border-subtle);border-radius:999px;min-height:36px;display:inline-flex;align-items:center}.toc .tind{border-radius:999px}
  .ldoc dl{grid-template-columns:1fr}.motif{min-height:0;justify-items:center;padding-top:8px}
  .m-eu{--er:96px;width:230px;height:230px}.m-docs{width:220px;height:280px}
  .pipe{height:400px}
  .plab{padding:5px 8px;gap:2px}.plab small{font-size:8px}.plab b{font-size:11px}.ptag{font-size:8px;padding:3px 6px}.plat{font-size:10px;padding:5px 9px}.plat b{font-size:12px}
  .strip .built{margin-left:0}
  .plans,.stats,.sb,.feat3,.dl-grid,.dl-grid.four{grid-template-columns:1fr}
  .sb-row{grid-template-columns:1fr;gap:var(--s2)}
  .cta,.sub-hero{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .lb-foot .row{margin-left:0}
}
.rm .hero,.rm .walk{height:auto}.rm .stage{position:relative;height:auto;min-height:100svh}
.rm .roll{height:auto}.rm .roll span{position:static;display:block;transform:none!important}.rm .roll span+span{display:none}
.rm .track{position:relative;top:auto;padding:260px var(--pad) 120px;overflow-x:auto}.rm .card{margin-top:0}
:root{--stag:40ms;--morph:440ms;--ease-io:cubic-bezier(.65,0,.35,1)}
.kw{display:inline-block;overflow:hidden;vertical-align:top;padding:.08em .05em .16em;margin:-.08em -.05em -.16em}
.kw>i{display:inline-block;font-style:normal;transform:translate3d(0,112%,0) rotate(6deg) skewX(-6deg);transform-origin:0 100%;filter:blur(6px);opacity:.001;
  transition:transform 900ms var(--ease-spring),filter 560ms var(--ease-out),opacity 160ms linear;transition-delay:calc(var(--k) * var(--stag))}
.kin.in .kw>i{transform:none;filter:none;opacity:1}
.rm .kw>i{transform:none;filter:none;opacity:1;transition:none}
.curtain{position:fixed;inset:0;z-index:48;background:var(--surface);display:grid;place-items:center;transform:scaleY(0);transform-origin:50% 100%;pointer-events:none}
.curtain svg{width:48px;height:48px;opacity:0;transform:translateY(16px) scale(.9);transition:opacity 180ms var(--ease),transform 420ms var(--ease-spring)}
html.js .curtain.cover{transform:none;animation:curtainFailsafe 1ms 1.5s forwards;transition:transform 280ms cubic-bezier(.7,0,.84,0)}
html.js .curtain.cover svg{opacity:1;transform:none}
html.js .curtain.cover.open{transform:scaleY(0);transform-origin:50% 0;transition:transform 560ms var(--ease-out)}
html.js .curtain.cover.open svg{opacity:0;transform:translateY(-16px);transition:opacity 160ms var(--ease),transform 400ms var(--ease-out)}
.rvq{position:relative;width:100%;max-width:560px;aspect-ratio:520/340;justify-self:center;overflow:hidden;border-radius:var(--r-3xl)}
.rq{position:absolute;left:0;top:0;width:520px;height:340px;transform-origin:0 0;font-size:13px;color:var(--text)}
.rq-shell{position:absolute;inset:0;background:var(--surface-light);box-shadow:inset 0 0 0 1px var(--border);clip-path:inset(144px 170px 144px 170px round 26px);transition:clip-path var(--morph) var(--ease-spring),background-color var(--morph) var(--ease)}
.rvq[data-s=pill] .rq-shell{background:var(--primary)}
.rvq[data-s=ring] .rq-shell{clip-path:inset(144px 234px 144px 234px round 26px)}
.rvq[data-s=row] .rq-shell{clip-path:inset(128px 24px 128px 24px round 18px)}
.rvq[data-s=card] .rq-shell{clip-path:inset(0 0 0 0 round 22px)}
.rq>[data-in]{position:absolute;opacity:0;transform:scale(.96);transition:opacity 220ms var(--ease),transform var(--morph) var(--ease-spring);pointer-events:none}
.rvq[data-s=pill] [data-in~=pill],.rvq[data-s=ring] [data-in~=ring],.rvq[data-s=row] [data-in~=row],.rvq[data-s=card] [data-in~=card]{opacity:1;transform:none;transition-delay:120ms}
.rq-pill{left:170px;top:144px;width:180px;height:52px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:15px;font-weight:600;color:var(--on-primary)}
.rq-pill svg,.rq-ring svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.rq-pill svg{width:18px;height:18px}
.rq-ring{left:234px;top:144px;width:52px;height:52px;color:var(--primary)}
.rq-ring svg{width:52px;height:52px}
.rq-ring .trk{stroke:var(--surface-hover)}
.rq-ring .arc{stroke-dasharray:101;stroke-dashoffset:101;transform:rotate(-90deg);transform-origin:26px 26px}
.rq-ring .chk{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 320ms var(--ease-out)}
.rvq.done .rq-ring .chk{stroke-dashoffset:0}
.rq-row{left:24px;top:128px;width:472px;height:84px;display:flex;align-items:center;gap:14px;padding:0 16px}
.rq-thumb{flex:none;width:104px;height:58px;border-radius:var(--r-md);background:var(--i-ui-viewer) 0 0/128.4% auto no-repeat}
.rq-row div{flex:1;min-width:0;display:grid;gap:4px}
.rq-row b,.rq-top b{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rq-row small{font-size:12px;color:var(--text-2)}
.rq-badge,.rq-cc,.rq-orig,.rq-chips span{flex:none;font-size:11px;font-weight:500;line-height:1;padding:6px 9px;border-radius:999px}
.rq-badge{color:var(--success);background:#4ade801f;transform:scale(0);transition:transform 460ms var(--ease-spring)}
.rvq.applied .rq-badge{transform:none}
.rq-cc{display:flex;align-items:center;gap:4px;color:var(--text-2);background:var(--surface-lighter);transform:scale(0);transition:transform 420ms var(--ease-spring)}
.rq-cc svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:2.2}
.rvq.saved .rq-cc{transform:none}
.rq-more{flex:none;width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:var(--surface-lighter);color:var(--text-2);font-size:14px;line-height:1}
.rq-menu{left:376px;top:198px;width:118px;padding:4px;border-radius:var(--r-lg);background:var(--bg);box-shadow:var(--sh-lg),0 0 0 1px var(--border);transform-origin:100% 0}
.rq-menu span{display:flex;align-items:center;gap:8px;height:30px;padding:0 10px;border-radius:var(--r-md);background:var(--surface-light);font-size:12px}
.rq-menu svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round}
.rvq.menu .rq-menu,.rvq.notes .rq-notes{opacity:1;transform:none}
.rq-notes{left:92px;top:84px;width:336px;padding:14px;border-radius:var(--r-2xl);background:var(--bg);box-shadow:var(--sh-xl),0 0 0 1px var(--border);display:grid;gap:8px}
.rq-notes h4{font-size:14px;font-weight:600}
.rq-notes small{font-size:11px;color:var(--text-2)}
.rq-chips{display:flex;gap:6px}
.rq-chips span{background:var(--surface-lighter);color:var(--text-2);transition:background var(--base) var(--ease),color var(--base) var(--ease),transform 300ms var(--ease-spring)}
.rvq.appr .rq-chips .c-ok{background:#4ade801f;color:var(--success)}
.rq-notes footer{display:flex;justify-content:flex-end;margin-top:4px}
.rq-notes footer span{height:28px;padding:0 16px;display:grid;place-items:center;border-radius:var(--r-md);background:var(--primary);color:var(--on-primary);font-size:12px;font-weight:600}
.rq-top{left:20px;top:10px;width:480px;height:28px;display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px}
.rq-orig{color:var(--success);background:#4ade801f}
.rq-frame{left:40px;top:44px;width:440px;height:248px;border-radius:var(--r-md);overflow:hidden;background:var(--i-ui-viewer) 0 0/128.4% auto no-repeat}
.rq-rect{position:absolute;left:386px;top:132px;width:30px;height:32px;border:2px solid var(--success);border-radius:3px;transform-origin:0 0;transform:scale(0)}
.rq-bar{left:40px;top:298px;width:440px;height:38px}
.rq-trk{position:absolute;left:0;right:0;top:6px;height:4px;border-radius:2px;background:var(--surface-hover)}
.rq-trk em{position:absolute;left:0;top:0;bottom:0;width:100%;border-radius:2px;background:var(--primary);transform-origin:0 50%;transform:scaleX(0)}
.rq-trk i{position:absolute;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--bg);border:2px solid var(--primary)}
.rq-trk .mk{width:8px;height:8px;margin:-10px 0 0 -4px;border:0;background:var(--orange);transform:scale(0);transition:transform 420ms var(--ease-spring)}
.rvq.saved .rq-trk .mk{transform:none}
.rq-ctl{position:absolute;left:0;top:18px;display:flex;align-items:center;gap:10px;font:500 12px/1 var(--mono);color:var(--text-2)}
.rq-ctl svg{width:14px;height:14px;fill:var(--text)}
.rq-pop{left:168px;top:112px;width:232px;padding:12px;border-radius:var(--r-xl);background:var(--bg);box-shadow:var(--sh-lg),0 0 0 1px var(--border);display:grid;gap:8px;transform-origin:100% 50%}
.rvq.pop .rq-pop{opacity:1;transform:none}
.rq-pop .tc{justify-self:start;font:500 11px/1 var(--mono);color:var(--primary);background:var(--primary-bg);padding:5px 7px;border-radius:999px}
.rq-pop p{font-size:12px;line-height:1.4;min-height:34px}
.rq-pop p::after{content:"";display:inline-block;width:1px;height:12px;margin-left:1px;vertical-align:-2px;background:var(--text);animation:caret 1s steps(1) infinite}
.rq-pop div{display:flex;gap:8px;margin-top:2px}
.rq-pop div span{flex:1;display:grid;place-items:center;height:28px;padding:0 10px;border-radius:var(--r-md);font-size:11px;font-weight:600;white-space:nowrap}
.rq-pop .sv{background:var(--primary);color:var(--on-primary)}
.rq-pop .ds{color:#f87171;box-shadow:inset 0 0 0 1px #f8717155}
.rq-toast{left:176px;top:236px;width:168px;height:36px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;background:var(--bg);box-shadow:var(--sh-lg),0 0 0 1px var(--border);font-size:12px;font-weight:500}
.rq-toast i{width:16px;height:16px;border-radius:50%;background:var(--success);display:grid;place-items:center;color:var(--bg);font-style:normal;font-size:10px;font-weight:700}
.rq>.rq-toast{transform:translateY(24px) scale(.9)}
.rq-toast.t2{left:100px;top:232px;width:320px}
.rvq.toast .t1,.rvq.toast2 .t2{opacity:1;transform:none}
.rq-cur{position:absolute;left:0;top:0;width:20px;height:20px;z-index:3;transition:transform 640ms var(--ease-io);will-change:transform}
.rq-cur.drag{transition:none}
.rq-cur svg{width:20px;height:20px;transition:transform 140ms var(--ease)}
.rq-cur.clk svg{transform:scale(.8)}
.rq-cur::after{content:"";position:absolute;left:-14px;top:-14px;width:28px;height:28px;border-radius:50%;border:2px solid var(--text);opacity:0;transform:scale(.4)}
.rq-cur.clk::after{animation:rip 520ms var(--ease-out)}
@keyframes caret{50%{opacity:0}}
.rm .rq-cur{display:none}.rm .rq-pop p::after{display:none}
@keyframes curtainFailsafe{to{transform:scaleY(0);transform-origin:50% 0}}
.defs{position:absolute;width:0;height:0;overflow:hidden}
.skip-link{position:fixed;left:var(--s4);top:-60px;z-index:60;padding:var(--s3) var(--s4);border-radius:var(--r-lg);background:var(--primary);color:var(--on-primary);font-weight:600;text-decoration:none;transition:top var(--fast) var(--ease)}
.skip-link:focus{top:var(--s4)}
.lz{background-image:none!important}
.lang{display:inline-flex;gap:2px;padding:3px;border-radius:999px;background:var(--surface-light)}
.lang button{min-height:30px;padding:0 var(--s3);border-radius:999px;font:500 12px/1 var(--mono);letter-spacing:.06em;color:var(--text-2)}
.lang button[aria-pressed=true]{background:var(--surface-hover);color:var(--text)}
.drawer .lang{align-self:flex-start;margin-top:var(--s6)}
.proc .dpa{display:inline-block;margin-top:var(--s3);font-size:13px;font-weight:500;color:var(--primary);text-decoration:none}
.proc .dpa:hover{text-decoration:underline}
.dl .dl-meta{font:500 11px/1.4 var(--mono);letter-spacing:.05em;color:var(--text-2)}
.doc-note[hidden]{display:none}
.kw{max-width:100%}.kw>i{max-width:100%;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}
.foot-grid>div{min-width:0}.foot-grid a{overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}
.ldoc .num{margin-right:.35em}
body[data-page=restrictions] .ldoc p>strong:first-child{margin-right:.4em}
@media (max-width:900px){.foot-brand .made{white-space:normal}.ldoc .tbl table{min-width:600px}}