/* Responsive overrides; desktop composition remains the source of truth. */
@media(max-width:1250px) and (min-width:901px){
.site-header .tagline{left:200px;max-width:220px;font-size:12px}.site-header nav{left:auto;right:150px;gap:18px}.site-header .work-link{left:53%;width:140px}.work-preview{width:140px}.work-link:hover .work-preview{width:152px}
.services-section{grid-template-columns:58% 42%;gap:0}.services-pinned h2,.projects-intro h2,.agency-section h2,.contact-section h2{font-size:38px}.services-pinned h2{padding-right:24px}.service-category,.service-hover-media{left:86.2%}.service-details{padding-left:18px}.service-introduction{height:auto;margin-bottom:80px}.service-group ul{padding-left:40px}.contact-details{left:60%}.contact-footer{grid-template-columns:60% 40%}.contact-notice{padding-right:30px}.agency-copy{margin-left:42%;max-width:58%}
}
@media(max-width:900px){
:root{--section-gap:140px}main{padding:0 20px}.site-header{height:84px}.site-header .brand{left:20px;top:15px}.site-header .tagline{display:none}.site-header .hello{right:20px;top:15px}.site-header .work-link{left:20px;transform:none;top:51px;width:auto;text-align:left;line-height:18px;padding-bottom:14px}.site-header nav{left:auto;right:20px;top:51px;gap:28px}.work-preview{left:0;transform:none;top:32px;width:132px}.work-link:hover .work-preview{width:144px}.preview-track{top:73px}
.hero{padding-top:260px;min-height:620px}.hero h1{font-size:min(64px,calc((100svh - 280px)/5),calc((100vw - 40px)/12));width:100%}
.projects-intro{height:auto;padding-bottom:90px}.projects-intro h2,.services-pinned h2,.agency-section h2,.contact-section h2{font-size:clamp(32px,4.9vw,44px);line-height:1.08;letter-spacing:-.025em}.projects-intro p{position:static;transform:none;width: min(446px,100%);margin:56px auto 0}.projects-intro h2 .intro-line>span,.services-pinned h2 .intro-line>span,.agency-section h2 .intro-line>span,.contact-section h2 .intro-line>span{white-space:normal}
.project-meta{grid-template-columns:1fr 1fr;line-height:1.3;font-size:14px;gap:16px;padding-top:14px}.project-meta>span:nth-child(2){text-align:right;white-space:normal}.project-card{margin-bottom:40px}.all-projects{margin-top:50px}
.services-section{display:block}.services-pinned{position:relative;top:auto;height:auto;min-height:0;margin-bottom:60px}.services-pinned h2{max-width:680px}.service-category,.service-hover-media{display:none!important}.service-details{max-width:620px;margin-left:25%;font-size:16px}.service-introduction{height:auto;max-width:none;margin-bottom:70px}.service-introduction p,.service-introduction p:nth-child(2){max-width:none}.service-group{margin-bottom:70px}.service-group::before{content:attr(data-category) '   :';display:block;font-size:30px;font-weight:900;letter-spacing:-.025em;margin-bottom:32px;white-space:pre}.service-group p{min-height:0;max-width:none!important}.service-group ul{padding-left:40px;margin:18px 0 26px}.service-group h3:not(:first-of-type){margin-top:30px}.service-touch-preview{display:block;margin-top:24px;max-width:100%;width:100%;height:auto;max-height:65svh;object-fit:contain;object-position:left center}.service-touch-preview[hidden]{display:none}
.agency-section{min-height:0}.agency-section h2{height:auto;max-width:680px}.agency-copy{margin:60px 0 0 25%;width:auto;max-width:620px}.agency-copy p:first-child,.agency-copy p:last-child{max-width:none}.agency-copy p{margin-bottom:18px}.press-ribbon{top:50%;width:calc(100vw + 480px)}
.contact-section{height:auto;min-height:0;padding-bottom:24px}.contact-section h2{max-width:600px}.contact-details{position:static;margin:60px 0 80px 25%;display:grid;grid-template-columns:1fr 1fr;gap:36px}.contact-address,.contact-social{margin-top:0}.contact-footer{position:static;grid-template-columns:1fr;gap:30px}.contact-notice{max-width:620px}.contact-privacy{justify-self:start}
#work,#services,#about,#contact{scroll-margin-top:110px}
}
@media(max-width:600px){
:root{--section-gap:100px}main{padding:0 16px}.site-header{font-size:13px}.site-header .brand{left:16px}.site-header .hello{right:16px}.site-header .work-link{left:16px}.site-header nav{right:16px;gap:20px}.work-preview{width:112px}.work-link:hover .work-preview{width:112px}.preloader-mask{font-size:clamp(20px,5.8vw,28px)}
.hero{height:100svh;min-height:650px;padding:260px 0 24px}.hero h1{font-size:clamp(36px,9.25vw,56px);line-height:1.04;letter-spacing:-.035em}.hero .line,.hero .line>span{display:inline;white-space:normal;padding:0;margin:0;overflow:visible;will-change:auto;backface-visibility:visible}.hero .line:not(:last-child)::after{content:' '}.motion-ready .hero .line>span{animation:none;transform:none}.hero .line:last-child{padding:0;margin:0}.motion-ready .hero h1{animation:mobile-hero-reveal 660ms cubic-bezier(.22,1,.36,1) both}
.projects-intro{padding-bottom:50px}.projects-intro h2,.services-pinned h2,.agency-section h2,.contact-section h2{font-size:32px}.projects-intro h2 .intro-line,.services-pinned h2 .intro-line,.agency-section h2 .intro-line,.contact-section h2 .intro-line{display:inline}.projects-intro h2 .intro-line::after,.services-pinned h2 .intro-line::after,.agency-section h2 .intro-line::after,.contact-section h2 .intro-line::after{content:' '}.projects-intro h2 .intro-line>span,.services-pinned h2 .intro-line>span,.agency-section h2 .intro-line>span,.contact-section h2 .intro-line>span{display:inline;animation:none!important;transform:none!important;visibility:visible}.intro-motion h2{opacity:1}.projects-intro p{margin-top:36px;text-align:left;font-size:15px}.project-photo,.project-cle .project-photo{aspect-ratio:1.25}.project-photo>img{width:100%!important;height:100%!important;inset:0!important;object-fit:cover!important}.project-cle .project-photo>img{object-position:39% center!important}.project-cta{font-size:12px;padding:7px 11px;left:auto!important;right:12px;top:auto!important;bottom:12px;transform:none!important}.project-photo.is-pointer-active .project-cta,.project-card:focus-visible .project-cta{transform:none}.project-meta{font-size:12px;gap:10px}.project-card{margin-bottom:30px}
.services-pinned{margin-bottom:40px}.service-details,.agency-copy{margin-left:0;max-width:none}.service-introduction{margin-bottom:60px}.service-group::before{font-size:28px;margin-bottom:24px}.service-group ul{padding-left:28px;line-height:1.4}.service-group{margin-bottom:60px}.service-details,.agency-copy,.contact-section{font-size:15px;line-height:1.4}.service-group h3{font-size:15px}.agency-copy{margin-top:40px}.press-ribbon{height:76px}.press-track{height:76px}.press-run{gap:50px;padding-right:50px}.contact-details{margin:44px 0 65px;gap:32px 20px}.contact-group h3{font-size:15px}.contact-address address{font-size:14px}.contact-footer{font-size:12px;line-height:1.4}.contact-copyright,.contact-notice{line-height:1.5}.contact-privacy{font-size:13px}
}
@keyframes mobile-hero-reveal{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@media(max-width:360px){.site-header{font-size:12px}.site-header nav{gap:14px}.hero h1{font-size:34px}.contact-details{grid-template-columns:1fr}.contact-address address{font-size:15px}}
@media(prefers-reduced-motion:reduce){.motion-ready .hero h1{animation:none}}

@media(max-width:900px){html{overflow-x:clip}.work-preview{max-height:109px}.preview-track{top:54.5px;height:109px;aspect-ratio:auto}}
@media(max-width:600px){.work-preview{max-height:92px}.preview-track{top:46px;height:92px}}

.menu-toggle,.mobile-preview{display:none}
@media(max-width:900px){
.site-header{height:56px}.site-header .brand{top:19px}.site-header nav,.site-header .work-link,.site-header .hello{display:none}.site-header .work-preview{display:none!important}
.menu-toggle{position:absolute;right:16px;top:10px;width:44px;height:36px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border:0;background:none;color:#030303;cursor:pointer;z-index:2}.menu-toggle span{display:block;width:25px;height:2px;background:currentColor;transition:transform 220ms ease}.mobile-menu-open .menu-toggle span:first-child{transform:translateY(4px) rotate(45deg)}.mobile-menu-open .menu-toggle span:last-child{transform:translateY(-4px) rotate(-45deg)}
.mobile-menu-open.site-header{height:100svh;background:#f6f6f6}.mobile-menu-open.site-header .work-link{display:block;top:115px;left:24px;transform:none;font-size:36px;font-weight:900;padding:0;text-align:left;width:auto}.mobile-menu-open.site-header nav{display:flex;position:absolute;left:24px;right:auto;top:185px;flex-direction:column;gap:28px;font-size:36px;font-weight:900;line-height:1.15;align-items:flex-start}.mobile-menu-open.site-header .hello{display:block;top:auto;bottom:42px;left:24px;right:auto;font-size:20px}.mobile-menu-open.site-header .brand{z-index:2}
.hero{height:auto;min-height:100svh;padding:110px 0 48px;display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;gap:54px}.hero h1{font-size:clamp(36px,6.4vw,62px)}
.mobile-preview{display:block;position:relative;flex:none;width:156px;height:129px;overflow:hidden;align-self:center;background:#dedede}.mobile-preview .preview-track{inset:0;top:50%;height:100%;width:calc(100% + 4px);left:-2px;transform:translateY(-50%)}.mobile-preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;visibility:hidden}.mobile-preview img.is-active{visibility:visible}
#work,#services,#about,#contact{scroll-margin-top:80px}
}
@media(max-width:600px){.hero h1{font-size:clamp(36px,9.25vw,56px)}.hero{min-height:100svh}.mobile-preview{width:156px;height:129px}}

@media(max-width:900px){.project-meta{grid-template-columns:1fr;gap:6px;line-height:1.35}.project-meta>span:nth-child(2){text-align:left;white-space:normal}}

@media(max-width:900px){.project-meta{line-height:1.2}}
@media(max-width:600px){.service-details,.agency-copy,.contact-section{line-height:1.3}.service-introduction p,.service-group p{line-height:19.5px}.service-group ul{line-height:19px}.contact-address address,.contact-phone{line-height:19.5px}.contact-copyright,.contact-notice{line-height:1.35}}

@media(max-width:900px){.project-meta{gap:3px;line-height:1.15}.service-introduction p,.service-group p,.service-group ul,.service-view{font-size:inherit}}

@media(max-width:900px){.site-header{height:48px}.site-header .brand{top:15px}.site-header .hello,.mobile-menu-open.site-header .hello{display:block;position:absolute;top:15px;right:65px;left:auto;bottom:auto;font-size:13px;line-height:17px;z-index:2}.menu-toggle{top:6px}.mobile-menu-open.site-header .brand{top:15px}}
@media(max-width:360px){.site-header .brand{font-size:11px}.site-header .hello,.mobile-menu-open.site-header .hello{font-size:12px;right:59px}.menu-toggle{right:10px}}

/* Unified responsive body type and compact action order. */
@media(max-width:900px){.site-header,.site-header .brand,.site-header .hello,.mobile-menu-open.site-header .hello{font-size:14px;line-height:18px}.site-header .hello,.mobile-menu-open.site-header .hello{right:16px}.menu-toggle{right:108px;width:36px}.site-header .brand{top:15px}.projects-intro p,.project-meta,.project-cta,.all-projects,.service-details,.service-group h3,.service-group ul,.service-view,.agency-copy,.contact-section,.contact-group h3,.contact-address address,.contact-footer,.contact-privacy{font-size:14px}.service-introduction p,.service-group p,.agency-copy{line-height:18.2px}.service-group ul{line-height:18px}.contact-phone,.contact-address address,.contact-copyright,.contact-notice{line-height:18.2px}.project-meta{line-height:1.15}.mobile-menu-open.site-header .work-link,.mobile-menu-open.site-header nav{font-size:14px;line-height:20px;font-weight:600}.mobile-menu-open.site-header .work-link{top:110px}.mobile-menu-open.site-header nav{top:160px;gap:26px}}
@media(max-width:360px){.site-header .brand{font-size:14px;left:12px;letter-spacing:-.03em}.site-header .hello,.mobile-menu-open.site-header .hello{font-size:14px;right:12px}.menu-toggle{right:94px;width:32px}}

@media(max-width:900px){.site-header .hello,.mobile-menu-open.site-header .hello{right:65px}.menu-toggle{right:12px;width:36px}}
@media(max-width:360px){.site-header .hello,.mobile-menu-open.site-header .hello{right:54px}.menu-toggle{right:8px;width:32px}}

.mobile-hero-action{display:none}
@media(max-width:900px){.site-header .hello{display:none}.mobile-menu-open.site-header .hello{display:block;top:auto;bottom:40px;left:24px;right:auto;font-size:14px}.mobile-hero-action{display:flex;flex-direction:column;align-items:center;gap:20px;align-self:center}.mobile-hero-action>a{font-size:14px;line-height:18px;font-weight:600}.mobile-hero-action .mobile-preview{align-self:auto}}

@media(max-width:900px){.projects-intro p{margin-top:32px}.services-pinned{margin-bottom:32px}.agency-copy{margin-top:32px}.contact-details{margin-top:32px}.service-group::before{margin-bottom:22px}.service-group h3{margin-bottom:8px}}
@media(max-width:600px){.projects-intro p{margin-top:24px}.services-pinned{margin-bottom:24px}.agency-copy{margin-top:24px}.contact-details{margin-top:24px}.service-group::before{margin-bottom:18px}}

@media(max-width:900px){:root{--section-gap:120px}}
@media(max-width:600px){:root{--section-gap:80px}}

@media(max-width:900px){.service-introduction{margin-bottom:56px}.service-group{margin-bottom:56px}.service-group h3:not(:first-of-type){margin-top:24px}.service-group ul{margin:14px 0 21px}.service-group::before{margin-bottom:18px}}
@media(max-width:600px){.service-introduction{margin-bottom:48px}.service-group{margin-bottom:48px}.service-group h3:not(:first-of-type){margin-top:24px}.service-group::before{margin-bottom:14px}.service-group ul{margin:14px 0 20px}}

/* Compact drawer rhythm; a full navigation row fits wider tablets. */
@media(max-width:759px){.mobile-menu-open.site-header .work-link{top:100px;line-height:18px}.mobile-menu-open.site-header nav{top:134px;gap:14px;line-height:18px}}
@media(min-width:760px) and (max-width:900px){
.site-header{display:flex;align-items:center;height:48px;padding:0 20px;gap:32px}
.site-header .brand{position:static;margin-right:auto;white-space:nowrap;line-height:18px}
.site-header .work-link{display:block;position:static;transform:none;width:auto;text-align:left;padding:0;line-height:18px;white-space:nowrap}
.site-header nav{display:flex;position:static;gap:24px;line-height:18px;white-space:nowrap}
.site-header .menu-toggle,.site-header .hello{display:none}
}

@media(min-width:760px) and (max-width:900px){.site-header{gap:22px}.site-header nav{gap:20px}.site-header .hello{display:block;position:static;font-size:14px;line-height:18px;white-space:nowrap;margin-left:4px}.mobile-preview{width:220px;height:182px}.mobile-hero-action>a{display:none}}

.menu-address{display:none}
@media(max-width:759px){.mobile-menu-open.site-header .menu-address{display:block;position:absolute;left:24px;right:24px;bottom:94px;margin:0;font-size:14px;font-style:normal;font-weight:600;line-height:18.2px}}
@media(max-width:759px) and (max-height:480px){.mobile-menu-open.site-header{overflow-y:auto}.mobile-menu-open.site-header .menu-address{top:290px;bottom:auto}.mobile-menu-open.site-header .hello{top:374px;bottom:auto}.mobile-menu-open.site-header{min-height:430px}}

@media(max-width:759px){
.site-header{--menu-inset:20px}
.mobile-menu-open.site-header .work-link,.mobile-menu-open.site-header nav,.mobile-menu-open.site-header .hello,.mobile-menu-open.site-header .menu-address{left:var(--menu-inset)}
.menu-toggle svg{display:block;width:26px;height:18px;overflow:visible}
.menu-toggle path{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:butt;vector-effect:non-scaling-stroke;transform-origin:13px 9px;transition:transform 220ms ease}
.menu-toggle path:first-child{transform:translateY(-4px)}.menu-toggle path:last-child{transform:translateY(4px)}
.mobile-menu-open .menu-toggle path:first-child{transform:rotate(45deg)}.mobile-menu-open .menu-toggle path:last-child{transform:rotate(-45deg)}
}
@media(max-width:600px){.site-header{--menu-inset:16px}}
@media(prefers-reduced-motion:reduce){.menu-toggle path{transition:none}}

@media(max-width:600px){:root{--section-gap:84px}.mobile-hero-action{align-self:flex-start;align-items:flex-start}.hero{padding-bottom:0}.projects-section,.services-section,.agency-section,.contact-section{margin-top:var(--section-gap)}}

@media(max-width:600px){.projects-intro{padding-bottom:30px}}

@media(max-width:600px){.all-projects{text-align:left}}

/* Shared spacing rhythm for tablet and mobile layouts. */
@media(max-width:900px){
:root{--space-related:8px;--space-copy:16px;--space-heading:24px;--space-content:40px;--space-category:48px}
.projects-intro{padding-bottom:var(--space-content)}
.projects-intro p{margin-top:var(--space-heading);margin-bottom:0}
.project-meta{padding-top:12px;gap:4px}
.project-card{margin-bottom:32px}
.project-card:last-child{margin-bottom:0}
.all-projects{margin-top:var(--space-content)}
.services-pinned{margin-bottom:var(--space-heading)}
.service-introduction{margin-bottom:var(--space-content)}
.service-introduction p{margin-bottom:var(--space-copy)}
.service-introduction p:last-child{margin-bottom:0}
.service-group{margin-bottom:var(--space-category)}
.service-group:last-child{margin-bottom:0}
.service-group::before{margin-bottom:var(--space-heading)}
.service-group h3{margin-bottom:var(--space-related)}
.service-group h3:not(:first-of-type){margin-top:var(--space-heading)}
.service-group ul{margin-top:var(--space-copy);margin-bottom:var(--space-heading)}
.service-touch-preview{margin-top:var(--space-heading)}
.agency-copy{margin-top:var(--space-heading)}
.agency-copy p{margin-bottom:var(--space-copy)}
.agency-copy p:last-child{margin-bottom:0}
.contact-details{margin-top:var(--space-heading);margin-bottom:var(--space-content);gap:var(--space-content)}
.contact-group h3{margin-bottom:var(--space-related)}
.contact-footer{gap:var(--space-content)}
.contact-copyright{margin-bottom:var(--space-related)}
.mobile-hero-action{gap:var(--space-heading)}
}

/* Services spacing matched to the supplied responsive reference. */
@media(max-width:900px){
.services-pinned{margin-bottom:32px}
.service-introduction p{margin-bottom:12px}
.service-introduction p:last-child{margin-bottom:0}
.service-introduction{margin-bottom:40px}
.service-group::before{margin-bottom:24px}
.service-group h3{margin-bottom:8px}
.service-group h3:not(:first-of-type){margin-top:8px}
.service-group ul{padding-left:68px;margin-top:12px;margin-bottom:8px}
.service-group{margin-bottom:48px}
.service-group:last-child{margin-bottom:0}
}

/* Stable mobile image boxes and proportional ribbon scaling. */
@media(max-width:600px){
.mobile-preview{width:min(240px,66vw);height:auto;aspect-ratio:177/146}
.mobile-preview .preview-track{position:relative;inset:auto;left:0;top:0;width:100%;height:100%;aspect-ratio:177/146;transform:none}
.mobile-preview img{height:100%;width:100%;object-fit:cover}
.project-photo,.project-cle .project-photo{height:calc((100vw - 32px)/1.25);aspect-ratio:auto;isolation:isolate}
.project-photo>img{position:absolute;width:100%!important;height:100%!important;object-fit:cover!important;transform:none;backface-visibility:visible}
.press-ribbon{height:56px}.press-scale{transform:scale(.65);transform-origin:left top;width:max-content;height:86px}.press-track{height:86px}
}

/* Content-led mobile hero: consistent gaps instead of viewport distribution. */
@media(max-width:600px){
.hero{height:auto;min-height:0;padding-top:110px;padding-bottom:0;justify-content:flex-start;gap:40px}
.mobile-preview{width:220px;max-width:calc(100vw - 32px);height:181.47px;aspect-ratio:177/146}
.mobile-hero-action{gap:24px;align-items:flex-start;align-self:flex-start}
}

@media(max-width:600px){.hero{min-height:100svh;justify-content:flex-start;gap:40px}}

@media(max-width:600px){.project-cta{display:none!important}}
@media(max-width:759px){
.mobile-menu-open.site-header .tagline{display:block;position:absolute;left:var(--menu-inset);top:47px;width:auto;max-width:calc(100vw - 32px);font-size:14px;font-weight:600;line-height:18.2px;white-space:normal}
.mobile-menu-open.site-header .work-link{top:120px}
.mobile-menu-open.site-header nav{top:154px}
}

@media(max-width:759px){.mobile-menu-open.site-header .tagline{top:33.2px;line-height:18.2px}}
