/* Final V4: one alignment guide and one typographic scale throughout the original design. */
:root{--page-gutter:clamp(26px,9vw,180px);--media-gutter:var(--page-gutter);--text-gutter:var(--page-gutter);--copy-inset:0px;--size-section:clamp(38px,3.8vw,68px);--size-display:clamp(42px,4.2vw,76px);--size-card:clamp(23px,1.65vw,30px);}
header{padding-left:var(--page-gutter);padding-right:var(--page-gutter);}
.wrap,.hero.wrap,.work-page.wrap,.about-applications.wrap,.contact.wrap{padding-left:var(--page-gutter);padding-right:var(--page-gutter);}
.menu{padding-left:var(--page-gutter);padding-right:var(--page-gutter);}
.hero h1{font-size:var(--size-display);line-height:1.13;max-width:1050px;margin-left:0;margin-right:0;letter-spacing:0;}
.hero .services-line{margin-left:0;margin-right:0;max-width:1000px;font-size:clamp(17px,1.4vw,24px);}
.hero .hero-art{width:100%;margin:0;}
.scroll-scenes .quote-stage{padding-left:var(--page-gutter);padding-right:var(--page-gutter);gap:6vw;grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
.scroll-scenes .quote-images{height:68svh;max-height:640px;}
.statement{padding:95px var(--page-gutter) 80px;}
.statement .big-copy{max-width:1200px;width:85%;margin:0 auto;text-align:center;font-size:clamp(30px,2.9vw,50px);line-height:1.35;}
.gallery-heading{margin-left:var(--page-gutter);margin-right:var(--page-gutter);}
.work-title,.work-page h1,.about-applications>.section-label,.awards>h2,.contact h2{font-size:var(--size-section);font-weight:400;line-height:1.15;letter-spacing:0;}
.work-page h1{margin-left:0;margin-right:0;}
.horizontal-track{padding-left:var(--page-gutter);padding-right:var(--page-gutter);}
.work-features,.application-grid{max-width:none;width:100%;margin-left:0;margin-right:0;gap:40px 32px;}
.work-feature,.work-feature:hover,.work-feature-image{cursor:default;}
.work-feature-name,.application-grid h2{font-size:var(--size-card);line-height:1.25;}
.about-applications>.section-label{margin:0 0 34px;text-transform:none;}
.about-applications>.about-intro{font-size:clamp(16px,1.9vw,32px);font-weight:400;line-height:1.55;letter-spacing:0;max-width:none;width:100%;margin:0 0 65px;}
.application-grid p{font-size:clamp(15px,1vw,18px);line-height:1.65;}
.awards>h2{margin-bottom:35px;}
.contact h2{margin-bottom:20px;}
@media(max-width:1100px){:root{--page-gutter:6vw;}.about-applications>.about-intro{width:100%;}.statement .big-copy{width:92%;}.scroll-scenes .quote-stage{gap:4vw;}.application-grid{gap:32px 25px;}}
@media(max-width:700px){
 :root{--page-gutter:24px;--size-section:38px;--size-display:clamp(34px,8.4vw,43px);--size-card:24px;}
 header{height:85px;}.hero h1{margin-left:0;margin-right:0;}.hero .services-line{margin-left:0;margin-right:0;font-size:16px;}
 .scroll-scenes .quote-stage{padding-left:var(--page-gutter);padding-right:var(--page-gutter);gap:18px;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);}
 .scroll-scenes .quote-images{height:min(50svh,100vw);max-height:none;}
 .statement{padding:65px var(--page-gutter);}.statement .big-copy{width:100%;font-size:27px;line-height:1.4;}
 .gallery-heading{margin-left:var(--page-gutter);margin-right:var(--page-gutter);}.horizontal-track{padding-left:var(--page-gutter);padding-right:var(--page-gutter);}
 .about-applications>.section-label{margin-bottom:25px;}.about-applications>.about-intro{width:100%;font-size:24px;margin-bottom:40px;}
 .work-features{gap:32px;}.application-grid{gap:38px;}.work-feature-name,.application-grid h2{font-size:var(--size-card);}
 .contact h2{font-size:var(--size-section);}.contact .contact-heading{gap:18px;}
}

/* Desktop line lengths follow the requested one-line About and two-line introduction. */
@media(min-width:701px){.about-applications>.about-intro{white-space:nowrap;}}
.hero .services-line{max-width:none;width:100%;}
@media(min-width:1000px){.hero .services-line .intro-line{display:block;white-space:nowrap;}}

/* The film widens on scroll; its height stays fixed so the next scene does not jump. */
.hero .hero-art{
 width:calc(100% + 2 * var(--hero-bleed,0px));
 margin-left:calc(-1 * var(--hero-bleed,0px));
 height:calc(var(--hero-base-width,calc(100vw - 2 * var(--page-gutter))) / 1.95);
 aspect-ratio:auto;
}
@media(max-width:700px){
 .hero .hero-art{height:calc(var(--hero-base-width,calc(100vw - 2 * var(--page-gutter))) / 1.85);}
}
