/* Layout: NessCampbell-style corporate-industrial homepage rebuilt for Snell.
   Full-bleed photo hero, split image/text bands, service tiles, safety band, fleet rail,
   project mosaic, crew split, photo CTA, dark footer. Every block maps to one Elementor container.
   Single committed light look; container queries make the Phone toggle honest. */
/* Barlow and Barlow Condensed (SIL Open Font License), latin subset, self-hosted so text doesn't wait on Google Fonts */
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/barlow-400.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 500; font-display: swap; src: url("/assets/fonts/barlow-500.woff2") format("woff2"); }
@font-face { font-family: "Barlow"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/barlow-600.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 600; font-display: swap; src: url("/assets/fonts/barlow-condensed-600.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 700; font-display: swap; src: url("/assets/fonts/barlow-condensed-700.woff2") format("woff2"); }
@font-face { font-family: "Barlow Condensed"; font-style: normal; font-weight: 800; font-display: swap; src: url("/assets/fonts/barlow-condensed-800.woff2") format("woff2"); }
:root {
  --navy: #0b1f5c;        /* Snell navy, warmed from logo #000066 for large fills */
  --navy-deep: #07143d;
  --orange: #ffa300;      /* logo orange */
  --orange-hover: #ffb733;
  --ink: #141821;
  --gray: #5d6573;
  --mist: #f3f4f6;        /* light section ground */
  --line: #dde0e5;
  --white: #ffffff;
  --on-dark: #e9edf6;
  --on-dark-muted: #a9b4cf;

  --display: "Barlow Condensed", "Arial Narrow", Arial, sans-serif;
  --body: "Barlow", "Helvetica Neue", Arial, sans-serif;
  color-scheme: light;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; background: var(--white); color: var(--ink); font-family: var(--body); font-size: 17px; line-height: 1.6; }
a { color: inherit; }
img { display: block; max-width: 100%; }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }
h1, h2, h3, h4, p { margin: 0; }
h1, h2, h3 { font-family: var(--display); font-weight: 800; text-transform: uppercase; line-height: .98; letter-spacing: .005em; text-wrap: balance; }

/* ---------- Page container ---------- */
.site { container-type: inline-size; background: var(--white); margin: 0 auto; max-width: 100%; overflow: clip; }

/* ---------- Primitives ---------- */
.wrap { max-width: 1280px; margin: 0 auto; padding-inline: 40px; }
.eyebrow { font: 700 14px var(--display); letter-spacing: .18em; text-transform: uppercase; color: var(--orange); display: flex; align-items: center; gap: 12px; }
.eyebrow::before { content: ""; width: 34px; height: 3px; background: var(--orange); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; font: 700 17px var(--display); letter-spacing: .1em; text-transform: uppercase; text-decoration: none;
  padding: 15px 30px; border: 2px solid transparent; cursor: pointer; transition: background .15s, color .15s; white-space: nowrap; }
.btn-orange { background: var(--orange); color: var(--navy-deep); }
.btn-orange:hover { background: var(--orange-hover); }
.btn-outline-light { border-color: var(--white); color: var(--white); }
.btn-outline-light:hover { background: var(--white); color: var(--navy); }
.btn-navy { background: var(--navy); color: var(--white); }
.btn-navy:hover { background: var(--navy-deep); }
.btn-outline-dark { border-color: var(--navy); color: var(--navy); }
.btn-outline-dark:hover { background: var(--navy); color: var(--white); }
.sec { padding-block: 104px; }
.sec-title { font-size: 54px; color: var(--navy); }
.lead { font-size: 19px; color: var(--gray); max-width: 60ch; }

/* ---------- Header ---------- */
.utility { background: var(--navy-deep); color: var(--on-dark-muted); font-size: 14px; }
.utility .wrap { display: flex; flex-wrap: wrap; gap: 6px 26px; align-items: center; min-height: 40px; }
.utility b { color: var(--white); font-weight: 600; }
.utility a { text-decoration: none; }
.utility a:hover b { text-decoration: underline; }
.utility .grow { flex: 1; }
.utility .soc { display: flex; gap: 14px; }
.utility .soc span { width: 22px; height: 22px; border-radius: 50%; background: rgba(255,255,255,.12); display: grid; place-items: center; font: 600 11px var(--body); color: var(--white); }
header.main { background: var(--white); border-bottom: 1px solid var(--line); position: sticky; top: var(--rb, 0px); z-index: 30; transition: box-shadow .2s; }
header.main .wrap { display: flex; align-items: center; gap: 32px; min-height: 96px; transition: min-height .2s; }
.brand { display: block; aspect-ratio: 1920 / 753; height: 74px; background: url("/img/logo.svg") center / contain no-repeat; flex: none; transition: height .2s; }
/* Stuck state: set by JS once the utility bar has scrolled away */
header.main.stuck { box-shadow: 0 6px 18px rgba(11,31,92,.12); }
header.main.stuck .wrap { min-height: 72px; }
header.main.stuck .brand { height: 54px; }
header.main.stuck nav.primary > a, header.main.stuck nav.primary > .dd-wrap > a { padding-block: 22px; }
.hcall { display: none; align-items: center; gap: 10px; font: 700 17px var(--display); letter-spacing: .06em; color: var(--navy); text-decoration: none; white-space: nowrap; margin-right: -12px; }
.hcall .ico { width: 38px; height: 38px; border-radius: 50%; background: var(--orange); color: var(--navy-deep); display: grid; place-items: center; flex: none; }
.hcall:hover .txt { text-decoration: underline; }
header.main.stuck .hcall { display: flex; }
/* Open mobile menu: JS sets its height so it fills the screen from the header down to the bottom call bar */
header.main .mnav { overflow-y: auto; overscroll-behavior: contain; align-content: start; }
html.menu-open { overflow: hidden; }
@container (max-width: 1380px) { .hcall .txt { display: none; } .hcall { margin-right: -16px; } }
@container (max-width: 960px) { .hcall { margin: 0 0 0 auto; } header.main.stuck .menu-btn { margin-left: 0; } header.main .wrap { gap: 16px; } }
/* Phones already have the bottom call bar, so skip the header call icon there */
@container (max-width: 560px) { header.main.stuck .hcall { display: none; } header.main.stuck .menu-btn { margin-left: auto; } }
.brand.rev { background-image: url("/img/logo-rev.svg"); }
nav.primary { display: flex; margin-left: auto; }
nav.primary a { font: 700 17px var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--navy); text-decoration: none; padding: 34px 14px; display: flex; align-items: center; gap: 6px; cursor: pointer; border-bottom: 4px solid transparent; transition: padding .2s; }
nav.primary a:hover { border-bottom-color: var(--orange); }
nav.primary a.dd::after { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-3px); }
.menu-btn { display: none; margin-left: auto; background: var(--navy); color: var(--white); border: 0; font: 700 15px var(--display); letter-spacing: .1em; text-transform: uppercase; padding: 12px 16px; cursor: pointer; }

