.image-canvas{display:block;position:relative;overflow:hidden;width:100%;aspect-ratio:16/10;background:transparent;isolation:isolate}
.image-canvas>img{position:absolute;display:block}
.hero-direction-2 .hero-project-frame>.image-canvas,.hero-direction-3 .hero-project-frame>.image-canvas{height:100%;aspect-ratio:auto}
.gallery-open>.image-canvas,.project-image>.image-canvas,.dialog-image>.image-canvas,#service-art>.image-canvas{position:absolute;inset:0;height:100%;aspect-ratio:auto}
#service-art{position:relative;width:100%;height:100%}
.custom-colors{--deep:var(--custom-primary);--green:var(--custom-primary);--paper:var(--custom-paper);--ink:var(--custom-ink);--accent:var(--custom-primary);--muted:color-mix(in srgb,var(--custom-ink) 68%,var(--custom-paper));--line:color-mix(in srgb,var(--custom-ink) 22%,var(--custom-paper));background:var(--custom-paper);color:var(--custom-ink)}
.custom-colors .site-header,.custom-colors footer,.custom-colors .discipline-strip,.custom-colors .sectors{background:var(--custom-primary);color:var(--custom-on-primary)}
.custom-colors nav,.custom-colors footer a,.custom-colors .footer-bottom,.custom-colors .footer-top>p,.custom-colors .back-top{color:var(--custom-on-primary)}
.custom-colors .hero,.custom-colors .section,.custom-colors .capabilities,.custom-colors .about,.custom-colors .enquiry{background:var(--custom-paper);color:var(--custom-ink)}
.custom-colors h1,.custom-colors h2,.custom-colors h3,.custom-colors .hero-intro,.custom-colors .contact-value,.custom-colors address,.custom-colors .large-copy,.custom-colors .project-meta,.custom-colors .service-detail{color:var(--custom-ink)}
.custom-colors .eyebrow,.custom-colors .contact-label,.custom-colors .project-category,.custom-colors .contact-action,.custom-colors .contact-arrow,.custom-colors .contact-alternatives a{color:var(--muted)}
.custom-colors .hero h1 span,.custom-colors h2 em,.custom-colors .text-link,.custom-colors .service-add{color:var(--custom-primary)}
.custom-colors .button.primary,.custom-colors .hero .button.primary,.custom-colors .filter.active,.custom-colors .service-list>button[aria-selected=true]{background:var(--custom-primary);color:var(--custom-on-primary)}
.custom-colors .contact-card,.custom-colors .process,.custom-colors .service-list>button{background:var(--custom-paper);border-color:var(--line)}
.custom-colors .contact-icon{color:var(--custom-primary);background:color-mix(in srgb,var(--custom-primary) 12%,var(--custom-paper))}
.custom-colors input,.custom-colors textarea,.custom-colors select{color:var(--custom-ink);border-color:var(--line)}
.custom-colors.hero-direction-2 .hero{background:var(--custom-primary)}
.custom-colors.hero-direction-2 .hero:after{background:linear-gradient(90deg,color-mix(in srgb,var(--custom-primary) 96%,transparent),color-mix(in srgb,var(--custom-primary) 80%,transparent) 38%,color-mix(in srgb,var(--custom-primary) 24%,transparent) 80%)}
.custom-colors.hero-direction-2 .hero h1,.custom-colors.hero-direction-2 .hero h1 span,.custom-colors.hero-direction-2 .hero-intro,.custom-colors.hero-direction-2 .hero .eyebrow,.custom-colors.hero-direction-2 .hero-topline,.custom-colors.hero-direction-2 .hero-base,.custom-colors.hero-direction-2 .hero-actions .text-link{color:var(--custom-on-primary)}
.custom-colors.hero-direction-2 .hero .button.primary{background:var(--custom-paper);color:var(--custom-ink)}
@media(max-width:760px){.image-canvas{aspect-ratio:16/10}}

.media-stage>.image-canvas{width:100%;height:100%;aspect-ratio:auto}
.nav-wrap nav{flex-wrap:wrap;min-width:0}.hero-actions{flex-wrap:wrap}

