:root{--bg:#07080a;--bg2:#0e1013;--ink:#e8e6e1;--dim:#8a8d93;--line:#23262b;--accent:#ff6a2b;--maxw:1240px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:400 17px/1.6 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
h1,h2,h3,h4{font-family:"Space Grotesk",sans-serif;font-weight:500;letter-spacing:-.03em;line-height:.95}
section{padding:clamp(80px,12vw,160px) clamp(20px,5vw,64px);max-width:var(--maxw);margin:0 auto}
.label{color:var(--accent);margin-bottom:40px}
.nav{position:fixed;inset:0 0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding:18px clamp(20px,5vw,64px);z-index:10;background:linear-gradient(var(--bg),transparent)}
.brand{font:700 18px "Space Grotesk";letter-spacing:.2em}.brand span{color:var(--dim);font-weight:400}
.nav nav{display:flex;gap:24px;align-items:center;flex-wrap:wrap;font-size:14px;color:var(--dim)}
.nav nav a:hover{color:var(--ink)}
.btn{display:inline-block;padding:14px 26px;border:1px solid var(--ink);background:var(--ink);color:var(--bg);font:500 15px Inter;border-radius:999px;transition:.25s}
.btn:hover{background:var(--accent);border-color:var(--accent);color:var(--bg)}
.btn.ghost{background:transparent;color:var(--ink)}.btn.sm{padding:8px 16px;font-size:13px;color:var(--bg)}
.btn.big{font-size:20px;padding:20px 40px;margin:24px 0}
.hero{position:relative;min-height:100vh;display:flex;align-items:flex-end;max-width:none;padding-bottom:12vh;overflow:hidden}
#field{position:fixed;inset:0;width:100vw;height:100vh;opacity:.55;pointer-events:none;z-index:0}
main,footer{position:relative;z-index:1}.nav{z-index:10}
.hero-inner{position:relative;max-width:var(--maxw);margin:0 auto;width:100%}
.eyebrow{color:var(--dim);margin-bottom:28px}
h1{font-size:clamp(48px,10vw,150px)}h1 em{font-style:normal;color:var(--accent)}
.lede{max-width:560px;margin:32px 0;color:var(--dim);font-size:clamp(16px,1.6vw,20px)}
.cta-row{display:flex;gap:14px;flex-wrap:wrap}
.scroll{position:absolute;right:clamp(20px,5vw,64px);bottom:32px;color:var(--dim)}
.m-lines p{font:500 clamp(30px,5.4vw,76px)/1.08 "Space Grotesk";letter-spacing:-.03em;margin-bottom:.15em}
.m-lines .dim{color:var(--dim)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.card{background:var(--bg);padding:40px 32px 48px;min-height:320px;transition:background .3s}
.card:hover{background:var(--bg2)}.card .n{color:var(--accent)}
.card h3{font-size:30px;margin:80px 0 16px}.card p{color:var(--dim)}
.flagship{display:grid;grid-template-columns:1.1fr 1fr;gap:64px;align-items:center}
.flag-visual svg{width:100%;height:auto}.ph{color:var(--dim);margin-top:12px;text-align:center}
.flagship h2{white-space:nowrap;font-size:clamp(72px,10vw,150px);margin-bottom:12px}
.sub{font:500 22px/1.3 "Space Grotesk";margin-bottom:20px}.flag-copy>p{color:var(--dim);margin-bottom:20px}
.facts{list-style:none;border-top:1px solid var(--line);margin:28px 0}.facts li{padding:14px 0;border-bottom:1px solid var(--line)}
.note{font-size:13px;border-left:2px solid var(--accent);padding-left:14px}
.process ol{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.process li{border-top:1px solid var(--ink);padding-top:20px}.process li span{color:var(--accent)}
.process h4{font-size:26px;margin:28px 0 12px}.process p{color:var(--dim);font-size:15px}
.endorse{display:flex;gap:48px;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-top:72px;padding-bottom:72px}
.endorse img{opacity:.9;flex:none}.endorse h3{font-size:clamp(28px,3.4vw,44px);margin:10px 0 14px}.endorse p:last-child{color:var(--dim);max-width:620px}
.intake{text-align:center}.intake h2{font-size:clamp(44px,8vw,120px)}.intake>p{color:var(--dim);max-width:520px;margin:24px auto 0}
.small{color:var(--dim);font-size:11px}
footer{padding:40px;text-align:center;color:var(--dim)}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
@media (max-width:860px){.flagship{grid-template-columns:1fr}.process ol{grid-template-columns:1fr 1fr}.endorse{flex-direction:column;align-items:flex-start}.nav nav a:not(.btn){display:none}}
@media (max-width:520px){.process ol{grid-template-columns:1fr}.card{min-height:0}.card h3{margin-top:40px}}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}
.static .hero{min-height:900px}.static.m .hero{min-height:844px}

html{scrollbar-gutter:stable}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--ink);color:var(--bg);padding:8px 14px;border-radius:6px}.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
footer{display:grid;gap:14px;justify-items:center}.fnav{display:flex;gap:22px;flex-wrap:wrap;justify-content:center}.fnav a:hover{color:var(--ink)}
.phero{padding-top:160px;padding-bottom:40px}.ptitle{font-size:clamp(48px,9vw,120px);margin-bottom:20px}.ilede{color:var(--dim);max-width:620px;font-size:18px}
.svc{border-top:1px solid var(--line);padding-top:80px;padding-bottom:80px}
.svc-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:56px}.svc h2{font-size:clamp(36px,4.6vw,60px);margin-bottom:18px}
.lede2{color:var(--dim);margin-bottom:28px}
.svc-cols{display:grid;grid-template-columns:1fr 1fr;gap:32px}.svc-cols>div:last-child{grid-column:1/-1}
.svc h3{color:var(--accent);margin-bottom:12px;font-weight:400}
.tick{list-style:none}.tick li{padding:9px 0 9px 22px;border-bottom:1px solid var(--line);position:relative;font-size:15px}.tick li:before{content:"";position:absolute;left:0;top:18px;width:10px;height:2px;background:var(--accent)}
.fmt{color:var(--ink);text-transform:none;letter-spacing:.04em;font-size:13px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.pcard{background:var(--bg);padding:32px}.pcard.hl{background:var(--bg2)}.pcard h2{font-size:26px;margin-bottom:14px}.mt{margin-top:28px}
.rate{font:500 44px "Space Grotesk";margin-bottom:20px}.rate .mono{display:block;color:var(--dim);font-size:11px}.rate small{font-size:16px;color:var(--dim)}
.pr table{width:100%;border-collapse:collapse;font-size:14px}.pr th,.pr td{text-align:left;padding:10px 0;border-bottom:1px solid var(--line);vertical-align:top;font-weight:400}.pr td{text-align:right;padding-left:12px;white-space:nowrap}
.terms td{text-align:left!important;white-space:normal!important;color:var(--dim)}.terms th{width:180px;color:var(--ink)}
.fine{color:var(--dim);font-size:13px;margin-top:10px}
.callout{border-left:3px solid var(--accent);background:var(--bg2);padding:20px 24px;margin:48px 0;color:var(--dim)}.callout b{color:var(--ink)}
.th{font-size:34px;margin:56px 0 20px}.cen{text-align:center;margin-top:48px}
.ab-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:56px}.about h2{font-size:30px;margin:0 0 14px}.about p{color:var(--dim);margin-bottom:24px}
.ph-box{border:1px dashed #3a3e45;border-radius:10px;min-height:420px;display:grid;place-items:center;text-align:center;padding:20px;color:var(--dim);background:repeating-linear-gradient(45deg,transparent 0 14px,#0d0f12 14px 15px)}.ph-box.short{min-height:160px}
.todo{color:var(--accent);font-family:"JetBrains Mono"}
.values{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:28px}.values li{border-top:1px solid var(--ink);padding-top:16px}.values span{color:var(--accent)}.values h3{font-size:22px;margin:18px 0 10px}.values p{color:var(--dim);font-size:15px}
.nf{min-height:70vh;padding-top:180px}
@media(max-width:860px){.svc-grid,.ab-grid{grid-template-columns:1fr}.values{grid-template-columns:1fr 1fr}.ph-box{min-height:240px}}
@media(max-width:520px){.svc-cols,.values{grid-template-columns:1fr}.pr td{white-space:normal}.terms th{width:110px}}
.about .th{margin-top:80px}
.pcard th,.pcard td{display:block;text-align:left!important;border:0;padding:0}.pcard tr{display:block;padding:10px 0;border-bottom:1px solid var(--line)}.pcard td{color:var(--accent);font-family:"JetBrains Mono";font-size:12px;margin-top:4px}
.wk-note{color:var(--dim);margin:-8px 0 24px}
.work{list-style:none;padding:0;margin:0 0 24px;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.wk{border:1px solid var(--line);padding:14px 14px 18px;background:rgba(255,255,255,.015)}
.wk-img{aspect-ratio:16/10;margin-bottom:14px;display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(135deg,transparent 0 10px,rgba(255,255,255,.025) 10px 11px) #0d0f11;background-size:cover;background-position:center;border:1px dashed var(--line);color:var(--dim);font-size:11px}
.wk .tag,.eq .tag{color:var(--accent);font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.wk h3{margin:6px 0 4px;font-size:18px}.wk p{margin:0;color:var(--dim);font-size:14px;line-height:1.5}
.eq{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;border-top:1px solid var(--line);padding-top:20px}.eq ul{list-style:none;padding:0;margin:8px 0 0}.eq li{padding:6px 0;border-bottom:1px solid var(--line)}
@media(max-width:700px){.eq{grid-template-columns:1fr}}
.render-card{position:relative;z-index:1;margin:0;padding:clamp(8px,2vw,24px) 0 0}
.render-card::before{content:"";position:absolute;inset:-8% -6%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(232,230,225,.10),rgba(232,230,225,.04) 55%,transparent 100%)}
.render-card img{display:block;width:100%;height:auto;filter:drop-shadow(0 0 1px rgba(255,255,255,.18)) drop-shadow(0 18px 40px rgba(0,0,0,.6))}
.render-card figcaption{color:var(--dim);font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin-top:14px;text-align:center}
.render-card.sm{margin-top:24px}
.render-card img.zoomable{cursor:zoom-in}.render-card img.zoomable:focus-visible{outline:2px solid var(--accent);outline-offset:6px;border-radius:6px}
.zoom-bd{position:fixed;inset:0;z-index:90;background:radial-gradient(closest-side,rgba(40,40,42,.9),rgba(5,6,8,.9));opacity:0;cursor:zoom-out}
.zoom-img{position:fixed;z-index:91;margin:0;transform-origin:0 0;cursor:zoom-out;will-change:transform;filter:drop-shadow(0 0 1px rgba(255,255,255,.18))}
html.zoom-lock,html.zoom-lock body{overflow:hidden}

/* Scroll reveal (shared with lab) */
.stage{position:relative;width:min(1100px,100%);margin:0 auto;aspect-ratio:2945/1896;user-select:none;-webkit-user-select:none}
.stage::before{content:"";position:absolute;inset:-6% -4%;z-index:0;pointer-events:none;background:radial-gradient(closest-side,rgba(232,230,225,.09),rgba(232,230,225,.03) 55%,transparent)}
.stage img{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;-webkit-user-drag:none;filter:drop-shadow(0 0 1px rgba(255,255,255,.14))}
.stage .ext,.stage .sec{z-index:1}.stage .sec{z-index:2}
/* A: scroll */
.sweep{height:260vh;position:relative}
.sticky{position:sticky;top:0;height:100vh;display:flex;align-items:center;justify-content:center}
.s-scroll{--p:0}
.s-scroll .sec{clip-path:inset(0 calc((1 - var(--p)) * 100%) 0 0)}
.s-scroll .ext{clip-path:inset(0 0 0 calc(var(--p) * 100%))}
.s-scroll .cut{position:absolute;z-index:3;top:4%;bottom:4%;left:calc(var(--p)*100%);width:1px;transform:translateX(-.5px);background:linear-gradient(transparent,rgba(255,106,43,.85) 20%,rgba(255,106,43,.85) 80%,transparent);box-shadow:0 0 10px 1px rgba(255,106,43,.35);opacity:var(--o,1);transition:opacity .4s}
.s-scroll.done .sec{pointer-events:auto}
.s-scroll .sec.zoomable{cursor:default}.s-scroll.done .sec.zoomable{cursor:zoom-in}
@media (prefers-reduced-motion:reduce){.sweep,.sweep.rv{height:auto}.sticky{position:static;height:auto;padding:20px 0}.s-scroll .cut{transition:none}}

/* About RDE-2 reveal: compact pinned frame */
.sweep.rv{height:auto;margin:48px 0 8px}
.sweep.rv .sticky{height:auto;top:var(--st,72px);display:block}
.rv-fig{position:relative;margin:0 auto;width:100%;padding:clamp(14px,2vw,28px) clamp(14px,2vw,28px) 0;border:1px solid rgba(232,230,225,.07);
background-color:rgba(255,255,255,.008);background-image:linear-gradient(rgba(232,230,225,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(232,230,225,.035) 1px,transparent 1px);background-size:32px 32px;background-position:-1px -1px}
.rv-fig .s-scroll{width:min(90%,calc((100vh - 200px) * 1.553))!important}
.rv-fig .tk{position:absolute;width:12px;height:12px;border:0 solid rgba(255,106,43,.45);pointer-events:none}
.tk.tl{top:-1px;left:-1px;border-top-width:1px;border-left-width:1px}.tk.tr{top:-1px;right:-1px;border-top-width:1px;border-right-width:1px}
.tk.bl{bottom:-1px;left:-1px;border-bottom-width:1px;border-left-width:1px}.tk.br{bottom:-1px;right:-1px;border-bottom-width:1px;border-right-width:1px}
.rv-cap{display:flex;justify-content:space-between;gap:16px;margin:clamp(10px,1.5vw,18px) calc(-1 * clamp(14px,2vw,28px)) 0;padding:10px clamp(14px,2vw,28px);border-top:1px solid rgba(232,230,225,.07);color:var(--dim);font-size:11px;letter-spacing:.08em}
.rv-cap b{font-weight:400;color:var(--accent);display:inline-block;min-width:4ch;text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:600px){.rv-cap{flex-direction:column;gap:4px;font-size:10px}.rv-fig .s-scroll{width:100%!important}}
@media (prefers-reduced-motion:reduce){.sweep.rv{height:auto!important}.sweep.rv .sticky{position:static}}

/* RDE-2 case study */
.cs{max-width:1000px;margin:0 auto;padding:0 24px 80px}
.cs p{max-width:68ch;margin:0 0 1em}
.cs-hero,.cs-sec{margin:8px 0 24px}
.cs-hero img,.cs-sec img{width:100%;height:auto;display:block}
.cs-hero figcaption,.cs-sec figcaption{color:var(--dim);font-size:11px;letter-spacing:.1em;text-transform:uppercase;text-align:center;margin-top:10px}
.cs-list{max-width:68ch}
.cs-tl{list-style:none;padding:0;margin:24px 0 8px;display:grid;grid-template-columns:repeat(5,1fr);gap:12px;position:relative}
.cs-tl::before{content:"";position:absolute;left:10%;right:10%;top:7px;height:1px;background:rgba(255,106,43,.45)}
.cs-tl li{position:relative;padding-top:26px;text-align:center}
.cs-tl li::before{content:"";position:absolute;top:2px;left:50%;width:11px;height:11px;margin-left:-6px;border-radius:50%;background:var(--accent,#ff6a2b)}
.cs-tl .mono{font-size:13px;color:var(--fg,#e8e6e1)}
.cs-tl p{font-size:13px;color:var(--dim);margin:6px auto 0}
@media (max-width:700px){.cs-tl{grid-template-columns:1fr;gap:0}.cs-tl::before{left:5px;right:auto;top:8px;bottom:8px;width:1px;height:auto}.cs-tl li{text-align:left;padding:0 0 16px 26px}.cs-tl li::before{left:0;margin:0;top:4px}.cs-tl p{margin:2px 0 0}}
/* Work tile with a viewport capture */
.wk-img.vp{position:relative;border:1px solid rgba(232,230,225,.14);background-color:#9da3aa;overflow:hidden;align-items:flex-start;justify-content:flex-start}
.wk-img.vp::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 95% at 50% 45%,transparent 55%,rgba(7,8,10,.55) 100%);box-shadow:inset 0 0 0 1px rgba(7,8,10,.6)}
@media print{.wk-img.vp::after{display:none}}
.wk-img.vp>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.wk-img img.zoomable{cursor:zoom-in}.wk-img img.zoomable:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.zoom-img[src*="/assets/work/"]:not([src*="rde-2"]){background:#9da3aa;filter:none;box-shadow:0 0 0 1px rgba(232,230,225,.14),0 20px 60px rgba(0,0,0,.5)}
/* gallery tiles + expanded gallery */
.wk-img.stack{box-shadow:3px -3px 0 -1px #0b0d0f,3px -3px 0 0 rgba(232,230,225,.12),6px -6px 0 -1px #0b0d0f,6px -6px 0 0 rgba(232,230,225,.07);overflow:visible}
.wk-img.stack::before{content:attr(data-count);position:absolute;right:8px;bottom:8px;z-index:2;font:10px/1 'JetBrains Mono',monospace;color:rgba(232,230,225,.8);background:rgba(7,8,10,.6);padding:4px 6px;border-radius:2px;pointer-events:none}
.wk-img.stack>img,.wk-img.stack::after{border-radius:0}
.zoom-ui{position:fixed;inset:0;z-index:92;pointer-events:none}
.zoom-ui button{pointer-events:auto;position:absolute;top:50%;transform:translateY(-50%);width:44px;height:64px;border:0;background:none;color:rgba(232,230,225,.45);font:300 40px/1 'Inter',sans-serif;cursor:pointer;transition:color .2s}
.zoom-ui button:hover,.zoom-ui button:focus-visible{color:rgba(232,230,225,.95);outline:none}
.zg-prev{left:max(12px,calc(10vw - 56px))}.zg-next{right:max(12px,calc(10vw - 56px))}
.zg-n{position:absolute;left:50%;bottom:calc(10vh - 28px);transform:translateX(-50%);font-size:11px;letter-spacing:.12em;color:rgba(232,230,225,.55)}
@media print{.wk-img.stack{box-shadow:none!important}.wk-img.stack::before{display:none}}
/* mobile full-screen viewer */
@media not all and (pointer:fine) and (min-width:900px){.wk-img.vp>img{cursor:pointer}}
.mv{position:fixed;inset:0;z-index:95;background:rgba(5,6,8,calc(.96 * var(--a,1)));opacity:0;transition:opacity .2s ease;touch-action:none;overscroll-behavior:contain}
.mv.on{opacity:1}.mv.rm{transition:none}
.mv-track{position:absolute;inset:0;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;touch-action:pan-x;transition:transform .2s ease}
.mv.rm .mv-track{transition:none;scroll-behavior:auto}
.mv-track::-webkit-scrollbar{display:none}
.mv-s{flex:0 0 100%;scroll-snap-align:center;margin:0;display:flex;align-items:center;justify-content:center;padding:0 10px}
.mv-s img{max-width:100%;max-height:82vh;display:block;background:#9da3aa;box-shadow:0 0 0 1px rgba(232,230,225,.14)}
.mv-x{position:absolute;top:max(10px,env(safe-area-inset-top));right:10px;z-index:2;width:44px;height:44px;border:0;background:rgba(7,8,10,.5);border-radius:50%;color:rgba(232,230,225,.85);font:300 28px/1 'Inter',sans-serif}
.mv-n{position:absolute;left:50%;bottom:max(20px,env(safe-area-inset-bottom));transform:translateX(-50%);font-size:11px;letter-spacing:.12em;color:rgba(232,230,225,.6)}
.mv-x:focus:not(:focus-visible){outline:none}
.wk-img.has-anim{position:relative}.wk-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s ease;pointer-events:none;z-index:1}.wk-img.playing .wk-vid{opacity:1}
.wk-img.has-anim::before{content:"\25B6";position:absolute;left:10px;bottom:10px;z-index:2;font:9px/1 'JetBrains Mono',monospace;color:rgba(255,255,255,.85);background:rgba(10,12,14,.45);border:1px solid rgba(255,255,255,.18);border-radius:50%;width:24px;height:24px;display:grid;place-items:center;padding-left:2px;box-sizing:border-box;pointer-events:none;transition:opacity .3s ease;backdrop-filter:blur(4px)}.wk-img.playing::before{opacity:0}
.zoom-vid{position:fixed;z-index:91;object-fit:contain;pointer-events:none;background:transparent}
.mv-s video{max-width:100%;max-height:82vh;display:block;background:#9e9e9e}
.wk-img.has-anim::after{z-index:2}

/* Selected work: fixed column counts so a short last row is centred, not left with a gap */
@media (min-width:640px){.work{grid-template-columns:repeat(4,1fr)}.work>.wk{grid-column:span 2}.work>.wk:nth-child(2n+1):last-child{grid-column:2/span 2}}
@media (min-width:995px){.work{grid-template-columns:repeat(6,1fr)}.work>.wk:nth-child(2n+1):last-child{grid-column:span 2}.work>.wk:nth-child(3n+1):nth-last-child(2){grid-column:2/span 2}.work>.wk:nth-child(3n+1):last-child{grid-column:3/span 2}}

.nav nav a[aria-current="page"]:not(.btn){color:var(--ink)}