/* RRVisuals / Fusion Cinema Flow — lateral depth, light and unhurried words. */
:root{--bg:#080f0d;--surface:#101c17;--lime:#d3ff7a;--line:#344b3e;--muted:#abbcaf;--spatial-ease:cubic-bezier(.16,1,.3,1)}
body{overflow-x:clip}.header{border-color:#d6ff962b}.mask-line{display:block;overflow:visible;padding:.13em .08em .2em;margin:-.13em -.08em -.2em}.mask-word{display:inline-block;transform-origin:50% 70%}
/* Inline vectors keep arrows and stars identical on iOS and desktop. */
.rr-icon{display:inline-block;width:1em;height:1em;vertical-align:-.12em;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;pointer-events:none;overflow:visible}
.title-dot{line-height:1}.title-dot .rr-icon{display:block}.menu-toggle .rr-icon{width:17px;height:17px}.close{display:grid;place-items:center}.footer>a:last-of-type .rr-icon{width:16px;height:16px}
.hero-scene{position:relative;background:#070f0c}.scene-stage{position:relative;isolation:isolate;overflow:clip;background:radial-gradient(ellipse at 74% 28%,#273b222b,transparent 57%),#070f0c}
/* Light lives behind the image planes; the dark near plane protects the type. */
.spatial-room{position:absolute;inset:0 0 auto;height:max(700px,100svh);pointer-events:none;z-index:0;perspective:1100px;overflow:hidden}
.room-glow{position:absolute;inset:-10%;background:radial-gradient(ellipse at 83% 26%,#ccff754d,transparent 39%),radial-gradient(ellipse at 65% 72%,#8cce4926,transparent 43%);opacity:var(--room-light-opacity,1);transform:translate3d(var(--light-x,0px),var(--light-y,0px),0)}
.energy-field{position:absolute;inset:0;pointer-events:none;opacity:var(--energy-opacity,1);transform-origin:70% 60%;transform:translate3d(var(--energy-x,0px),var(--energy-y,0px),0) scale(var(--energy-scale,1));-webkit-mask-image:linear-gradient(90deg,transparent 16%,#000 60%);mask-image:linear-gradient(90deg,transparent 16%,#000 60%)}
.energy-cone{position:absolute;left:31%;top:-24%;width:94%;height:132%;background:conic-gradient(from var(--cone-angle,188deg) at 68% 0%,transparent 0deg,#c3ff6305 6deg,#caff6c38 16deg,#e0ff9ea8 25deg,#cbff7359 31deg,#acdf5424 42deg,transparent 54deg);opacity:.92}
.energy-volume{position:absolute;left:37%;top:17%;width:66%;height:67%;background:radial-gradient(ellipse at 67% 38%,#d8ff875c,transparent 51%),radial-gradient(ellipse at 43% 72%,#bded5d45,transparent 60%);transform:rotate(-25deg)}
.energy-horizon{position:absolute;left:24%;top:37%;width:109%;height:62%;background:radial-gradient(ellipse at 58% 49%,#efffc9c4 0%,#daff8a8c 4%,#baf65b45 12%,#9dd7471f 28%,transparent 57%);transform:rotate(-21deg)}
.room-floor{position:absolute;left:-10%;right:-10%;height:65%;top:53%;background:linear-gradient(0deg,#090f0d,transparent 85%),repeating-linear-gradient(90deg,transparent 0 119px,#b3e9ae12 120px 121px),repeating-linear-gradient(0deg,transparent 0 88px,#b3e9ae12 89px 90px);transform:translate3d(0,var(--floor-y,0px),0) perspective(550px) rotateX(67deg) scale(var(--floor-scale,1));transform-origin:50% 0;opacity:var(--floor-opacity,.6)}
.light-blade{position:absolute;border-top:2px solid #eaffc2;border-radius:50%;box-shadow:0 -2px 13px #e7ffb7a3,0 -9px 38px #c4ff6b40,inset 0 15px 35px #c8ff831c;background:linear-gradient(180deg,#d7ff9b24,transparent 28%);transform-origin:center;will-change:auto}
.blade-back{width:78%;height:27%;left:30%;top:23%;transform:translate3d(var(--blade-x,0px),var(--blade-y,0px),0) rotate(-31deg) rotateY(-24deg);opacity:var(--rim-opacity,1)}
.blade-front{width:115%;height:34%;left:16%;top:76%;transform:translate3d(calc(var(--blade-x,0px) * -1),calc(var(--blade-y,0px) * -.5),0) rotate(-19deg) rotateX(55deg);border-top-color:#ecffd7;box-shadow:0 -3px 18px #e4ffae8c,inset 0 15px 30px #c8ff8326;opacity:var(--rim-opacity,1)}
.film-plane{position:absolute;overflow:hidden;border:1px solid #c8e9a870;box-shadow:-25px 35px 60px #0009,inset 0 0 0 1px #fff1;transform-style:preserve-3d}
.film-plane img{height:100%;object-fit:cover;opacity:.72}.film-plane:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#e3ffb524,transparent 40%,#020a0744);box-shadow:inset 0 1px #edffd6b3}
.film-plane>span{position:absolute;left:18px;bottom:14px;z-index:1;font:9px 'Courier New',monospace;letter-spacing:.14em;color:#ebffdc}
.plane-back{width:31%;height:27%;right:8%;top:17%;transform:translate3d(calc(var(--camera-x,0px) * -.7 + var(--back-x,0px)),calc(var(--camera-y,0px) * -.7 + var(--back-y,0px)),var(--back-z,0px)) rotateY(-28deg) rotateZ(-12deg) scale(var(--back-scale,1));opacity:var(--back-opacity,.8)}
.plane-front{width:27%;height:27%;right:-4%;top:62%;transform:translate3d(calc(var(--camera-x,0px) * 1.6 + var(--front-x,0px)),calc(var(--camera-y,0px) * 1.6 + var(--front-y,0px)),var(--front-z,0px)) rotateY(-34deg) rotateZ(10deg) scale(var(--front-scale,1));opacity:var(--front-opacity,.8);box-shadow:-30px 45px 60px #000c}
.glass-plane{position:absolute;left:53%;top:24%;width:24%;height:51%;border:1px solid #c9ff9a35;background:linear-gradient(130deg,#e5ffaf1a,transparent 52%);box-shadow:inset 1px 0 #edffbd99,-20px 20px 60px #0006;transform:translate3d(calc(var(--camera-x,0px) * 1.2 + var(--glass-x,0px)),var(--glass-y,0px),var(--glass-z,0px)) rotateY(-35deg) rotateZ(-10deg) scale(var(--glass-scale,1));opacity:var(--glass-opacity,.8)}
.room-coordinate{position:absolute;right:3%;top:27%;writing-mode:vertical-rl;font:9px 'Courier New',monospace;letter-spacing:.18em;color:#c8d8b2;opacity:var(--planes-opacity,.8)}
.hero-content a,.hero-content button{pointer-events:auto}
/* Hero text stays in the near plane, deliberately clear of the film stack. */
.hero{position:relative;z-index:2;min-height:max(700px,100svh);background:transparent;isolation:auto;pointer-events:none}.hero:after{display:none}.hero-content{min-height:inherit;padding-top:145px;padding-bottom:25px;pointer-events:none;transform:translate3d(var(--hero-x,0px),var(--hero-y,0px),0) scale(var(--hero-scale,1));transform-origin:0 50%;opacity:var(--hero-opacity,1);visibility:var(--hero-visibility,visible)}
h1{font-size:clamp(78px,8.6vw,142px);margin:56px 0 38px;line-height:1;letter-spacing:-.075em;max-width:66%;text-shadow:0 4px 38px #020b06b3}h1 em{margin-left:.23em;color:#edffd8}.title-dot{left:75%;top:66%;font-size:27px;color:var(--lime);transform:rotate(var(--star-angle,-12deg))}
.hero-bottom{max-width:53%;margin-top:auto;margin-bottom:46px;gap:30px;align-items:end}.hero-bottom p{font-size:13px;color:#c7d4c8;line-height:1.7}.hero-bottom .button{font-size:12px;gap:22px;padding-inline:18px;min-height:54px;white-space:nowrap}.hero-foot{font-size:8px;border-color:#bde99230}.hero-foot>span:nth-child(2){margin-left:auto}.hero-foot a{margin-left:35px}.eyebrow>span:last-child{font-size:8px;color:#b7c8ac}
/* The showreel is a stable, separately reachable section below the hero. */
.showreel{position:relative;z-index:1;display:block;padding-block:65px 90px;perspective:1100px}.reel-intro{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:32px}.reel-intro .kicker{margin-bottom:20px}.showreel h2{font-size:clamp(42px,4.5vw,68px);margin:0;line-height:1.05}.reel-intro>p{font-size:12px;color:var(--muted);margin:0 0 7px;max-width:310px}.reel{width:100%;aspect-ratio:2.3;min-height:280px;padding:26px;background:#273126;border:1px solid #e0ffae9c;box-shadow:0 0 0 1px #b6ff7017,0 30px 80px #0009,0 -1px 18px #ceff9226;transform-origin:center;transform:translate3d(var(--film-x,0px),var(--film-y,0px),var(--film-z,0px)) rotateY(var(--film-ry,0deg)) rotateX(var(--film-rx,0deg)) rotateZ(var(--film-rz,0deg))}
.reel-image{position:absolute;inset:-2%;z-index:-2;pointer-events:none;background:url('assets/landscape.svg?v=9a4e0fc02c') center 58% / cover;transform:translate3d(var(--film-image-x,0%),var(--film-image-y,0%),0) scale(var(--film-image-scale,1))}.reel-edge{position:absolute;left:0;top:0;width:28%;height:2px;pointer-events:none;background:linear-gradient(90deg,transparent,#f1ffd8,transparent);transform:translate3d(var(--edge-x,-120%),0,0);opacity:var(--edge-opacity,0)}
.reel:before{background:linear-gradient(0deg,#07170dd9,transparent 46%,#08190c88),linear-gradient(90deg,#06120b35,#16351d15)}.reel:after{inset:0;border:0;border-radius:0;background:linear-gradient(130deg,#f1ffd727,transparent 30%,transparent 75%,#ccff7c17);box-shadow:inset 0 1px #f0ffcab3}.reel-top,.reel-bottom{font-size:9px;text-shadow:0 1px 6px #000}.reel-center{gap:16px;text-shadow:0 2px 8px #000}.play{width:72px;height:72px;color:#f3ffdd;border-color:#e0ffbe;background:#07140b50;transition:transform .5s var(--spatial-ease),background .3s,color .3s}.reel:hover .play,.reel:focus-visible .play{transform:rotate(45deg);background:var(--lime);color:var(--bg)}.reel-caption{display:flex;justify-content:space-between;margin-top:20px;font:8px 'Courier New',monospace;letter-spacing:.14em;color:#b7c8ac}
/* Hero and showreel always follow native document flow. */
.reel-frame{display:none}.showreel{scroll-margin-top:32px}
/* Shared light crosses the section boundary. Native scrolling owns the pace. */
.spatial-room{-webkit-mask-image:linear-gradient(#000 0%,#000 81%,transparent 100%);mask-image:linear-gradient(#000 0%,#000 81%,transparent 100%)}
.showreel{isolation:isolate}
.showreel:before{content:"";position:absolute;pointer-events:none;z-index:-1;left:calc(var(--gutter) * -1);right:calc(var(--gutter) * -1);top:-180px;height:520px;background:radial-gradient(ellipse at 72% 35%,#e7ffb963, #b9ef722a 25%,transparent 65%),linear-gradient(151deg,transparent 34%,#d7ff8f16 44%,transparent 54%);opacity:var(--handoff-glow,.18);transform:translate3d(var(--handoff-x,0px),var(--handoff-y,0px),0)}
.reel{opacity:var(--film-opacity,1)}
.showreel:before{-webkit-mask-image:linear-gradient(180deg,transparent,#000 25%,#000 65%,transparent);mask-image:linear-gradient(180deg,transparent,#000 25%,#000 65%,transparent)}
.showreel:before{left:calc(var(--gutter) * -1 - 60px);right:calc(var(--gutter) * -1 - 60px)}
.reel:focus-visible{transform:none;opacity:1}
@media(max-width:720px){.showreel:before{top:-130px;height:400px}}
@media(min-width:901px) and (max-height:760px){.hero-content{padding-top:126px}h1{margin:36px 0 25px;font-size:clamp(78px,8.6vw,116px)}.hero-bottom{margin-bottom:30px}}
/* Each real word resolves independently; glow never depends on a blurred clone. */
/* The gradient paint box must include italic overhangs and descenders.
   Equal negative margins preserve the original word spacing and line height. */
[data-title-motion] .mask-word{padding:.16em .16em .24em;margin:-.16em -.16em -.24em;color:#f5f6e9;text-shadow:0 0 14px #d9f9b825,0 0 34px #baf29115}
@supports (-webkit-background-clip:text) or (background-clip:text){
 [data-title-motion] .mask-word{background:linear-gradient(115deg,#fffdf0 0%,#f5f8e8 38%,#d9f5c4 76%,#c7efb6 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
 [data-title-motion] em .mask-word{background-image:linear-gradient(110deg,#f0f8dd 0%,#d5f2be 60%,#bfeab1 100%)}
}
h1{ text-shadow:none }h1 .mask-word{text-shadow:0 0 15px #dfffc43d,0 0 38px #bcf19e21}
.motion-enabled .title-pending .mask-word,.motion-boot h1 .mask-word{opacity:0;transform:translate3d(0,.24em,0);filter:blur(4px)}
[data-title-motion]{--word-duration:1350ms;--word-stagger:180ms;--word-ease:cubic-bezier(.22,.68,.2,1)}
[data-title-motion="intro"]{--word-duration:1550ms;--word-stagger:280ms}
[data-title-motion="drift"]{--word-duration:1400ms;--word-stagger:170ms}
[data-title-motion="focus"]{--word-duration:1500ms;--word-stagger:150ms}
.motion-enabled .is-revealed .mask-word{animation:word-lift var(--word-duration) var(--word-ease) both;animation-delay:calc(var(--word-index,0) * var(--word-stagger))}
.motion-enabled [data-title-motion="drift"].is-revealed .mask-word{animation-name:word-drift}
.motion-enabled [data-title-motion="focus"].is-revealed .mask-word{animation-name:word-focus}
@keyframes word-lift{from{opacity:0;transform:translate3d(0,.24em,0);filter:blur(4px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes word-drift{from{opacity:0;transform:translate3d(.16em,.08em,0);filter:blur(2px)}to{opacity:1;transform:none;filter:blur(0)}}
@keyframes word-focus{from{opacity:0;transform:translate3d(0,.06em,0);filter:blur(5px)}to{opacity:1;transform:none;filter:blur(0)}}
/* Project sheets rotate toward the viewer, individually driven by position. */
.work{position:relative;padding-top:100px}.work:before{content:"";position:absolute;pointer-events:none;left:45%;top:-80px;width:50%;height:230px;background:radial-gradient(ellipse at 60% 25%,#d4ff8b38,#b8ee6814 30%,transparent 68%);transform:rotate(-16deg)}
.project-grid{column-gap:9%;row-gap:120px}.project{perspective:1100px;--spot-x:50%;--spot-y:38%;--spot-radius:clamp(80px,8vw,110px);--tilt-x:0deg;--tilt-y:0deg}.project-visual{border:1px solid #b7d59245;box-shadow:0 28px 50px #0005;transform-origin:50% 70%;transform:translate3d(0,var(--project-y,0px),0) rotateX(var(--project-rx,0deg)) rotateY(var(--project-ry,0deg));transition:transform .16s ease-out}.project img{transform:scale(var(--image-scale,1.025)) translate3d(0,var(--image-y,0px),0);transition:transform .35s var(--spatial-ease);filter:none}.project:hover img{filter:none}.project-visual:before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(circle var(--spot-radius) at var(--spot-x) var(--spot-y),rgb(237 255 217 / .12) 0%,rgb(237 255 217 / .045) 42%,rgb(237 255 217 / 0) 100%);opacity:0;transition:opacity .3s}.project-visual:after{box-shadow:inset 0 0 0 1px #e1ffc426;background:linear-gradient(130deg,#efffd312,transparent 32%)}.visual-label,.project-arrow{z-index:3}.project-arrow{transition:transform .4s var(--spatial-ease),background .3s}.project:focus-visible .project-visual{transform:none}.project:focus-visible .project-visual{outline:2px solid var(--lime);outline-offset:4px}.project:focus-visible .project-arrow{background:var(--lime);color:var(--bg);transform:rotate(45deg)}
@media(hover:hover) and (pointer:fine){.motion-enabled .project:hover .project-visual{transform:rotateX(var(--tilt-x)) rotateY(var(--tilt-y))}.motion-enabled .project-visual:before{opacity:var(--spot-active,0)}.project:hover .project-arrow{transform:rotate(45deg)}}
/* A spatial aperture catches the same warm light before the craft section. */
.light-interlude{position:relative;isolation:isolate;overflow:clip;min-height:580px;display:flex;align-items:center;padding:100px var(--gutter);background:#080f0d;perspective:1000px}
.light-interlude:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 79% 40%,#d8ff8666,#b9f56321 24%,transparent 55%),conic-gradient(from 191deg at 88% -14%,transparent 0deg,#d9ff8d38 19deg,transparent 40deg);transform:translate3d(var(--interlude-light-x,0px),0,0);opacity:var(--interlude-light-opacity,1)}
.interlude-aperture{position:absolute;left:43%;top:10%;width:50%;height:80%;transform:translate3d(var(--aperture-x,0px),0,0) rotateY(var(--aperture-ry,-36deg)) rotateZ(-18deg);transform-style:preserve-3d}
.interlude-aperture i{position:absolute;inset:0;border:1px solid #d6ff96a3;background:linear-gradient(125deg,#d6ff9612,transparent 55%);box-shadow:0 0 24px #c4ff6d33,inset 0 1px #efffcac7}
.interlude-aperture i:nth-child(2){transform:translate3d(-14%,-8%,-90px);opacity:.55}.interlude-aperture i:nth-child(3){transform:translate3d(-28%,-16%,-180px);opacity:.3}
.interlude-type{position:relative;z-index:1;transform:translate3d(var(--interlude-x,0px),0,0)}.interlude-type>span{display:block;font-size:clamp(65px,9.8vw,155px);line-height:1.03;letter-spacing:-.075em;text-shadow:0 5px 40px #07110bcc}.interlude-type>span:nth-child(2){margin-left:12vw;font-family:Georgia,serif;font-style:italic;color:var(--lime)}.interlude-note{position:absolute;left:var(--gutter);bottom:48px;font:9px 'Courier New',monospace;letter-spacing:.12em;color:var(--muted)}
.services{position:relative;border-color:#c8e9a830;background:radial-gradient(ellipse at 92% 0%,#b5e95e1c,transparent 46%),linear-gradient(140deg,#19291d,#0e1813 55%);overflow:clip}.services:before{content:"";position:absolute;right:-10%;top:0;width:75%;height:1px;background:linear-gradient(90deg,transparent,#e1ffb7,transparent);box-shadow:0 0 20px #d6ff96;transform:translateX(var(--service-light-x,0px))}.service-row{position:relative}.service-row:before{content:"";position:absolute;left:0;top:-1px;width:38%;height:1px;background:linear-gradient(90deg,#d6ff96,transparent)}

.identity-art{border:1px solid #b2d38647;box-shadow:20px 25px 60px #0004;background:radial-gradient(ellipse at 80% 20%,#65754a,#243b2b 43%,#111c15 80%)}.identity-art:after{border-radius:0;transform:rotate(-12deg);border-color:#d6ff9640}.steps article{border-color:#85a56570}
/* The last light exits on a sharp horizon instead of another circular portal. */
.closing{background:radial-gradient(ellipse at 85% 12%,#d6ff8657,#b8ed701c 24%,transparent 55%),#0a160e;border-top-color:#80985b4d;overflow:clip}.closing:before{width:115%;height:65%;left:20%;top:12%;border:0;border-top:2px solid #e6ffbe;border-radius:50%;box-shadow:0 -4px 25px #dfff9c85,0 -15px 65px #b9ff5733;background:linear-gradient(180deg,#d9ff8d2b,transparent 35%);transform:translate3d(0,var(--closing-y,0px),0) rotate(-24deg);z-index:-1}.closing .wrap{position:relative}.closing h2 em{color:#e7ffcd}.closing-bottom{border-color:#d6ff9640}
.button span,.nav-cta span,.text-link span{display:inline-block;transition:transform .3s var(--spatial-ease)}.button:hover span,.button:focus-visible span,.nav-cta:hover span,.text-link:hover span{transform:translate(3px,-3px)}
.motion-toggle{min-height:44px;padding:10px 13px;font:10px Arial,sans-serif;color:var(--ink);background:#0b1912f2;border:1px solid #71885e;cursor:pointer}.motion-toggle[hidden]{display:none}.motion-toggle:hover{border-color:var(--lime)}.motion-toggle:disabled{color:var(--muted);cursor:default}.hero-motion-toggle{position:absolute;right:var(--gutter);top:calc(max(700px,100svh) - 116px);z-index:4}.footer>.motion-toggle{grid-column:1/-1;justify-self:start}
@media(min-width:901px){.hero-foot{padding-right:190px}.hero-foot>span:nth-child(2){display:none}}
/* Tablet and touch use an independent composition and ordinary page flow. */
@media(max-width:1100px) and (min-width:901px){h1{font-size:8.7vw;max-width:66%}.hero-bottom{max-width:60%;gap:20px}.hero-bottom p{font-size:12px}.eyebrow>span:last-child{display:none}.hero-content{padding-top:130px}.hero-foot a{margin-left:auto}}
@media(max-width:900px){
  .hero{min-height:800px;min-height:max(800px,100svh)}.hero-content{padding-top:135px;min-height:inherit;padding-bottom:26px}h1{font-size:clamp(68px,11vw,100px);max-width:80%;margin-top:65px}.hero-bottom{max-width:70%;margin-bottom:40px}.spatial-room{height:max(800px,100svh)}.plane-back{width:43%;height:22%;right:-5%;top:33%;opacity:.45}.plane-front{width:37%;height:21%;right:-8%;top:59%;opacity:.55}.glass-plane{left:59%;width:35%;height:38%;top:32%;opacity:.5}.room-coordinate{display:none}.blade-back{left:32%;top:26%;width:110%}.blade-front{top:68%;left:26%;width:130%}.hero-motion-toggle{top:calc(max(800px,100svh) - 116px)}.hero-foot>span:nth-child(2){display:none}.hero-foot a{margin-left:auto}.reel-intro{gap:25px}.reel-intro>p{max-width:230px}.showreel h2{font-size:48px}.showreel{padding-top:45px;padding-bottom:65px}.reel{aspect-ratio:1.9;min-height:280px}.light-interlude{min-height:480px}.project-grid{row-gap:80px;column-gap:6%}
}
@media(max-width:720px){
  .hero{min-height:800px;min-height:max(800px,100svh)}.hero-content{padding-top:121px;padding-bottom:24px}h1{font-size:clamp(61px,14.4vw,100px);max-width:100%;line-height:1.02;margin:71px 0 0}h1 em{margin-left:.2em}.title-dot{left:auto;right:11%;top:70%;font-size:23px}.hero-bottom{display:flex;flex-direction:column;align-items:start;max-width:100%;gap:22px;margin-top:auto;margin-bottom:34px}.hero-bottom p{font-size:13px}.hero-bottom .button{min-width:230px;font-size:12px}.hero-foot{font-size:7px;padding-top:17px;gap:12px}.hero-foot a{gap:7px;margin-left:0}.eyebrow{font-size:8px}.eyebrow>span:last-child{display:none}
  .spatial-room{height:max(800px,100svh)}.plane-back{width:53%;height:18%;top:39%;right:0;transform:translate3d(var(--camera-x,0px),var(--camera-y,0px),0) rotateY(-28deg) rotateZ(-14deg);opacity:.65}.plane-front{width:43%;height:18%;top:58%;right:-13%;opacity:.6}.film-plane>span{font-size:7px;left:10px;bottom:10px}.glass-plane{width:35%;height:26%;left:57%;top:44%;opacity:.7}.room-floor{top:62%;opacity:.4}.room-glow{background:radial-gradient(ellipse at 91% 49%,#c9fc7947,transparent 43%)}.blade-back{width:140%;height:22%;left:8%;top:40%;transform:rotate(-35deg);opacity:.7}.blade-front{width:150%;height:23%;left:22%;top:69%;opacity:.6}.hero-motion-toggle{top:calc(230px + clamp(61px,14.4vw,100px) * 2.04);left:var(--gutter);right:auto;font-size:9px;padding-inline:10px;max-width:120px}
  .showreel{padding-block:45px 35px}.reel-intro{display:block;margin-bottom:27px}.showreel h2{font-size:clamp(40px,9.9vw,65px)}.reel-intro .kicker{font-size:8px;margin-bottom:20px}.reel-intro>p{font-size:12px;max-width:280px;margin:20px 0 0}.reel{aspect-ratio:1.35;min-height:225px;padding:16px}.reel-center{font-size:11px;gap:12px}.play{height:57px;width:57px}.reel-top,.reel-bottom{font-size:7px;letter-spacing:.06em}.reel-top>span{font-size:6px}.reel-caption{font-size:6px;gap:10px;letter-spacing:.07em}.draft-note{font-size:8px;padding-block:20px}.work{padding-top:70px}.section h2{font-size:clamp(40px,8.7vw,62px)}.project-grid{gap:52px}.project-visual{box-shadow:0 18px 30px #0005}.project:nth-child(n){margin-top:0}.project-meta{font-size:8px}.project-meta>span{font-size:6px}.project-title{font-size:25px}.visual-label{font-size:6px;padding:5px 7px}
  .light-interlude{padding:70px var(--gutter);min-height:350px}.interlude-aperture{left:40%;top:13%;width:62%;height:65%}.interlude-type>span{font-size:clamp(42px,10.8vw,76px)}.interlude-type>span:nth-child(2){margin-left:5vw}.interlude-note{font-size:6px;bottom:34px;letter-spacing:.06em}.services{padding-block:70px}.service-row h3{font-size:26px}.closing h2{font-size:clamp(57px,11.7vw,84px);line-height:1.06}.closing h2 em{margin-left:0}.closing:before{left:7%;top:13%;height:45%;width:155%}.footer>.motion-toggle{grid-row:4}.footer .legal-note{grid-row:3}
}
/* On touch the beam belongs to the film stack in the middle of the page. */
@media(max-width:900px){.energy-field{-webkit-mask-image:linear-gradient(90deg,transparent 5%,#000 68%);mask-image:linear-gradient(90deg,transparent 5%,#000 68%)}.energy-cone{left:30%;top:-9%;width:115%;height:103%}.energy-horizon{left:21%;top:35%;width:118%;height:54%}}
@media(max-width:720px){.energy-field{inset:27% 0 18%;-webkit-mask-image:linear-gradient(180deg,transparent,#000 24%,#000 70%,transparent);mask-image:linear-gradient(180deg,transparent,#000 24%,#000 70%,transparent)}.energy-cone{--cone-angle:166deg;left:8%;top:-43%;width:142%;height:170%;opacity:.8}.energy-volume{left:38%;top:13%;width:90%;height:71%}.energy-horizon{left:20%;top:25%;width:130%;height:65%}.light-interlude:before{background:radial-gradient(ellipse at 94% 33%,#d8ff8657,#b9f5631c 26%,transparent 60%)}.work:before{left:30%;width:70%;height:170px;top:-50px}}
@media(hover:none),(pointer:coarse){.project-visual:before{display:none}}
/* Paused and failed enhancement return to the complete static document. */
.motion-paused{scroll-behavior:auto}.motion-paused *,.motion-paused *:before,.motion-paused *:after{animation:none!important;transition:none!important}
.motion-paused .project-visual,.motion-paused .project img,.motion-paused .play,.motion-paused .project-arrow,.motion-paused .button span,.motion-paused .nav-cta span,.motion-paused .text-link span{transform:none!important}
.motion-suspended *,.motion-suspended *:before,.motion-suspended *:after{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.project-visual,.project img,.play,.project-arrow,.button span,.nav-cta span,.text-link span{transform:none!important}.mask-word{transform:none!important;opacity:1!important}}

/* Browser polish: feather the beam bounds and preserve navigation contrast. */
.energy-cone{-webkit-mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent);mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent)}
.header:before{content:"";position:absolute;left:50%;top:0;width:100vw;height:145px;transform:translateX(-50%);z-index:-1;pointer-events:none;background:linear-gradient(180deg,#070f0dd9,#070f0d85 45%,#070f0d00)}

/* No enhancement, pause and system preferences all retain complete readable titles. */
.motion-paused .mask-word{opacity:1!important;transform:none!important;filter:none!important;animation:none!important}
@media(prefers-reduced-motion:reduce){.mask-word{opacity:1!important;transform:none!important;filter:none!important;animation:none!important}}
/* A little more breathing room keeps the italic line and its halo inside small screens. */
@media(max-width:720px){h1{font-size:clamp(58px,14.4vw,100px)}h1 .mask-line{white-space:nowrap}.hero-motion-toggle{top:calc(230px + clamp(58px,14.4vw,100px) * 2.04)}}
.interlude-type .mask-word{background:none;color:inherit}
/* Touch gets a finite composited title reveal, not scroll-driven 3D repainting. */
@media(max-width:900px),(hover:none),(pointer:coarse){
 .light-interlude{perspective:none}
 .interlude-aperture{transform:rotate(-18deg);transform-style:flat}
 .interlude-aperture i:nth-child(2){transform:translate(-14%,-8%)}
 .interlude-aperture i:nth-child(3){transform:translate(-28%,-16%)}
 .interlude-type{transform:none}
 .light-interlude:before{transform:none;opacity:.8}
 .motion-enabled .interlude-type.is-revealed .mask-word{animation-name:word-touch;will-change:transform,opacity}
}
@keyframes word-touch{from{opacity:0;transform:translate3d(0,.12em,0);filter:none}to{opacity:1;transform:none;filter:none}}