:root{--bg:#f6f5f2;--paper:#fff;--ink:#0b0b0d;--ink-2:#3c3b38;--muted:#6b6862;--line:#0b0b0d1a;--night:#0b0b0d;--night-2:#141417;--night-line:#232328;--night-text:#a3a2ab;--blue:#2f6bff;--blue-ink:#2152d6;--blue-soft:#e8efff;--wa:#25d366;--sans:"Bricolage Grotesque",system-ui,sans-serif;--mono:"JetBrains Mono",ui-monospace,monospace;--ease:cubic-bezier(.16,.84,.3,1)}*{box-sizing:border-box;margin:0;padding:0}html{overflow-x:clip}html.lenis{height:auto}.lenis.lenis-smooth{scroll-behavior:auto!important}body{background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:clip}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto;display:block}button{font:inherit}::selection{background:var(--blue);color:#fff}:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:8px}.wrap{width:min(1320px,100% - 32px);margin-inline:auto}@media (width>=760px){.wrap{width:min(1320px,100% - 80px)}}.mono{font-family:var(--mono);letter-spacing:.04em;font-size:12px}.kicker{color:var(--blue-ink);margin-bottom:16px;display:block}.skip{z-index:100;background:var(--paper);border-radius:10px;padding:10px 14px;position:fixed;top:-60px;left:12px}.skip:focus{top:12px}.magnetic{transition:transform .5s var(--ease);display:inline-block}.btn{white-space:nowrap;border-radius:99px;align-items:center;gap:10px;height:54px;padding:0 26px;font-size:16px;font-weight:550;transition:background .2s,color .2s,border-color .2s;display:inline-flex}.btn svg{flex:none;width:18px;height:18px}.btn.wa{background:var(--wa);color:#062b14}.btn.wa:hover{background:#3ae07a}.btn.ghost{color:#fff;border:1.5px solid #ffffff59}.btn.ghost:hover{background:#ffffff0f;border-color:#fff}.btn.light{color:var(--ink);background:#fff}.btn.sm{height:40px;padding:0 16px;font-size:14px}.btn.lg{height:64px;padding:0 32px;font-size:18px}.hdr{z-index:50;color:#fff;transition:background .3s,color .3s,box-shadow .3s;position:fixed;inset:0 0 auto}.hdr .wrap{justify-content:space-between;align-items:center;gap:20px;height:70px;display:flex}.hdr.light{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:var(--ink);box-shadow:0 1px 0 var(--line);background:#f6f5f2d1}.logo{white-space:nowrap;letter-spacing:-.01em;align-items:center;gap:10px;font-size:17px;font-weight:650;display:flex}.logo .mark{width:30px;height:30px;-webkit-mask:var(--logo-mark) center/contain no-repeat;-webkit-mask:var(--logo-mark) center/contain no-repeat;mask:var(--logo-mark) center/contain no-repeat;background:currentColor}.hdr nav{align-items:center;gap:28px;font-size:15px;display:flex}.hdr nav>a:not(.btn){opacity:.75;transition:opacity .2s}.hdr nav>a:not(.btn):hover{opacity:1}.menu-btn{height:40px;color:inherit;cursor:pointer;background:0 0;border:1.5px solid;border-radius:99px;padding:0 14px;font-size:14px;font-weight:550;display:none}.mnav{display:none}@media (width<=820px){.hdr nav>a:not(.btn){display:none}.menu-btn{align-items:center;display:inline-flex}.mnav{z-index:49;background:var(--paper);border-radius:18px;flex-direction:column;padding:10px;position:fixed;inset:74px 12px auto;box-shadow:0 24px 60px -20px #00000073}.mnav.open{display:flex}.mnav a{border-radius:12px;padding:14px 16px;font-size:18px;font-weight:550}.mnav a:hover{background:var(--bg)}}.hero{background:var(--night);color:#fff;height:220vh;padding:0;position:relative}.hero-stage{height:100svh;position:sticky;top:0;overflow:hidden}.wall3d{inset:0;position:absolute!important}.hero-shade{pointer-events:none;background:radial-gradient(58% 62% at 22% 70%,#0b0b0df0 0%,#0b0b0dbf 45%,#0b0b0d00 100%),linear-gradient(#0b0b0d8c,#0000 20% 72%,#0b0b0dd9);position:absolute;inset:0}.hero-shade.three{background:radial-gradient(52% 58% at 20% 72%,#0b0b0de6 0%,#0b0b0d8c 50%,#0b0b0d00 100%),linear-gradient(#0b0b0d73,#0000 18% 78%,#0b0b0db3)}.hero-copy{z-index:3;pointer-events:none;flex-direction:column;justify-content:flex-end;height:100%;padding-bottom:clamp(40px,9vh,100px);display:flex;position:relative}.hero-copy>*{pointer-events:auto;max-width:max-content}.hello{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff14;border:1px solid #ffffff24;border-radius:99px;align-items:center;gap:10px;margin-bottom:26px;padding:7px 15px 7px 8px;font-size:14px;display:inline-flex}.hello img{object-fit:cover;object-position:50% 20%;border-radius:50%;width:28px;height:28px}.hello b{margin-right:-4px;font-weight:550}.hero h1{font-variation-settings:"wdth" 80;letter-spacing:-.045em;font-size:clamp(54px,8.6vw,144px);font-weight:700;line-height:.88}.hero h1 span{color:var(--blue);text-shadow:0 0 60px #2f6bff59}.hero .sub{color:#d4d3cf;max-width:44ch;margin-top:24px;font-size:clamp(17px,1.45vw,21px);line-height:1.5}.hero .ctas{flex-wrap:wrap;gap:12px;margin-top:34px;display:flex}.hero .hint{color:var(--night-text);align-items:center;gap:10px;margin-top:22px;display:flex}.hero .hint:before{content:"";background:var(--blue);border-radius:50%;width:8px;height:8px;animation:2s infinite pulse;box-shadow:0 0 0 4px #2f6bff40}@keyframes pulse{50%{box-shadow:0 0 0 8px #2f6bff00}}.pause{z-index:4;color:#d6d5d1;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff14;border:1px solid #ffffff2e;border-radius:99px;height:38px;padding:0 14px;font-size:13px;position:absolute;bottom:clamp(40px,9vh,100px);right:clamp(16px,4vw,40px)}.pause:hover{background:#ffffff29}.wall-tip{z-index:60;pointer-events:none;color:var(--ink);opacity:0;background:#fffffff5;border-radius:12px;padding:9px 13px 10px;transition:opacity .2s;position:fixed;top:0;left:0;box-shadow:0 18px 40px -12px #00000080}.wall-tip.on{opacity:1}.wall-tip b{font-size:15px;font-weight:600;display:block}.wall-tip span{font-family:var(--mono);color:var(--muted);font-size:11px}.wall2d{gap:14px;display:flex;position:absolute;inset:-4% -2%;transform:rotate(-4deg)scale(1.08)}.wall2d .col{min-width:0;animation:drift var(--d) linear infinite;flex-direction:column;flex:1;gap:14px;display:flex}.wall2d .col.rev{animation-direction:reverse}.wall2d.paused .col{animation-play-state:paused}.wall2d .tile{opacity:.45;border-radius:10px;flex:none;overflow:hidden}.wall2d img{aspect-ratio:16/10;object-fit:cover;object-position:top;width:100%}@keyframes drift{to{transform:translateY(-50%)}}@media (width<=760px){.hero{height:100svh}.wall2d .col:nth-child(n+4){display:none}.hero-shade{background:linear-gradient(#0b0b0d80,#0b0b0db3 38%,#0b0b0df7 72%)}.hero .hint{display:none}.pause{top:84px;bottom:auto}}.marquee{background:var(--night);color:#e8e7e3;border-top:1px solid var(--night-line);padding:30px 0;overflow:hidden}.marquee .track{font-variation-settings:"wdth" 80;letter-spacing:-.03em;white-space:nowrap;width:max-content;font-size:clamp(28px,3.4vw,50px);font-weight:600;animation:55s linear infinite roll;display:flex}.marquee span{align-items:center;gap:30px;padding-right:30px;display:inline-flex}.marquee span:nth-child(3n+2){color:var(--blue)}.marquee i{background:#34343a;border-radius:50%;width:10px;height:10px}.marquee:hover .track{animation-play-state:paused}@keyframes roll{to{transform:translate(-50%)}}section{padding-block:clamp(100px,12vw,170px)}.sh{flex-wrap:wrap;justify-content:space-between;align-items:end;gap:28px;margin-bottom:clamp(44px,6vw,80px);display:flex}.sh p{max-width:38ch;color:var(--ink-2);font-size:17px;line-height:1.55}h2,.split{font-variation-settings:"wdth" 82;letter-spacing:-.045em;font-size:clamp(44px,6.4vw,104px);font-weight:650;line-height:.92}.split .line{margin-bottom:-.06em;padding-bottom:.06em;display:block;overflow:hidden}.split .w,.split .w>span{display:inline-block}.split .accent{color:var(--blue)}.browser{background:var(--paper);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 30px 60px -34px #0b0b0d73}.browser .bar{border-bottom:1px solid var(--line);background:#fbfaf8;align-items:center;gap:6px;height:30px;padding:0 12px;display:flex}.browser .bar i{background:#dedbd4;border-radius:50%;width:8px;height:8px}.browser .bar span{font-family:var(--mono);color:var(--muted);background:#f1efea;border-radius:6px;margin:0 auto;padding:3px 14px;font-size:11px}.browser img{aspect-ratio:16/10;object-fit:cover;object-position:top;width:100%}.featured{height:calc(var(--steps) * 90vh + 20vh);margin-bottom:clamp(60px,8vw,110px);position:relative}.featured-stage{grid-template-columns:.85fr 1.15fr;align-items:center;gap:56px;height:100vh;display:grid;position:sticky;top:0}.f-text h3{letter-spacing:-.035em;font-size:clamp(32px,3.2vw,50px);font-weight:650;line-height:1}.f-text .lede{color:var(--ink-2);max-width:44ch;margin:16px 0 28px;font-size:17px;line-height:1.55}.parts{border-top:1px solid var(--line);list-style:none}.parts li{border-bottom:1px solid var(--line);padding:16px 0;transition:opacity .3s}.parts li:not(.on){opacity:.45}.parts a{grid-template-columns:34px 1fr auto;align-items:baseline;gap:10px;display:grid}.parts b{font-size:19px;font-weight:600}.parts em{color:var(--muted);font-size:14px;font-style:normal}.parts li p{color:var(--ink-2);max-height:0;transition:max-height .5s var(--ease);margin:8px 0 0 44px;font-size:15px;line-height:1.5;overflow:hidden}.parts li.on p{max-height:120px}.f-device{perspective:1800px}.laptop{transform:rotateX(var(--tilt,24deg)) translateY(var(--lift,60px));transform-origin:50% 100%;transition:transform .15s linear}.laptop .screen{aspect-ratio:16/10;background:#101012;border-radius:16px 16px 4px 4px;padding:12px 12px 14px;position:relative;box-shadow:0 60px 120px -40px #0b0b0d8c,inset 0 0 0 1px #2a2a2e}.laptop .screen img{object-fit:cover;object-position:top;opacity:0;width:calc(100% - 24px);height:calc(100% - 26px);transition:opacity .6s var(--ease),transform .8s var(--ease);border-radius:6px;position:absolute;inset:12px 12px 14px;transform:scale(1.02)}.laptop .screen img.on{opacity:1;transform:none}.laptop .url{color:var(--muted);position:absolute;bottom:-34px;left:50%;transform:translate(-50%)}.laptop .base{background:linear-gradient(#d9d6cf,#b9b5ad);border-radius:0 0 18px 18px;height:16px;margin:0 -6%;box-shadow:0 20px 30px -18px #00000080}@media (width<=960px){.featured{height:auto}.featured-stage{grid-template-columns:1fr;gap:36px;height:auto;position:static}.parts li:not(.on){opacity:1}.parts li p{max-height:none}.laptop{transform:none}}.sites{grid-template-columns:1fr;gap:56px 32px;display:grid}@media (width>=900px){.sites{grid-template-columns:1fr 1fr}}.tilt{--rx:0deg;--ry:0deg;transform:perspective(1000px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .4s var(--ease);display:block;position:relative}.tilt .glare{aspect-ratio:16/10.4;z-index:2;pointer-events:none;opacity:0;background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),#ffffff59,transparent 55%);border-radius:14px;transition:opacity .3s;position:absolute;inset:0 0 auto}.tilt:hover .glare{opacity:1}.site .meta{justify-content:space-between;align-items:baseline;gap:12px;margin-top:18px;display:flex}.site h4{letter-spacing:-.02em;font-size:24px;font-weight:600}.site .meta .mono{color:var(--muted);white-space:nowrap}.site p{color:var(--ink-2);max-width:52ch;margin-top:6px;font-size:15.5px;line-height:1.5}.also{border-top:1px solid var(--line);gap:16px;margin-top:72px;padding-top:28px;display:grid}@media (width>=860px){.also{grid-template-columns:200px 1fr}}.also>.mono{color:var(--muted)}.names{flex-wrap:wrap;gap:8px;display:flex}.names span{background:var(--paper);border:1px solid var(--line);border-radius:99px;padding:7px 13px;font-size:14px}.names .plus{background:var(--ink);color:#fff;border-color:var(--ink)}.apps{background:var(--night);color:#f1f0ec}.apps .kicker{color:#7fa3ff}.apps .sh p{color:var(--night-text)}.app-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));gap:16px;display:grid}@media (width>=1100px){.app-grid{grid-template-columns:repeat(3,1fr)}.app.wide{grid-column:span 2}}.app{background:var(--night-2);border:1px solid var(--night-line);transition:transform .4s var(--ease);border-radius:22px;flex-direction:column;gap:14px;padding:26px 26px 24px;display:flex;position:relative;overflow:hidden}.app:before{content:"";-webkit-mask-composite:xor;opacity:0;pointer-events:none;background:linear-gradient(140deg,#2f6bffb3,#0000 42%);border-radius:22px;padding:1px;transition:opacity .4s;position:absolute;inset:-1px;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.app:hover{transform:translateY(-4px)}.app:hover:before{opacity:1}.app-top{color:var(--night-text);justify-content:space-between;display:flex}.app-top a{color:#7fa3ff}.app h3{letter-spacing:-.025em;font-size:clamp(22px,2vw,30px);font-weight:600;line-height:1.1}.app.wide h3{font-size:clamp(28px,2.8vw,42px)}.app>p{color:#c4c3bd;font-size:15.5px;line-height:1.55}.app ul{gap:8px;margin-top:4px;list-style:none;display:grid}@media (width>=1100px){.app.wide ul{grid-template-columns:1fr 1fr}}.app li{color:#dcdbd6;padding-left:20px;font-size:14.5px;line-height:1.45;position:relative}.app li:before{content:"";background:var(--blue);border-radius:2px;width:8px;height:8px;position:absolute;top:.55em;left:0}.app .stat{align-items:baseline;gap:10px;margin-top:4px;display:flex}.app .stat b{letter-spacing:-.04em;color:#fff;font-size:clamp(34px,3.4vw,52px);font-weight:650}.app .stat span{color:var(--night-text);font-size:14px}.app .stack{border-top:1px solid var(--night-line);color:var(--night-text);margin-top:auto;padding-top:14px}#services{background:var(--paper)}.svc{border-top:1px solid var(--ink);list-style:none}.svc li{border-bottom:1px solid var(--line);grid-template-columns:60px 1.05fr 1.5fr 1.25fr 170px;align-items:baseline;gap:24px;padding:28px 0;display:grid}.svc .n{color:var(--muted)}.svc h3{letter-spacing:-.025em;font-size:clamp(22px,2.2vw,32px);font-weight:600}.svc p{color:var(--ink-2);font-size:16px;line-height:1.5}.svc .eg{color:var(--muted);font-size:15px}.svc .st{color:var(--muted);text-align:right}@media (width<=960px){.svc li{grid-template-columns:40px 1fr;gap:6px 14px}.svc li>:not(.n){grid-column:2}.svc .st{text-align:left}}.lab{margin-top:90px}.lab-row{grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:14px;display:grid}.lab-row>div{border:1px dashed #0b0b0d38;border-radius:16px;flex-direction:column;gap:8px;padding:20px;display:flex}.lab-row b{font-size:18px;font-weight:600}.lab-row p{color:var(--ink-2);font-size:14.5px;line-height:1.5}.lab-row .mono{color:var(--muted);margin-top:auto}.about{gap:44px;display:grid}@media (width>=960px){.about{grid-template-columns:.8fr 1.2fr;align-items:center;gap:80px}}.about .ph{aspect-ratio:4/5;border-radius:26px;overflow:hidden}.about .ph img{object-fit:cover;object-position:50% 30%;width:100%;height:116%;margin-top:-8%}.about .split{margin-bottom:26px}.about p{color:var(--ink-2);max-width:54ch;font-size:18px;line-height:1.6}.about p+p{margin-top:16px}.how{grid-template-columns:repeat(3,1fr);gap:10px;margin-top:36px;display:grid}.how div{border:1px solid var(--line);background:var(--paper);border-radius:14px;padding:16px}.how b{font-size:18px;font-weight:600;display:block}.how span{color:var(--muted);font-size:14px}.contact{background:var(--night);color:#fff;text-align:center;border-radius:36px 36px 0 0;padding-bottom:0;position:relative;overflow:hidden}.contact>.wrap,.contact footer{position:relative}.contact-mark{aspect-ratio:1;opacity:.06;width:min(1100px,120vw);-webkit-mask:var(--logo-line) center/contain no-repeat;-webkit-mask:var(--logo-line) center/contain no-repeat;mask:var(--logo-line) center/contain no-repeat;pointer-events:none;background:#fff;position:absolute;top:48%;left:50%;transform:translate(-50%,-50%)}.contact .kicker{color:#7fa3ff}.contact .split.big{font-size:clamp(52px,9vw,150px)}.contact>.wrap>p{color:#c4c3bd;max-width:44ch;margin:28px auto 42px;font-size:19px;line-height:1.5}.contact .ctas{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}.contact footer{border-top:1px solid var(--night-line);color:var(--night-text);text-align:left;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:clamp(90px,12vw,150px);padding-block:28px;font-size:14px;display:flex}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}.laptop{transform:none}}@media (width<=420px){.hdr nav{gap:8px}.hdr .btn.sm{justify-content:center;gap:0;width:40px;padding:0;font-size:0}.hdr .btn.sm svg{width:20px;height:20px}}
