/* One architectural material language. Motion separates foreground and distance. */
.hero{--look-x:0;--look-y:0}.hero-pin{background:radial-gradient(ellipse at 72% 61%,#d6d9d0 0,transparent 52%)}
.depth-horizon{position:absolute;width:125%;height:45%;left:-12%;top:58%;border-top:1px solid #aeb5aa75;border-bottom:1px solid #aeb5aa40;transform:rotate(-14deg) translateY(calc(var(--p)*150px));pointer-events:none;z-index:0;background:linear-gradient(180deg,#ffffff24,transparent)}
.depth-orbit{position:absolute;width:70vw;height:70vw;left:37%;top:7%;border:1px solid #aab1a36b;border-radius:50%;box-shadow:0 0 0 65px #c1c7ba16,0 0 0 130px #c1c7ba12;transform:translate(calc(var(--look-x)*-10px),calc(var(--p)*-160px + var(--look-y)*-10px));pointer-events:none;opacity:calc(1 - var(--p)*.8);z-index:0}
.depth-plane{position:absolute;pointer-events:none;border:1px solid #a5aea1;transform-origin:center;z-index:1;opacity:calc(1 - var(--p)*1.2)}
.depth-plane-back{left:39%;top:28%;width:52%;height:58%;background:linear-gradient(140deg,#cbd2c5,#e4e6dd);transform:translate(calc(var(--look-x)*-14px),calc(var(--p)*-130px + var(--look-y)*-12px)) rotateX(9deg) rotateY(-17deg) rotateZ(-10deg);box-shadow:-15px 25px 40px #1b222515}
.depth-plane-middle{left:42%;top:33%;width:54%;height:57%;background:#f7f6ef;transform:translate(calc(var(--look-x)*7px),calc(var(--p)*-65px + var(--look-y)*6px)) rotateX(7deg) rotateY(-14deg) rotateZ(-7deg);box-shadow:0 15px 28px #1b222522}
.hero-word{translate:calc(var(--look-x)*-7px) calc(var(--look-y)*-5px);text-shadow:0 2px 0 #ffffff80}
.surface{translate:calc(var(--look-x)*12px) calc(var(--look-y)*9px);box-shadow:-18px 36px 55px #14221a38,-3px 5px 0 #69776c,0 1px 0 #f6f5ef inset}
.surface-shadow{translate:calc(var(--look-x)*-18px) calc(var(--look-y)*-12px);transform:rotate(-8deg) translateY(calc(var(--p)*80px)) scale(calc(1 + var(--p)*.2))}
[data-depth-section]{--depth:0;--drift:0px;position:relative;isolation:isolate}
.work-heading h2{translate:0 calc(var(--drift)*-.32)}
.feira-window{position:relative;translate:0 calc(var(--drift)*-.18);box-shadow:0 44px 58px -20px #1b222545,0 10px 0 -3px #cacfc3,0 11px 0 -3px #9fa798,0 23px 0 -7px #e1e3da,0 24px 0 -7px #abb3a2}
.feira-poster{translate:0 calc(var(--drift)*-.5)}
.case-open{translate:0 calc(var(--drift)*-.28)}
.mentor-links .project-stage{perspective:1100px}
.mentor-links .desktop-screen{translate:0 calc(var(--drift)*.13);rotate:calc(var(--depth)*-1.8deg)}
.mentor-links .phone-screen{translate:0 calc(var(--drift)*-.28);rotate:calc(var(--depth)*2deg)}
.services{overflow:clip;background:#e8e9e1}.services>h2,.service-rows{position:relative;z-index:1}
.service-blueprint{position:absolute;right:-12%;top:12%;width:62%;height:72%;border:1px solid #b6beae80;transform:translateY(calc(var(--drift)*-1)) rotate(-22deg);box-shadow:0 0 0 48px #d0d5c633,0 0 0 49px #b6beae40,0 0 0 96px #d0d5c622,0 0 0 97px #b6beae30;z-index:-1;pointer-events:none}
.service-rows article{background:linear-gradient(90deg,#e8e9e1f2 20%,#e8e9e1b3);position:relative}
.consult{overflow:clip}.consult-grid{position:absolute;inset:-25% -15%;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(16.666% - 1px),#aeb7a233 16.666%),repeating-linear-gradient(0deg,transparent 0,transparent 109px,#aeb7a222 110px);transform:translateY(calc(var(--drift)*.65)) rotate(-8deg);z-index:-1;pointer-events:none;mask-image:linear-gradient(90deg,transparent,#000 80%)}
.consult .demo{position:relative;background:#e4e6dd;box-shadow:12px 16px 0 -1px #d2d7ca,12px 16px 0 0 #a7b09e;translate:0 calc(var(--drift)*-.15)}
.person{overflow:clip}.person-backplate{position:absolute;left:-10%;top:12%;width:60%;height:57%;background:#dce0d3;transform:translateY(calc(var(--drift)*.7)) rotate(-7deg);z-index:-1;pointer-events:none}
.paper-statement{padding:40px 30px!important;background:#f6f5ee;box-shadow:0 35px 45px -25px #26352140;border:1px solid #d1d6c9;translate:0 calc(var(--drift)*-.35);rotate:calc(-2deg + var(--depth)*1.8deg)}
.person-copy{translate:0 calc(var(--drift)*.12)}
.contact{overflow:clip}.contact-architecture{position:absolute;right:-8%;top:-24%;width:58%;height:140%;border:1px solid #c5ccb52e;transform:translateY(calc(var(--drift)*.9)) rotate(24deg);box-shadow:0 0 0 55px #c5ccb506,0 0 0 56px #c5ccb520,0 0 0 110px #c5ccb504,0 0 0 111px #c5ccb512;z-index:-1;pointer-events:none}.contact-big>span:first-child{translate:0 calc(var(--drift)*-.18)}.contact-big .contact-arrow{translate:0 calc(var(--drift)*-.5)}
@media(max-width:760px){.depth-plane-back{left:10%;top:48%;width:79%;height:40%;transform:translateY(calc(var(--p)*-60px)) rotate(-9deg)}.depth-plane-middle{left:9%;top:50%;width:82%;height:40%;transform:translateY(calc(var(--p)*-30px)) rotate(-6deg)}.depth-orbit{top:32%;left:15%;width:125vw;height:125vw}.depth-horizon{top:57%}.surface{translate:none}.work-heading h2{translate:none}.paper-statement{padding:25px 18px!important}.paper-statement h2{font-size:clamp(28px,8vw,36px)}.person-backplate{width:95%;height:35%;left:-8%;top:9%}.service-blueprint{right:-40%;width:95%}.consult .demo{box-shadow:6px 8px 0 -1px #d2d7ca,6px 8px 0 0 #a7b09e}.contact-architecture{width:85%;right:-35%}}
.depth-still .depth-plane,.depth-still .depth-horizon,.depth-still .depth-orbit{transform:none;opacity:.45}.depth-still .hero-word,.depth-still .surface,.depth-still .surface-shadow,.depth-still [data-depth-section] *{translate:none!important;rotate:none!important}.depth-still .service-blueprint,.depth-still .consult-grid,.depth-still .person-backplate,.depth-still .contact-architecture{transform:none}
@media(prefers-reduced-motion:reduce){.hero-word,.surface,.surface-shadow,[data-depth-section] *{translate:none!important;rotate:none!important}.depth-plane,.depth-horizon,.depth-orbit,.service-blueprint,.consult-grid,.person-backplate,.contact-architecture{transform:none!important}}
/* Local scroll anchors prevent long sections from diluting the parallax. */
[data-depth-local]{--depth:0;--drift:0px}
.feira-window{translate:none;transform:perspective(1600px) rotateX(calc(var(--depth)*-3deg))}
.feira-poster{translate:0 calc(var(--drift)*-.32)}
.case-open{translate:0 calc(var(--drift)*.24)}
.mentor-links .desktop-screen{translate:0 calc(var(--drift)*.12);rotate:calc(var(--depth)*-2deg)}
.mentor-links .phone-screen{translate:0 calc(var(--drift)*-.32);rotate:calc(var(--depth)*3deg)}
.person-backplate{transform:translate(calc(var(--drift)*.18),calc(var(--drift)*.8)) rotate(-7deg)}
.paper-statement{translate:0 calc(var(--drift)*-.2);rotate:calc(-2deg + var(--depth)*2.8deg)}
.person-copy{translate:none}.person-grid{padding-top:35px;padding-bottom:110px}
.contact-architecture{border-color:#c5ccb55c;transform:translate(calc(var(--drift)*.24),calc(var(--drift)*1.15)) rotate(24deg)}
.contact-big>span:first-child{translate:none}.contact-big .contact-arrow{translate:0 calc(var(--drift)*-.28)}
.consult-grid{transform:translateY(calc(var(--drift)*.9)) rotate(-8deg)}
.consult .demo{translate:0 calc(var(--drift)*-.12)}
/* The project subpages use the same depth language as the homepage. */
.project-page .project-figure,.project-page .project-extract figure{perspective:1500px}
.project-page .project-stage{overflow:visible;isolation:isolate}
.project-page .project-stage:before{content:'';position:absolute;inset:5% 8%;border:1px solid #7f908450;transform:translateY(calc(var(--drift)*.27)) rotate(-5deg);pointer-events:none;z-index:-1}
.project-page .project-stage .desktop-screen{translate:0 calc(var(--drift)*.1);rotate:calc(var(--depth)*-1.8deg);box-shadow:0 35px 50px -18px #14212e66,0 3px 8px #14212e22}
.project-page .project-stage .phone-screen{translate:0 calc(var(--drift)*-.32);rotate:calc(var(--depth)*2.5deg)}
.project-page .project-figure{margin-top:25px;margin-bottom:35px}
.project-page .project-extract,.project-page .project-transfer,.project-page .project-next{overflow:clip}
.project-depth-plane{position:absolute;z-index:-1;pointer-events:none;width:65%;height:125%;top:-10%;right:-15%;border:1px solid #9ba89375;background:#d3dbcc66;transform:translateY(calc(var(--drift)*.8)) rotate(-14deg);box-shadow:-35px 28px 0 -1px #edece688,-36px 29px 0 0 #abb8a355}
.project-transfer{max-width:none;padding-left:max(6vw,calc((100vw - 900px)/2));padding-right:max(6vw,calc((100vw - 900px)/2));background:#eeeee7}
.project-transfer .project-depth-plane{right:57%;top:3%;width:40%;background:#dce1d460;transform:translateY(calc(var(--drift)*.9)) rotate(12deg)}
.project-next .project-depth-plane{background:transparent;border-color:#b9c9ac55;box-shadow:0 0 0 36px #b9c9ac06,0 0 0 37px #b9c9ac33;transform:translateY(calc(var(--drift)*1)) rotate(25deg)}
.project-next>a{position:relative;z-index:1}.project-next>a:first-child>span:last-child{translate:0 calc(var(--drift)*-.15)}
.project-page .project-motion{font-size:12px;padding:10px 0}
@media(max-width:760px){.person-grid{padding-top:15px;padding-bottom:60px}.project-page .project-stage .phone-screen{translate:0 calc(var(--drift)*-.2)}.project-page .project-stage .desktop-screen{translate:0 calc(var(--drift)*.08)}.project-depth-plane{width:90%;right:-35%}.contact-big .contact-arrow{translate:0 calc(var(--drift)*-.2)}}
.depth-still .feira-window{transform:none!important}.depth-still .project-depth-plane,.depth-still .project-page .project-stage:before{transform:none!important}.depth-still [data-depth-local] *{translate:none!important;rotate:none!important}
@media(prefers-reduced-motion:reduce){.feira-window,.project-depth-plane,.project-page .project-stage:before{transform:none!important}[data-depth-local] *{translate:none!important;rotate:none!important}}