/* ---------- Hero ---------- */
.hero { position: relative; min-height: 720px; display: grid; align-items: end; color: var(--white); background: var(--navy-deep); }
.hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; }
.hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,20,61,.88) 0%, rgba(7,20,61,.55) 48%, rgba(7,20,61,.05) 80%), linear-gradient(0deg, rgba(7,20,61,.7) 0%, rgba(7,20,61,0) 45%); }
.hero .wrap { position: relative; z-index: 2; padding-block: 120px 96px; width: 100%; }
.hero .inner { max-width: 760px; display: grid; gap: 24px; }
.hero h1 { font-size: 84px; }
.hero h1 em { font-style: normal; color: var(--orange); }
.hero .tags { font: 700 24px var(--display); letter-spacing: .14em; text-transform: uppercase; color: var(--white); }
.hero .tags span { color: var(--orange); padding-inline: 8px; }
.hero p.intro { font-size: 19px; color: var(--on-dark); max-width: 56ch; }
.hero .ctas { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 6px; }
.hero .badge { position: absolute; z-index: 2; right: 40px; bottom: 96px; width: 170px; height: 170px; border-radius: 50%; border: 3px solid var(--orange); display: grid; place-items: center; text-align: center; background: rgba(7,20,61,.6); }
.hero .badge b { display: block; font: 800 64px/0.85 var(--display); color: var(--orange); }
.hero .badge span { font: 700 14px var(--display); letter-spacing: .16em; text-transform: uppercase; }

/* ---------- Since 1992 split ---------- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.split .media { position: relative; }
.split .media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.split .media .stamp { position: absolute; right: -28px; bottom: -28px; background: var(--orange); color: var(--navy-deep); padding: 24px 28px; display: grid; gap: 2px; }
.split .media .stamp b { font: 800 56px/0.9 var(--display); }
.split .media .stamp span { font: 700 14px var(--display); letter-spacing: .14em; text-transform: uppercase; }
.split .copy { display: grid; gap: 22px; }
.split .copy .btns { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }

/* ---------- Services ---------- */
.svc-band { background: var(--mist); }
.svc-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 48px; }
.svc-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.svc { background: var(--white); text-decoration: none; display: grid; grid-template-rows: auto 1fr; cursor: pointer; transition: transform .2s, box-shadow .2s; }
.svc:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(11,31,92,.14); }
.svc .ph { aspect-ratio: 4 / 3; overflow: hidden; }
.svc .ph img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.svc:hover .ph img { transform: scale(1.05); }
.svc .txt { padding: 24px 24px 26px; display: grid; gap: 10px; align-content: start; border-top: 5px solid var(--orange); }
.svc h3 { font-size: 28px; color: var(--navy); }
.svc p { font-size: 16px; color: var(--gray); }
.svc .more { font: 700 15px var(--display); letter-spacing: .12em; text-transform: uppercase; color: var(--navy); margin-top: 4px; }
.doc { margin-top: 24px; background: var(--navy); color: var(--on-dark); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; padding: 26px 32px; }
.doc b { font: 800 26px var(--display); text-transform: uppercase; color: var(--white); margin-right: 12px; }

/* ---------- Credentials strip ---------- */
.creds { border-bottom: 1px solid var(--line); }
.creds .wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px 40px; padding-block: 36px; }
.creds .label { font: 700 15px var(--display); letter-spacing: .16em; text-transform: uppercase; color: var(--gray); }
.creds .logos { display: flex; flex-wrap: wrap; align-items: center; gap: 28px 56px; }
.creds img { height: 64px; width: auto; }
.creds .word { font: 800 30px/1 var(--display); color: var(--navy); letter-spacing: .04em; display: grid; }
.creds .word small { font: 500 11px var(--body); letter-spacing: .06em; color: var(--gray); text-transform: none; }

/* ---------- Safety band ---------- */
.safety { position: relative; color: var(--white); background: var(--navy); overflow: hidden; }
.safety > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .18; }
.safety .wrap { position: relative; display: grid; grid-template-columns: 1fr 1.1fr; gap: 64px; align-items: center; padding-block: 96px; }
.safety h2 { font-size: 60px; }
.safety ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 20px 28px; }
.safety li { display: grid; gap: 6px; border-top: 3px solid var(--orange); padding-top: 14px; }
.safety li b { font: 700 22px var(--display); text-transform: uppercase; letter-spacing: .03em; }
.safety li span { font-size: 15.5px; color: var(--on-dark-muted); }

/* ---------- Fleet rail ---------- */
.fleet-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 24px; margin-bottom: 40px; }
.rail-ctl { display: flex; gap: 8px; }
.rail-ctl button { width: 52px; height: 52px; border: 2px solid var(--navy); background: var(--white); color: var(--navy); font-size: 20px; cursor: pointer; }
.rail-ctl button:hover { background: var(--navy); color: var(--white); }
.rail { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 72px) / 4); gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 14px; scrollbar-width: thin; }
.crane { scroll-snap-align: start; border: 1px solid var(--line); display: grid; grid-template-rows: auto 1fr; background: var(--white); }
.crane .ph { aspect-ratio: 3 / 2; background: var(--white); overflow: hidden; }
.crane .ph img { width: 100%; height: 100%; object-fit: cover; }
.crane .txt { padding: 18px 20px 20px; display: grid; gap: 8px; border-top: 1px solid var(--line); }
.crane .cap { font: 800 40px/1 var(--display); color: var(--navy); }
.crane .cap small { font-size: 20px; color: var(--gray); margin-left: 4px; }
.crane .model { font-weight: 600; }
.crane .type { font-size: 14px; color: var(--gray); }
.crane .specs { display: flex; gap: 16px; font-size: 14px; color: var(--gray); border-top: 1px dashed var(--line); padding-top: 10px; }
.crane .specs b { color: var(--ink); }

/* ---------- Projects mosaic ---------- */
.projects { background: var(--mist); }
.mosaic { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 240px; gap: 12px; margin-top: 44px; }
.tile { position: relative; overflow: hidden; cursor: pointer; background: var(--navy); }
.tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.tile:hover img { transform: scale(1.05); }
.tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(7,20,61,.85), rgba(7,20,61,0) 55%); }
.tile .t { position: absolute; z-index: 2; left: 18px; right: 18px; bottom: 16px; color: var(--white); display: grid; gap: 2px; }
.tile .t b { font: 800 22px/1.05 var(--display); text-transform: uppercase; }
.tile .t span { font-size: 13.5px; color: var(--on-dark); }
.tile.w2 { grid-column: span 2; }
.tile.h2 { grid-row: span 2; }

