/* 25 Oct 2026: white bar with logo, tap-to-call number and hamburger, equally spaced; lighter hero overlay */
.site-header{background:#FFFFFF;border-bottom:1px solid #000000}
.bar{justify-content:space-between;gap:0;min-height:76px;padding-top:.45rem;padding-bottom:.45rem}
.logo{display:block;flex:0 0 auto;line-height:0}
.logo img{display:block;height:64px;width:auto;max-width:none;aspect-ratio:1532/1027}
.tel{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:48px;padding:0 .25rem;font:600 1rem/1.2 Montserrat,Arial,Helvetica,sans-serif;letter-spacing:.01em;color:#000000!important;text-decoration:none;white-space:nowrap}
.tel:hover{text-decoration:underline;text-underline-offset:5px}
.nav-toggle,.js .nav-toggle{display:inline-flex;flex:0 0 auto}
.nav-toggle i,.nav-toggle i::before,.nav-toggle i::after{background:#000000}
.js .main-nav{display:none;position:absolute;left:0;right:0;top:100%;background:#FFFFFF;border-bottom:1px solid #000000;padding:.5rem var(--pad) 1rem}
.js .main-nav.open{display:flex;flex-direction:column}
.main-nav a[aria-current=page]{color:#000000!important}
@media(min-width:1040px){
 .bar{min-height:92px}
 .logo img{height:80px}
 .tel{font-size:1.125rem}
 .nav-toggle,.js .nav-toggle{display:inline-flex}
 .js .main-nav{position:absolute;left:auto;right:var(--pad);width:320px;flex-direction:column;gap:0;padding:.5rem 1.25rem 1rem;border:1px solid #000000;border-top:0;box-shadow:0 14px 24px rgba(0,0,0,.12)}
 .js .main-nav a{font-size:1rem;padding:.4rem 0}
}
@media(max-width:360px){.logo img{height:56px}.tel{font-size:.95rem}}
/* lighter overlay on every hero (about 30% less than before) */
.hero::before{background:linear-gradient(180deg,rgba(10,16,14,.54) 0%,rgba(10,16,14,.42) 55%,rgba(10,16,14,.36) 100%)}
@media(min-width:900px){.hero::before{background:linear-gradient(90deg,rgba(10,16,14,.58) 0%,rgba(10,16,14,.42) 48%,rgba(10,16,14,.08) 100%)}}
.hero-copy h1,.hero-copy p{text-shadow:0 1px 14px rgba(0,0,0,.5)}
.hero.home>img{object-position:30% 50%}
@media(min-width:900px){.hero.home>img{object-position:50% 62%}}
/* service strip as six cards (25 Oct 2026): very pale blue, rounded, soft shadow */
.strip{background:#FFFFFF;border-block:0}
.strip-grid{grid-template-columns:minmax(0,1fr);gap:1rem;padding:1.5rem var(--pad) 1.75rem;align-items:stretch}
.fact,.fact:first-child{background:#EAF3FB;border:1px solid #D3E4F4;border-left:1px solid #D3E4F4;border-radius:16px;box-shadow:0 6px 18px rgba(20,60,100,.10),0 1px 3px rgba(20,60,100,.08);padding:1.35rem 1.4rem;height:100%}
.fact .ft,.fact .fd{color:#000000!important}
@media(min-width:700px){.strip-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem}.fact{padding:1.5rem}}
@media(min-width:1000px){.strip-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;padding-top:2rem;padding-bottom:2.25rem}}
@media(min-width:1100px){.fact,.fact:first-child{border-left:1px solid #D3E4F4;padding:1.5rem}}
/* enlarged text: let the number wrap instead of pushing the bar wider than the screen */
.tel{white-space:normal;text-align:center;min-width:0;flex:0 1 auto}
.logo,.nav-toggle{flex-shrink:0}
/* buttons on light sections: white text on the black pill, black text on the outlined one (the earlier all-black rule hid the label) */
.btn:not(.ghost){color:#FFFFFF!important}
.btn.ghost{color:#000000!important}
.hero .btn:not(.ghost),.dark .btn:not(.ghost){color:#000000!important}
.hero .btn.ghost,.dark .btn.ghost{color:#FFFFFF!important}