.custom-colors .section p,.custom-colors .service-detail p,.custom-colors .project-category,.custom-colors .gallery-tile figcaption,.custom-colors .gallery-group-heading,.custom-colors .gallery-bottom p,.custom-colors .form-note,.custom-colors .form-top{color:var(--muted)}
.custom-colors #sector-panel h3,.custom-colors .sector-needs,.custom-colors .form-grid label,.custom-colors .message-label,.custom-colors .service-checks legend,.custom-colors .service-checks span{color:var(--custom-ink)}
.custom-colors .button.secondary,.custom-colors .filter:not(.active),.custom-colors .feature-chips li{color:var(--custom-ink);background:var(--custom-paper);border-color:var(--line)}
.custom-colors .service-list>button[aria-selected=true] small{color:var(--custom-on-primary)}

/* Readable colors are calculated on the server and in the owner's draft preview. */
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .hero-intro{opacity:1}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) :is(.section-heading>p,.section-heading>div>p,.hero-footnote p,.hero-footnote strong,.hero-image-caption small,.small-note,.project-category,.possibility-note p,.process-heading,.process article>span,.process p,.enquiry-location div>span,.form-top>span:last-child,.form-note,.gallery-tile figcaption,.gallery-tile figcaption>span:last-child,.gallery-group-heading,.gallery-group-heading>span:last-child,.gallery-bottom p,.contact-alternatives,.media-detail p:not(.eyebrow),.project-dialog ul){color:var(--muted)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) :is(.eyebrow,.hero-topline,.hero-base,.large-copy,.contact-label,.contact-action,.contact-arrow,.contact-alternatives a,.form-grid>label>span){color:var(--link-ink)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) :is(.hero h1 span,h2 em,.text-link){color:var(--accent)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) :is(.capabilities,.process,.contact-card,.service-list>button,.feature-chips li){background:var(--paper);color:var(--ink);border-color:var(--line)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .service-list :is(small,.service-no,.service-arrow){color:var(--muted)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .service-list>button[aria-selected=true],body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .filter.active,body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .service-checks input:checked+span,body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .button.primary{background:var(--deep);color:var(--on-deep)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .service-list>button[aria-selected=true] :is(small,.service-no,.service-arrow){color:var(--on-deep)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) :is(.art-label,.project-label){background:var(--paper);color:var(--ink);padding:7px 9px}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .hero h1,body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .form-grid>label,body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .message-label,body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .service-checks legend,body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .service-checks span{color:var(--ink)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) :is(input,select,textarea){color:var(--ink);border-color:var(--line)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) input::placeholder,body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) textarea::placeholder{color:var(--muted);opacity:1}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) :is(.site-header,footer,.discipline-strip,.sectors){background:var(--deep);color:var(--on-deep)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) :is(.site-header nav,footer a,footer button,.footer-top>p,.footer-top>p span,.footer-bottom,.back-top,.discipline-strip span,.sector-intro .eyebrow,.sector-intro>p:last-child,.sector-tabs button,.sector-tabs button[aria-selected=true],#sector-panel h3,#sector-panel .eyebrow,#sector-panel>p:not(.eyebrow),.sector-needs,.sector-symbol){color:var(--on-deep)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .menu-toggle{border-color:var(--on-deep)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .menu-toggle span{background:var(--on-deep)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C).hero-direction-1 .hero .button.primary,body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C).hero-direction-3 .hero .button.primary{background:var(--deep);color:var(--on-deep)}
/* The approved gradient protects the text and reveals the photo toward the right. */
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C).hero-direction-2[class*="color-treatment-"] .hero:after{background:linear-gradient(90deg,#032829f5 0%,#032829e6 27%,#032829d1 39%,#0328294d 57%,#0328290d 77%,#03282900 100%),linear-gradient(0deg,#032829e6 0%,#03282966 12%,#03282900 32%)}
.hero-direction-2 .hero-topline>span:last-child{background:#032829b8;padding:6px 10px;border-radius:2px;margin-block:-6px}
@media(max-width:760px){body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C).hero-direction-2[class*="color-treatment-"] .hero:after{background:linear-gradient(90deg,#032829f5 0%,#032829e6 38%,#032829b8 100%)}}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C).hero-direction-2 .hero :is(h1,h1 span,.hero-intro,.eyebrow,.hero-topline,.hero-base,.hero-actions .text-link){color:#ffffff}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C).hero-direction-2 .hero h1 span{color:#b3e5d5}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C).hero-direction-2 .hero .button.primary{background:var(--paper);color:var(--ink)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C).hero-direction-3 .hero .hero-image-caption,body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C).hero-direction-3 .hero .hero-image-caption small{background:#032829;color:#ffffff}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .hero-image-caption small{opacity:1}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .enquiry-status{color:var(--ink)}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .possibility-note p strong{color:inherit}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .button{transition:transform .2s}
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .site-header nav>a{color:var(--on-deep);transition:none}
/* Counts carry information too; keep their inherited text color fully opaque. */
body:is(.color-treatment-A,.color-treatment-B,.color-treatment-C) .filter span{color:inherit;opacity:1}
.service-directory{border-top:1px solid var(--line)}.service-link-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}.service-link-grid>a{display:flex;align-items:center;gap:15px;padding:22px;min-height:102px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);font-size:16px;line-height:1.35;color:var(--ink)}.service-link-grid>a:hover{text-decoration:underline;text-underline-offset:4px}.service-link-no{font-size:10px;color:var(--muted);align-self:flex-start;padding-top:3px}.service-link-grid>a>span:last-child{margin-left:auto;font-size:19px}.service-link-grid small{display:block;font-size:11px;color:var(--muted);margin-top:9px}.directory-all{margin-top:24px}.service-directory .section-heading>div>h2{font-size:clamp(30px,3.8vw,51px)}
@media(max-width:1000px){.service-link-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.service-link-grid{grid-template-columns:1fr}.service-link-grid>a{min-height:80px;padding:19px 16px;font-size:16px;gap:15px}.service-link-grid small{font-size:12px;margin-top:7px}.service-directory .directory-all{font-size:14px;min-height:48px;line-height:1.5}.service-directory .section-heading>div>h2{font-size:32px}}

/* The first hero photo stays in the HTML; later slides load after the page. */
.hero-slides-stage{display:block;position:relative;width:100%;aspect-ratio:16/10;overflow:hidden;background:var(--deep)}
.hero-slides-stage>img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .4s ease}
.hero-direction-1 .hero-slides-stage>img{object-fit:contain}
.hero-direction-2 .hero-project-frame>.hero-slides-stage,.hero-direction-3 .hero-project-frame>.hero-slides-stage{height:100%;aspect-ratio:auto}
.hero{position:relative}.hero-slideshow-controls{display:flex;align-items:center;width:max-content;max-width:100%;gap:3px;margin:0 0 20px;background:#082f34;color:#fff;border:1px solid #ffffff80;border-radius:3px;position:relative;z-index:4}
.hero-slideshow-controls[hidden]{display:none}.hero-slideshow-controls button{display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:0;background:transparent;color:#fff;padding:9px 12px;font-size:13px}.hero-slideshow-controls button:hover{background:#ffffff20}.hero-slideshow-controls [data-slide-count]{min-width:48px;text-align:center;font-size:12px;font-variant-numeric:tabular-nums}.hero-slideshow-controls [data-slide-pause]{border-left:1px solid #ffffff66;min-width:86px}
.hero-direction-2 .hero-slideshow-controls{position:absolute;left:5%;bottom:76px;margin:0}.hero-direction-3 .hero-slideshow-controls{margin:0 auto 20px}
@media(max-width:760px){body.hero-direction-2 .hero-slideshow-controls{position:relative;left:auto;bottom:auto;margin:0 0 22px}}
@media(prefers-reduced-motion:reduce){.hero-slides-stage>img{transition:none}}