/* ---------- Crew ---------- */
.crew .split { grid-template-columns: 1.1fr 1fr; }
.crew .media img { aspect-ratio: 4 / 3; }

/* ---------- CTA ---------- */
.cta { position: relative; color: var(--white); text-align: center; background: var(--navy-deep); }
.cta > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; }
.cta::after { content: ""; position: absolute; inset: 0; background: rgba(7,20,61,.62); }
.cta .wrap { position: relative; z-index: 2; padding-block: 120px; display: grid; justify-items: center; gap: 22px; }
.cta h2 { font-size: 72px; max-width: 16ch; }
.cta p { font-size: 20px; color: var(--on-dark); max-width: 52ch; }
.cta .btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }

/* ---------- Footer ---------- */
footer { background: var(--navy-deep); color: var(--on-dark-muted); font-size: 15px; }
footer .wrap { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 40px; padding-block: 72px 40px; }
footer h2 { font: 700 17px var(--display); letter-spacing: .14em; text-transform: uppercase; color: var(--white); margin-bottom: 14px; }
footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
footer a { text-decoration: none; cursor: pointer; }
footer a:hover { color: var(--orange); }
footer .tel { color: var(--white); font-weight: 600; }
footer .legal { grid-column: 1 / -1; border-top: 1px solid rgba(169,180,207,.2); padding-top: 22px; display: flex; flex-wrap: wrap; gap: 8px 28px; font-size: 13.5px; }
.call-bar { display: none; }

.toast { position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); background: var(--navy-deep); color: var(--white); padding: 10px 16px; border-radius: 6px; font-size: 14px; z-index: 60; }

/* ---------- Inner page hero ---------- */
.phero { position: relative; color: var(--white); background: var(--navy-deep); }
.phero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.phero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,20,61,.9) 0%, rgba(7,20,61,.6) 55%, rgba(7,20,61,.25) 100%); }
.phero .wrap { position: relative; z-index: 2; padding-block: 120px 88px; display: grid; gap: 20px; }
.phero h1 { font-size: 76px; max-width: 14ch; }
.phero .intro { font-size: 19px; color: var(--on-dark); max-width: 58ch; }
.crumbs { font: 600 14px var(--display); letter-spacing: .14em; text-transform: uppercase; color: var(--orange); }
.crumbs a { color: var(--white); text-decoration: none; cursor: pointer; }
.hstats { display: flex; flex-wrap: wrap; gap: 20px 48px; margin-top: 8px; }
.hstats div { display: grid; border-left: 3px solid var(--orange); padding-left: 16px; }
.hstats b { font: 800 44px/1 var(--display); }
.hstats span { font-size: 14px; color: var(--on-dark-muted); text-transform: uppercase; letter-spacing: .1em; }

/* ---------- Sub nav ---------- */
.subnav { position: sticky; top: calc(var(--rb, 0px) + var(--hh, 0px)); z-index: 4; background: var(--white); border-bottom: 1px solid var(--line); box-shadow: 0 6px 16px rgba(11,31,92,.06); }
.subnav .wrap { display: flex; gap: 4px; overflow-x: auto; }
.subnav a { font: 700 16px var(--display); letter-spacing: .1em; text-transform: uppercase; color: var(--navy); padding: 20px 16px; white-space: nowrap; cursor: pointer; border-bottom: 4px solid transparent; text-decoration: none; }
.subnav a:hover, .subnav a.on { border-bottom-color: var(--orange); }

/* ---------- Service detail rows ---------- */
.svc-detail.alt { background: var(--mist); }
.svc-detail .wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
.svc-detail.flip .media { order: 2; }
.svc-detail .media { position: relative; min-width: 0; }
.svc-detail .media > img { width: 100%; aspect-ratio: 5 / 4; object-fit: cover; }
.svc-detail .media.stack { display: grid; grid-template-columns: 1.2fr 1fr; gap: 14px; align-items: end; }
.svc-detail .media.stack img { width: 100%; object-fit: cover; }
.svc-detail .media.stack img:first-child { aspect-ratio: 4 / 5; }
.svc-detail .media.stack img:last-child { aspect-ratio: 3 / 4; margin-bottom: -40px; }
.svc-detail .tag { position: absolute; left: 0; bottom: 0; background: var(--orange); color: var(--navy-deep); font: 700 15px var(--display); letter-spacing: .1em; text-transform: uppercase; padding: 10px 16px; }
.svc-detail .copy { display: grid; gap: 22px; min-width: 0; }
.lists { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.lists.one { grid-template-columns: 1fr; }
.lists h4 { font: 700 18px var(--display); letter-spacing: .1em; text-transform: uppercase; color: var(--navy); margin-bottom: 10px; }
.lists ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: 16px; }
.lists li { padding-left: 24px; position: relative; }
.lists li::before { content: ""; position: absolute; left: 0; top: 9px; width: 12px; height: 3px; background: var(--orange); }
.copy .btns { display: flex; flex-wrap: wrap; gap: 12px; }
dl.specs { margin: 0; display: grid; border-top: 2px solid var(--navy); }
dl.specs div { display: grid; grid-template-columns: 160px 1fr; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); }
dl.specs dt { font: 700 15px var(--display); letter-spacing: .1em; text-transform: uppercase; color: var(--gray); }
dl.specs dd { margin: 0; font-weight: 500; }
.counters { display: flex; flex-wrap: wrap; gap: 16px; }
.counters div { background: var(--navy); color: var(--white); padding: 18px 22px; display: grid; min-width: 130px; }
.counters b { font: 800 46px/1 var(--display); color: var(--orange); }
.counters span { font-size: 13px; text-transform: uppercase; letter-spacing: .1em; color: var(--on-dark-muted); }
.hoist { background: var(--navy); color: var(--white); }
.hoist .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 24px; padding-block: 64px; }
.hoist h2 { font-size: 48px; margin: 10px 0 8px; }
.hoist p:not(.eyebrow) { color: var(--on-dark-muted); }
.process { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; counter-reset: step; }
.process li { counter-increment: step; display: grid; gap: 10px; align-content: start; border-top: 4px solid var(--navy); padding-top: 18px; }
.process li::before { content: counter(step, decimal-leading-zero); font: 800 48px/1 var(--display); color: var(--orange); }
.process b { font: 700 22px/1.1 var(--display); text-transform: uppercase; color: var(--navy); }
.process span { color: var(--gray); font-size: 16px; }
.industries { background: var(--mist); border-top: 1px solid var(--line); }
.industries .wrap { display: grid; gap: 18px; padding-block: 56px; }
.industries .label { font: 700 15px var(--display); letter-spacing: .16em; text-transform: uppercase; color: var(--gray); }
.industries .chips { display: flex; flex-wrap: wrap; gap: 10px; }
.industries .chips span { background: var(--white); border: 1px solid var(--line); padding: 10px 18px; font: 600 17px var(--display); letter-spacing: .06em; text-transform: uppercase; color: var(--navy); }

