:root{--contact-paper:#f5f4f1;--contact-ink:#202124;--contact-muted:#5b5f63;--contact-line:#d9d6cf;--contact-taupe:#9b8875}html{scroll-behavior:smooth}.contact-page{margin:0;background:var(--contact-paper);color:var(--contact-ink)}.contact-page .site-header{background:rgba(255,255,255,.96);color:var(--contact-ink);border-bottom:1px solid var(--contact-line);box-shadow:none;backdrop-filter:none}.contact-page .logo-light{opacity:0}.contact-page .logo-dark{opacity:1}.contact-page main{padding-top:68px}.contact-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(380px,.72fr);gap:clamp(48px,7vw,120px);align-items:center;width:min(calc(100% - 128px),1440px);min-height:calc(100svh - 68px);margin-inline:auto;padding:64px 0}.contact-eyebrow{margin:0 0 22px;color:var(--contact-taupe);font-size:14px;font-weight:600;letter-spacing:.18em}.contact-intro h1{max-width:820px;margin:0;font-size:clamp(54px,5.5vw,88px);font-weight:600;line-height:1.08;letter-spacing:-.035em}.contact-intro>p:not(.contact-eyebrow){max-width:760px;margin:28px 0 34px;color:var(--contact-muted);font-size:clamp(18px,1.3vw,21px);line-height:1.75}.contact-primary{display:flex;gap:14px;flex-wrap:wrap}.contact-primary>a,.contact-project a,.contact-map{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 26px;border:1px solid var(--contact-taupe);border-radius:999px;background:var(--contact-taupe);color:#fff;font-weight:600}.contact-primary a span{margin-left:10px}.contact-primary .contact-line{background:transparent;color:var(--contact-ink)}.contact-card{padding:42px;border:1px solid var(--contact-line);border-radius:24px;background:#fff}.contact-card>img{display:block;width:180px;margin-bottom:30px}.contact-company{margin:0 0 22px;font-size:14px;font-weight:600;letter-spacing:.11em}.contact-card dl{margin:0}.contact-card dl div{display:grid;grid-template-columns:110px 1fr;gap:18px;padding:17px 0;border-top:1px solid var(--contact-line)}.contact-card dt{color:var(--contact-muted)}.contact-card dd{margin:0;font-weight:600;overflow-wrap:anywhere}.contact-lower{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--contact-line)}.contact-lower>div{min-height:430px;padding:70px max(64px,calc((100vw - 1440px)/2))}.contact-location{background:#e9e8e4}.contact-project{background:#30312f;color:#fff}.contact-lower h2{margin:0 0 22px;font-size:clamp(36px,3vw,52px);line-height:1.2}.contact-location address,.contact-project>p:not(.contact-eyebrow){max-width:600px;margin:0 0 28px;color:var(--contact-muted);font-size:18px;font-style:normal;line-height:1.75}.contact-project>p:not(.contact-eyebrow){color:rgba(255,255,255,.72)}.contact-project>div{display:flex;gap:12px;flex-wrap:wrap}.contact-project a{border-color:rgba(255,255,255,.35);background:transparent}.contact-map{padding:0;background:transparent;color:var(--contact-ink)}.contact-footer{display:flex;justify-content:space-between;gap:24px;padding:28px max(64px,calc((100vw - 1440px)/2));background:#242523;color:rgba(255,255,255,.65)}.contact-footer p{margin:0}@media(max-width:900px){.contact-page main{padding-top:66px}.contact-hero{grid-template-columns:1fr;width:calc(100% - 40px);min-height:0;padding:54px 0}.contact-intro h1{font-size:clamp(44px,12vw,64px)}.contact-card{padding:28px}.contact-lower{grid-template-columns:1fr}.contact-lower>div{min-height:0;padding:54px 24px}.contact-footer{padding:26px 20px;flex-direction:column}.contact-primary{display:grid}.contact-primary>a{width:100%}}@media(max-width:520px){.contact-card dl div{grid-template-columns:1fr;gap:5px}.contact-primary a span{display:block}.contact-project>div{display:grid}.contact-project a{width:100%}}
.contact-social{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px;padding-top:22px;border-top:1px solid var(--contact-line)}.contact-social a{display:inline-flex;align-items:center;gap:7px;min-height:42px;padding:0 14px;border:1px solid var(--contact-line);border-radius:999px;font-size:14px;font-weight:600;transition:border-color .2s,color .2s}.contact-social a:hover{border-color:var(--contact-taupe);color:var(--contact-taupe)}@media(max-width:520px){.contact-social{display:grid}.contact-social a{justify-content:center}}.contact-social{display:flex;gap:10px;flex-wrap:wrap}.contact-social a{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 13px;font-size:13px}.contact-social svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.contact-social a:first-child svg,.contact-social a:nth-child(3) svg{fill:currentColor;stroke:none}.contact-social .icon-fill{fill:currentColor;stroke:none}@media(max-width:520px){.contact-social{display:flex;flex-wrap:nowrap}.contact-social a{width:44px;padding:0}.contact-social a span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}
/* Consultation form and reliable in-page anchor target. */
#project-form{scroll-margin-top:88px;outline:none}
.contact-project form{display:grid;gap:18px;max-width:680px}
.contact-project label{display:grid;gap:8px;color:rgba(255,255,255,.86);font-size:15px;font-weight:600}
.contact-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.contact-project input,.contact-project select,.contact-project textarea{width:100%;min-height:52px;padding:13px 15px;border:1px solid rgba(255,255,255,.24);border-radius:10px;background:rgba(255,255,255,.08);color:#fff;font:inherit;outline:none}
.contact-project textarea{min-height:128px;resize:vertical}
.contact-project select option{color:#202124;background:#fff}
.contact-project input:focus,.contact-project select:focus,.contact-project textarea:focus{border-color:#bcaf9f;box-shadow:0 0 0 3px rgba(188,175,159,.18)}
.contact-project form button{justify-self:start;min-height:54px;padding:0 26px;border:1px solid #bcaf9f;border-radius:999px;background:#bcaf9f;color:#202124;font:600 16px/1 var(--font-primary);cursor:pointer}
.contact-form-note{margin:0!important;color:rgba(255,255,255,.58)!important;font-size:14px!important}
@media(max-width:620px){.contact-form-grid{grid-template-columns:1fr}.contact-project form button{width:100%}}
.contact-project label[hidden]{display:none}
/* Keep narrow mobile columns within the viewport, including long CTA labels. */
.contact-hero>*{min-width:0}
@media(max-width:520px){
 .contact-primary{grid-template-columns:minmax(0,1fr)}
 .contact-primary>a{min-width:0;max-width:100%;box-sizing:border-box;padding:12px 16px;flex-wrap:wrap}
 .contact-intro h1{overflow-wrap:break-word}
}

/* Keep the fixed header offset once and align the contact content at the top. */
.contact-page{padding-top:68px}
.contact-page.standard-site-header-page main{padding-top:0}
.contact-page>.site-breadcrumb{padding-block:16px}
.contact-page .contact-hero{align-items:start;min-height:0;padding-top:32px;padding-bottom:48px}
@media(max-width:760px){
 .contact-page{padding-top:66px}
 .contact-page .contact-hero{padding-top:24px;padding-bottom:36px}
}

/* Desktop contact overview fills the first screen; lower sections follow below. */
@media(min-width:901px){
 .contact-page>.site-breadcrumb{line-height:24px}
 /* Header 68px + breadcrumb 57px; allow content to grow on shorter screens. */
 .contact-page .contact-hero{box-sizing:border-box;min-height:calc(100svh - 125px);align-content:center}
 .contact-page .contact-hero{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,4vw,64px);width:min(calc(100% - 96px),1440px);padding-top:24px;padding-bottom:32px}
 .contact-page .contact-intro{padding-top:12px}
 .contact-page .contact-intro h1{font-size:clamp(44px,4.2vw,64px);line-height:1.12}
 .contact-page .contact-eyebrow{margin-bottom:16px}
 .contact-page .contact-intro>p:not(.contact-eyebrow){margin:20px 0 24px;font-size:20px;line-height:1.65}
 .contact-page .contact-primary{gap:10px}
 .contact-page .contact-primary>a{min-height:48px;padding:10px 18px;font-size:16px;line-height:1.4}
 .contact-page .contact-card{padding:24px 28px;border-radius:20px}
 .contact-page .contact-card .contact-logo{width:180px;height:64px;margin-bottom:16px}
 .contact-page .contact-company{font-size:17px;line-height:1.5;margin-bottom:16px}
 .contact-page .contact-card dl div{grid-template-columns:90px minmax(0,1fr);gap:14px;padding:11px 0}
 .contact-page .contact-card dt,.contact-page .contact-card dd{font-size:16px;line-height:1.5}
 .contact-page .contact-social{margin-top:16px;padding-top:16px;gap:8px}
 .contact-page .contact-social a{min-height:36px;padding:0 10px;font-size:12px;gap:6px}
}

/* Office and enquiry form occupy one desktop screen below the fixed header. */
@media(min-width:901px){
 html:has(>body.contact-page){scroll-padding-top:68px}
 .contact-page .contact-lower{min-height:calc(100svh - 68px);scroll-margin-top:0}
 .contact-page .contact-lower>div{min-height:0;padding:28px clamp(32px,4vw,64px);box-sizing:border-box;align-content:center}
 .contact-page .contact-lower .contact-eyebrow{margin-bottom:12px}
 .contact-page .contact-lower h2{font-size:clamp(28px,2.5vw,40px);line-height:1.2;margin-bottom:16px}
 .contact-page .contact-location address,.contact-page .contact-project>p:not(.contact-eyebrow){margin-bottom:18px;font-size:20px;line-height:1.6}
 .contact-page .contact-project form{gap:12px}
 .contact-page .contact-project label{gap:6px}
 .contact-page .contact-project input,.contact-page .contact-project select{min-height:44px;padding:9px 12px}
 .contact-page .contact-project textarea{height:90px;min-height:90px;padding:10px 12px}
 .contact-page .contact-project form button{min-height:44px}
 .contact-page .contact-project .contact-form-note{font-size:14px!important;line-height:1.5!important}
 .contact-page #project-form{scroll-margin-top:1px}
}
