@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');

:root {
  --navy: #071722;
  --navy-2: #0d2737;
  --navy-3: #123a50;
  --blue: #006cb5;
  --blue-dark: #005a97;
  --blue-pale: #e8f3fa;
  --copper: #c77a49;
  --ink: #102531;
  --muted: #5a6b74;
  --line: #d6e0e4;
  --paper: #f4f7f8;
  --white: #ffffff;
  --shell: 1220px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 108px; }
body { margin: 0; background: var(--white); color: var(--ink); font-family: "Manrope", system-ui, sans-serif; font-size: 1rem; line-height: 1.65; text-rendering: optimizeLegibility; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.shell { width: min(calc(100% - 48px), var(--shell)); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 999; top: -100px; left: 18px; padding: 11px 16px; background: var(--white); border-radius: 4px; font-weight: 800; }
.skip-link:focus { top: 18px; }

.topbar { background: #031019; color: #b8c7cf; font-size: .76rem; font-weight: 600; letter-spacing: .04em; }
.topbar-inner { min-height: 34px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.topbar p { margin: 0; }
.topbar-inner > div { display: flex; gap: 24px; align-items: center; }
.topbar a { color: var(--white); text-decoration: none; }

.site-header { position: sticky; z-index: 60; top: 0; background: rgba(7,23,34,.97); border-bottom: 1px solid rgba(255,255,255,.1); transition: box-shadow .2s ease; }
.site-header.scrolled { box-shadow: 0 14px 35px rgba(1,12,18,.2); }
.header-inner { height: 78px; display: flex; align-items: center; gap: 30px; }
.brand { display: inline-flex; align-items: center; gap: 11px; color: var(--white); text-decoration: none; line-height: 1; flex: 0 0 auto; }
.brand-logo { --mark-size: 38px; position: relative; width: var(--mark-size); height: var(--mark-size); flex: 0 0 var(--mark-size); overflow: hidden; border-radius: 50%; background: var(--white); }
.brand-logo img { position: absolute; top: calc(var(--mark-size) * -.288); left: calc(var(--mark-size) * -1.195); width: calc(var(--mark-size) * 3.39); max-width: none; height: auto; }
.brand-copy strong { display: block; font-size: 1.24rem; font-weight: 800; letter-spacing: .1em; }
.brand-copy small { display: block; margin-top: 6px; color: #99acb7; font-size: .57rem; font-weight: 700; letter-spacing: .3em; }
.site-nav { display: flex; align-items: center; justify-content: center; gap: clamp(18px, 2.5vw, 34px); margin-left: auto; }
.site-nav a { color: #cad6dc; font-size: .83rem; font-weight: 700; text-decoration: none; }
.site-nav a:hover, .site-nav a:focus-visible { color: var(--white); }
.menu-button { display: none; width: 44px; height: 44px; padding: 11px; margin-left: auto; border: 1px solid rgba(255,255,255,.2); border-radius: 5px; background: transparent; }
.menu-button i { display: block; height: 2px; margin: 4px 0; border-radius: 2px; background: var(--white); }

.button { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 22px; border: 1px solid var(--blue); border-radius: 5px; background: var(--blue); color: var(--white); font-size: .86rem; font-weight: 800; text-decoration: none; line-height: 1.2; transition: background .2s ease, border-color .2s ease, transform .2s ease; }
.button:hover, .button:focus-visible { background: var(--blue-dark); border-color: var(--blue-dark); transform: translateY(-1px); }
.button-header { min-height: 42px; padding: 10px 16px; font-size: .78rem; }
.button-outline { border-color: rgba(255,255,255,.55); background: transparent; }
.button-outline:hover, .button-outline:focus-visible { background: var(--white); border-color: var(--white); color: var(--navy); }
.button-dark { border-color: var(--navy); background: var(--navy); }
.button-dark:hover, .button-dark:focus-visible { border-color: var(--navy-3); background: var(--navy-3); }
.text-link { color: var(--blue-dark); font-size: .86rem; font-weight: 800; text-decoration: none; }

.eyebrow { margin: 0 0 15px; color: var(--blue-dark); font-size: .73rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.eyebrow-light { color: #6dd6fb; }
h1, h2, h3 { margin-top: 0; letter-spacing: -.035em; line-height: 1.08; }
h1 { margin-bottom: 24px; color: var(--white); font-size: clamp(3.25rem, 6vw, 5.8rem); font-weight: 700; }
h2 { margin-bottom: 20px; font-size: clamp(2.45rem, 4.3vw, 4rem); font-weight: 700; }
h3 { margin-bottom: 10px; font-size: 1.55rem; font-weight: 700; }

.hero { position: relative; min-height: 690px; overflow: hidden; background: var(--navy); color: var(--white); }
.hero-image, .hero-shade { position: absolute; inset: 0; }
.hero-image img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-shade { background: linear-gradient(90deg, rgba(3,16,25,.98) 0%, rgba(3,16,25,.91) 35%, rgba(3,16,25,.42) 65%, rgba(3,16,25,.08) 100%), linear-gradient(0deg, rgba(3,16,25,.58) 0%, transparent 45%); }
.hero-inner { position: relative; min-height: 690px; display: flex; align-items: center; padding-top: 50px; padding-bottom: 70px; }
.hero-copy { max-width: 760px; }
.hero-lead { max-width: 660px; margin: 0; color: #d0dce2; font-size: clamp(1.04rem, 1.7vw, 1.2rem); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.hero-note { margin: 23px 0 0; color: #9fb1ba; font-size: .8rem; font-weight: 600; }
.hero-water-card { position: absolute; right: 0; bottom: 56px; width: 320px; padding: 25px 26px; border-top: 3px solid var(--blue); background: rgba(255,255,255,.96); color: var(--ink); box-shadow: 0 22px 55px rgba(0,0,0,.24); }
.hero-water-card > span { color: var(--blue-dark); font-size: .67rem; font-weight: 800; letter-spacing: .14em; }
.hero-water-card strong { display: block; margin-top: 12px; font-size: 1.25rem; line-height: 1.35; }
.hero-water-card p { margin: 9px 0 16px; color: var(--muted); font-size: .83rem; line-height: 1.5; }
.hero-water-card a { color: var(--ink); font-size: .78rem; font-weight: 800; text-decoration: none; }
.hero-water-card b { color: var(--blue); }
.section { padding: 118px 0; }
.services-section { background: var(--white); }
.section-intro { display: grid; grid-template-columns: 1.1fr .7fr; align-items: end; gap: 80px; margin-bottom: 66px; }
.section-intro h2 { margin-bottom: 0; }
.section-intro > p { margin: 0; color: var(--muted); }
.service-list { border-top: 1px solid var(--line); }
.service-row { display: grid; grid-template-columns: 60px .9fr 1.1fr; gap: 38px; align-items: start; padding: 42px 0; border-bottom: 1px solid var(--line); }
.service-index { padding-top: 6px; color: var(--blue); font-size: .72rem; font-weight: 800; }
.service-title h3 { margin-bottom: 8px; font-size: 1.75rem; }
.service-title p { margin: 0; color: var(--muted); font-size: .88rem; }
.service-row ul { display: grid; grid-template-columns: 1fr 1fr; gap: 11px 28px; margin: 0; padding: 4px 0 0; list-style: none; }
.service-row li { position: relative; padding-left: 16px; color: #324b59; font-size: .84rem; }
.service-row li::before { content: ""; position: absolute; left: 0; top: .68em; width: 5px; height: 5px; border-radius: 50%; background: var(--copper); }
.service-footer { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding-top: 26px; }
.service-footer p { max-width: 780px; margin: 0; color: var(--muted); font-size: .81rem; }

.water-section { padding: 118px 0 0; background: var(--blue-pale); }
.water-grid { display: grid; grid-template-columns: .88fr 1.12fr; gap: clamp(70px, 10vw, 140px); align-items: start; padding-bottom: 82px; }
.water-intro > p:not(.eyebrow) { max-width: 570px; color: var(--muted); }
.water-intro .button { margin-top: 18px; }
.water-detail-link { display: block; width: fit-content; margin-top: 17px; color: var(--blue-dark); font-size: .8rem; font-weight: 800; text-decoration: none; }
.water-solutions { border-top: 1px solid #b8d5df; }
.water-solutions article { display: grid; grid-template-columns: 46px 1fr; gap: 20px; padding: 29px 0; border-bottom: 1px solid #b8d5df; }
.water-solutions article > span { padding-top: 4px; color: var(--blue-dark); font-size: .72rem; font-weight: 800; }
.water-solutions h3 { margin-bottom: 5px; font-size: 1.45rem; }
.water-solutions p { margin: 0; color: var(--muted); font-size: .86rem; }
.water-offer { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 45px; min-height: 142px; padding-block: 25px; border-top: 1px solid #b8d5df; }
.water-offer > div { border-right: 1px solid #b8d5df; }
.water-offer span { display: block; margin-bottom: 4px; color: var(--blue-dark); font-size: .65rem; font-weight: 800; letter-spacing: .13em; }
.water-offer strong { font-size: 1rem; }
.water-offer p { margin: 0; color: var(--muted); font-size: .75rem; }

.commercial-section { padding: 120px 0; background: var(--navy); color: var(--white); }
.commercial-layout { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(70px, 9vw, 130px); }
.commercial-copy { align-self: start; }
.commercial-copy > p:not(.eyebrow) { max-width: 540px; color: #afc0c9; }
.commercial-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 24px; margin-top: 30px; }
.commercial-actions > a:not(.button) { color: #9fdaeF; font-size: .82rem; font-weight: 800; text-decoration: none; }
.commercial-scope { border-top: 1px solid rgba(255,255,255,.18); }
.scope-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 38px; padding: 0 0 36px; }
.scope-group-title { margin: 0; padding: 17px 0; border-bottom: 1px solid rgba(255,255,255,.18); color: #6fd6fa; font-size: .72rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.scope-accordion details { border-bottom: 1px solid rgba(255,255,255,.1); }
.scope-accordion summary { display: grid; grid-template-columns: minmax(0, 1fr) 28px; align-items: center; gap: 18px; min-height: 58px; padding: 13px 0; color: #c7d3d9; font-size: .92rem; font-weight: 600; line-height: 1.4; list-style: none; cursor: pointer; transition: color .2s ease; }
.scope-accordion summary::-webkit-details-marker { display: none; }
.scope-accordion summary::after { content: "+"; width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid rgba(111,214,250,.45); border-radius: 50%; color: #6fd6fa; font-size: 1.15rem; font-weight: 400; line-height: 1; transition: background .2s ease, border-color .2s ease, color .2s ease; }
.scope-accordion summary:hover, .scope-accordion summary:focus-visible, .scope-accordion details[open] summary { color: var(--white); }
.scope-accordion summary:focus-visible { border-radius: 3px; outline: 2px solid #6fd6fa; outline-offset: 4px; }
.scope-accordion details[open] summary::after { content: "−"; border-color: #6fd6fa; background: #6fd6fa; color: var(--navy); }
.scope-detail { padding: 0 38px 19px 0; }
.scope-detail p { margin: 0; color: #9eb0b9; font-size: .88rem; line-height: 1.65; }
.scope-note { padding: 22px 24px; border-left: 3px solid var(--copper); background: rgba(255,255,255,.06); }
.scope-note strong { font-size: .93rem; }
.scope-note p { margin: 3px 0 0; color: #9eb0b9; font-size: .77rem; }

.projects-section { padding: 118px 0; background: var(--paper); }
.projects-heading { display: grid; grid-template-columns: 1.05fr .65fr; align-items: end; gap: 80px; margin-bottom: 55px; }
.projects-heading h2 { margin-bottom: 0; }
.projects-heading > div:last-child > p { margin: 0 0 15px; color: var(--muted); }
.project-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.project-card { min-height: 330px; display: flex; flex-direction: column; padding: 30px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--white); color: var(--ink); text-decoration: none; transition: background .2s ease, color .2s ease; }
.project-card:hover, .project-card:focus-visible { background: var(--navy); color: var(--white); outline: none; }
.project-number { margin-bottom: 42px; color: var(--blue-dark); font-size: .68rem; font-weight: 800; }
.project-type { color: var(--copper); font-size: .66rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.project-card h3 { margin: 13px 0 10px; font-size: 1.52rem; }
.project-card p { margin: 0 0 25px; color: var(--muted); font-size: .83rem; }
.project-card:hover p, .project-card:focus-visible p { color: #b6c7cf; }
.project-link { margin-top: auto; font-size: .75rem; font-weight: 800; }
.project-link b { color: var(--blue); }

.reviews-section { padding: 110px 0; background: var(--white); }
.reviews-header { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(45px, 8vw, 110px); align-items: end; margin-bottom: 45px; }
.reviews-copy > p:not(.eyebrow) { max-width: 520px; color: var(--muted); }
.review-rating { display: grid; gap: 5px; padding: 24px 26px; border-left: 4px solid var(--copper); background: var(--navy); color: var(--white); text-decoration: none; box-shadow: 0 18px 42px rgba(7,23,34,.14); }
.review-rating strong { font-size: 1.16rem; }
.review-rating small { color: #9eb3bd; font-size: .73rem; font-weight: 800; }
.review-stars { color: #efb456; font-size: .92rem; letter-spacing: .12em; }
.review-carousel { position: relative; }
.review-carousel-track { display: flex; gap: 18px; overflow-x: auto; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-inline: contain; }
.review-carousel-track::-webkit-scrollbar { display: none; }
.review-carousel-track:focus-visible { outline: 3px solid var(--blue); outline-offset: 5px; }
.review-card { min-height: 335px; flex: 0 0 100%; display: flex; flex-direction: column; padding: clamp(28px, 4.5vw, 52px); border: 1px solid var(--line); background: var(--paper); scroll-snap-align: start; }
.review-card-top { display: flex; justify-content: space-between; gap: 18px; align-items: center; }
.review-source { color: var(--blue-dark); font-size: .66rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.review-card blockquote { max-width: 900px; margin: 34px 0 18px; color: var(--ink); font-family: Georgia, 'Times New Roman', serif; font-size: clamp(1.7rem, 3.8vw, 2.75rem); line-height: 1.15; }
.review-summary { max-width: 810px; margin: 0 0 38px; color: var(--muted); font-size: .92rem; }
.review-meta { display: grid; gap: 2px; margin-top: auto; }
.review-meta strong { font-size: .84rem; }
.review-meta span { color: var(--muted); font-size: .73rem; }
.review-carousel-controls { display: flex; justify-content: space-between; gap: 24px; align-items: center; margin-top: 20px; }
.review-carousel-count { margin: 0; color: var(--muted); font-size: .76rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.review-carousel-buttons { display: flex; gap: 9px; }
.review-arrow { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid #9cb0b9; border-radius: 50%; background: transparent; color: var(--ink); font: inherit; font-size: 1.2rem; cursor: pointer; transition: border-color .2s ease, background .2s ease, color .2s ease; }
.review-arrow:hover, .review-arrow:focus-visible { border-color: var(--navy); background: var(--navy); color: var(--white); }
.review-arrow:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; }
.review-arrow:disabled { border-color: var(--line); color: #9bacb5; background: transparent; cursor: default; opacity: .55; }
.reviews-footer { display: flex; justify-content: space-between; gap: 35px; align-items: center; margin-top: 28px; padding-top: 28px; border-top: 1px solid var(--line); }
.reviews-footer > p { max-width: 610px; margin: 0; color: var(--muted); font-size: .82rem; }
.reviews-footer > p a { color: var(--blue-dark); font-weight: 800; }
.review-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 12px; }
.button-outline-dark { border-color: #9cb0b9; color: var(--ink); background: transparent; }
.button-outline-dark:hover, .button-outline-dark:focus-visible { border-color: var(--navy); background: var(--navy); color: var(--white); }
.review-secondary-dark { color: var(--blue-dark); font-size: .74rem; font-weight: 800; text-decoration: none; }
.review-secondary-dark:hover, .review-secondary-dark:focus-visible { color: var(--ink); text-decoration: underline; }

.company-section { padding: 115px 0; background: var(--white); }
.company-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: clamp(70px, 10vw, 140px); align-items: end; }
.company-statement h2 { margin-bottom: 0; }
.company-copy > p { margin: 0 0 35px; color: var(--muted); }
.company-copy dl { margin: 0; border-top: 1px solid var(--line); }
.company-copy dl > div { display: grid; grid-template-columns: 140px 1fr; gap: 20px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.company-copy dt { color: var(--muted); font-size: .75rem; font-weight: 700; }
.company-copy dd { margin: 0; font-size: .8rem; font-weight: 800; text-align: right; }

.faq-section { padding: 110px 0; background: var(--paper); }
.faq-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(65px, 9vw, 125px); align-items: start; }
.faq-intro { position: sticky; top: 115px; }
.faq-intro > p:not(.eyebrow) { max-width: 480px; color: var(--muted); }
.faq-intro a { color: var(--blue-dark); font-weight: 800; text-decoration: none; }
.faq-list { border-top: 1px solid var(--line); }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { display: grid; grid-template-columns: 1fr 32px; gap: 20px; align-items: center; min-height: 75px; padding: 16px 0; font-size: 1rem; font-weight: 800; list-style: none; cursor: pointer; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid #b8c9d1; border-radius: 50%; color: var(--blue-dark); font-size: 1.15rem; font-weight: 500; }
.faq-list details[open] summary::after { content: "−"; border-color: var(--blue); background: var(--blue); color: var(--white); }
.faq-list summary:focus-visible { outline: 2px solid var(--blue); outline-offset: 5px; }
.faq-list details > p { max-width: 760px; margin: -2px 50px 25px 0; color: var(--muted); font-size: .9rem; }
.faq-list a { color: var(--blue-dark); font-weight: 700; }

.area-section { padding: 105px 0; background: var(--navy-2); color: var(--white); }
.area-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(60px, 9vw, 120px); align-items: center; }
.area-copy p:not(.eyebrow) { color: #afc0c9; }
.area-copy .button { margin-top: 18px; }
.city-grid { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; padding: 0; border-top: 1px solid rgba(255,255,255,.18); border-left: 1px solid rgba(255,255,255,.18); list-style: none; }
.city-grid li { min-height: 72px; display: grid; place-items: center; padding: 10px; border-right: 1px solid rgba(255,255,255,.18); border-bottom: 1px solid rgba(255,255,255,.18); color: #ced9df; font-size: .76rem; font-weight: 700; text-align: center; }

.contact-section { padding: 110px 0; background: var(--white); }
.contact-panel { display: grid; grid-template-columns: 1.15fr .85fr; gap: 70px; align-items: end; padding-bottom: 60px; border-bottom: 1px solid var(--line); }
.contact-panel h2 { margin-bottom: 0; }
.contact-details { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; }
.contact-details a { color: var(--blue-dark); font-weight: 800; text-decoration: none; overflow-wrap: anywhere; }
.contact-details .contact-phone { color: var(--ink); font-size: clamp(1.7rem, 3.5vw, 2.7rem); letter-spacing: -.04em; }
.contact-details p { margin: 13px 0 0; color: var(--muted); font-size: .79rem; }

.project-page { background: var(--paper); }
.project-page .site-header { position: sticky; }
.project-hero { padding: 100px 0 82px; background: var(--navy); color: var(--white); }
.breadcrumb { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 46px; color: #8fa6b2; font-size: .72rem; font-weight: 700; }
.breadcrumb a { color: #b7c8d0; text-decoration: none; }
.project-hero-grid { display: grid; grid-template-columns: 1.15fr .55fr; gap: 90px; align-items: end; }
.project-hero h1 { max-width: 820px; margin-bottom: 22px; font-size: clamp(3.15rem, 6vw, 5.5rem); }
.project-hero-lead { max-width: 720px; margin: 0; color: #b8c9d1; font-size: 1.05rem; }
.project-meta { margin: 0; border-top: 1px solid rgba(255,255,255,.18); }
.project-meta > div { display: grid; grid-template-columns: 92px 1fr; gap: 18px; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.18); }
.project-meta dt { color: #7dd9fa; font-size: .65rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.project-meta dd { margin: 0; color: #d5e0e5; font-size: .78rem; font-weight: 700; text-align: right; }
.project-content { padding: 94px 0 110px; }
.project-content-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(65px, 9vw, 125px); }
.project-overview h2 { font-size: clamp(2.3rem, 4vw, 3.5rem); }
.project-overview p { color: var(--muted); }
.project-file-note { margin-top: 34px; padding: 20px 22px; border-left: 3px solid var(--blue); background: var(--white); }
.project-file-note strong { display: block; margin-bottom: 4px; font-size: .86rem; }
.project-file-note p { margin: 0; font-size: .76rem; }
.scope-panel { background: var(--white); border-top: 3px solid var(--navy); }
.scope-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 25px; border-bottom: 1px solid var(--line); }
.scope-panel-header h2 { margin: 0; font-size: 1.25rem; }
.scope-panel-header span { color: var(--blue-dark); font-size: .66rem; font-weight: 800; letter-spacing: .12em; }
.scope-list { margin: 0; padding: 0; list-style: none; }
.scope-list li { display: grid; grid-template-columns: 34px 1fr; gap: 16px; padding: 21px 25px; border-bottom: 1px solid var(--line); color: #314a58; font-size: .85rem; }
.scope-list li span { color: var(--blue-dark); font-size: .66rem; font-weight: 800; }
.project-gallery { padding: 0 0 110px; }
.project-gallery-intro { display: grid; grid-template-columns: 1.05fr .65fr; align-items: end; gap: 80px; margin-bottom: 42px; padding-top: 50px; border-top: 1px solid var(--line); }
.project-gallery-intro h2 { max-width: 760px; margin-bottom: 0; font-size: clamp(2.3rem, 4vw, 3.5rem); }
.project-gallery-intro > p { margin: 0; color: var(--muted); font-size: .9rem; }
.project-gallery-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: start; }
.project-gallery-item { margin: 0; overflow: hidden; border-bottom: 3px solid var(--navy); background: var(--white); box-shadow: 0 16px 38px rgba(7,23,34,.08); }
.project-gallery-item--wide { grid-column: span 2; }
.project-gallery-link { display: block; overflow: hidden; background: #dfe7ea; }
.project-gallery-link:focus-visible { outline: 4px solid var(--blue); outline-offset: -4px; }
.project-gallery-link img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; transition: transform .35s ease; }
.project-gallery-item--wide .project-gallery-link img { aspect-ratio: 8 / 5; }
.project-gallery-link:hover img, .project-gallery-link:focus-visible img { transform: scale(1.025); }
.project-gallery-item figcaption { min-height: 82px; padding: 15px 18px 17px; }
.project-gallery-item figcaption strong, .project-gallery-item figcaption span { display: block; }
.project-gallery-item figcaption strong { color: var(--ink); font-size: .88rem; }
.project-gallery-item figcaption span { margin-top: 3px; color: var(--muted); font-size: .7rem; }
.project-gallery--rough { padding: 105px 0 110px; background: var(--navy-2); color: var(--white); }
.project-gallery--rough .project-gallery-intro { padding-top: 0; border-top: 0; }
.project-gallery--rough .project-gallery-intro > p { color: #afc0c9; }
.project-gallery--rough .eyebrow { color: #6dd6fb; }
.project-gallery-grid--rough { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.project-gallery-grid--rough .project-gallery-link img { aspect-ratio: 4 / 3; }
.project-gallery-grid--rough .project-gallery-item--portrait .project-gallery-link img { aspect-ratio: 4 / 5; }
.project-gallery--underground { padding: 105px 0 110px; background: var(--paper); }
.project-gallery--underground .project-gallery-intro { padding-top: 0; border-top: 0; }
.project-video-section { padding: 105px 0; background: var(--navy-2); color: var(--white); }
.project-video-grid { display: grid; grid-template-columns: .9fr .55fr; gap: clamp(65px, 10vw, 140px); align-items: center; }
.project-video-copy h2 { max-width: 690px; font-size: clamp(2.45rem, 4.3vw, 4rem); }
.project-video-copy > p:not(.eyebrow) { max-width: 620px; color: #afc0c9; }
.project-video-detail { display: flex; flex-wrap: wrap; gap: 10px 26px; margin-top: 28px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.17); color: #84d9f7; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.project-video-card { width: min(100%, 430px); margin: 0; justify-self: end; overflow: hidden; border: 1px solid rgba(255,255,255,.14); background: #031019; box-shadow: 0 25px 65px rgba(0,0,0,.35); }
.project-video-card video { width: 100%; aspect-ratio: 512 / 910; display: block; background: #000; object-fit: cover; }
.project-video-card--underground video { aspect-ratio: 16 / 25; }
.project-video-card figcaption { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 18px; color: #9fb3bd; font-size: .7rem; }
.project-video-card figcaption strong { color: var(--white); font-size: .78rem; }
.project-photo-card a { display: block; overflow: hidden; background: #dfe7ea; }
.project-photo-card a:focus-visible { outline: 4px solid var(--blue); outline-offset: -4px; }
.project-photo-card img { width: 100%; aspect-ratio: 3 / 4; display: block; object-fit: cover; transition: transform .35s ease; }
.project-photo-card--landscape img { aspect-ratio: 4 / 3; }
.project-photo-card a:hover img, .project-photo-card a:focus-visible img { transform: scale(1.02); }
.project-video-section--light { background: var(--paper); color: var(--ink); }
.project-video-section--light .eyebrow { color: var(--blue-dark); }
.project-video-section--light .project-video-copy > p:not(.eyebrow) { color: var(--muted); }
.project-video-section--light .project-video-detail { border-color: var(--line); color: var(--blue-dark); }
.project-video-section--light .project-video-card { border-color: rgba(7,23,34,.12); box-shadow: 0 25px 65px rgba(7,23,34,.17); }
.project-gallery--equipment { padding: 105px 0 110px; background: var(--paper); }
.project-gallery--equipment .project-gallery-intro { padding-top: 0; border-top: 0; }
.project-gallery-grid--equipment { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.project-gallery-grid--equipment .project-gallery-item figcaption { min-height: 94px; }
.project-cta { padding: 80px 0; background: var(--blue-pale); }
.project-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 50px; }
.project-cta h2 { max-width: 760px; margin: 0; font-size: clamp(2rem, 4vw, 3.25rem); }
.all-projects-hero { padding: 95px 0 80px; background: var(--navy); color: var(--white); }
.all-projects-hero h1 { max-width: 850px; }
.all-projects-hero p:not(.eyebrow) { max-width: 700px; margin: 0; color: #b8c9d1; }
.all-projects-section { padding: 90px 0 110px; }

.info-page { background: var(--paper); }
.info-page .site-header { position: sticky; }
.info-hero { padding: 92px 0 82px; background: var(--navy); color: var(--white); }
.info-hero-grid { display: grid; grid-template-columns: 1.15fr .55fr; gap: 90px; align-items: end; }
.info-hero h1 { max-width: 880px; margin-bottom: 22px; font-size: clamp(3.1rem, 6vw, 5.45rem); }
.info-hero-lead { max-width: 760px; margin: 0; color: #b8c9d1; font-size: 1.05rem; }
.info-hero-meta { margin: 0; border-top: 1px solid rgba(255,255,255,.18); }
.info-hero-meta > div { display: grid; grid-template-columns: 92px 1fr; gap: 18px; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.18); }
.info-hero-meta dt { color: #7dd9fa; font-size: .65rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.info-hero-meta dd { margin: 0; color: #d5e0e5; font-size: .78rem; font-weight: 700; text-align: right; }
.info-content { padding: 92px 0 110px; }
.info-layout { display: grid; grid-template-columns: .66fr 1.34fr; gap: clamp(60px, 9vw, 120px); align-items: start; }
.info-sidebar { position: sticky; top: 112px; }
.info-sidebar h2 { font-size: clamp(2.15rem, 3.7vw, 3.25rem); }
.info-sidebar > p:not(.eyebrow) { color: var(--muted); }
.info-sidebar-links { margin: 28px 0 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.info-sidebar-links a { display: flex; justify-content: space-between; gap: 18px; padding: 14px 0; border-bottom: 1px solid var(--line); color: var(--ink); font-size: .78rem; font-weight: 800; text-decoration: none; }
.info-sidebar-links a span { color: var(--blue); }
.info-body { display: grid; gap: 28px; }
.info-section { padding: clamp(28px, 4vw, 45px); border-top: 3px solid var(--navy); background: var(--white); box-shadow: 0 13px 35px rgba(7,23,34,.06); }
.info-section h2 { margin-bottom: 16px; font-size: clamp(2rem, 3.6vw, 3rem); }
.info-section > p { color: var(--muted); }
.info-section > p:last-child { margin-bottom: 0; }
.info-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 28px; margin: 25px 0 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.info-list li { position: relative; padding: 17px 0 17px 18px; border-bottom: 1px solid var(--line); color: #324b59; font-size: .86rem; }
.info-list li::before { content: ""; position: absolute; left: 0; top: 1.55rem; width: 6px; height: 6px; border-radius: 50%; background: var(--copper); }
.info-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 27px; }
.info-card { padding: 24px; border: 1px solid var(--line); background: var(--paper); }
.info-card span { display: block; margin-bottom: 28px; color: var(--blue-dark); font-size: .67rem; font-weight: 800; }
.info-card h3 { font-size: 1.3rem; }
.info-card p { margin: 0; color: var(--muted); font-size: .8rem; }
.info-answer-list { margin-top: 22px; border-top: 1px solid var(--line); }
.info-answer-list details { border-bottom: 1px solid var(--line); }
.info-answer-list summary { padding: 16px 28px 16px 0; font-size: .9rem; font-weight: 800; cursor: pointer; }
.info-answer-list p { margin: -1px 30px 19px 0; color: var(--muted); font-size: .82rem; }
.info-cta { padding: 78px 0; background: var(--blue-pale); }
.info-cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 50px; }
.info-cta h2 { max-width: 760px; margin: 0; font-size: clamp(2rem, 4vw, 3.25rem); }
.services-hub-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.services-hub-card { min-height: 285px; display: flex; flex-direction: column; padding: 32px; border-top: 3px solid var(--navy); background: var(--white); color: var(--ink); text-decoration: none; box-shadow: 0 13px 35px rgba(7,23,34,.06); }
.services-hub-card > span:first-child { color: var(--blue-dark); font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.services-hub-card h2 { margin: 35px 0 12px; font-size: 1.8rem; }
.services-hub-card p { margin: 0; color: var(--muted); font-size: .84rem; }
.services-hub-card .project-link { margin-top: auto; padding-top: 24px; }
.services-hub-card:hover, .services-hub-card:focus-visible { border-top-color: var(--blue); background: var(--navy); color: var(--white); outline: none; }
.services-hub-card:hover p, .services-hub-card:focus-visible p { color: #b6c7cf; }

.site-footer { padding: 62px 0 25px; background: #031019; color: var(--white); }
.footer-top { display: grid; grid-template-columns: 1fr 1fr auto; gap: 45px; align-items: center; padding-bottom: 52px; }
.footer-top > p { margin: 0; color: #92a6b1; font-size: .8rem; }
.footer-call { color: var(--white); font-size: .85rem; font-weight: 800; text-decoration: none; }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.1); color: #8296a0; font-size: .7rem; }
.footer-bottom a { color: #a8c5d2; text-decoration: none; }
.mobile-contact { display: none; }

@media (max-width: 1050px) {
  .button-header { display: none; }
  .hero-water-card { width: 285px; }
  .service-row { grid-template-columns: 45px .75fr 1.25fr; gap: 24px; }
  .city-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 860px) {
  body { padding-bottom: 64px; }
  .topbar-inner { justify-content: center; }
  .topbar-inner > p, .topbar-inner span { display: none; }
  .header-inner { height: 70px; }
  .menu-button { display: block; }
  .site-nav { position: absolute; top: calc(100% + 7px); left: 24px; right: 24px; display: none; flex-direction: column; align-items: stretch; gap: 0; padding: 10px; border: 1px solid rgba(255,255,255,.12); background: var(--navy); box-shadow: 0 20px 50px rgba(0,0,0,.28); }
  .site-nav.open { display: flex; }
  .site-nav a { padding: 12px; }
  .hero { min-height: 820px; }
  .hero-shade { background: linear-gradient(90deg, rgba(3,16,25,.97) 0%, rgba(3,16,25,.78) 64%, rgba(3,16,25,.34) 100%), linear-gradient(0deg, rgba(3,16,25,.7), transparent 55%); }
  .hero-inner { min-height: 820px; align-items: flex-start; padding-top: 78px; padding-bottom: 250px; }
  .hero-copy { max-width: 690px; }
  .hero-water-card { right: auto; left: 0; bottom: 55px; width: min(390px, 100%); }
  .section, .company-section { padding: 88px 0; }
  .section-intro, .water-grid, .commercial-layout, .reviews-header, .company-grid, .faq-layout, .area-grid, .contact-panel { grid-template-columns: 1fr; gap: 42px; }
  .projects-heading, .project-hero-grid, .project-content-grid, .project-gallery-intro, .project-video-grid { grid-template-columns: 1fr; gap: 42px; }
  .section-intro { margin-bottom: 45px; }
  .service-row { grid-template-columns: 40px 1fr; }
  .service-row ul { grid-column: 2; }
  .water-section { padding-top: 88px; }
  .water-grid { padding-bottom: 60px; }
  .water-offer { grid-template-columns: 1fr 1fr; gap: 25px; }
  .commercial-section, .area-section { padding: 88px 0; }
  .projects-section { padding: 88px 0; }
  .project-grid { grid-template-columns: repeat(2, 1fr); }
  .company-copy dl { max-width: 620px; }
  .project-meta { max-width: 480px; }
  .project-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-gallery--rough { padding: 88px 0; }
  .project-gallery--underground { padding: 88px 0; }
  .project-video-section { padding: 88px 0; }
  .project-video-card { justify-self: start; }
  .project-gallery--equipment { padding: 88px 0; }
  .project-cta-inner { align-items: flex-start; flex-direction: column; }
  .faq-intro, .info-sidebar { position: static; }
  .info-hero-grid, .info-layout { grid-template-columns: 1fr; gap: 42px; }
  .info-hero-meta { max-width: 480px; }
  .info-cta-inner { align-items: flex-start; flex-direction: column; }
  .contact-panel { align-items: start; }
  .footer-top { grid-template-columns: 1fr 1fr; }
  .footer-call { grid-column: 2; }
  .mobile-contact { position: fixed; z-index: 80; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: 1fr 1fr; padding: 7px; background: #031019; box-shadow: 0 -8px 24px rgba(3,16,25,.25); }
  .mobile-contact a { min-height: 49px; display: grid; place-items: center; color: var(--white); font-size: .87rem; font-weight: 800; text-decoration: none; }
  .mobile-contact a:first-child { border-radius: 4px; background: var(--blue); }
}

@media (max-width: 620px) {
  .shell { width: min(calc(100% - 30px), var(--shell)); }
  .brand-logo { --mark-size: 34px; }
  .brand-copy strong { font-size: 1.08rem; }
  .brand-copy small { font-size: .51rem; }
  h1 { font-size: clamp(2.85rem, 13.5vw, 4.25rem); }
  h2 { font-size: clamp(2.25rem, 10.5vw, 3.1rem); }
  .hero { min-height: 880px; }
  .hero-image img { object-position: 60% center; }
  .hero-inner { min-height: 880px; padding-top: 68px; padding-bottom: 250px; }
  .hero-actions .button { width: 100%; }
  .hero-note { font-size: .72rem; }
  .hero-water-card { bottom: 55px; padding: 21px; }
  .service-row { grid-template-columns: 32px 1fr; gap: 15px; padding: 33px 0; }
  .service-row ul { grid-template-columns: 1fr; gap: 8px; }
  .service-footer { align-items: flex-start; flex-direction: column; }
  .water-solutions article { grid-template-columns: 34px 1fr; gap: 14px; }
  .water-offer { grid-template-columns: 1fr; gap: 0; padding-block: 0; }
  .water-offer > div { padding: 20px 0; border-right: 0; border-bottom: 1px solid #b8d5df; }
  .water-offer p { grid-column: auto; padding: 20px 0; }
  .scope-grid { grid-template-columns: 1fr; gap: 28px; }
  .project-grid { grid-template-columns: 1fr; }
  .review-card { min-height: 390px; padding: 30px 24px; }
  .review-card blockquote { margin: 28px 0 16px; }
  .review-summary { margin-bottom: 32px; }
  .review-card-top { align-items: flex-start; flex-direction: column; gap: 8px; }
  .reviews-footer { align-items: flex-start; flex-direction: column; }
  .review-actions { width: 100%; justify-content: flex-start; }
  .review-actions .button { width: 100%; }
  .faq-list details > p { margin-right: 0; }
  .project-card { min-height: 285px; }
  .project-hero { padding: 72px 0 62px; }
  .breadcrumb { margin-bottom: 35px; }
  .project-content { padding: 70px 0 80px; }
  .project-gallery { padding-bottom: 80px; }
  .project-gallery--rough { padding-top: 78px; }
  .project-gallery--underground { padding: 78px 0 80px; }
  .project-video-section { padding: 78px 0; }
  .project-video-card { width: 100%; }
  .project-video-card figcaption { align-items: flex-start; flex-direction: column; gap: 2px; }
  .project-gallery--equipment { padding: 78px 0 80px; }
  .project-gallery-intro { gap: 20px; padding-top: 38px; }
  .project-gallery-grid { grid-template-columns: 1fr; gap: 15px; }
  .project-gallery-item--wide { grid-column: span 1; }
  .project-gallery-item--wide .project-gallery-link img { aspect-ratio: 4 / 5; }
  .city-grid { grid-template-columns: repeat(2, 1fr); }
  .company-copy dl > div { grid-template-columns: 105px 1fr; }
  .info-hero { padding: 72px 0 62px; }
  .info-content { padding: 70px 0 80px; }
  .info-list, .info-cards, .services-hub-grid { grid-template-columns: 1fr; }
  .info-section { padding: 26px 22px; }
  .footer-top { grid-template-columns: 1fr; gap: 24px; }
  .footer-call { grid-column: auto; }
  .footer-bottom { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .review-carousel-track { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}