/* ---------- Fleet archive ---------- */
.fbar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px 24px; padding-bottom: 20px; border-bottom: 2px solid var(--navy); }
.chips-f { display: flex; flex-wrap: wrap; gap: 8px; }
.chips-f button { font: 700 15px var(--display); letter-spacing: .1em; text-transform: uppercase; padding: 10px 16px; background: var(--white); color: var(--navy); border: 2px solid var(--line); cursor: pointer; }
.chips-f button[aria-pressed="true"] { background: var(--navy); border-color: var(--navy); color: var(--white); }
.chips-f button small { opacity: .7; margin-left: 4px; }
.fctl { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.fctl label { font: 700 14px var(--display); letter-spacing: .12em; text-transform: uppercase; color: var(--gray); }
.fctl select { font: 500 15px var(--body); padding: 9px 10px; border: 2px solid var(--line); background: var(--white); color: var(--ink); }
.viewt { display: flex; border: 2px solid var(--navy); }
.viewt button { font: 700 14px var(--display); letter-spacing: .1em; text-transform: uppercase; padding: 8px 14px; border: 0; background: var(--white); color: var(--navy); cursor: pointer; }
.viewt button[aria-pressed="true"] { background: var(--navy); color: var(--white); }
.fcount { color: var(--gray); font-size: 15px; margin: 16px 0 20px; }
.fgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.fcard { border: 1px solid var(--line); background: var(--white); display: grid; grid-template-rows: auto 1fr; transition: box-shadow .2s; }
.fcard:hover { box-shadow: 0 16px 36px rgba(11,31,92,.12); }
.fcard .ph { aspect-ratio: 3 / 2; overflow: hidden; background: var(--white); position: relative; }
.fcard .ph img { width: 100%; height: 100%; object-fit: cover; }
.fcard .ph .t { position: absolute; left: 0; top: 0; background: var(--navy); color: var(--white); font: 700 13px var(--display); letter-spacing: .1em; text-transform: uppercase; padding: 6px 10px; }
.fcard .body { padding: 20px 22px 22px; display: grid; gap: 14px; align-content: start; border-top: 4px solid var(--orange); }
.fcard .top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.fcard h3 { font-size: 23px; color: var(--navy); }
.fcard .cap { font: 800 38px/1 var(--display); color: var(--navy); white-space: nowrap; }
.fcard .cap small { font-size: 18px; color: var(--gray); margin-left: 3px; }
.fcard dl { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid var(--line); }
.fcard dl div { padding: 10px 0; border-bottom: 1px solid var(--line); }
.fcard dl div:nth-child(odd) { border-right: 1px solid var(--line); }
.fcard dl div:nth-child(even) { padding-left: 14px; }
.fcard dt { font: 700 12px var(--display); letter-spacing: .12em; text-transform: uppercase; color: var(--gray); }
.fcard dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.fcard .acts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.fcard .acts .btn { padding: 12px 10px; font-size: 15px; }
.ftable { overflow-x: auto; border: 1px solid var(--line); }
.ftable table { width: 100%; min-width: 680px; border-collapse: collapse; background: var(--white); }
.ftable th { text-align: left; font: 700 13px var(--display); letter-spacing: .12em; text-transform: uppercase; color: var(--white); background: var(--navy); padding: 14px 16px; }
.ftable td { padding: 13px 16px; border-bottom: 1px solid var(--line); }
.ftable tr:nth-child(even) td { background: var(--mist); }
.ftable .n { text-align: right; font-variant-numeric: tabular-nums; }
.ftable td.capc { font: 800 22px var(--display); color: var(--navy); text-align: right; }
.ftable a { color: var(--navy); font-weight: 600; cursor: pointer; }
.help { background: var(--navy); color: var(--white); }
.help .wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; padding-block: 88px; }
.help .copy { display: grid; gap: 20px; }
.help h2 { font-size: 52px; }
.help p:not(.eyebrow) { color: var(--on-dark-muted); max-width: 54ch; }
.abcd { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.abcd li { display: grid; grid-template-columns: 64px 1fr; align-items: center; gap: 18px; background: rgba(255,255,255,.06); padding: 14px 18px; }
.abcd b { font: 800 44px/1 var(--display); color: var(--orange); text-align: center; }
.abcd span { color: var(--on-dark); }
nav.primary a[aria-current="page"] { border-bottom-color: var(--orange); }

@container (max-width: 1180px) {
  .fgrid { grid-template-columns: repeat(2, 1fr); }
  .process { grid-template-columns: repeat(2, 1fr); }
}
@container (max-width: 960px) {
  .svc-detail .wrap, .help .wrap { grid-template-columns: 1fr; gap: 48px; }
  .svc-detail.flip .media { order: 0; }
  .svc-detail .media.stack img:last-child { margin-bottom: 0; }
}
@container (max-width: 560px) {
  .phero .wrap { padding-block: 72px 56px; }
  .phero h1 { font-size: 46px; }
  .hstats b { font-size: 34px; }
  .subnav a { padding: 16px 12px; font-size: 15px; }
  .lists, .process, .fgrid { grid-template-columns: 1fr; }
  dl.specs div { grid-template-columns: 1fr; gap: 2px; }
  .hoist h2, .help h2 { font-size: 36px; }
  .fctl { width: 100%; }
  .fctl select { flex: 1; }
}

/* ---------- Quote page ---------- */
.phero.short .wrap { padding-block: 88px 64px; }
.qsec { background: var(--mist); }
.qlayout { display: grid; grid-template-columns: 1fr 340px; gap: 40px; align-items: start; }
.qcard { background: var(--white); border-top: 6px solid var(--orange); box-shadow: 0 14px 40px rgba(11,31,92,.08); padding: 36px 40px 28px; display: grid; gap: 24px; min-width: 0; }
.steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; counter-reset: none; }
.steps li { display: flex; align-items: center; gap: 10px; padding-bottom: 12px; border-bottom: 4px solid var(--line); color: var(--gray); font: 700 16px var(--display); letter-spacing: .1em; text-transform: uppercase; }
.steps li b { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: var(--line); color: var(--gray); font-size: 16px; flex: none; }
.steps li.on { color: var(--navy); border-bottom-color: var(--orange); }
.steps li.on b { background: var(--navy); color: var(--white); }
.steps li.done { color: var(--navy); border-bottom-color: var(--navy); }
.steps li.done b { background: var(--orange); color: var(--navy-deep); }
.qstep { border: 0; margin: 0; padding: 0; display: grid; gap: 18px; min-width: 0; }
.qstep legend { float: left; width: 100%; padding: 0; font: 800 34px/1 var(--display); text-transform: uppercase; color: var(--navy); }
.hint { color: var(--gray); font-size: 16px; }
.lift { display: grid; grid-template-columns: 1.25fr 1fr; gap: 24px; align-items: center; }
.dia { background: var(--mist); border: 1px solid var(--line); padding: 12px; }
.dia svg { width: 100%; height: auto; display: block; }
.dia .gnd { stroke: var(--ink); stroke-width: 2; }
.dia .bld { fill: #cfd6e3; stroke: #8a94a8; }
.dia .load { fill: var(--orange); stroke: var(--navy-deep); }
.dia .crn { stroke: var(--navy); stroke-width: 4; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.dia .crn.thin { stroke-width: 1.5; }
.dia .whl { fill: var(--navy); }
.dia .dg line { stroke: var(--gray); stroke-width: 1.5; }
.dia .dg text { font: 800 20px var(--display); fill: var(--gray); }
.dia .dg.on line { stroke: var(--orange); stroke-width: 3.5; }
.dia .dg.on text { fill: var(--navy); }
.dims { display: grid; gap: 12px; }
.f { display: grid; gap: 6px; min-width: 0; }
.f label { font: 600 15px var(--body); color: var(--ink); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.f label i { font: 800 18px/1 var(--display); font-style: normal; width: 26px; height: 26px; display: grid; place-items: center; background: var(--navy); color: var(--white); }
.f label em { color: #c0261b; font-style: normal; }
.f .opt { font-weight: 400; color: var(--gray); font-size: 13.5px; }
.f input, .f select, .f textarea { font: 400 16px var(--body); color: var(--ink); background: var(--white); border: 1.5px solid #c3c9d4; border-radius: 0; padding: 12px 14px; width: 100%; }
.f input:focus, .f select:focus, .f textarea:focus { outline: none; border-color: var(--navy); box-shadow: 0 0 0 3px rgba(255,163,0,.45); }
.f input[aria-invalid="true"] { border-color: #c0261b; }
.u { position: relative; }
.u input { padding-right: 48px; font-variant-numeric: tabular-nums; }
.u::after { content: attr(data-u); position: absolute; right: 14px; top: 50%; transform: translateY(-50%); font: 700 14px var(--display); letter-spacing: .08em; text-transform: uppercase; color: var(--gray); pointer-events: none; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.grid2 .full { grid-column: 1 / -1; }
.grid2.inner { gap: 12px; grid-template-columns: 1fr 1.3fr; }
.check { font-weight: 500 !important; color: var(--gray) !important; cursor: pointer; }
.check input { width: 18px; height: 18px; accent-color: var(--navy); }
.err { color: #c0261b; font-weight: 600; }
.qnav { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; border-top: 1px solid var(--line); padding-top: 20px; }
.qnav .grow { flex: 1; }
.fine { font-size: 13px; color: var(--gray); }
.qside { display: grid; gap: 20px; position: sticky; top: calc(var(--rb, 0px) + var(--hh, 0px) + 20px); }
.sum { background: var(--white); padding: 24px; border: 1px solid var(--line); display: grid; gap: 14px; }
.sum h3 { font-size: 24px; color: var(--navy); }
.sum dl { margin: 0; display: grid; }
.sum dl div { display: grid; grid-template-columns: 96px 1fr; gap: 10px; padding: 9px 0; border-top: 1px solid var(--line); font-size: 15px; }
.sum dt { font: 700 13px var(--display); letter-spacing: .1em; text-transform: uppercase; color: var(--gray); }
.sum dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
/* Quote form: Turnstile widget (usually invisible) and the honeypot field people never see */
.ts:empty { display: none; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.qnav .btn[disabled] { opacity: .6; cursor: progress; }
.call { background: var(--navy); color: var(--white); padding: 24px; display: grid; gap: 6px; }
.call > b { font: 800 36px/1 var(--display); color: var(--orange); }
.call > span { color: var(--on-dark-muted); font-size: 14px; }
.call ul { list-style: none; margin: 10px 0 0; padding: 0; display: grid; }
.call li { display: flex; justify-content: space-between; gap: 10px; border-top: 1px solid rgba(169,180,207,.25); padding: 9px 0; font-size: 15px; }
.call li span { font-weight: 600; white-space: nowrap; }
@container (max-width: 1080px) {
  .qlayout { grid-template-columns: 1fr; }
  .qside { position: static; grid-template-columns: 1fr 1fr; }
  .lift { grid-template-columns: 1fr; }
  .dims { grid-template-columns: 1fr 1fr; }
}
@container (max-width: 560px) {
  .qcard { padding: 24px 18px 20px; }
  .steps li span { display: none; }
  .steps li { justify-content: center; }
  .qstep legend { font-size: 28px; }
  .grid2, .qside { grid-template-columns: 1fr; }
  .grid2.inner { grid-template-columns: 1fr 1.3fr; }
  .dims { grid-template-columns: 1fr; }
  .qnav .btn { flex: 1 1 auto; }
}

/* ---------- Responsive ---------- */
@container (max-width: 1180px) {
  nav.primary a { padding-inline: 9px; font-size: 16px; }
  .hero h1 { font-size: 70px; }
  .svc-grid { grid-template-columns: repeat(2, 1fr); }
  .rail { grid-auto-columns: calc((100% - 48px) / 3); }
  .hero .badge { display: none; }
}
@container (max-width: 960px) {
  nav.primary, header.main .btn { display: none; }
  .menu-btn { display: inline-block; }
  .utility .hide-md { display: none; }
  .split, .crew .split, .safety .wrap { grid-template-columns: 1fr; gap: 56px; }
  .split .media .stamp { right: 16px; bottom: -24px; }
  .mosaic { grid-template-columns: repeat(2, 1fr); }
  .tile.w2 { grid-column: span 2; }
  .rail { grid-auto-columns: calc((100% - 24px) / 2); }
  footer .wrap { grid-template-columns: 1fr 1fr; }
}
@container (max-width: 560px) {
  body { font-size: 16px; }
  .wrap { padding-inline: 18px; }
  header.main .wrap { min-height: 78px; }
  .brand { height: 58px; }
  .utility .wrap { justify-content: center; }
  .utility .soc { display: none; }
  .hero { min-height: 0; }
  .hero .wrap { padding-block: 140px 48px; }
  .hero h1 { font-size: 46px; }
  .hero .tags { font-size: 17px; letter-spacing: .08em; }
  .hero .tags span { padding-inline: 4px; }
  .hero .ctas .btn { flex: 1 1 100%; }
  .hero::after { background: linear-gradient(0deg, rgba(7,20,61,.92) 0%, rgba(7,20,61,.55) 60%, rgba(7,20,61,.25) 100%); }
  .sec { padding-block: 64px; }
  .sec-title, .safety h2 { font-size: 40px; }
  .split .media .stamp b { font-size: 42px; }
  .svc-grid, .safety ul { grid-template-columns: 1fr; }
  .rail { grid-auto-columns: 82%; }
  .mosaic { grid-template-columns: 1fr; grid-auto-rows: 220px; }
  .tile.w2, .tile.h2 { grid-column: auto; grid-row: auto; }
  .cta .wrap { padding-block: 80px; }
  .cta h2 { font-size: 46px; }
  .btn { padding: 14px 22px; }
  .split .copy .btns .btn, .cta .btns .btn { flex: 1 1 100%; }
  footer .wrap { grid-template-columns: 1fr; padding-bottom: 100px; }
  .call-bar { display: grid; grid-template-columns: 1fr 1fr; position: sticky; bottom: 0; z-index: 6; }
  .call-bar .btn { padding: 16px 8px; }
  .call-bar .btn-navy { background: var(--navy-deep); }
}


/* ---------- Full-site additions ---------- */
.dd-wrap { position: relative; display: flex; }
.dd-wrap .menu { display: none; position: absolute; top: 100%; left: 0; z-index: 20; background: var(--white); min-width: 280px; border-top: 4px solid var(--orange); box-shadow: 0 18px 40px rgba(11,31,92,.18); }
.dd-wrap:hover .menu, .dd-wrap:focus-within .menu { display: grid; }
.dd-wrap.closed .menu { display: none; } /* set by JS after a menu link is clicked, cleared when the mouse leaves */
nav.primary .menu a { padding: 14px 20px; font: 600 16px var(--body); letter-spacing: 0; text-transform: none; border-bottom: 1px solid var(--line); }
nav.primary .menu a:hover { background: var(--mist); }
.mnav { background: var(--navy-deep); padding: 12px 18px 20px; display: grid; }
.mnav a { color: var(--white); text-decoration: none; font: 700 19px var(--display); letter-spacing: .08em; text-transform: uppercase; padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
.mnav a.sub { font: 500 16px var(--body); text-transform: none; letter-spacing: 0; padding-left: 16px; color: var(--on-dark); }
.phero .ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }
.phero h1 { max-width: 20ch; }
.rich { display: grid; gap: 16px; font-size: 18px; color: var(--gray); min-width: 0; }
.rich p, .rich h3 { margin: 0; }
.rich a { color: var(--navy); font-weight: 600; }
.rich strong { color: var(--ink); }
.rich ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; color: var(--ink); font-size: 17px; }
.rich ul li { padding-left: 26px; position: relative; }
.rich ul li::before { content: ""; position: absolute; left: 0; top: 11px; width: 14px; height: 3px; background: var(--orange); }
.rich ol { margin: 0; padding: 0; list-style: none; counter-reset: s; display: grid; gap: 14px; color: var(--ink); }
.rich ol li { counter-increment: s; position: relative; padding-left: 70px; min-height: 36px; }
.rich ol li::before { content: counter(s, decimal-leading-zero); position: absolute; left: 0; top: 0; font: 800 36px/1 var(--display); color: var(--orange); }
.subh { font: 700 18px var(--display); letter-spacing: .1em; text-transform: uppercase; color: var(--navy); margin-top: 6px; }
.svc-types { display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; }
.svc-types .txt { padding: 20px 20px 22px; }
.svc-types h3 { font-size: 24px; }
.svc-types p { font-size: 15px; }
.svc .range { font: 700 14px var(--display); letter-spacing: .1em; text-transform: uppercase; color: var(--orange); }
.areas-band .wrap { display: grid; gap: 40px; }
.areas-band .tagrow { display: grid; grid-template-columns: 1fr 1.6fr; gap: 24px 64px; align-items: start; }
.areas-band .after { color: var(--gray); }
.rel .after a, .rel .chips2 a { display: inline; height: auto; border: 0; background: none; padding: 0; font: inherit; color: var(--navy); text-decoration: underline; text-transform: none; letter-spacing: 0; }
.rel .after a::after, .rel .chips2 a::after { content: none; }
.rel .chips2 a { text-transform: inherit; letter-spacing: inherit; } /* a link inside an industry chip reads like the chip */
.help-cta .media.diagram img { object-fit: contain; background: var(--white); padding: 16px; }
@container (max-width: 1180px) { .svc-types { grid-template-columns: repeat(3, 1fr); } }
@container (max-width: 960px) { .svc-types { grid-template-columns: repeat(2, 1fr); } .areas-band .tagrow { grid-template-columns: 1fr; } }
@container (max-width: 560px) { .svc-types { grid-template-columns: 1fr; } }
.rows > section:nth-child(even) { background: var(--mist); }
.row .wrap { display: grid; grid-template-columns: 5fr 7fr; gap: 64px; align-items: start; }
.row .head { display: grid; gap: 16px; align-content: start; }
.row .head h2 { font-size: 46px; color: var(--navy); }
.row .head img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; margin-top: 12px; }
.two { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; }
.two h2 { font-size: 40px; color: var(--navy); margin-bottom: 18px; }
.chips2 { display: flex; flex-wrap: wrap; gap: 8px; }
.chips2 span { background: var(--white); border: 1px solid var(--line); padding: 8px 14px; font: 600 16px var(--display); letter-spacing: .05em; text-transform: uppercase; color: var(--navy); }
.townintro .wrap { display: grid; grid-template-columns: 1.1fr 1fr; gap: 72px; align-items: center; }
.townintro .media img { width: 100%; aspect-ratio: 5 / 4; object-fit: cover; }
.townintro h2, .local h2, .proj h2, .faqsec h2, .rel h2 { font-size: 48px; color: var(--navy); }
.local .wrap { display: grid; grid-template-columns: 1.2fr 1fr; gap: 64px; align-items: start; }
.local .box { background: var(--white); border-top: 5px solid var(--orange); padding: 28px; display: grid; gap: 14px; }
.local .box h3 { font-size: 24px; color: var(--navy); }
.local .box .tel { font: 800 34px/1 var(--display); color: var(--navy); text-decoration: none; }
.proj { background: var(--navy); color: var(--white); }
.proj .wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; padding-block: 88px; }
.proj h2 { color: var(--white); }
.proj .rich { color: var(--on-dark); }
.proj img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.faq { display: grid; border-top: 2px solid var(--navy); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 18px; padding: 20px 0; font: 700 22px/1.2 var(--display); text-transform: uppercase; color: var(--navy); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary:hover, .faq summary:focus-visible { color: var(--orange); }
.faq summary:focus-visible { outline: 2px solid var(--orange); outline-offset: 4px; }
/* Plus icon drawn with two bars; the vertical bar collapses into a minus when the panel opens */
.faq summary::after { content: ""; flex: none; width: 18px; height: 18px; margin-top: 3px;
  background: linear-gradient(var(--orange), var(--orange)) center / 100% 3px no-repeat, linear-gradient(var(--orange), var(--orange)) center / 3px 100% no-repeat;
  transition: background-size .3s ease, transform .3s ease; }
.faq details[open]:not(.closing) summary::after { background-size: 100% 3px, 3px 0; transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) { .faq summary::after { transition: none; } }
.faq .rich { padding: 0 0 22px; }
.faqsec .wrap { display: grid; grid-template-columns: 1fr 1.6fr; gap: 64px; align-items: start; }
.rel .grid, .linkgrid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.rel ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.rel li::before, .linkgrid li::before { display: none; }
.rel li, .linkgrid li { padding: 0; }
.rel a, .linkgrid a { display: flex; justify-content: space-between; align-items: center; gap: 10px; height: 100%; border: 2px solid var(--line); background: var(--white); padding: 14px 16px; font: 700 16px/1.2 var(--display); letter-spacing: .06em; text-transform: uppercase; color: var(--navy); text-decoration: none; }
.rel a::after, .linkgrid a::after { content: "→"; color: var(--orange); }
.rel a:hover, .linkgrid a:hover { border-color: var(--navy); }
.rel .wrap { display: grid; gap: 28px; }
.regions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.region { background: var(--white); border: 1px solid var(--line); border-top: 5px solid var(--orange); padding: 26px; display: grid; gap: 12px; align-content: start; }
.region h3 { font-size: 28px; color: var(--navy); }
.region .tel { font: 800 26px var(--display); color: var(--navy); text-decoration: none; }
.region p { color: var(--gray); font-size: 16px; }
.region ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 16px; }
.region a { color: var(--navy); font-weight: 600; }
.cdetail .wrap { display: grid; grid-template-columns: 1.1fr 1fr; gap: 64px; align-items: start; }
.cdetail .media { background: var(--white); border: 1px solid var(--line); }
.cdetail .media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.cdetail .media .ph-none { aspect-ratio: 4 / 3; display: grid; place-items: center; background: var(--mist); color: var(--gray); font: 700 18px var(--display); letter-spacing: .1em; text-transform: uppercase; }
.cdetail .copy { display: grid; gap: 22px; min-width: 0; }
.cdetail .cap { font: 800 72px/0.9 var(--display); color: var(--navy); }
.cdetail .cap small { font-size: 28px; color: var(--gray); margin-left: 6px; }
.phones { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.phones div { background: var(--white); border: 1px solid var(--line); border-left: 5px solid var(--orange); padding: 22px 24px; display: grid; gap: 4px; }
.phones b { font: 800 34px/1 var(--display); color: var(--navy); }
.phones span { font: 700 14px var(--display); letter-spacing: .12em; text-transform: uppercase; color: var(--gray); }
.phones small { color: var(--gray); font-size: 15px; }
.phones a { text-decoration: none; line-height: 1; }
.typeblurb { color: var(--gray); margin: 18px 0 0; max-width: 80ch; }
.empty-note { background: #fff4f4; border: 1px dashed #d88; padding: 10px 14px; font-size: 14px; color: #8a2b2b; }
@container (max-width: 1180px) {
  .regions { grid-template-columns: 1fr 1fr; }
}
@container (max-width: 960px) {
  .row .wrap, .two, .townintro .wrap, .local .wrap, .proj .wrap, .faqsec .wrap, .cdetail .wrap { grid-template-columns: 1fr; gap: 40px; }
  .rel ul, .rel .grid, .linkgrid { grid-template-columns: 1fr 1fr; }
}
@container (max-width: 560px) {
  .row .head h2, .townintro h2, .local h2, .proj h2, .faqsec h2, .rel h2, .two h2 { font-size: 34px; }
  .rel ul, .rel .grid, .linkgrid, .regions, .phones { grid-template-columns: 1fr; }
  .faq summary { font-size: 19px; }
  .cdetail .cap { font-size: 56px; }
  .proj .wrap { padding-block: 64px; }
}
@container (min-width: 961px) { footer .wrap { grid-template-columns: 1.3fr 1fr 1fr 1fr 1fr; } }
/* Quote form: full-width lift illustration, A-D inputs in one row below it */
.lift { grid-template-columns: 1fr !important; gap: 18px; }
.lift .dia { padding: 0; border: 1px solid var(--line); }
.dims { grid-template-columns: repeat(4, 1fr) !important; align-items: end; }
@container (max-width: 1080px) { .dims { grid-template-columns: 1fr 1fr !important; } }
@container (max-width: 560px) { .dims { grid-template-columns: 1fr !important; } }

.help-cta .copy { gap: 22px; }
.help-cta h2 { font-size: 56px; }
.help-cta .copy > p:not(.eyebrow):not(.note) { font-size: 20px; color: var(--on-dark); }
.help-cta .btns { display: flex; flex-wrap: wrap; gap: 12px; }
.help-cta .note { font-size: 15px; }
.help-cta .media img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }

footer h2.sub { margin-top: 30px; }
footer ul.lines li { display: flex; justify-content: space-between; gap: 12px; max-width: 240px; }

/* ---------- Google Map embed (Contact, About) ---------- */
.map { position: relative; width: 100%; aspect-ratio: 4 / 3; background: var(--mist); border: 1px solid var(--line); }
.map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---------- News: post cards (News page, "More Stories") and post pages ---------- */
.posts { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 28px; }
.post-card { background: var(--white); border: 1px solid var(--line); text-decoration: none; display: grid; grid-template-rows: auto 1fr; transition: transform .2s, box-shadow .2s; }
.post-card:hover { transform: translateY(-4px); box-shadow: 0 18px 40px rgba(11,31,92,.14); }
.post-card .ph { aspect-ratio: 16 / 10; overflow: hidden; background: var(--mist); }
.post-card .ph img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.post-card:hover .ph img { transform: scale(1.05); }
.post-card .txt { padding: 22px 24px 26px; display: grid; gap: 10px; align-content: start; border-top: 5px solid var(--orange); }
.post-card .meta { font: 700 13px var(--display); letter-spacing: .12em; text-transform: uppercase; color: var(--gray); }
.post-card h2, .post-card h3 { font-size: 26px; line-height: 1.1; color: var(--navy); }
.post-card p:not(.meta) { font-size: 16px; color: var(--gray); }
.post-card .more { font: 700 15px var(--display); letter-spacing: .12em; text-transform: uppercase; color: var(--navy); margin-top: 4px; }
.post-body { max-width: 780px; margin: 0 auto; display: grid; gap: 32px; }
.post-body .rich p { font-size: 19px; }
.post-body figure { margin: 0; display: grid; gap: 8px; }
.post-body figure img, .post-body .rich img { width: 100%; height: auto; display: block; }
.post-body figcaption { font-size: 14px; color: var(--gray); }
.video { position: relative; aspect-ratio: 16 / 9; background: var(--navy-deep); }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.post-rel { display: grid; gap: 12px; border-top: 1px solid var(--line); padding-top: 28px; }
.chips-links { display: flex; flex-wrap: wrap; gap: 8px; }
.chips-links a { border: 2px solid var(--line); padding: 8px 14px; font: 700 15px var(--display); letter-spacing: .06em; text-transform: uppercase; color: var(--navy); text-decoration: none; }
.chips-links a:hover { border-color: var(--navy); }

/* ---------- Legal pages ---------- */
.legal .rich h3 { font-size: 26px; color: var(--navy); margin-top: 18px; }
.legal .rich p, .legal .rich li { font-size: 17px; }
.legal .rich p + p, .legal .rich ul { margin-top: 0; }
.legal-docs { display: grid; gap: 14px; }
.legal-doc { display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; padding: 20px 22px; border: 2px solid var(--line); text-decoration: none; color: var(--ink); transition: border-color .2s; }
.legal-doc:hover { border-color: var(--navy); }
.legal-doc .ico { background: var(--navy); color: var(--white); font: 800 14px var(--display); letter-spacing: .08em; padding: 12px 10px; }
.legal-doc b { display: block; font: 700 22px/1.15 var(--display); text-transform: uppercase; color: var(--navy); }
.legal-doc small { color: var(--gray); font-size: 15px; }
.legal-doc .more { font: 700 15px var(--display); letter-spacing: .12em; text-transform: uppercase; color: var(--orange); white-space: nowrap; }
@media (max-width: 560px) { .legal-doc { grid-template-columns: auto 1fr; } .legal-doc .more { grid-column: 2; } }

/* ---------- Footer "Cookie Settings" link and other link-style buttons ---------- */
.linkbtn { background: none; border: 0; padding: 0; font: inherit; color: inherit; text-decoration: underline; cursor: pointer; }
footer .legal .linkbtn { color: inherit; text-decoration: none; }
footer .legal .linkbtn:hover { color: var(--white); text-decoration: underline; }

/* ---------- Privacy consent card (floats bottom-left; sits above the phone call bar) ---------- */
.consent { position: fixed; z-index: 60; left: 24px; bottom: 24px; width: min(390px, calc(100vw - 32px)); background: var(--white); color: var(--ink);
  border-top: 5px solid var(--orange); box-shadow: 0 18px 50px rgba(7,20,61,.28); padding: 22px 22px 18px; display: grid; gap: 12px; font-size: 15px; line-height: 1.5;
  opacity: 0; transform: translateY(16px); transition: opacity .25s ease, transform .25s ease; }
.consent.in { opacity: 1; transform: none; }
.consent .ttl { font: 800 22px/1.1 var(--display); text-transform: uppercase; color: var(--navy); }
.consent a { color: var(--navy); font-weight: 600; }
.consent .acts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 4px; }
.consent .acts .btn { padding: 12px 10px; font-size: 14px; }
.consent > .linkbtn { justify-self: center; font-size: 14px; color: var(--gray); }
.switch { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: center; cursor: pointer; }
.switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.switch .track { width: 42px; height: 24px; border-radius: 12px; background: #c5cbd8; position: relative; transition: background .2s; }
.switch .track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--white); box-shadow: 0 1px 3px rgba(0,0,0,.3); transition: transform .2s; }
.switch input:checked + .track { background: var(--navy); }
.switch input:checked + .track::after { transform: translateX(18px); }
.switch input:focus-visible + .track { outline: 2px solid var(--orange); outline-offset: 2px; }
.switch b { display: block; font-size: 15px; color: var(--navy); }
.switch small { color: var(--gray); font-size: 13px; }
@media (max-width: 560px) { .consent { left: 12px; right: 12px; width: auto; bottom: 68px; } }
@media (prefers-reduced-motion: reduce) { .consent, .switch .track, .switch .track::after { transition: none; } }

/* ---------- Home: Machinery Moving feature ---------- */
.feature { position: relative; min-height: 680px; display: grid; align-items: center; color: var(--white); background: var(--navy-deep); overflow: hidden; }
.feature > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 50%; }
.feature::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,20,61,.94) 0%, rgba(7,20,61,.78) 42%, rgba(7,20,61,.15) 78%); }
.feature .wrap { position: relative; z-index: 2; padding-block: 110px; width: 100%; }
.feature .inner { max-width: 640px; display: grid; gap: 24px; }
.feature h2 { font-size: 72px; }
.feature h2 em { font-style: normal; color: var(--orange); }
.feature .intro { font-size: 19px; color: var(--on-dark); max-width: 54ch; }
.feature .intro a { color: var(--white); text-decoration: underline; text-decoration-color: var(--orange); text-underline-offset: 3px; }
.feature .facts { list-style: none; margin: 4px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, auto); justify-content: start; gap: 0 36px; }
.feature .facts li { display: grid; gap: 4px; border-top: 3px solid var(--orange); padding-top: 12px; }
.feature .facts b { font: 800 40px/1 var(--display); }
.feature .facts span { font: 700 13px var(--display); letter-spacing: .12em; text-transform: uppercase; color: var(--on-dark-muted); }
.feature .ctas { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 6px; }
@container (max-width: 960px) {
  .feature h2 { font-size: 58px; }
  .feature::after { background: linear-gradient(90deg, rgba(7,20,61,.94) 0%, rgba(7,20,61,.8) 60%, rgba(7,20,61,.45) 100%); }
}
@container (max-width: 560px) {
  .feature { min-height: 0; }
  .feature .wrap { padding-block: 220px 64px; }
  .feature > img { object-position: 60% 0; height: 340px; }
  .feature::after { background: linear-gradient(0deg, var(--navy-deep) 0%, var(--navy-deep) calc(100% - 340px), rgba(7,20,61,.2) 100%); }
  .feature h2 { font-size: 44px; }
  .feature .facts { grid-template-columns: repeat(3, 1fr); gap: 0 16px; }
  .feature .facts b { font-size: 28px; }
  .feature .facts span { font-size: 11px; letter-spacing: .08em; }
  .feature .ctas .btn { flex: 1 1 100%; }
}
