/* Depth belongs to the display surfaces; all original artwork is retained. */
section[id],main[id]{scroll-margin-top:130px}
.skip-link{position:fixed;top:8px;left:16px;z-index:100000;padding:14px;background:#fff;color:#111;transform:translateY(-160%)}
.skip-link:focus{transform:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
:focus-visible{outline:2px solid #ff6868;outline-offset:5px}
.site-splash{display:none}body.splash-active .site-splash{display:grid}
.reveal{opacity:1;transform:none}.motion-ready .reveal:not(.visible){opacity:0;transform:translateY(20px)}
.hero-redesign{isolation:isolate;perspective:1400px}
.hero-redesign .hero-overlay{inset:-6%;background:radial-gradient(ellipse at 78% 35%,#d5232318,transparent 52%),repeating-linear-gradient(115deg,transparent 0 90px,#ffffff03 91px 92px);transform:translate3d(var(--scene-x,0px),var(--scene-y,0px),0);transition:transform .7s ease}
.hero-redesign .hero-brandboard{border-radius:14px;box-shadow:12px 16px 0 -6px #111,13px 17px 0 -6px #493033,0 38px 65px #0009,inset 0 1px #ffffff18;transform-style:preserve-3d;transform:perspective(1200px) rotateX(var(--tilt-x,2deg)) rotateY(var(--tilt-y,-5deg));transition:transform .5s ease,box-shadow .4s ease}
.hero-redesign .hero-logo-panel{border-radius:7px;box-shadow:inset 0 2px 22px #000b,0 12px 24px #0005;transform:translateZ(22px)}
.hero-redesign .hero-logo-panel img{mix-blend-mode:normal}
.hero-board-top,.hero-board-bottom,.hero-disciplines{transform:translateZ(12px)}
.hero-brandboard::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,transparent 30%,#ffffff08 48%,transparent 65%);background-size:250% 100%;animation:studio-light 12s ease-in-out 2}
@keyframes studio-light{0%,25%,100%{background-position:150% 0}65%{background-position:-80% 0}}
.real-work .project-art{border-top-color:#505050;box-shadow:0 4px 0 #030303,0 16px 28px #0007,inset 0 1px #ffffff08;transition:transform .4s ease,box-shadow .4s ease,border-color .4s ease}
.service,.package-grid article,.pricing-card,.testimonial-card,.process-grid article{transition:translate .3s ease,box-shadow .3s ease,border-color .3s ease}
.about-panel,.ala-carte-wrap,.testimonial-submit{box-shadow:0 24px 55px #0005,inset 0 1px #ffffff08}
.project-live-link{display:inline-flex;gap:12px;margin-top:14px;padding:8px 0;color:#eee;font:700 15px var(--display);text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--red)}
.button.primary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 22px;border:1px solid #eb4949;background:linear-gradient(120deg,#d52323,#981717);color:#fff;font:700 15px var(--body);cursor:pointer}
.btn,.header-cta,.button.primary{transition:transform .25s ease,box-shadow .25s ease;background-size:160% 100%}
@media(hover:hover) and (pointer:fine){
 .real-work .project-card:hover .project-art,.real-work .project-card:focus-within .project-art{transform:perspective(1100px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(-7px);border-color:#795050;box-shadow:0 5px 0 #080808,0 25px 40px #000a}
 .service:hover,.package-grid article:hover,.pricing-card:hover,.testimonial-card:hover,.process-grid article:hover{translate:0 -5px;box-shadow:0 20px 36px #0006;border-color:#744040}
 .btn:hover,.header-cta:hover,.button.primary:hover{transform:translateY(-3px);box-shadow:0 10px 25px #d5232326}
}
@media(min-width:851px) and (max-width:1250px){.site-header{gap:16px;grid-template-columns:125px 1fr 150px;padding-inline:24px}.nav{gap:15px}.nav a{font-size:14px}.header-cta{padding:14px 10px}}
@media(max-width:850px){section[id],main[id]{scroll-margin-top:100px}.hero-redesign .hero-brandboard{transform:none}.hero-redesign .hero-overlay{transform:none}}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .motion-ready .reveal:not(.visible){opacity:1;transform:none}
 .hero-redesign .hero-brandboard,.hero-redesign .hero-overlay,.real-work .project-card:hover .project-art,.real-work .project-card:focus-within .project-art{transform:none}
 .service:hover,.package-grid article:hover,.pricing-card:hover,.testimonial-card:hover,.process-grid article:hover{translate:none}
}
@media(prefers-reduced-motion:reduce){.btn:hover,.header-cta:hover,.button.primary:hover,.dlw-social-icons a:hover,.portfolio-lightbox-close:hover,.portfolio-lightbox-close:focus{transform:none}}

/* Expanded studio depth: every major section gets a dimensional stage. */
main>section{position:relative;isolation:isolate}
main>section:not(.hero)::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 12% 20%,#d5232312,transparent 50%),linear-gradient(115deg,transparent 40%,#ffffff04 50%,transparent 60%);background-size:100% 100%,240% 100%;animation:section-light 18s ease-in-out infinite;animation-play-state:paused}
main>section.scene-in-view::before{animation-play-state:running}
@keyframes section-light{0%,100%{background-position:0 0,130% 0}50%{background-position:0 0,-60% 0}}
.service-row,.process-grid,.package-grid,.pricing-grid,.testimonial-grid,.project-grid{perspective:1500px}
.service,.process-grid article,.package-grid article,.pricing-card,.testimonial-card{position:relative;border-radius:12px;border:1px solid #343034;background:linear-gradient(145deg,#1b181a,#0b0b0b 72%);box-shadow:0 6px 0 #030303,0 7px 0 #3a2428,0 22px 38px #0007,inset 0 1px #ffffff13;transform:perspective(1100px) rotateX(2deg);transition:transform .4s ease,translate .4s ease,box-shadow .4s ease,border-color .4s ease}
.service-row,.process-grid{gap:18px}
.service{padding:26px 20px}
.process-grid article{padding:28px 24px}
.process-grid strong{display:inline-grid;place-items:center;width:50px;height:50px;border-radius:12px;background:linear-gradient(145deg,#eb3838,#791313);color:#fff;box-shadow:0 5px 0 #470d0d,0 12px 24px #0008;transform:rotate(-6deg)}
.service .icon{display:grid;place-items:center;width:54px;height:60px;border:1px solid #633034;border-radius:12px;background:linear-gradient(145deg,#301b20,#100c0e);box-shadow:0 5px 0 #050505,0 12px 22px #0007;transform:translateY(-4px) rotate(-5deg);transition:transform .4s ease}
.section-title .title-rule{width:76px;box-shadow:0 3px 15px #d5232380}
.hero-redesign .hero-brandboard{animation:board-float 7s ease-in-out infinite;animation-play-state:paused;translate:0 -2px}
.scene-in-view .hero-brandboard{animation-play-state:running}
@keyframes board-float{0%,100%{translate:0 -2px}50%{translate:0 -15px}}
.hero-brandboard::after{animation:studio-light 10s ease-in-out infinite;animation-play-state:paused}
.scene-in-view .hero-brandboard::after{animation-play-state:running}
.real-work .project-art{border-radius:12px;box-shadow:5px 7px 0 -2px #111,6px 8px 0 -2px #583337,0 25px 40px #0009;transform:perspective(1100px) rotateX(3deg) rotateY(-2deg)}
.real-work .project-card:nth-child(even) .project-art{transform:perspective(1100px) rotateX(3deg) rotateY(2deg)}
.about-panel{border-radius:16px;border-top-color:#695056;box-shadow:8px 10px 0 -4px #21171a,0 35px 65px #0008;transition:transform .5s ease}
.pricing-card.featured,.package-grid article.featured{border-color:#df4545;background:radial-gradient(ellipse at top,#4c1b2280,transparent 70%),#100d0e;box-shadow:0 7px 0 #3a1115,0 25px 50px #000a,0 0 36px #d5232312}
.testimonial-card::before{text-shadow:4px 5px 0 #000;color:#593239}
.contact-wrap{border-radius:12px;padding:42px;background:linear-gradient(130deg,#181214,#090909 65%);box-shadow:0 8px 0 #030303,0 28px 65px #0008}
.motion-ready .depth-entry:not(.depth-arrived){opacity:0;transform:perspective(1000px) translateY(35px) rotateX(10deg)}
.depth-entry{transition:opacity .7s ease var(--entry-delay,0ms),transform .7s ease var(--entry-delay,0ms),box-shadow .4s ease}
.motion-control{position:fixed;right:18px;bottom:18px;z-index:40;padding:10px 14px;border:1px solid #775057;border-radius:30px;background:#130e10ed;color:#eee;font:600 12px var(--body);cursor:pointer;box-shadow:0 5px 20px #0008}
@media(hover:hover) and (pointer:fine){
.service:hover,.process-grid article:hover,.package-grid article:hover,.pricing-card:hover,.testimonial-card:hover,.about-panel:hover{transform:perspective(1100px) rotateX(var(--tilt-x,3deg)) rotateY(var(--tilt-y,-4deg));translate:0 -9px;box-shadow:0 9px 0 -2px #1c1114,0 32px 48px #000a;border-color:#a44954}
.service:hover .icon{transform:translateY(-10px) rotate(4deg)}
.real-work .project-card:hover .project-art{transform:perspective(1100px) rotateX(var(--tilt-x,3deg)) rotateY(var(--tilt-y,-4deg)) translateY(-12px)}
}
@media(max-width:850px){.contact-wrap{padding:28px 20px}.service-row,.process-grid{gap:14px}.service{grid-template-columns:48px 1fr;gap:16px}.service .icon{width:46px}.hero-redesign .hero-brandboard{animation:none}}
@media(max-width:600px){.process-grid{grid-template-columns:1fr}.motion-control{right:10px;bottom:10px;font-size:11px}.real-work .project-art,.real-work .project-card:nth-child(even) .project-art{transform:perspective(1100px) rotateX(2deg)}}
body.motion-paused *,body.motion-paused *::before,body.motion-paused *::after{animation-play-state:paused!important;transition:none!important}
body.motion-paused .depth-entry,body.motion-paused .reveal{opacity:1!important;transform:none!important}
body.motion-paused .hero-brandboard,body.motion-paused .project-art,body.motion-paused .service,body.motion-paused .process-grid article,body.motion-paused .package-grid article,body.motion-paused .pricing-card,body.motion-paused .testimonial-card,body.motion-paused .about-panel{transform:none!important;translate:none!important}
@media(prefers-reduced-motion:reduce){
main>section::before,.hero-brandboard,.hero-brandboard::after{animation:none!important}
.motion-ready .depth-entry:not(.depth-arrived){opacity:1;transform:none}
.service,.process-grid article,.package-grid article,.pricing-card,.testimonial-card,.about-panel,.real-work .project-art,.real-work .project-card:nth-child(even) .project-art,.service:hover,.process-grid article:hover,.package-grid article:hover,.pricing-card:hover,.testimonial-card:hover,.about-panel:hover,.real-work .project-card:hover .project-art,.service .icon,.service:hover .icon{transform:none;translate:none}
.motion-control{display:none}
}