/* Additive lower-page scenery. No selector changes the approved intro or cinematic hero. */
.homepage-depth{isolation:isolate;background:#FAF8F7}
.homepage-depth main,.homepage-depth>.footer{position:relative;z-index:1}
.depth-atmosphere{position:fixed;inset:0;z-index:0;overflow:clip;contain:strict;pointer-events:none;background:#360000}
.depth-atmosphere *{pointer-events:none!important;user-select:none}
.depth-landscape{position:absolute;inset:-14%;transform:scale(1.05)}
.depth-landscape img{display:block;width:100%;height:100%;object-fit:cover;object-position:52% 50%;max-width:none}
.depth-tint,.depth-wash{position:absolute;inset:0}
.depth-tint{background:#360000;opacity:.12}.depth-wash{background:#FAF8F7;opacity:.28}
.depth-rock{position:absolute;left:0;top:0;transform-origin:0 0;opacity:.4}
.depth-rock img{display:block;width:100%;height:auto}
.depth-rock-left{width:clamp(180px,28vw,430px);transform:translate3d(-88%,60vh,0)}
.depth-rock-right{left:auto;right:-13%;width:clamp(140px,20vw,310px);transform:translate3d(0,-10%,0)}
.depth-mist{position:absolute;inset:auto -22% -15%;height:65%;opacity:.10;mask-image:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent)}
.depth-mist img{display:block;width:100%;height:100%;max-width:none;object-fit:cover}
/* Only inner decorative layers drift; parent transforms are controlled by native scroll. */
.depth-enabled .depth-rock img{animation:depth-rock-drift 26s ease-in-out infinite alternate}
.depth-enabled .depth-rock-right img{animation-duration:31s;animation-delay:-11s}
.depth-enabled .depth-mist img{animation:depth-mist-drift 34s ease-in-out infinite alternate}
@keyframes depth-rock-drift{from{transform:translate3d(0,-4px,0)}to{transform:translate3d(4px,7px,0)}}
@keyframes depth-mist-drift{from{transform:translate3d(-1%,0,0) scale(1.04)}to{transform:translate3d(1%,-1%,0) scale(1.06)}}
/* Individual translate composes with existing reveal/hover transforms; no artwork is altered. */
.depth-float{--depth-lift:5px;--depth-period:11s;--depth-delay:0s;animation:depth-art-float var(--depth-period) ease-in-out var(--depth-delay) infinite alternate;animation-play-state:paused}
.depth-float[data-depth-visible="true"]{animation-play-state:running}
.depth-float:hover,.depth-float:focus-within{animation-play-state:paused}
.homepage-depth:is(.page-hidden,.intro-active,.dialog-open,.depth-motion-paused) .depth-float{animation-play-state:paused!important}
@keyframes depth-art-float{from{translate:0 var(--depth-lift)}to{translate:0 calc(var(--depth-lift)*-1)}}
/* Feathered surfaces keep paragraphs calm while the single canyon continues at the edges. */
.homepage-depth .work-section,.homepage-depth .graphic-project,.homepage-depth .recruitment-project,.homepage-depth .services-surface,.homepage-depth .studio,.homepage-depth #process,.homepage-depth .featured,.homepage-depth .contact,.homepage-depth>.footer{background:transparent}
.homepage-depth :where(.work-head,.project,.services-surface,.studio,#process,.contact,.footer){position:relative;isolation:isolate;--depth-surface:250,248,247;--depth-strength:.97}
.homepage-depth :where(.work-head,.project,.services-surface,.studio,#process,.contact,.footer)::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(var(--depth-surface),.60),rgba(var(--depth-surface),var(--depth-strength)) 14%,rgba(var(--depth-surface),var(--depth-strength)) 86%,rgba(var(--depth-surface),.60));mask-image:linear-gradient(180deg,transparent,#000 65px,#000 calc(100% - 65px),transparent)}
.homepage-depth .work-head{--depth-surface:255,255,255}.homepage-depth .work-head::before{mask-image:linear-gradient(180deg,transparent,#000 65px)}
.homepage-depth .campaign-project::before{mask-image:linear-gradient(180deg,#000,#000 calc(100% - 65px),transparent)}
.homepage-depth .featured,.homepage-depth .contact{--depth-surface:54,0,0;--depth-strength:.985}
.homepage-depth>.footer{--depth-surface:36,0,0;--depth-strength:.98}
.homepage-depth .ribbon{background:#240000f5}
.homepage-depth .services-list,.homepage-depth .process-grid{background:#faf8f7eb}
.homepage-depth .process-step>.eyebrow{background:#FAF8F7}
.homepage-depth .enquiry-form,.homepage-depth .contact-intro{background:#360000f5}
.depth-toggle{position:absolute;right:clamp(22px,5.3vw,86px);top:24px;z-index:2;min-height:36px;padding:8px 12px;border:1px solid #d4c9c5;background:#faf8f7ed;color:#360000;font-size:10px;cursor:pointer}
.depth-toggle:hover,.depth-toggle:focus-visible{background:#fff;border-color:#360000}
.depth-motion-paused .depth-atmosphere img,.page-hidden .depth-atmosphere img{animation-play-state:paused!important}
@media(max-width:700px){
 .depth-rock-left{width:42vw}.depth-rock-right{width:32vw;right:-20%}
 .depth-mist{height:48%;inset:auto -35% -9%;opacity:.06}
 .depth-float{--depth-mobile-factor:.4;animation-name:depth-art-float-mobile}
 @keyframes depth-art-float-mobile{from{translate:0 calc(var(--depth-lift)*.4)}to{translate:0 calc(var(--depth-lift)*-.4)}}
 .homepage-depth :where(.work-head,.project,.services-surface,.studio,#process,.contact,.footer)::before{background:linear-gradient(90deg,rgba(var(--depth-surface),.84),rgba(var(--depth-surface),.98) 18%,rgba(var(--depth-surface),.98) 82%,rgba(var(--depth-surface),.84));mask-image:linear-gradient(180deg,transparent,#000 42px,#000 calc(100% - 42px),transparent)}
 .homepage-depth .work-head::before{mask-image:linear-gradient(180deg,transparent,#000 42px)}
 .homepage-depth .campaign-project::before{mask-image:linear-gradient(180deg,#000,#000 calc(100% - 42px),transparent)}
 .depth-toggle{top:10px;right:22px;font-size:9px;min-height:34px;padding:7px 10px}
}
@media(prefers-reduced-motion:reduce){.depth-atmosphere *,.depth-float{animation:none!important}.depth-float{translate:none!important}.depth-toggle{display:none!important}}