/* Approved trailer identity: green buildings/SYR, white VAC, neutral page. */
:root{--green:#626746;--ink:#20242a;--paper:#f1f3f5;--line:#d9dde2;--silver:#c8cdd3;--accent:#858653}
body{color:var(--ink)}
h1,h2,h3{font-weight:700;letter-spacing:-.035em}
:focus-visible{outline-color:#929b6b}
.preview{background:#171b20;color:#cbd0d5}
.header{background:#20242a;color:#fff;padding:12px var(--pad);border-bottom:1px solid #ffffff15;gap:22px;min-height:98px}
.brand{position:relative;display:block;width:280px;height:74px;overflow:hidden;flex-shrink:0}
.brand img.logo{position:absolute;width:315px;max-width:none;height:auto;left:-17px;top:-24px}
.header nav{gap:24px;white-space:nowrap}
.header nav a:hover{color:var(--silver)}
.contact-nav{background:#f1f3f5;color:#20242a;border:0;white-space:nowrap}
.language-switch{border-color:var(--accent);color:#fff}
.menu{color:#fff}
.mobile-nav{top:98px;background:#20242a;color:#fff;box-shadow:0 12px 24px #0003}
.mobile-nav a{border-color:#ffffff25}
.hero{background:#20242a;min-height:650px;height:calc(100svh - 132px);max-height:850px}
.hero .hero-shade,.hero.video-ready .hero-shade{background:linear-gradient(90deg,rgba(12,15,19,.86),rgba(12,15,19,.55) 40%,rgba(12,15,19,.05) 85%),linear-gradient(0deg,rgba(12,15,19,.32),transparent 40%)}
.hero-content{margin-left:0;padding:85px 0 110px var(--pad);max-width:min(780px,65%)}
.hero h1{font-size:clamp(44px,4.5vw,72px);line-height:1.08;font-weight:750;letter-spacing:-.04em}
.hero h1 em{font-family:inherit;font-size:1em;font-weight:700;font-style:normal;color:var(--silver)}
.hero .eyebrow{position:relative;letter-spacing:.18em;margin-bottom:38px;font-weight:500}
.hero .eyebrow:after{content:"";display:block;width:90px;height:2px;background:var(--accent);position:absolute;bottom:-16px;left:0}
.hero .dot{display:none}
.hero-description{color:#f1f3f5;max-width:470px;font-size:16px;line-height:1.6}
.button{font-weight:600}.button:hover{background:#e0e4e8}
.hero-bottom{justify-content:flex-end}
.hero-bottom button{border:1px solid #ffffff70;border-radius:24px;padding:9px 15px;background:#20242a55}
.about{grid-template-columns:1fr 1.65fr;gap:6%;padding-top:65px;padding-bottom:65px}
.about-number{border-color:var(--accent)}
.about-number strong{font-size:clamp(85px,10vw,160px);font-weight:750;color:#20242a;letter-spacing:-.065em;white-space:nowrap}
.about-number strong span{font-size:.55em;margin-left:14px;letter-spacing:-.04em}
.about-number p{font-weight:600;letter-spacing:0;font-size:17px;margin-left:0}
.about-copy h2{font-size:clamp(30px,2.6vw,42px)}
.about-copy .eyebrow,.section-heading .eyebrow,.services article>span,.sectors,.work-photo figcaption span{color:#555d65}
.about-copy>p:not(.eyebrow),.section-heading>p,.services article p,.equipment figcaption,.work-photo figcaption,.comparison-heading p{color:#59616b}
.text-link{border-color:#8b9197}.text-link:hover{color:#444b54}
.service-carousel{background:#20242a}
.service-shade{background:linear-gradient(90deg,rgba(12,15,19,.85),rgba(12,15,19,.55) 50%,rgba(12,15,19,.15)),linear-gradient(0deg,rgba(12,15,19,.5),transparent 40%)}
.service-copy>p:not(.eyebrow){color:#ecf0f3}
.night-copy .eyebrow,.night-copy p:not(.eyebrow){color:#c8cdd3}.night .text-link:hover{color:#fff}
.compare-label{background:#ffffffee}
.contact{background:#20242a}.contact>div>p:not(.eyebrow),.contact-details p{color:#d2d6dc}
.contact .eyebrow{border-left:2px solid var(--accent);padding-left:14px}
footer{background:#20242a;border-top:1px solid #ffffff25;color:#fff}
footer p,footer span{color:#c3c9cf}
.clients-original h2{font-weight:700;letter-spacing:-.035em}
@media(max-width:1150px){.header nav{gap:16px}.header .brand{width:240px;height:68px}.header .brand img.logo{width:274px;left:-16px;top:-21px}.header{gap:18px}.hero-content{max-width:70%}.hero h1{font-size:52px}}
@media(max-width:800px){.header nav{display:none}.menu{display:block}.language-switch{margin-left:auto}.hero-content{max-width:85%}}
@media(max-width:700px){.header{min-height:80px;padding:8px 20px;gap:16px}.header .brand{width:205px;height:64px}.header .brand img.logo{width:232px;left:-14px;top:-15px}.mobile-nav{top:80px}.hero{height:auto;min-height:650px}.hero-content{padding:100px 24px 100px;max-width:100%;margin:0}.hero h1{font-size:clamp(34px,8.5vw,54px)}.hero-description{font-size:15px;max-width:440px}.hero .hero-shade,.hero.video-ready .hero-shade{background:linear-gradient(90deg,rgba(12,15,19,.83),rgba(12,15,19,.40)),linear-gradient(0deg,rgba(12,15,19,.65),transparent 65%)}.hero-bottom #motion{font-size:10px}.about{grid-template-columns:1fr;gap:30px;padding:55px 24px}.about-number strong{font-size:100px}.about-number{border-bottom-color:var(--accent);padding-bottom:25px}.about-number p{font-size:16px}.about-copy h2{font-size:32px}.service-copy h2{font-size:36px}.night-copy h2,.contact h2{font-size:36px}footer .brand{width:240px;height:68px}footer .brand img.logo{width:274px;left:-16px;top:-21px}}
@media(max-width:360px){.header{gap:12px;padding-left:14px;padding-right:14px}.header .brand{width:185px}.header .brand img.logo{width:210px;left:-12px;top:-10px}}
.brand img.logo,.header .brand img.logo,footer .brand img.logo{position:static;display:block;width:100%;height:100%;max-width:100%;object-fit:contain}
.water-slide>img{transform:scale(1.02);transform-origin:60% 55%;object-position:60% center}.water-slide.active>img{animation:water-drift 18s ease-in-out infinite alternate}.water-slide .service-copy{padding-top:80px;max-width:660px}.water-slide .service-copy h2{font-size:clamp(34px,3.6vw,54px);font-weight:500;line-height:1.12;max-width:630px}.water-slide .service-copy>p:not(.eyebrow){max-width:560px;font-size:17px;line-height:1.75}.services-motion-paused .water-slide>img{animation-play-state:paused!important}@keyframes water-drift{from{transform:scale(1.02) translateX(0)}to{transform:scale(1.09) translateX(-.8%)}}@media(max-width:700px){.water-slide .service-copy{padding-top:55px}.water-slide .service-copy h2{font-size:34px}.water-slide .service-copy>p:not(.eyebrow){font-size:15px;line-height:1.7;margin-top:24px}.water-slide>img{object-position:62% center}}@media(prefers-reduced-motion:reduce){.water-slide.active>img{animation:none}}
.water-slide>img{object-position:50% 57%;transform-origin:55% 57%}@media(max-width:700px){.water-slide>img{object-position:50% 54%}}
.planning-slide>img{transform:scale(1.02);transform-origin:center;object-position:center}
.planning-slide.active>img{animation:planning-drift 20s ease-in-out infinite alternate}
.planning-slide .service-copy{padding-top:65px;max-width:680px}
.planning-slide .service-copy h2{font-size:clamp(34px,3.6vw,54px);font-weight:500;line-height:1.12}
.planning-slide .service-copy>p:not(.eyebrow){max-width:620px;font-size:17px;line-height:1.7;margin-top:20px}
.services-motion-paused .planning-slide>img{animation-play-state:paused!important}
@keyframes planning-drift{from{transform:scale(1.02) translateX(-.5%)}to{transform:scale(1.09) translateX(.5%)}}
@media(max-width:700px){.service-carousel:has(.planning-slide.active){height:auto;min-height:660px}.service-carousel:has(.planning-slide.active) .service-slides{position:relative}.planning-slide.active{position:relative;min-height:660px;padding-bottom:150px}.planning-slide .service-copy{padding-top:55px}.planning-slide .service-copy h2{font-size:34px}.planning-slide .service-copy>p:not(.eyebrow){font-size:15px;line-height:1.7}}
@media(prefers-reduced-motion:reduce){.planning-slide.active>img{animation:none}}
.team-slide{background:radial-gradient(ellipse at 75% 50%,#454b50 0%,#20242a 65%)}
.team-slide .service-copy{padding-top:55px;width:31%;max-width:520px}
.team-slide .service-copy h2{font-size:clamp(32px,3.4vw,48px);font-weight:500;line-height:1.12}
.team-slide .service-copy>p:not(.eyebrow){font-size:16px;line-height:1.6;margin-top:18px}
.team-visual{position:absolute;right:2%;bottom:110px;width:58%;margin:0}
.team-visual img{display:block;width:100%;height:auto;transform-origin:center bottom}
.team-visual figcaption{text-align:center;font-size:11px;color:#c3c9cf;margin-top:15px;letter-spacing:.02em}
.team-slide.active .team-visual img{animation:team-drift 18s ease-in-out infinite alternate}
.services-motion-paused .team-visual img{animation-play-state:paused!important}
@keyframes team-drift{from{transform:scale(.98) translateX(-.4%)}to{transform:scale(1.015) translateX(.4%)}}
@media(max-width:900px){.service-carousel:has(.team-slide.active){height:auto;min-height:660px}.service-carousel:has(.team-slide.active) .service-slides{position:relative}.team-slide.active{position:relative;display:flex;flex-direction:column;gap:26px;min-height:660px;padding-bottom:150px}.team-slide .service-copy{padding-top:48px;width:auto;max-width:660px}.team-slide .service-copy h2{font-size:34px}.team-slide .service-copy>p:not(.eyebrow){font-size:15px;margin-top:20px}.team-visual{position:relative;right:auto;bottom:auto;width:calc(100% - 32px);margin:0 auto}}
@media(prefers-reduced-motion:reduce){.team-slide.active .team-visual img{animation:none}}
.equipment-slide>img{object-position:65% center;transform:scale(1.02);transform-origin:65% center}
.equipment-slide.active>img{animation:equipment-forward 18s ease-in-out infinite alternate}
@keyframes equipment-forward{from{transform:scale(1.02)}to{transform:scale(1.12)}}
.equipment-slide .service-shade{background:linear-gradient(90deg,rgba(12,15,19,.94),rgba(12,15,19,.78) 40%,rgba(12,15,19,.15) 78%)}
.equipment-slide .service-copy{padding-top:55px;max-width:620px}
.equipment-slide .service-copy h2{font-size:clamp(32px,3.4vw,48px);font-weight:500;line-height:1.12}
.equipment-slide .service-copy>p:not(.eyebrow){font-size:16px;line-height:1.65;max-width:560px;margin-top:20px}
.equipment-slide .service-copy .historical-caption{font-size:11px;color:#c3c9cf;margin-top:22px;letter-spacing:.02em}
.services-motion-paused .equipment-slide>img{animation-play-state:paused!important}
@media(max-width:700px){.service-carousel:has(.equipment-slide.active){height:auto;min-height:660px}.service-carousel:has(.equipment-slide.active) .service-slides{position:relative}.equipment-slide.active{position:relative;min-height:660px;padding-bottom:150px}.equipment-slide .service-copy{padding-top:48px}.equipment-slide .service-copy h2{font-size:34px}.equipment-slide .service-copy>p:not(.eyebrow){font-size:15px}.equipment-slide .service-copy .historical-caption{font-size:11px}.equipment-slide .service-shade{background:linear-gradient(90deg,rgba(12,15,19,.88),rgba(12,15,19,.66))}}
@media(prefers-reduced-motion:reduce){.equipment-slide.active>img{animation:none}}
.hero .hero-content{position:absolute;left:calc(100% - var(--pad));top:32px;transform:translate(-100%,0);width:min(510px,44%);max-width:none;margin:0;padding:0;animation:none;transition:left 1.6s ease-in-out,top 1.6s ease-in-out,transform 1.6s ease-in-out;z-index:2}
.hero .hero-content h1{font-size:clamp(34px,3.6vw,58px)}
.hero .hero-content .hero-description{font-size:15px;line-height:1.6;margin:20px 0 24px}
.hero .hero-content .button.light{background:rgba(12,15,19,.3);color:#fff;border:1px solid rgba(255,255,255,.4);padding:12px 18px;font-size:12px;box-shadow:none;transition:background .2s,border-color .2s}
.hero .hero-content .button.light:hover{background:rgba(12,15,19,.55);border-color:rgba(255,255,255,.7)}
.hero.hero-video-mode .hero-content{left:var(--pad);top:calc(100% - 90px);transform:translate(0,-100%)}
.hero.hero-photo-mode .hero-shade,.hero.hero-video-mode .hero-shade{background:linear-gradient(0deg,rgba(12,15,19,.55),rgba(12,15,19,.1));isolation:isolate}
.hero .hero-shade::before,.hero .hero-shade::after{content:'';position:absolute;inset:0;transition:opacity 1.6s ease-in-out}
.hero .hero-shade::before{background:linear-gradient(270deg,rgba(12,15,19,.83),rgba(12,15,19,.45) 50%,rgba(12,15,19,.08));opacity:1}
.hero .hero-shade::after{background:linear-gradient(90deg,rgba(12,15,19,.83),rgba(12,15,19,.45) 50%,rgba(12,15,19,.08));opacity:0}
.hero.hero-video-mode .hero-shade::before{opacity:0}.hero.hero-video-mode .hero-shade::after{opacity:1}
@media(max-width:700px){.hero{min-height:720px}.hero .hero-content{width:min(440px,82%);top:28px;left:calc(100% - 24px)}.hero.hero-video-mode .hero-content{left:24px;top:calc(100% - 90px)}.hero .hero-content h1{font-size:clamp(28px,6vw,40px)}.hero .hero-content .hero-description{font-size:14px}.hero .hero-content .eyebrow{font-size:9px;margin-bottom:18px}}
.work-photo-crop{position:relative;width:100%;aspect-ratio:1536/941;overflow:hidden}
.work-photo .work-photo-crop img{display:block;width:100%;height:100%;object-fit:cover;object-position:center top}
.work-photo.visible .work-photo-crop img{animation:floor-photo-drift 12s ease-in-out infinite alternate;transform-origin:55% 45%}
.work-photo.photo-paused .work-photo-crop img{animation-play-state:paused}
.work-photo-motion{position:absolute;right:12px;bottom:12px;border:1px solid #ffffff70;border-radius:24px;padding:0;width:36px;height:36px;color:#fff;background:#0c182875;font-size:14px;z-index:1}
@keyframes floor-photo-drift{from{transform:scale(1)}to{transform:scale(1.09)}}
@media(prefers-reduced-motion:reduce){.work-photo.visible .work-photo-crop img{animation:none}}

/* Desktop: show complete service photos beside the copy. */
@media(min-width:901px){
  .service-carousel:has(:is(.water-slide,.planning-slide,.equipment-slide,.team-slide).active){height:clamp(600px,calc(100svh - 100px),720px)}
  .service-slide:is(.water-slide,.planning-slide,.equipment-slide)>img{left:auto;right:1.5%;top:20px;width:54%;height:calc(100% - 112px);object-fit:contain;object-position:center;transform-origin:center;transform:scale(1)}
  .service-slide:is(.water-slide,.planning-slide,.equipment-slide).active>img{animation:none;transform:none}
  .service-slide:is(.water-slide,.planning-slide,.equipment-slide) .service-copy{width:37%;max-width:620px;margin-left:var(--pad);margin-right:0;padding-top:60px}
  .service-slide:is(.water-slide,.planning-slide,.equipment-slide) .service-copy h2{font-size:clamp(30px,2.8vw,44px)}
  .service-slide:is(.water-slide,.planning-slide,.equipment-slide) .service-copy>p:not(.eyebrow){font-size:16px;line-height:1.65;margin-top:20px}
  .service-slide:is(.water-slide,.planning-slide,.equipment-slide) .service-shade{background:linear-gradient(90deg,rgba(12,15,19,.4),transparent 48%);pointer-events:none}
  .service-carousel:has(.drain-slide.active){height:700px}
  .service-slide.drain-slide .drain-comparison{right:1.5%;top:20px;width:min(51%,580px)}
  .service-slide.drain-slide .service-copy{width:37%;max-width:620px}
  .service-slide.drain-slide .service-copy h2{font-size:clamp(30px,2.8vw,44px)}
  .team-slide .team-visual{top:32px;bottom:auto;right:3%;width:51%;height:calc(100% - 150px);display:flex;flex-direction:column;justify-content:center}
  .team-slide .team-visual img{height:calc(100% - 32px);width:100%;object-fit:contain;object-position:center}
  .team-slide.active .team-visual img{animation:none;transform:none}
  .team-slide .service-copy{width:37%;padding-top:45px}
  .team-slide .service-copy h2{font-size:clamp(30px,2.8vw,44px)}
}

/* Keep the full floor photographs visible on desktop. */
@media(min-width:901px){
  .results .work-photo,.results .comparison,.results .comparison-heading{width:100%;max-width:820px;margin-left:auto;margin-right:auto}
  .results .comparison{height:auto;aspect-ratio:960/719}
  .results .comparison>img{object-fit:contain}
  .results .work-photo.visible .work-photo-crop img{animation-name:floor-photo-desktop}
  @keyframes floor-photo-desktop{from{transform:scale(1)}to{transform:scale(1.03)}}
}
