/* USA Epoxy Floors - site.css
   Desktop is FLUID like Wix Studio: the root font-size tracks the
   viewport, and every desktop size is written in rem measured off the
   live site at 1440px wide (1rem = 16px at 1440). The whole layout
   scales with the window exactly the way the Wix build does.
   Phones (<= 750px) switch to a fixed 16px root and their own rules. */

:root {
  --bg: #1d2024;
  --bg-deep: #000;
  --bar: #212428;
  --line: #4a4f55;
  --text: #f4f4f4;
  --muted: #d5d7da;
  --ink: #16181b;
  --gold: #f5a524;
  --flag: linear-gradient(31deg, #e00000 0%, #0a5694 75%, #2aa8f5 100%);
  --flag-v: linear-gradient(180deg, #164a82 0%, #2a2c55 48%, #4d0710 100%);
  --silver: linear-gradient(155deg, #fbfbfb 0%, #dadada 28%, #b5b5b5 52%, #ececec 74%, #c4c4c4 100%);
  --silver-bar: linear-gradient(90deg, #ffffff 0%, #e6e6e6 40%, #a9abae 100%);
  --divider: linear-gradient(180deg, #7d8085 0%, #ececec 45%, #7d8085 100%);
  --shadow: 0 .4rem 1.1rem rgba(0, 0, 0, .5);
  --display: "Oswald", "Arial Narrow", "Roboto Condensed", "DejaVu Sans Condensed", sans-serif;
  --label: "Barlow", "Oswald", sans-serif;
  --gutter: 2.94rem;
}

html { font-size: 16px; -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (min-width: 751px) { html { font-size: calc(6px + .6944vw); } }

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--display); font-size: 1.125rem; line-height: 1.3; overflow-x: hidden; }
img, picture, svg, video { display: block; max-width: 100%; }
picture { width: 100%; height: 100%; }
a { color: inherit; }
p { margin: 0 0 .9em; }
h1, h2, h3, h4 { font-family: var(--display); font-weight: 500; line-height: 1; margin: 0; text-transform: uppercase; }
button, input, textarea, select { font: inherit; }
.wrap { width: 100%; padding: 0 var(--gutter); }
.skip { position: absolute; left: -999px; top: 8px; z-index: 100; background: #fff; color: #000; padding: 8px 12px; }
.skip:focus { left: 8px; }
:focus-visible { outline: 2px solid #f1f1f1; outline-offset: 2px; }
.drawer, .drawer * { -webkit-tap-highlight-color: transparent; }
/* No blue tap flash anywhere (phones and touch emulation paint one on every tapped link or button). */
html { -webkit-tap-highlight-color: transparent; }
.divider, .band + .band, .who + .band, .faq + .band { border-top: .3rem solid transparent; border-image: var(--divider) 1; }

/* ---------- buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .8rem;
  min-height: 3.75rem; padding: .3rem 2rem;
  background: var(--flag); color: #fff; text-decoration: none; text-transform: uppercase;
  font-family: var(--display); font-weight: 500; font-size: 2.1rem; line-height: 1;
  border: 1px solid rgba(255, 255, 255, .85); border-radius: .3rem;
  box-shadow: 0 .25rem .7rem rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .25);
  cursor: pointer; transition: filter .15s ease, transform .15s ease; white-space: nowrap;
}
.btn:hover { filter: brightness(1.12); }
.btn:active { transform: translateY(1px); }
.btn svg { width: 1em; height: 1em; flex: 0 0 auto; }
.btn--block { width: 100%; white-space: normal; text-align: center; }
.btn--lg { min-height: 4.4rem; min-width: 27.4rem; font-size: 2.35rem; }
.btn--case { text-transform: none; }
.btn--outline { background: transparent; border: 2px solid #f2f2f2; border-radius: 999px; box-shadow: none; text-transform: none; }
.btn--red { background: linear-gradient(180deg, #ff1a1a, #c40000); border-radius: 999px; text-transform: none; }

/* ---------- header ---------- */
.site-header { position: relative; z-index: 50; background: var(--bar); border-bottom: 2px solid #61666c; box-shadow: 0 2px 10px rgba(0, 0, 0, .5); }
.nav { display: flex; align-items: stretch; height: 5rem; padding-right: 3rem; }
.nav__links { display: flex; flex: 1; margin: 0; padding: 0; list-style: none; max-width: 70rem; }
.nav__links li { flex: 1; display: flex; }
.nav__links li + li { border-left: 1px solid #6a6f75; margin: .75rem 0; }
.nav__links a { flex: 1; display: flex; align-items: center; justify-content: center; text-decoration: none; text-transform: uppercase; font-weight: 600; font-size: 1.6rem; color: #fff; }
.nav__links li + li a { margin: -.75rem 0; }
.nav__links a[aria-current="page"] { color: #9aa0a6; }
.nav__links a:hover { color: #c4c4c4; }
.nav__links li.nav__home { flex: 0 0 11.25rem; }
.nav__home svg { width: 1.6rem; height: 1.6rem; color: currentColor; }
.menu-btn { margin-left: auto; flex: 0 0 4.4rem; display: flex; align-items: center; justify-content: center; background: none; border: 0; color: #fff; cursor: pointer; }
.menu-btn svg { width: 3.6rem; height: 2.9rem; }
.menu-btn svg path { stroke-width: 3.4; }

.drawer { position: fixed; inset: 0; z-index: 60; visibility: hidden; }
.drawer.is-open { visibility: visible; }
.drawer__scrim { position: absolute; inset: 0; background: rgba(0, 0, 0, .55); opacity: 0; transition: opacity .25s; }
.drawer.is-open .drawer__scrim { opacity: 1; }
.drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; width: max(48.6vw, 380px); display: flex; flex-direction: column; background: var(--flag-v); border-left: 1px solid #8a8f96; box-shadow: -1rem 0 2rem rgba(0, 0, 0, .5); transform: translateX(100%); transition: transform .3s ease; }
.drawer.is-open .drawer__panel { transform: none; }
.menu-bar { display: flex; align-items: stretch; height: 4.625rem; background: var(--bar); border-bottom: 2px solid #61666c; flex: 0 0 auto; }
.menu-close { flex: 0 0 4.6rem; display: flex; align-items: center; justify-content: center; background: none; border: 0; border-right: 1px solid #6a6f75; color: #fff; cursor: pointer; }
.menu-close svg { width: 2rem; height: 2rem; }
/* Tab = link to the list page + a caret that slides the list down over the form. */
.menu-tab { flex: 1 1 auto; display: flex; align-items: stretch; border-right: 1px solid #6a6f75; min-width: 0; }
.menu-tab:last-child { border-right: 0; }
.menu-tab__link { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; padding: 0 .25rem 0 .6rem; color: #fff; text-decoration: none; font-family: var(--display); font-weight: 500; font-size: 1.2rem; text-transform: uppercase; white-space: nowrap; }
.menu-tab__link:hover { color: #c4c4c4; }
.menu-tab__drop { flex: 0 0 auto; display: flex; align-items: center; padding: 0 .6rem 0 .25rem; background: none; border: 0; color: #c9ccd0; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.menu-tab__drop:hover { color: #fff; }
.menu-tab__drop svg { width: .95rem; height: .95rem; transition: transform .25s ease; }
.menu-tab.is-open { background: rgba(255, 255, 255, .08); }
.menu-tab.is-open .menu-tab__link { color: #fff; }
.menu-tab.is-open .menu-tab__drop svg { transform: rotate(180deg); }
/* List sheets: slide down from the tab bar over the form area (right of the rail), scroll on their own,
   heading and the pinned bottom button both go to the list page. */
.menu-body { position: relative; overflow: hidden; }
/* Menu panel surfaces. The Get In Touch form: dark charcoal, red wash top-right, blue wash bottom-left,
   lighter base at the bottom. The list sheets: the same gradient flipped (every angle + 180deg). */
.drawer {
  --menu-surface: linear-gradient(191deg, rgba(76, 2, 1, .28) 0%, rgba(76, 2, 1, 0) 45%), linear-gradient(20deg, rgba(3, 86, 145, .3) 0%, rgba(3, 86, 145, 0) 50%), linear-gradient(20deg, #23272d 0%, #1b1e22 45%, #141618 100%);
  --menu-surface-flip: linear-gradient(11deg, rgba(76, 2, 1, .28) 0%, rgba(76, 2, 1, 0) 45%), linear-gradient(200deg, rgba(3, 86, 145, .3) 0%, rgba(3, 86, 145, 0) 50%), linear-gradient(200deg, #23272d 0%, #1b1e22 45%, #141618 100%);
}
.menu-panes { background: var(--menu-surface); }
/* Menu form = the contact form (no radios, Send Message), its button in the red-blue brand gradient. */
.drawer .form .btn--outline { background: var(--btn); border: 1px solid rgba(255, 255, 255, .85); border-radius: .65rem; box-shadow: 0 .25rem .7rem rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 255, 255, .25); }
.drawer .form .btn--outline:hover { background: var(--btn-hover); }
/* Own panel: charcoal gradient (lighter top-right, near-black bottom-left) covering the whole area right of
   the rail, square, tight padding. Never scrolls: the list carries only what fits, button pinned to the bottom. */
.menu-sheet { position: absolute; top: 0; bottom: 0; left: 4.6rem; right: 0; z-index: 2; display: flex; flex-direction: column; overflow: hidden; padding: 1rem 1.1rem .9rem; background: var(--menu-surface-flip); border-top: 1px solid rgba(241, 241, 241, .5); box-shadow: 0 .8rem 1.8rem rgba(0, 0, 0, .65); transform: translateY(-100%); visibility: hidden; transition: transform .32s cubic-bezier(.2, .8, .2, 1), visibility 0s linear .32s; }
.menu-sheet.is-open { transform: none; visibility: visible; transition: transform .32s cubic-bezier(.2, .8, .2, 1); }
/* Head: title left, then the enter-page arrow and the close X as bright brand circles (same as the rail). */
.menu-sheet__head { display: flex; align-items: center; gap: .6rem; margin-bottom: .7rem; }
.menu-pane .menu-sheet__head h2 { flex: 1 1 auto; margin: 0; text-align: left; }
.menu-sheet h2 a { color: #fff; text-decoration: none; }
.menu-sheet h2 a:hover { color: #c4c4c4; }
.menu-sheet__ico { flex: 0 0 auto; width: 2.9rem; height: 2.9rem; display: inline-flex; align-items: center; justify-content: center; padding: 0; border-radius: 50%; border: 2px solid #e8e8e8; background: var(--flag); color: #fff; box-shadow: 0 .2rem .5rem rgba(0, 0, 0, .55); cursor: pointer; }
.menu-sheet__ico:hover { background: var(--btn-hover); }
.menu-sheet__ico svg { width: 1.3rem; height: 1.3rem; }
a.menu-sheet__ico svg { width: 1.7rem; height: 1.7rem; transform: rotate(-40deg); transition: transform .3s ease-in-out; }
a.menu-sheet__ico:hover svg { transform: rotate(0deg); }
.menu-sheet > .btn.btn--block { margin-top: auto; flex: 0 0 auto; }
.menu-sheet > .menu-list, .menu-sheet > .menu-projects { margin-bottom: 1rem; }
/* The form underneath may scroll on short screens, but without a visible scrollbar. */
.menu-panes, .menu-rail { scrollbar-width: none; }
.menu-panes::-webkit-scrollbar, .menu-rail::-webkit-scrollbar { display: none; }
@media (prefers-reduced-motion: reduce) { .menu-sheet, .menu-sheet.is-open { transition: none; } }
.menu-body { flex: 1 1 auto; display: flex; min-height: 0; }
.menu-rail { flex: 0 0 4.6rem; display: flex; flex-direction: column; align-items: center; gap: .55rem; padding: .9rem 0; background: #17191c; border-right: 1px solid #6a6f75; overflow-y: auto; }
.menu-dot { width: 2.9rem; height: 2.9rem; flex: 0 0 auto; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--flag); border: 2px solid #e8e8e8; color: #fff; overflow: hidden; }
.menu-dot svg { width: 1.6rem; height: 1.6rem; }
.menu-dot--logo { background: #fff; width: 3.2rem; height: 3.2rem; padding: .2rem; }
.menu-dot--logo img { width: 100%; height: 100%; object-fit: contain; }
.menu-share { display: flex; flex-direction: column; align-items: center; gap: .15rem; background: none; border: 0; color: #fff; text-decoration: none; font-family: var(--display); font-size: .78rem; cursor: pointer; padding: .2rem 0; }
.menu-share svg { width: 1.5rem; height: 1.5rem; }
.menu-panes { flex: 1 1 auto; overflow-y: auto; padding: 1.6rem 1.6rem 2rem; }
.menu-pane h2 { font-size: 2.4rem; font-weight: 500; margin-bottom: 1rem; text-align: center; }
.menu-pane .btn { margin-top: 1.4rem; font-size: 1.7rem; min-height: 3.4rem; }
.menu-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.2rem; }
.menu-list a { display: block; padding: .55rem .2rem; border-bottom: 1px solid rgba(255, 255, 255, .25); color: #fff; text-decoration: none; font-size: 1.35rem; }
.menu-list a:hover { color: #c4c4c4; }
#pane-faqs .menu-list { grid-template-columns: 1fr; }
.menu-projects { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; }
.menu-proj { position: relative; display: block; aspect-ratio: 220 / 160; border-radius: .5rem; overflow: hidden; border: 2px solid #ddd; }
.menu-proj img { width: 100%; height: 100%; object-fit: cover; }
.menu-proj span { position: absolute; left: .4rem; bottom: .2rem; font-weight: 600; text-shadow: 0 1px 4px #000; }
.form-card.form-card--plain { max-width: none; border: 0; box-shadow: none; background: none; border-radius: 0; overflow: visible; }
.form-card__head.form-card__head--plain { min-height: 0; padding: 0 0 .4rem; background: none; border: 0; }
.form-card__head.form-card__head--plain h2 { font-size: 2.4rem; font-weight: 500; text-shadow: none; }
.form-card.form-card--plain .form { padding: .4rem .2rem 1rem; }

/* ---------- breadcrumbs ---------- */
.crumbs { background: #121416; border-bottom: 1px solid #2e3237; font-size: .95rem; }
.crumbs ol { display: flex; flex-wrap: wrap; gap: .25rem .5rem; list-style: none; margin: 0; padding: .45rem var(--gutter); }
.crumbs li { color: #9ea3a9; }
.crumbs li + li::before { content: "\203A"; margin-right: .5rem; color: #6b7076; }
.crumbs a { color: #d2d5d8; text-decoration: none; }
.crumbs a:hover { color: #fff; text-decoration: underline; }

/* ---------- hero ---------- */
.hero { position: relative; overflow: hidden; background: #171a1d; isolation: isolate; }
/* Live site: the background photo covers the copy column plus a sliver
   under the side photo (863px of ~1215px = 71%), not the full width. */
.hero__bg { position: absolute; top: 0; bottom: 0; left: 0; width: 71%; z-index: -2; }
.hero__bg img { width: 100%; height: 100%; object-fit: cover; opacity: .85; }
@media (max-width: 750px) { .hero__bg { width: 100%; } }
/* Hero overlay = the Wix gradient (Linear 0°): dark top, clear middle,
   gray then black at the bottom. Sits over the background AND the side
   photo; copy, logo and van sit above it. */
.hero__bg::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(0, 0, 0, .42) 0%, rgba(0, 0, 0, .3) 45%, rgba(0, 0, 0, 0) 100%),
    linear-gradient(0deg, var(--bg) 0%, rgba(255, 255, 255, 0) 14%, rgba(255, 255, 255, 0) 45%, rgba(128, 128, 128, 0) 78%, #000 100%);
}
.hero__copy { position: relative; z-index: 2; }
.hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) 31.5%; min-height: 54.75rem; }
.hero__copy { padding: 1.5rem 1.4rem 4rem 2.4rem; }
.hero__top { display: flex; align-items: center; gap: .9rem; margin-bottom: 2.6rem; }
.hero__brand {
  font-size: 1.75rem; font-weight: 500; text-transform: uppercase; text-decoration: underline; text-underline-offset: .3rem; text-decoration-thickness: 2px;
  background: linear-gradient(90deg, #ff4b4b 0%, #ff4b4b 34%, #ffffff 52%, #7cc0ff 70%); -webkit-background-clip: text; background-clip: text; color: transparent;
  text-decoration-color: #e9e9e9; margin-right: 2.3rem; line-height: 1.2;
}
.icon-btn { width: 3.125rem; height: 3.125rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--flag); border: 2px solid #d9d9d9; color: #fff; box-shadow: 0 .2rem .5rem rgba(0, 0, 0, .5); }
.icon-btn svg { width: 1.7rem; height: 1.7rem; }
.phone-pill { display: inline-flex; align-items: center; height: 3.125rem; padding: 0 1.5rem; border-radius: 999px; text-decoration: none; background: var(--flag); border: 2px solid #e8e8e8; font-size: 1.85rem; font-weight: 500; color: #fff; box-shadow: 0 .2rem .5rem rgba(0, 0, 0, .5); white-space: nowrap; }
.hero__eyebrow { font-size: 1.375rem; font-weight: 500; text-transform: uppercase; margin: 0 0 .35rem; text-shadow: 0 2px 4px rgba(0, 0, 0, .8); }
.hero h1 { font-size: 4.9rem; font-weight: 600; line-height: .96; text-shadow: 0 .25rem .6rem rgba(0, 0, 0, .75); margin-bottom: 1.4rem; }
.hero__lead { font-size: 1.85rem; line-height: 1.18; letter-spacing: -.01em; text-transform: capitalize; text-shadow: 0 2px 6px rgba(0, 0, 0, .9); margin-bottom: 1.6rem; }
.hero__side { position: relative; }
.hero__side-img { position: absolute; inset: 0; border-left: 1px solid rgba(255, 255, 255, .25); box-shadow: -.4rem 0 1.2rem rgba(0, 0, 0, .45); }
.hero__side-img img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; }
@media (min-width: 1001px) {
  /* Live: the background photo stops ~2.6rem above the hero's bottom;
     the side photo runs the full height, so it hangs below the bg. */
  .hero__bg { bottom: 2.6rem; }
  .hero__side-img { -webkit-mask-image: linear-gradient(180deg, #000 88%, transparent 100%); mask-image: linear-gradient(180deg, #000 88%, transparent 100%); box-shadow: none; }
}
.hero__logo { position: absolute; top: .4rem; left: -7.75rem; width: 28.1rem; height: 13.1rem; object-fit: contain; object-position: center top; z-index: 2; filter: drop-shadow(0 .4rem .6rem rgba(0, 0, 0, .55)); }
.hero__van { position: absolute; bottom: -2.5rem; right: -3rem; width: 44rem; height: auto; max-width: none; z-index: 2; filter: drop-shadow(0 .6rem .9rem rgba(0, 0, 0, .6)); }
.hero h1 { text-wrap: balance; letter-spacing: -.02em; }
@media (min-width: 1001px) { .hero.hero--xlong h1 { font-size: 3.7rem; text-wrap: balance; } }
.hero--compact .hero__grid { min-height: 42rem; }

/* ---------- section heads ---------- */
.band { position: relative; padding: 3rem 0 3.4rem; }
.hero + .band { padding-top: .6rem; border-top: 0; }
.section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; margin-bottom: 3.6rem; }
.section-head h2 { font-size: 4.75rem; font-weight: 500; text-shadow: 0 .2rem .5rem rgba(0, 0, 0, .6); }
.section-head h2.sm { font-size: 3rem; }
.section-head p { margin: .3rem 0 0; font-size: 1.9rem; color: var(--muted); line-height: 1.15; }
.section-head .kicker { text-transform: uppercase; color: #bcbec2; font-size: 1.6rem; font-weight: 500; margin-top: .9rem; padding-left: .3rem; }
.section-head .btn { flex: 0 0 auto; min-width: 25rem; }
.band--tight .section-head { margin-bottom: 2.2rem; }

/* ---------- silver service cards ---------- */
.cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.7rem; }
.card { position: relative; display: flex; flex-direction: column; background: var(--silver); color: var(--ink); border-radius: 1rem; border: 2px solid #f4f4f4; box-shadow: var(--shadow); padding: 1.4rem 1.4rem 1.2rem 1.5rem; }
.card__img { aspect-ratio: 385 / 288; overflow: hidden; border-radius: .3rem; border: 1px solid #3a3a3a; background: #333; }
.card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.card:hover .card__img img { transform: scale(1.04); }
.card h3 { font-size: 2.5rem; margin: .9rem 0 .5rem; color: var(--ink); line-height: 1; letter-spacing: -.01em; }
.card h3 a { text-decoration: none; }
.card h3 a::after { content: ""; position: absolute; inset: 0; z-index: 0; }
.card p { font-size: 1.3rem; line-height: 1.14; text-transform: capitalize; color: #222; margin: 0 0 1.4rem; flex: 1; }
.card .btn { position: relative; z-index: 1; width: calc(100% - .4rem); margin: 0 .2rem; font-size: 1.9rem; min-height: 3.5rem; }

/* ---------- area / type tiles ---------- */
.tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.56rem; }
.tile { position: relative; display: block; aspect-ratio: 322 / 280; border-radius: .9rem; overflow: hidden; text-decoration: none; border: .19rem solid #cfd1d4; box-shadow: var(--shadow); background: #2a2d31; }
.tile picture, .tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.tile::after { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .12); transition: background .2s; }
.tile:hover::after { background: rgba(0, 0, 0, 0); }
.tile span { position: absolute; inset: 0; z-index: 1; display: flex; align-items: center; justify-content: center; text-align: center; padding: .6rem; font-size: 2.4rem; font-weight: 500; text-transform: uppercase; color: #fff; text-shadow: 0 0 .4rem #000, 0 .15rem .6rem rgba(0, 0, 0, .9); line-height: 1.05; }
/* Live Wix tile button. Rest: 31deg #e10600 -> #035691, ring+arrow icon 30/50 of the button rotated 320deg,
   shadow 4 4 8 2. Hover (tile or button): 45deg #4c0201 -> #035691, icon rotates to 0deg, .3s ease-in-out. */
.tile .go { position: absolute; right: .6rem; bottom: .6rem; z-index: 1; background: linear-gradient(31deg, #e10600 0%, #035691 100%); box-shadow: 4px 4px 8px 2px rgba(0, 0, 0, .6); transition: box-shadow .3s ease-in-out; }
.tile .go svg { width: 64%; height: 64%; transform: rotate(-40deg); transition: transform .3s ease-in-out; }
.tile:hover .go, .tile:focus-visible .go { background: linear-gradient(45deg, #4c0201 0%, #035691 100%); }
.tile:hover .go svg, .tile:focus-visible .go svg { transform: rotate(0deg); }
@media (prefers-reduced-motion: reduce) { .tile .go svg { transition: none; } }
.go { width: 2.9rem; height: 2.9rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--flag); border: 2px solid #ddd; color: #fff; }
.go svg { width: 1.6rem; height: 1.6rem; }

/* ---------- link index (full city menus) ---------- */
.index-list { margin-top: 2rem; padding: 1.1rem 1.25rem; border: 1px solid #3a3f45; border-radius: .6rem; background: rgba(255, 255, 255, .03); }
.index-list h3 { font-size: 1.4rem; font-weight: 500; color: #cfd3d7; margin-bottom: .6rem; }
.index-list ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: .2rem 1.2rem; }
.index-list a { color: #e6e8ea; text-decoration: none; font-size: 1.15rem; display: block; padding: .2rem 0; border-bottom: 1px dotted #3c4147; }
.index-list a:hover { color: #c4c4c4; }

/* ---------- why choose us / what we do ---------- */
.band--textured { isolation: isolate; overflow: hidden; background: linear-gradient(180deg, rgba(28, 30, 33, 0) 0, #1c1e21 2.24rem, #1c1e21 100%); }
.band__bg { position: absolute; inset: 0; z-index: -1; }
.band__bg img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.22) saturate(.7); }
.split { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1fr); gap: 1.6rem; align-items: start; }
.prose h2 { font-size: 3rem; text-transform: none; font-weight: 600; margin-bottom: 1rem; }
.prose p { font-size: 1.7rem; line-height: 1.2; color: #dcdee1; }
.prose--loose p { line-height: 1.6; }
.pro-list { display: grid; gap: 2.1rem; }
.pro { display: grid; grid-template-columns: 37% 1fr; min-height: 15.6rem; background: var(--silver); color: var(--ink); border-radius: 1rem; overflow: hidden; border: 2px solid #f0f0f0; box-shadow: var(--shadow); }
.pro__img { position: relative; background: #333; }
.pro__img picture, .pro__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pro__body { padding: 1rem 1rem 1rem .9rem; box-shadow: -.6rem 0 1rem rgba(0, 0, 0, .25); position: relative; display: flex; flex-direction: column; }
.pro__body h3 { font-size: 2.25rem; margin-bottom: .5rem; color: var(--ink); }
.pro__body p { font-size: 1.3rem; line-height: 1.1; margin: 0; color: #24272a; }
.pro__body .btn { margin-top: auto; align-self: flex-end; margin-right: -1rem; margin-bottom: -.4rem; border-radius: .4rem 0 0 .4rem; font-size: 1.7rem; min-height: 3.4rem; }
.pro__body p + .btn { margin-top: 1rem; }
/* Why Choose Us + What We Do cards: light silver text slab, rounded on all corners, overlapping the photo with a cast shadow (live design). */
.band--textured .pro, .band--wwd .pro { background: #d9d9d9; border: 2px solid #f4f4f4; border-radius: .95rem; }
.band--textured .pro__img, .band--wwd .pro__img { border-radius: .8rem 0 0 .8rem; overflow: hidden; }
.band--textured .pro__body, .band--wwd .pro__body { margin-left: -.75rem; padding: .95rem 1.1rem 1rem .95rem; border-radius: .8rem; background: linear-gradient(172deg, #fbfbfb 0%, #f0f0f0 35%, #dcdcdc 72%, #e9e9e9 100%); box-shadow: -.35rem 0 .8rem rgba(0, 0, 0, .45); z-index: 1; }
.band--textured .pro__body h3, .band--wwd .pro__body h3 { color: #1b1c1e; }
.band--textured .pro__body p, .band--wwd .pro__body p { color: #1f2124; }
/* What We Do: 3 services, then Load More adds 3 at a time (site.js). Without JS every card shows and the
   button stays hidden. */
.js .band--wwd .pro.is-extra { display: none; }
.wwd__more .btn[hidden] { display: none; }
.wwd__more { margin-top: 2.6rem; }
.wwd__more .btn svg { width: 1.6rem; height: 1.6rem; }
/* What We Do: Wix editor specs at the 1280px canvas (Scale proportionally), converted px / 1280 to vw. */
@media (min-width: 751px) {
  .project-slide { scroll-margin-inline-end: calc(100cqw - 31.45rem); }
  .project-controls { --project-control-steps: max(0, calc((100cqw - 2.2rem) / 30.35rem * -1 + var(--project-steps) + 1)); }
  .band--wwd .wrap.split { padding: 0 1.81vw 0 2.41vw; grid-template-columns: minmax(0, 459fr) minmax(0, 474fr); gap: 1vw; }
  .band--wwd .prose h2 { font-size: 3.125vw; font-weight: 600; line-height: 1.2; letter-spacing: 0; color: #f4f4f4; margin-bottom: 0; }
  .band--wwd .prose p { font-size: 1.875vw; font-weight: 400; color: #c4c4c4; line-height: 1.6; letter-spacing: -.02em; margin: 0 0 3vw; }
  .band--wwd .prose p:last-child { margin-bottom: 0; }
  .band--wwd .pro-list { gap: 3.42vw; }
  .band--wwd .pro { grid-template-columns: 40% minmax(0, 1fr); min-height: 21.3vw; }
  .band--wwd .pro__body { margin-left: -.8vw; padding: 1.4vw 2vw .3vw 1vw; background: linear-gradient(31deg, #9fa9ad 0%, #f2f3f3 33%, #c9cbcc 66%, #f7f7f7 92%); }
  .band--wwd .pro__body h3 { font-size: 2.11vw; font-weight: 700; line-height: 1.1; letter-spacing: -.02em; color: #1e1e1e; margin-bottom: .9vw; }
  .band--wwd .pro__body p { font-size: 1.328vw; line-height: 1; letter-spacing: -.02em; color: #1e1e1e; }
  .band--wwd .pro__body .btn { min-height: 4.45vw; font-size: 1.88vw; font-weight: 400; padding: 0 2.26vw; margin: auto -1.5vw 0 0; border-radius: .45vw; border: 2px solid #c9cdd0; background: linear-gradient(11deg, #e00000 0%, #0b5594 100%); box-shadow: -.15vw .2vw .45vw rgba(0, 0, 0, .45); }
  .band--wwd .pro__body p { margin-bottom: 1.3vw; }
  .band--wwd .pro__body p + .btn { margin-top: auto; }
  /* Load More (live, scaled): full list width, 43px tall at a 920px window, near-square 2px corners,
     1px light edge, 2-stop red-to-blue, regular-weight label with an 18px circled plus. */
  .wwd__more { margin-top: 2.6vw; }
  .wwd__more .btn { min-height: 4.67vw; padding: 0 1.5vw; gap: .9vw; font-size: 2.2vw; font-weight: 400; border-radius: .2vw; border: 1px solid #e6e6e6; background: linear-gradient(11deg, #e00000 0%, #0b5594 100%); }
  .wwd__more .btn svg { width: 1.95vw; height: 1.95vw; }
}

/* ---------- forms ---------- */
.form-card { position: relative; width: 100%; max-width: 49.1rem; margin: 0 auto; border-radius: 1.25rem; overflow: hidden; border: 1px solid rgba(255, 255, 255, .8); box-shadow: 0 .6rem 1.8rem rgba(0, 0, 0, .6); background: var(--flag-v); }
.form-card__head { position: relative; text-align: center; padding: 2.36rem 1rem 1rem; min-height: 10.3rem; background: #2b2e31; isolation: isolate; border-bottom: 1px solid rgba(255, 255, 255, .45); }
.form-card__head picture { position: absolute; inset: 0; z-index: -1; }
.form-card__head img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.45) saturate(.8); }
.form-card__head h2 { font-size: 6.65rem; font-weight: 600; line-height: .95; text-shadow: 0 .25rem .6rem rgba(0, 0, 0, .7); }
.form-card__head p { position: relative; margin: -1.56rem 0 0; font-family: var(--label); font-weight: 600; font-size: 1.52rem; text-transform: uppercase; color: #d8d9db; text-shadow: 0 2px 6px rgba(0, 0, 0, .8); letter-spacing: -.01em; }
.form { padding: 1.2rem 2.6rem 2.2rem; display: grid; gap: 1.25rem; }
.form label { display: grid; gap: .45rem; font-size: 1.08rem; font-weight: 500; }
.form input, .form textarea, .form select { width: 100%; border: 0; border-radius: .3rem; background: #f1f1f1; color: #111; padding: 0 .75rem; height: 2.64rem; font-size: 1.15rem; box-shadow: inset 0 -2px 0 rgba(0, 0, 0, .28); }
.form textarea { height: auto; min-height: 5.2rem; padding: .5rem .75rem; resize: vertical; }
.form .tel { position: relative; display: block; }
.form .tel .flag { position: absolute; left: .75rem; top: 50%; width: 1.35rem; height: .9rem; transform: translateY(-50%); }
.form .tel input { padding-left: 2.8rem; }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; align-items: end; margin-top: .4rem; }
.form fieldset { border: 0; margin: 0; padding: 0; }
.form legend { font-size: 1.08rem; font-weight: 500; margin-bottom: .45rem; }
.form .radios { display: flex; gap: 2.6rem; }
.form .radios label { display: flex; align-items: center; gap: .5rem; font-size: 1.15rem; }
.form .radios input { width: 1rem; height: 1rem; padding: 0; accent-color: #1f78d1; box-shadow: none; }
.form .btn--outline { width: 100%; font-size: 1.65rem; min-height: 3.5rem; }
.form__status { font-size: 1.1rem; min-height: 1.2em; margin: 0; }
.form__status.is-ok { color: #9ff0b0; }
.form__status.is-err { color: #ffb4b4; }
.hp { position: absolute; left: -5000px; }
.form-band { position: relative; background: var(--bg-deep); padding: 1.9rem var(--gutter) 8rem; border-top: .3rem solid transparent; border-image: var(--divider) 1; isolation: isolate; }
.form-band__strip { position: absolute; left: 0; right: 0; top: 0; height: 3.6rem; z-index: -1; overflow: hidden; }
.form-band__strip img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.55); }

/* ---------- who we are ---------- */
.who { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 48.4%; padding-right: 2.9%; background: #0b0c0d; isolation: isolate; overflow: hidden; }
.who__mobile-heading { display: none; }
.who__bg { position: absolute; inset: 0; z-index: -1; }
.who__bg img { width: 100%; height: 100%; object-fit: cover; opacity: .22; filter: grayscale(.6); }
.who__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0, 0, 0, .55) 0%, rgba(0, 0, 0, .2) 55%, rgba(0, 0, 0, .6) 100%); }
.who__copy { padding: 1.8rem 1.4rem 3rem 2.6rem; }
.who__copy h2 { font-size: 4.6rem; font-weight: 600; margin-bottom: 1rem; }
.who__copy > p { font-size: 1.875rem; line-height: 1.17; }
.who__copy > .btn { min-width: 28rem; min-height: 4.4rem; font-size: 2.35rem; margin-top: .4rem; border-radius: .65rem; }
.who__copy h3 { font-size: 2.93rem; font-weight: 600; line-height: 1; margin: 3rem 0 1.1rem; text-shadow: 0 .2rem .5rem rgba(0, 0, 0, .6); }
.trust { list-style: none; margin: 0 0 1.2rem; padding: 0; display: grid; gap: .9rem; }
.trust li { font-style: italic; font-weight: 600; font-size: 2.55rem; line-height: 1.1; letter-spacing: -.01em; display: flex; align-items: center; gap: .5rem; }
.trust li a { color: inherit; }
.trust svg { width: 1em; height: 1em; flex: 0 0 auto; font-style: normal; }
.trust li:nth-child(1) { color: #cfe6ff; text-shadow: 0 0 .5rem #1f6fcf, 0 0 2px #1f6fcf; }
.trust li:nth-child(2) { color: #fff; text-shadow: 0 0 .4rem #d0101a, 0 0 2px #d0101a; }
.trust li:nth-child(3) { color: #e7f2ff; text-shadow: 0 0 .5rem #2b74c4; }
.trust li:nth-child(4) { color: #fff; text-shadow: 0 0 .5rem #d0101a; font-size: 3rem; }
.who__copy > .trust + .btn { min-width: 26.9rem; min-height: 4.5rem; font-size: 2.1rem; }
.who__art { position: relative; min-height: 41rem; }
.who__art .a1 { position: absolute; top: 0; left: 0; right: 0; height: 21.25rem; border-left: 2px solid #ddd; }
.who__art .a2 { position: absolute; top: 21.25rem; left: 0; right: 0; bottom: 0; border-left: 2px solid #ddd; }
.who__art .a1 img, .who__art .a2 img { width: 100%; height: 100%; object-fit: cover; }
.who__art .van { position: absolute; left: -7rem; bottom: -5.3rem; width: 52rem; max-width: none; z-index: 2; filter: drop-shadow(0 .6rem 1.1rem rgba(0, 0, 0, .7)); }
.who__about { grid-column: 1 / -1; padding: 0 1.4rem 2.2rem 3.25rem; }
.who__about h2 { font-size: 2.6rem; margin-bottom: .6rem; }
.who__about p { font-size: 1.35rem; line-height: 1.25; color: #dcdee1; }

/* ---------- property types + form ---------- */
.types-form { display: grid; grid-template-columns: 37.3% minmax(0, 1fr); gap: 3.4%; align-items: start; }
.band--types { padding-top: 1rem; }
.band--types .wrap { padding: 0 2.3rem; }
.types-form > div > h2 { font-size: 2.7rem; font-weight: 600; width: 118%; margin-bottom: 2.1rem; text-shadow: 0 .2rem .5rem rgba(0, 0, 0, .6); }
.type-stack { display: grid; gap: 1.8rem; }
.type-card { position: relative; background: var(--silver); color: var(--ink); border-radius: .75rem; padding: .5rem .55rem 1.5rem .6rem; border: 2px solid #f2f2f2; box-shadow: var(--shadow); }
.type-card h3 { font-size: 1.85rem; color: var(--ink); margin: 0 0 .2rem; }
.type-card h3 a { text-decoration: none; }
.type-card p { font-size: .98rem; line-height: 1.22; text-transform: capitalize; margin: 0 0 .5rem; color: #22252a; }
.type-card__img { position: relative; aspect-ratio: 343 / 168; border-radius: .4rem; overflow: hidden; border: 1px solid #333; }
.type-card__img img { width: 100%; height: 100%; object-fit: cover; }
.tab-btn { position: absolute; right: -.55rem; bottom: -.55rem; display: inline-flex; align-items: center; gap: .9rem; padding: 0 1.4rem; min-height: 3rem; background: var(--flag); color: #fff; text-decoration: none; text-transform: uppercase; font-size: 1.4rem; font-weight: 500; border-radius: .35rem 0 .7rem 0; border: 1px solid #eee; white-space: nowrap; }
.tab-btn svg { width: 1.6rem; height: 1.6rem; }
.type-card .tab-btn { min-height: 3.45rem; padding: 0 1.95rem; }
.types-form .sticky { position: sticky; top: 1.5rem; margin-top: 6.5rem; }
.types-form__more { margin-top: 1.8rem; padding: 0 .8rem; }
.types-form__more .btn { font-size: 2.1rem; min-height: 3.75rem; }

/* ---------- FAQ ---------- */
.faq { display: grid; grid-template-columns: 39% minmax(0, 1fr); background: #0e0f11; }
.faq__gallery { position: relative; overflow: hidden; min-height: 24rem; border-top: .3rem solid #6b6f74; border-right: .4rem solid; border-image: var(--divider) 1; }
.faq__track { display: flex; height: 100%; animation: marquee 70s linear infinite; }
.faq__track picture { width: auto; flex: 0 0 auto; height: 100%; }
.faq__track img { height: 100%; width: auto; max-width: none; aspect-ratio: 4 / 3; object-fit: cover; border-right: 2px solid #ccc; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.faq__gallery .btn { position: absolute; left: 50%; bottom: 1.8rem; transform: translateX(-50%); min-width: 28rem; min-height: 4rem; font-size: 2.25rem; background: linear-gradient(100deg, #4a0b14 0%, #2a2448 50%, #1d4a86 100%); }
.faq__title { background: var(--silver-bar); color: #111; margin: 0; padding: .7rem 1.9rem .6rem; font-size: 3.1rem; font-weight: 600; border-radius: 1.25rem 0 0 0; }
.faq__list { padding: 0 0 0 .6rem; background: linear-gradient(180deg, #d8d8d8, #8b8d90); }
.faq details { border-bottom: 2px solid #c9cbce; background: linear-gradient(90deg, #5a0915 0%, #3c1834 9%, #1d3b70 38%, #1d4d8b 100%); }
.faq summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 3.56rem; padding: .2rem 2.6rem; cursor: pointer; list-style: none; font-size: 2rem; font-weight: 500; text-transform: capitalize; line-height: 1.15; }
.faq--sentence summary { text-transform: none; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary svg { width: 1.4rem; height: 1.4rem; flex: 0 0 auto; transition: transform .2s; }
.faq details[open] summary svg { transform: rotate(180deg); }
.faq details > div { padding: .1rem 2.6rem 1.2rem; font-size: 1.35rem; line-height: 1.35; color: #eef0f2; background: rgba(0, 0, 0, .22); }
.faq details > div p { margin: .5rem 0 0; }
.faq--page { display: block; background: none; }
.faq--page .faq__list { padding: 0; border-radius: .75rem; overflow: hidden; }
.faq-group + .faq-group { margin-top: 2.2rem; }
.faq-group h2 { font-size: 2.5rem; margin-bottom: .75rem; }

/* ---------- projects ---------- */
.projects-head { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; min-height: 6.25rem; padding: .3rem 1.9rem .3rem 3.6rem; background: linear-gradient(90deg, #0f1012 0%, #2c3035 55%, #1a1c1f 100%); border-top: 1px solid #555; border-bottom: .2rem solid #e6e6e6; position: relative; }
.projects-head::after { content: ""; position: absolute; left: 0; bottom: -.2rem; width: max(4.3rem, calc(var(--carousel-p, 0) * 100%)); height: .2rem; background: #2f7fd6; transition: width .12s linear; }
.carousel__btn:disabled { opacity: .35; cursor: default; box-shadow: none; }
.carousel__track:focus-visible { outline: 2px solid #2f7fd6; outline-offset: -2px; }
.projects-head h2 { font-size: 4.75rem; font-weight: 600; }
.projects-head .btn { min-width: 23.5rem; min-height: 3.9rem; font-size: 2.1rem; }
.carousel { position: relative; background: linear-gradient(180deg, #000 0%, #222 100%); }
.carousel__track { display: grid; grid-auto-flow: column; grid-auto-columns: 29.25rem; gap: 1.1rem; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: 1.1rem; padding: 1.9rem 1.1rem 1.6rem; scrollbar-width: none; }
.carousel__track::-webkit-scrollbar { display: none; }
.carousel__btn { position: absolute; top: 55%; transform: translateY(-50%); width: 4rem; height: 4rem; border-radius: 50%; background: #fff; color: #111; border: 0; box-shadow: var(--shadow); cursor: pointer; z-index: 2; display: flex; align-items: center; justify-content: center; }
.carousel__btn svg { width: 2.3rem; height: 2.3rem; }
.carousel__btn--prev { left: 1rem; }
.carousel__btn--next { right: 1rem; }
.proj-card { scroll-snap-align: start; position: relative; border-radius: .75rem; overflow: hidden; background: #fff; border: 1px solid #ddd; box-shadow: var(--shadow); text-decoration: none; color: #222; display: block; }
.proj-card__num { display: flex; align-items: center; height: 4.6rem; padding: 0 .7rem .8rem; font-family: var(--label); font-weight: 600; font-size: 1.5rem; background: linear-gradient(180deg, #fff, #e4e4e4); }
.proj-card__img { aspect-ratio: 468 / 270; }
.proj-card__img img { width: 100%; height: 100%; object-fit: cover; }
.proj-card .tab-btn { right: 0; bottom: 0; border-radius: .5rem 0 0 0; font-size: 1.5rem; min-height: 2.75rem; }
.proj-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; }
.proj-grid .proj-card__num { position: absolute; left: .7rem; bottom: .3rem; height: auto; padding: 0; background: none; color: #fff; text-shadow: 0 1px 4px #000; z-index: 1; }

/* ---------- reviews ---------- */
.reviews { position: relative; background: #1b1d20; isolation: isolate; border-top: .3rem solid transparent; border-image: var(--divider) 1; }
.reviews__map { position: absolute; inset: 0 0 auto 0; height: 50rem; z-index: -1; }
.reviews__map img { width: 100%; height: 100%; object-fit: cover; }
.reviews__map::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(27, 29, 32, 0) 62%, #1b1d20 100%); }
.reviews__map--plain { background: radial-gradient(ellipse at 35% 45%, #283241 0%, #1b1d20 65%); }
.reviews__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 2rem; padding: 9.4rem var(--gutter) 6rem 1.75rem; }
.reviews__title { position: sticky; top: 9rem; align-self: start; font-size: 5.6rem; font-weight: 500; letter-spacing: -.045em; line-height: .88; text-shadow: 0 .25rem .75rem rgba(0, 0, 0, .7); }
.reviews__list { display: grid; gap: 7rem; padding: 0 0 4rem; }
.review { width: min(36rem, 100%); background: rgba(22, 24, 27, .95); border: 1px solid #8a8f96; border-radius: .75rem; padding: 1.1rem 1.1rem .9rem; box-shadow: 0 .6rem 1.6rem rgba(0, 0, 0, .65); }
.review:nth-child(even) { margin-left: 4rem; }
.review blockquote { margin: 0 0 .6rem; font-style: italic; font-size: 1.4rem; line-height: 1.24; color: #f2f2f2; letter-spacing: -.01em; }
.review footer { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .5rem 1rem; }
.review cite { grid-column: 1 / -1; font-style: normal; font-weight: 500; font-size: 2rem; line-height: 1.1; }
.review .stars { display: flex; gap: .5rem; color: var(--gold); justify-self: end; margin-right: 1.5rem; }
.review .stars svg { width: 1.8rem; height: 1.8rem; }
.review .src { width: 2.6rem; height: 2.6rem; border-radius: 50%; background: #fff; padding: .3rem; box-shadow: 0 0 0 2px #ddd; display: grid; place-items: center; }
/* The G fills the circle's padded box; never sized past it (it used to hang out the bottom-right). */
.review .src svg { width: 100%; height: 100%; }
.js .review.reveal { opacity: 0; transform: scale(.55); transform-origin: 50% 50%; transition: opacity .8s ease, transform .8s cubic-bezier(.2, .8, .2, 1); }
.js .review.reveal.is-in { opacity: 1; transform: none; }
.js .review.is-extra { display: none; }
.reviews__more .btn { min-width: 22.5rem; min-height: 3.6rem; font-size: 2.1rem; }

/* ---------- service areas list (index page) ---------- */
.hero--plain { background: #23282d; }
.hero--plain::before { display: none; }
.sa-list { position: relative; display: grid; grid-template-columns: 30% minmax(0, 1fr); background: #1a1c1e; border-top: 2px solid #d9d9d9; }
.sa-list__media { position: relative; overflow: hidden; min-height: 28rem; }
.sa-list__track { position: absolute; inset: 0 auto 0 0; display: flex; width: max-content; animation: marquee 70s linear infinite; }
.sa-list__track picture { height: 100%; aspect-ratio: 1; flex: 0 0 auto; }
.sa-list__track img { width: 100%; height: 100%; object-fit: cover; border-right: 2px solid #ccc; }
.sa-list__cta { position: absolute; left: 1.45rem; bottom: 1.55rem; z-index: 1; min-width: 22.9rem; min-height: 4.55rem; font-size: 1.8rem; border-radius: .5rem; background: linear-gradient(to top right, #4a0909 0%, #2b2842 50%, #0a4f84 100%); }
.sa-list__panel { position: relative; z-index: 2; margin-top: -2.5rem; align-self: start; background: #1a1c1e; border-left: 1px solid #3a3d40; }
.sa-list__title { display: flex; align-items: center; min-height: 5.07rem; padding: 0 1.9rem; font-size: 3.15rem; font-weight: 600; color: #262626; background: linear-gradient(90deg, #d9d9d9 0%, #cecece 40%, #f2f2f2 75%, #fdfdfd 100%); }
.sa-state { border-top: 1px solid #1a1a1a; }
.sa-state summary { display: flex; align-items: center; justify-content: space-between; min-height: 4.55rem; padding: 0 2.4rem 0 2.9rem; list-style: none; cursor: pointer; font-family: var(--display); font-size: 2.15rem; font-weight: 500; text-transform: uppercase; color: #fff; background: linear-gradient(to top right, #520407 0%, #3b1426 35%, #2a2a48 60%, #0b4d82 100%); }
.sa-state summary::-webkit-details-marker { display: none; }
.sa-state summary svg { width: 2.1rem; height: 2.1rem; transition: transform .2s ease; }
.sa-state[open] summary svg { transform: rotate(180deg); }
.sa-state__body { height: 24rem; overflow-y: auto; padding: 0 1.2rem 0 1.9rem; background: #1a1c1e; }
.sa-state__body ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.45rem; }
.sa-state__body a { display: flex; align-items: center; justify-content: space-between; gap: .6rem; min-height: 4.8rem; padding: 0 .2rem 0 .6rem; border-bottom: 2px solid #868788; color: #fff; text-decoration: none; font-size: 2.05rem; line-height: 1.1; }
.sa-state__body a:hover { color: #9fd0ff; }
.go { width: 2.85rem; height: 2.85rem; flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--flag); border: 1px solid #c9ccd6; color: #fff; }
.go svg { width: 1.4rem; height: 1.4rem; }

/* ---------- service areas ---------- */
.areas { display: grid; grid-template-columns: 33% minmax(0, 1fr); padding-top: .93rem; background: linear-gradient(180deg, #9aa9ac 0, #9aa9ac 18%, #bebebe 18%, #1a1c1e 100%) top / 100% .93rem no-repeat, var(--bg); }
.areas__map { position: relative; border-right: 2px solid #b9bcbf; min-height: 41rem; background: radial-gradient(circle at 40% 40%, #273140, #15181c 70%); }
.areas__map img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.areas__body { padding: .9rem 0 1.3rem 1rem; }
.areas__body h2 { font-size: 3.75rem; display: flex; align-items: center; gap: .45rem; }
.areas__body h2 svg { width: 1.2em; height: 1.2em; color: #f04848; }
.areas__body > p { margin: .4rem 0 .6rem .2rem; font-size: 1.6rem; }
.area-box { background: radial-gradient(ellipse at 60% 15%, #b6b7b9 0%, #9c9d9f 45%, #8f9193 100%); color: var(--ink); border-radius: .6rem; border: 1px solid #e4e4e4; padding: 1.15rem 0 .9rem 1rem; height: 30.8rem; overflow-y: auto; box-shadow: var(--shadow); }
.area-box h3 { font-size: 2.75rem; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: .3rem; font-weight: 400; margin: .2rem 0 .3rem; color: var(--ink); }
.area-box ul { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.2rem; }
.area-box li a { display: flex; align-items: center; justify-content: space-between; gap: .6rem; min-height: 4.8rem; padding: 0 .6rem; border-bottom: 2px solid #6f7377; text-decoration: none; color: var(--ink); font-size: 2.05rem; font-weight: 400; line-height: 1.1; }
.area-box li a:hover { color: #3a3d40; }
.pin { width: 3.2rem; height: 3.2rem; flex: 0 0 auto; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--flag); border: 2px solid #f1f1f1; color: #fff; box-shadow: 0 2px 5px rgba(0, 0, 0, .4); }
.pin svg { width: 1.85rem; height: 1.85rem; }
.areas__body > .btn { margin-top: .7rem; min-width: 25.6rem; min-height: 4.45rem; text-transform: none; }
.areas__body > .btn, .page-home .areas__body > .btn { border-radius: .3rem; }
.city-filter { width: 100%; max-width: 26rem; margin: 0 0 .8rem; padding: .6rem .9rem; border-radius: .5rem; border: 1px solid #777; background: #f4f4f4; color: #111; font-size: 1.2rem; }

/* ---------- footer ---------- */
.contact-info { background: #121315; border-top: 2px solid #f1f1f1; }
.footer-icon--mobile { display: none; }
.contact-info__title { text-align: center; font-size: 3.9rem; font-weight: 600; min-height: 5.7rem; display: flex; align-items: center; justify-content: center; border-bottom: 2px solid #9a9a9c; background: linear-gradient(180deg, #23262a, #131416); }
.contact-grid { display: grid; grid-template-columns: 47.8% 7.4% minmax(0, 1fr); }
.contact-grid > div { border-right: 1px solid #5a5a5a; }
.cg-cell { padding: .6rem 1.6rem; border-bottom: 1px solid #5a5a5a; min-height: 6.9rem; display: flex; flex-direction: column; justify-content: center; }
.cg-name { font-size: 4.5rem; font-weight: 600; text-transform: uppercase; line-height: 1; }
.cg-line { font-size: 2.9rem; text-transform: uppercase; line-height: 1.02; text-decoration: none; display: block; color: #ddd; }
.cg-addr { font-size: 2.9rem; text-transform: uppercase; line-height: 1.1; text-underline-offset: .3rem; }
.cg-icons { display: grid; grid-template-rows: repeat(3, 6.9rem) 1fr; }
.cg-icons > a { display: flex; flex-direction: column; align-items: center; justify-content: center; border-bottom: 1px solid #5a5a5a; text-decoration: none; }
.cg-icons > a > svg { width: 3.75rem; height: 3.75rem; }
.cg-faq { border-bottom: 0 !important; gap: .3rem; }
.cg-faq svg { width: 3rem !important; height: 3rem !important; }
.cg-faq span { font-size: .95rem; font-weight: 600; text-transform: uppercase; text-decoration: underline; }
.cg-bottom { display: grid; grid-template-columns: 40.7% 28.5% 1fr; min-height: 6.9rem; }
.cg-bottom a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .3rem; padding: .4rem; border-right: 1px solid #5a5a5a; text-decoration: underline; text-transform: uppercase; font-size: .95rem; font-weight: 600; }
.cg-bottom a:last-child { border-right: 0; }
.cg-bottom a > svg { width: 3.4rem; height: 3.4rem; }
.cg-bottom picture, .cg-bottom img { width: auto; height: 6.5rem; max-width: 100%; object-fit: contain; }
.newsletter { position: relative; padding: 1.3rem 1.5rem 1.6rem; background: radial-gradient(circle at 50% 35%, #2a2f36, #0f1012 75%); isolation: isolate; overflow: hidden; }
.newsletter__bg { position: absolute; inset: 0; z-index: -1; }
.newsletter__bg img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.38); }
.newsletter > p { font-size: 1.5rem; font-weight: 500; line-height: 1.5; text-transform: capitalize; }
.newsletter .form { padding: 0; gap: 1rem; }
.newsletter .form label { font-size: 1.15rem; }
.newsletter input[type="text"], .newsletter input[type="email"] { height: 2.9rem; border: 3px solid #4ea2ff; background: #ececec; }
.newsletter .check { display: flex !important; grid-template-columns: none; align-items: center; gap: .6rem; font-size: 1.05rem; }
.newsletter .check input { width: 1.2rem; height: 1.2rem; padding: 0; }
.newsletter__row { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.newsletter .btn--red { min-width: 11.4rem; min-height: 3.1rem; font-size: 1.5rem; }
.legal { text-align: center; color: #8d9298; font-size: .95rem; padding: .9rem var(--gutter) 1.3rem; border-top: 1px solid #2c3035; margin: 0; }
.legal a { color: #b8bcc1; }

/* ---------- static page bits ---------- */
.about-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); min-height: 35rem; isolation: isolate; }
.about-grid__bg { position: absolute; inset: 0; z-index: -1; }
.about-grid__bg img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.3); }
.about-grid__copy { padding: 1.6rem var(--gutter) 2.5rem; }
.about-grid__copy h1 { font-size: 4rem; font-weight: 600; margin-bottom: 1rem; }
.about-grid__copy p { font-size: 1.4rem; line-height: 1.25; text-transform: capitalize; }
.about-grid__art { display: grid; grid-template-rows: 1fr 1fr; border-left: 2px solid #555; }
.about-grid__art img { width: 100%; height: 100%; object-fit: cover; }
.listings { display: grid; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); gap: .9rem; }
.listing { display: flex; align-items: center; gap: .75rem; padding: .75rem .9rem; border-radius: .6rem; background: var(--silver); color: var(--ink); text-decoration: none; font-size: 1.3rem; font-weight: 500; border: 2px solid #eee; }
.listing img { width: 1.9rem; height: 1.9rem; }
.project-hero { position: relative; min-height: 26rem; display: flex; align-items: flex-end; isolation: isolate; }
.project-hero picture { position: absolute; inset: 0; z-index: -1; }
.project-hero img { width: 100%; height: 100%; object-fit: cover; }
.project-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, rgba(15, 16, 18, .95) 100%); }
.project-hero h1 { font-size: 6rem; padding: 0 var(--gutter) 1.5rem; }
.gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.gallery a { display: block; aspect-ratio: 1; overflow: hidden; border-radius: .5rem; border: 2px solid #ccc; }
.gallery img { width: 100%; height: 100%; object-fit: cover; }
.sitemap-cols { columns: 3 16rem; column-gap: 2rem; }
.sitemap-cols section { break-inside: avoid; margin-bottom: 1.6rem; }
.sitemap-cols h2 { font-size: 1.6rem; margin-bottom: .5rem; }
.sitemap-cols ul { list-style: none; margin: 0; padding: 0; }
.sitemap-cols a { color: #dfe2e5; text-decoration: none; display: block; padding: .1rem 0; font-size: 1.1rem; }
.sitemap-cols a:hover { color: #c4c4c4; }
.notfound { min-height: 60vh; display: grid; place-items: center; text-align: center; padding: 2.5rem var(--gutter); }
.notfound h1 { font-size: 7rem; }

/* grid children may shrink below their content width */
.contact-grid > *, .split > *, .who > *, .types-form > *, .faq > *, .areas > *, .cards > *, .tiles > *, .about-grid > *, .reviews__grid > * { min-width: 0; }

/* ============================================================
   PHONES (<= 750px): fixed 16px root, stacked layout
   ============================================================ */
@media (max-width: 750px) {
  :root { --gutter: 16px; }
  body { font-size: 17px; }
  .nav { height: 46px; padding-right: 0; }
  .nav__links li.nav__home { flex: 0 0 34px; }
  .nav__links a { font-size: 15px; }
  .nav__links li + li { margin: 8px 0; }
  .nav__links li + li a { margin: -8px 0; }
  .menu-btn { flex: 0 0 52px; }
  .menu-btn svg { width: 30px; height: 28px; }
  .drawer__panel { width: 100vw; }
  .menu-bar { height: 50px; background: linear-gradient(180deg, #141414 0%, #23282d 100%); }
  .menu-close { flex-basis: 54px; order: 1; border-right: 0; border-left: 1px solid #6a6f75; }
  .menu-close svg { width: 24px; height: 24px; }
  .menu-tab__link { font-size: clamp(10px, 2.7vw, 12px); padding: 0 2px 0 4px; }
  .menu-tab__drop { padding: 0 3px 0 1px; }
  .menu-tab__drop svg { width: 10px; height: 10px; }
  .menu-sheet { left: 0; right: 54px; padding: 12px 12px 10px; }
  .menu-sheet__ico { width: 38px; height: 38px; }
  .menu-sheet__ico svg { width: 16px; height: 16px; }
  a.menu-sheet__ico svg { width: 22px; height: 22px; }
  .menu-sheet .menu-list { grid-template-columns: 1fr 1fr; gap: 0 10px; }
  .menu-sheet .menu-list a { font-size: 15px; padding: 7px 2px; }
  #pane-faqs .menu-list { grid-template-columns: 1fr; }
  .menu-rail { flex-basis: 54px; gap: 16px; padding: 20px 0; order: 1; border-right: 0; border-left: 1px solid #6a6f75; }
  .menu-dot { width: 40px; height: 40px; border-width: 1px; }
  .menu-dot svg { width: 24px; height: 24px; }
  .menu-dot[href^="tel:"] svg { width: 20px; height: 20px; }
  .menu-dot--logo { width: 42px; height: 42px; }
  .menu-share { font-family: var(--label); font-size: 12px; line-height: 1.2; gap: 5px; padding: 0; flex-shrink: 0; }
  .menu-share svg { width: 24px; height: 24px; }
  .menu-panes { min-width: 0; padding: 16px 14px 24px; }
  .menu-pane h2, .form-card__head.form-card__head--plain h2 { font-size: 26px; }
  .menu-list { grid-template-columns: 1fr; }
  .menu-list a { font-size: 17px; }
  .menu-projects { grid-template-columns: 1fr 1fr; }

  .hero__grid { display: flex; flex-direction: column-reverse; min-height: 0; }
  .hero__side { min-height: 250px; }
  .hero__side-img { border-left: 0; }
  .hero__side-img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 50%, rgba(16, 18, 20, .9)); }
  .hero__logo { left: 2%; top: 4px; width: 72%; max-width: 330px; }
  .hero__van { right: -4%; bottom: -8px; width: 70%; }
  .hero__copy { padding: 0 var(--gutter) 40px; margin-top: -40px; position: relative; z-index: 3; }
  .hero__top { margin-bottom: 10px; gap: 8px; flex-wrap: wrap; }
  .hero__brand { font-size: 13px; margin-right: 6px; }
  .icon-btn { width: 36px; height: 36px; }
  .icon-btn svg { width: 20px; height: 20px; }
  .phone-pill { height: 36px; font-size: 19px; padding: 0 12px; }
  .hero__eyebrow { font-size: 11px; }
  .hero h1 { font-size: 36px; }
  .hero__lead { font-size: 16px; }
  .btn--lg { min-width: 0; width: 100%; max-width: 340px; font-size: 26px; min-height: 56px; }

  .btn { font-size: 20px; min-height: 48px; padding: 6px 18px; }
  .band { padding: 28px 0 32px; }
  .section-head { flex-direction: column; gap: 12px; margin-bottom: 22px; }
  .section-head h2 { font-size: 34px; }
  .section-head h2.sm { font-size: 26px; }
  .section-head p { font-size: 17px; }
  .section-head .kicker { font-size: 15px; margin-top: 6px; }
  .section-head .btn { min-width: 0; }

  .cards, .proj-grid, .gallery { grid-template-columns: 1fr; gap: 20px; }
  .card { padding: 14px 14px 12px; }
  .card h3 { font-size: 30px; }
  .card p { font-size: 16px; }
  .card .btn { font-size: 24px; min-height: 50px; }
  .tiles { grid-template-columns: 1fr; gap: 14px; }
  .tile { aspect-ratio: 1.6 / 1; }
  .tile span { font-size: 30px; }
  .go { width: 34px; height: 34px; }
  .go svg { width: 20px; height: 20px; }

  .split, .types-form, .who, .faq, .areas, .about-grid, .reviews__grid { grid-template-columns: 1fr; }
  .prose h2 { font-size: 30px; }
  .prose p { font-size: 18px; }
  .pro { grid-template-columns: 1fr; min-height: 0; }
  .pro__img { aspect-ratio: 16 / 9; }
  .pro__body { box-shadow: none; padding: 12px 14px 14px; }
  .band--textured .pro__body, .band--wwd .pro__body { margin: -12px 0 0; padding: 12px 14px 14px; box-shadow: 0 -.35rem .8rem rgba(0, 0, 0, .35); }
  .band--textured .pro__img, .band--wwd .pro__img { border-radius: .8rem .8rem 0 0; }
  .pro__body h3 { font-size: 26px; }
  .pro__body p { font-size: 16px; }
  .pro__body .btn { font-size: 20px; min-height: 44px; }

  .form-card { border-radius: 9px; }
  .form-card__head { min-height: 0; padding: 16px 10px 12px; }
  .form-card__head h2 { font-size: 48px; }
  .form-card__head p { font-size: 17px; margin-top: 0; }
  .form-band .form-card__head h2 { font-size: clamp(46px, 12.73vw, 60px); }
  .form-band .form-card__head p { font-size: clamp(17px, 4.55vw, 21px); line-height: 1.2; }
  .form { padding: 14px 18px 22px; gap: 12px; }
  .form label, .form legend { font-size: 15px; }
  .form input, .form select { height: 40px; font-size: 16px; }
  .form .tel .flag { width: 20px; height: 13px; }
  .form .tel input { padding-left: 38px; }
  .form__row { grid-template-columns: 1fr; }
  .form .radios label { font-size: 15px; }
  .form .radios input { width: 16px; height: 16px; }
  .form .btn--outline { font-size: 22px; min-height: 48px; }
  .form-band { padding: 26px var(--gutter) 44px; }
  .form-band__strip { height: 46px; }

  .who { padding-right: 0; }
  .who__copy { padding: 26px var(--gutter) 30px; }
  .who__copy h2 { font-size: 44px; }
  .who__copy > p { font-size: 18px; }
  .who__copy > .btn { min-width: 0; font-size: 24px; min-height: 52px; }
  .who__copy h3 { font-size: 32px; margin-top: 28px; }
  .trust li { font-size: 28px; }
  .trust li:nth-child(4) { font-size: 32px; }
  .who__copy > .trust + .btn { min-width: 0; font-size: 22px; min-height: 50px; }
  .who__art { min-height: 420px; }
  .who__art .a1 { height: 46%; }
  .who__art .a2 { top: 46%; }
  .who__art .van { left: 0; bottom: 0; width: 100%; }
  .who__about { padding: 0 var(--gutter) 24px; }
  .who__about h2 { font-size: 28px; }
  .who__about p { font-size: 17px; }

  .types-form > div > h2 { font-size: 34px; }
  .band--types .wrap { padding: 0 var(--gutter); }
  .types-form .sticky { position: static; margin-top: 0; }
  .types-form > div > h2 { width: auto; }
  .type-card h3 { font-size: 28px; }
  .type-card p { font-size: 14px; }
  .tab-btn { font-size: 18px; min-height: 40px; padding: 0 14px; }
  .tab-btn svg { width: 20px; height: 20px; }
  .types-form__more .btn { font-size: 22px; }

  .faq__gallery { min-height: 260px; border-right: 0; }
  .faq__gallery .btn { min-width: 0; font-size: 22px; min-height: 50px; }
  .faq__title { border-radius: 0; font-size: 30px; padding: 10px 16px; }
  .faq__list { padding: 0; }
  .faq summary { font-size: 19px; padding: 10px 16px; min-height: 0; }
  .faq summary svg { width: 18px; height: 18px; }
  .faq details > div { font-size: 16px; padding: 4px 16px 14px; }
  .faq-group h2 { font-size: 26px; }

  .projects-head { flex-wrap: wrap; padding: 10px 16px; }
  .projects-head h2 { font-size: 40px; }
  .projects-head .btn { min-width: 0; font-size: 20px; min-height: 46px; }
  .carousel__track { grid-auto-columns: 82%; }
  .carousel__btn { width: 44px; height: 44px; }
  .proj-card__num { height: 44px; font-size: 18px; }
  .proj-card .tab-btn { font-size: 17px; min-height: 36px; }

  .reviews__grid { padding: 50px var(--gutter) 40px; }
  .reviews__title { position: static; font-size: 52px; }
  .reviews__list { gap: 26px; padding-top: 24px; }
  .review, .review:nth-child(even) { width: 100%; margin-left: 0; }
  .review blockquote { font-size: 17px; }
  .review cite { font-size: 22px; }
  .review .stars svg { width: 20px; height: 20px; }
  .review .src { width: 30px; height: 30px; }
  .reviews__more .btn { min-width: 0; font-size: 22px; }

  .sa-list { grid-template-columns: 1fr; }
  .sa-list__panel { margin-top: 0; order: -1; border-left: 0; background: #f1f1f1; }
  .sa-list__media { height: 266px; min-height: 266px; }
  .sa-list__track { height: 100%; }
  .sa-list__track picture { width: 60vw; flex: 0 0 60vw; }
  .sa-list__title { font-size: 30px; min-height: 60px; padding: 0 16px; }
  .sa-state { margin-inline: 6px; border-left: 1px solid #f1f1f1; border-right: 1px solid #f1f1f1; }
  .sa-state:first-of-type { border-top: 1px solid #f1f1f1; border-radius: 9px 9px 0 0; }
  .sa-state:first-of-type > summary { border-radius: 8px 8px 0 0; }
  .sa-state summary { font-size: 24px; min-height: 54px; padding: 0 10px; }
  .sa-state summary svg { width: 22px; height: 22px; }
  .sa-state__body { height: 380px; padding: 0 10px 0 16px; }
  .sa-state__body ul { grid-template-columns: 1fr; }
  .sa-state__body a { font-size: 22px; min-height: 54px; }
  .go { width: 34px; height: 34px; }
  .go svg { width: 16px; height: 16px; }
  .sa-list__cta { left: auto; bottom: auto; min-width: 0; }
  .areas__map { order: 2; height: 250px; min-height: 250px; border-right: 0; border-top: 1px solid #c4c4c4; }
  .areas__body { order: 1; position: relative; z-index: 1; padding: 14px 20px 0; margin-bottom: -28px; }
  .areas__body h2 { font-family: var(--label); font-size: 38px; font-weight: 600; line-height: 1.1; }
  .areas__body h2 svg { width: 38px; height: 38px; }
  .page-service-local .areas__body h2 { font-size: clamp(24px, 6.36vw, 28px); }
  .page-service-local .areas__body h2 svg { width: 1em; height: 1em; flex-shrink: 0; }
  .areas__body > p { font-family: var(--label); font-size: 17px; line-height: 1.2; margin: 4px 0 20px; }
  .area-box { height: 426px; max-height: none; padding: 14px 10px 0 16px; border: 2px solid #e4e4e4; border-radius: 12px; }
  .area-box h3 { font-family: var(--label); font-size: 20px; font-weight: 600; }
  .area-box ul { grid-template-columns: 1fr; }
  .area-box li a { font-size: 30px; font-weight: 500; font-style: italic; min-height: 70px; padding: 0 0 0 4px; }
  .pin { width: 34px; height: 34px; }
  .pin svg { width: 18px; height: 18px; }
  .areas__body > .btn { min-width: 0; width: 100%; min-height: 60px; margin-top: 14px; font-size: 30px; border-radius: 8px; }
  .city-filter { font-size: 17px; }

  .contact-info__title { font-size: 36px; min-height: 64px; }
  .contact-info .footer-icon--mobile { display: block; }
  .contact-info .footer-icon--desktop { display: none; }
  .contact-grid { grid-template-columns: minmax(0, 1fr) 72px; }
  .contact-info__title { border: 1.6px solid #9a9a9c; border-top: 0; }
  .contact-grid > div:not(.newsletter) { border-right: 1.6px solid #9a9a9c; }
  .contact-grid > div:first-child { border-left: 1.6px solid #9a9a9c; }
  .contact-grid .cg-cell, .contact-grid .cg-icons > a { border-bottom: 1.6px solid #9a9a9c; }
  .contact-grid .cg-bottom { border-bottom: 1.6px solid #9a9a9c; }
  .contact-grid .cg-bottom a:not(:last-child) { border-right: 1.6px solid #9a9a9c; }
  .newsletter { grid-column: 1 / -1; padding: 24px; min-height: 600px; }
  .newsletter > p { font-size: 14px; margin-bottom: 24px; }
  .newsletter .form { gap: 24px; }
  .newsletter .form label { font-size: 18px; font-weight: 400; }
  .newsletter input[type="text"], .newsletter input[type="email"] { height: 44px; }
  .newsletter .check { font-size: 14px; }
  .newsletter__row { flex-direction: column; align-items: stretch; gap: 26px; }
  .newsletter .form .check { font-size: 14px; }
  .newsletter .check input { appearance: none; flex: 0 0 19px; width: 19px; height: 19px; border: 2px solid #2da8ff; border-radius: 0; background: transparent; }
  .newsletter .check input:checked { background: #2da8ff; box-shadow: inset 0 0 0 3px #171a1d; }
  .newsletter .btn--red { width: 100%; min-width: 0; font-size: 20px; min-height: 48px; border-radius: 100px; background: #e10600; }
  .newsletter__bg img { filter: brightness(.25); }
  .cg-cell { padding: 4px 9px; min-height: 0; height: 68px; }
  .cg-cell:nth-child(2) { height: 54px; }
  .cg-cell:nth-child(3) { height: 66px; }
  .cg-name { font-size: 30px; }
  .cg-line, .cg-addr { font-size: 21px; font-weight: 500; overflow-wrap: anywhere; }
  .cg-addr { font-size: clamp(14px, 4.3vw, 19px); white-space: nowrap; }
  .cg-addr__city { display: inline; }
  .cg-icons { grid-template-rows: 68px 54px 66px 1fr; }
  .cg-icons > a > svg { width: 40px; height: 40px; }
  .cg-icons > a[aria-label="Google Business Profile"] > svg { width: 40px; height: 40px; }
  .cg-icons .cg-faq { height: 62px; gap: 0; border-bottom: 1.6px solid #9a9a9c !important; }
  .cg-icons .cg-faq svg { width: 48px !important; height: 48px !important; }
  .cg-faq span { font-size: 11px; }
  .cg-bottom { grid-template-columns: 1.3fr 1.25fr 1.1fr; height: 62px; min-height: 0; }
  .cg-bottom a { min-height: 0; font-size: 9px; line-height: 10px; padding: 0 4px; gap: 0; }
  .cg-bottom a > svg { flex-shrink: 0; }
  .cg-icons .cg-faq span { font-size: 9px; line-height: 10px; }
  .cg-bottom a > svg { width: 48px; height: 48px; color: #bcbcbc; }
  .cg-bottom picture, .cg-bottom img { height: 48px; }
  .legal { font-size: 13px; }

  .about-grid__copy h1 { font-size: 40px; }
  .about-grid__copy p { font-size: 17px; }
  .about-grid__art { grid-template-rows: none; grid-template-columns: 1fr 1fr; border-left: 0; }
  .project-hero { min-height: 260px; }
  .project-hero h1 { font-size: 56px; }
  .crumbs { font-size: 13px; }
  .index-list h3 { font-size: 18px; }
  .index-list a { font-size: 16px; }
}

/* mid-width desktop windows keep the desktop grid but give tiles room */
@media (min-width: 751px) and (max-width: 1000px) {
  .tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .faq__track, .sa-list__track { animation: none; }
  .js .review.reveal { opacity: 1; transform: none; transition: none; }
}

/* Reference corrections (homepage pass, October 19), now site-wide: every
   template on the live site uses the same Wix components as the homepage. */
body {
  --bg: #171a1d;
  --flag: linear-gradient(31deg, #e00000 0%, #0a5694 75%, #2aa8f5 100%);      /* icon circles */
  --btn: linear-gradient(11deg, #e00000 0%, #0a5694 75%, #2aa8f5 100%);       /* buttons */
  --btn-hover: linear-gradient(12deg, #4d0000 0%, #0a5694 100%);              /* button hover */
}
.btn, .tab-btn, .phone-pill { background: var(--btn); }
.btn--outline { background: transparent; }
.btn.btn--red { background: linear-gradient(180deg, #ff1a1a, #c40000); }
.btn:hover, .tab-btn:hover, .phone-pill:hover, a:hover .tab-btn { background: var(--btn-hover); filter: none; }
.btn--outline:hover { background: rgba(255, 255, 255, .1); }
/* Arrow buttons: on hover the ring fills white and the arrow turns to point right. */
.btn svg:has(circle) { transition: transform .2s ease; }
.btn svg:has(circle) circle, .btn svg:has(circle) path { transition: fill .2s ease, stroke .2s ease; }
.btn:hover svg:has(circle) { transform: rotate(45deg); }
.btn:hover svg:has(circle) circle { fill: #fff; stroke: #fff; }
.btn:hover svg:has(circle) path { stroke: #1d2c4c; }
.btn { border-radius: .65rem; }
.faq { border-top: 0; background: #22272b; }
.faq__body { margin-top: -2.4rem; position: relative; z-index: 1; }
.faq__gallery { min-height: 24rem; }
.faq__track { position: absolute; inset: 0 auto 0 0; width: max-content; }
.faq__track picture { width: 22rem; flex-basis: 22rem; }
.faq__track img { width: 100%; height: 100%; aspect-ratio: auto; }
.faq__title { font-size: 3.35rem; padding: .75rem 1.6rem; background: linear-gradient(110deg,#d5d7d8,#fff); }
.faq__list { padding-left: .6rem; border-left: 1px solid #cdd0d3; }
.faq details { border-bottom-width: 1px; background: #1d2022; }
.faq summary { min-height: 3.65rem; font-size: 2.15rem; background: linear-gradient(15deg,#460b16 0%,#29293f 43%,#07517e 100%); }
.faq details:first-child summary { border-radius: .6rem 0 0 0; }
.faq details > div { background: #1d2022; font-size: 1.65rem; line-height: 1.35; padding: 1.25rem 2.6rem 2.3rem; border-top: 1px solid #b4b7ba; }
.faq details > div p { margin: 0; }
.faq__gallery .btn { min-width: 0; width: 80%; background: linear-gradient(15deg,#420711,#28334c,#075582); }
.form-card__head p { margin: .5rem 0 0; font-weight: 400; }
.form-card__head h2 { font-size: 5.4rem; }
.types-form .form-card__head h2 { font-size: 4.5rem; }
.types-form .form-card__head p { margin-top: -1.2rem; }
.form-card { max-width: 46rem; }
.form textarea { min-height: 6rem; }
.form-band__strip { height: 100%; }
.form-band__strip img { filter: brightness(.28); }
@media (min-width: 751px) {
  .form-band { padding-bottom: 2.6rem; }
  .form-band__strip { clip-path: inset(0); }
  .form-band__strip picture { position: fixed; inset: 0; }
}
.form .radios input { appearance: none; border: 1px solid #b9bdc2; border-radius: 50%; background: transparent; }
.form .radios input:checked { background: #e8edf2; box-shadow: inset 0 0 0 3px #29314b; }
.reviews__map { inset: 0; height: auto; }
.reviews__map picture { position: sticky; top: 0; height: 100vh; height: 100svh; }
.reviews__map img { filter: brightness(.42) saturate(.65); }
.reviews__map::after { display: none; }
.reviews__grid { grid-template-columns: 47% minmax(0,1fr); gap: 1rem; padding: 8rem 2rem 5rem 1.5rem; }
.reviews__title { font-size: 4.6rem; font-weight: 600; line-height: 1.05; letter-spacing: -.025em; top: 8rem; }
.reviews__list { padding-top: 56vh; gap: 9rem; display: flex; flex-direction: column; }
.review, .review:nth-child(even) { width: 100%; margin: 0; padding: 1.2rem; border-radius: 1.2rem; background: #1d2022; transform: scale(var(--review-scale,1)); transform-origin: center center; }
.review blockquote { font-size: 1.75rem; line-height: 1.22; }
.review cite { font-size: 2.65rem; font-weight: 600; }
.review cite::before { content: "— "; }
.review .stars svg { width: 2.4rem; height: 2.4rem; }
.review .stars { gap: 1.2rem; }
.review .src { width: 3.3rem; height: 3.3rem; }
.reviews__more { text-align: center; }
.review-slot[hidden] { display: none; }
@media (min-width: 751px) {
  body { --gutter: 2.65rem; }
  .hero__grid { grid-template-columns: minmax(0,1fr) 31.5%; min-height: 50rem; }
  .hero__copy { padding-left: 2.4rem; padding-top: 1.5rem; }
  .hero__top { margin-bottom: 1.8rem; }
  .hero h1 { font-size: 4.9rem; margin-bottom: .8rem; }
  .hero__lead { font-size: 1.75rem; line-height: 1.16; margin-bottom: 1.5rem; }
  .hero__cta .btn { min-width: 24.5rem; }
  .section-head h2 { font-size: 4rem; }
  .section-head h2.sm { font-size: 2.3rem; }
  .section-head p { font-size: 1.75rem; }
  .section-head { gap: 1rem; }
  .section-head .btn { min-width: 24rem; font-size: 1.9rem; }
  .card { padding: 1.4rem 1.4rem .8rem; border-color: #999fa2; border-radius: 1.4rem; background: linear-gradient(35deg,#9aa5a7,#e6e8e8 48%,#b8b8b8 75%,#fff); }
  .card h3 { font-size: 2.15rem; margin: .65rem 0; }
  .card p { font-size: 1.2rem; line-height: 1.13; }
  .card .btn { margin-top: 1.3rem; }
  .page-home .band + .band { border-top: 0; }
  .page-home .band--types { border-top: .3rem solid #ddd; }
  .who__copy > p { font-size: 1.75rem; }
  .who__copy h2 { font-size: 4.4rem; }
  .who__copy > .btn { min-width: 25.5rem; }
  .who__art .a1 { height: 23rem; }
  .who__art .a2 { top: 23rem; }
  .who__art .van { left: -6rem; width: 49rem; bottom: -5.3rem; }
  .types-form { grid-template-columns: 38% minmax(0,1fr); gap: 3.2%; }
  .types-form__more { padding: 0 .5rem; }
  .types-form__more .btn { font-size: 1.9rem; padding-inline: .4rem; white-space: nowrap; }
  .type-card .tab-btn { right: 0; bottom: 0; }
  .projects-head h2 { font-size: 4.5rem; }
  .carousel__track { grid-auto-columns: calc((100% - 2.2rem) / 3); }
}
@media (max-width: 750px) {
  .faq__body { margin-top: 0; }
  .faq__title { font-size: 28px; padding: 14px 16px; }
  .faq summary { font-size: 20px; padding: 12px 16px; min-height: 48px; }
  .faq details > div { font-size: 17px; padding: 18px 16px 24px; }
  .faq__list { padding-left: 0; }
  .faq__gallery { min-height: 260px; }
  .form-card__head h2 { font-size: 46px; }
  .types-form .form-card__head h2 { font-size: 40px; }
  .form-card__head p { font-size: 15px; }
  .reviews__grid { grid-template-columns: 1fr; padding: 48px 18px; }
  .reviews__title { position: static; font-size: 40px; }
  .reviews__list { padding-top: 15vh; gap: 65px; }
  .review blockquote { font-size: 18px; }
  .review cite { font-size: 25px; }
  .review .stars { gap: 8px; }
  .review .stars svg { width: 23px; height: 23px; }
  .review .src { width: 32px; height: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .review { transform: none; }
  .reviews__list { padding-top: 2rem; gap: 2rem; }
}

/* ---------- inner-page template corrections (October 20) ---------- */
.tiles { display: flex; flex-wrap: wrap; justify-content: center; }
.tiles > .tile { flex: 0 0 calc((100% - 3 * 1.56rem) / 4); }
.form-intro { position: relative; text-align: center; margin: 0 auto 1rem; }
.form-intro h1, .form-intro h2 { font-size: 4.6rem; font-weight: 600; line-height: 1; text-shadow: 0 .25rem .6rem rgba(0, 0, 0, .75); }
.form-intro p { margin: .1rem 0 0; font-size: 2.2rem; text-transform: uppercase; line-height: 1; text-shadow: 0 2px 6px rgba(0, 0, 0, .8); }
.form-band--intro { padding-top: 1.2rem; padding-bottom: 2.6rem; }
.form-band--intro .form-card { max-width: 41rem; }
.form-card__photo { aspect-ratio: 820 / 310; overflow: hidden; border-bottom: 1px solid rgba(255, 255, 255, .45); background: #2b2e31; }
.form-card__photo img { width: 100%; height: 100%; object-fit: cover; }
.form-card--bare { padding-top: .6rem; }
.form__send { display: flex; justify-content: center; margin-top: .4rem; }
.form__send .btn--outline { width: 84%; text-transform: uppercase; }
.contact-hero { position: relative; isolation: isolate; overflow: hidden; padding: 2.6rem var(--gutter) 8.5rem; background: #101214; }
.contact-hero__bg { position: absolute; inset: 0; z-index: -1; }
.contact-hero__bg img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.6); }
.contact-hero .form-intro h1 { font-size: 3.6rem; }
.contact-hero .form-intro p { font-size: 1.85rem; }
.contact-hero .form-card { max-width: 41rem; }
.about-grid__copy h1 { font-size: 4.4rem; line-height: .98; }
.about-grid__copy p { font-size: 1.62rem; line-height: 1.17; margin-bottom: 0; }
.about-grid__copy .btn { margin-top: 1.2rem; }
.about-grid__art { grid-template-rows: 1fr 1.25fr; }
.who__about { padding: 0 2.9rem 2.6rem 2.6rem; }
.who__about h2 { font-size: 3rem; font-weight: 600; margin-bottom: .5rem; }
.who__about p { font-size: 1.85rem; line-height: 1.17; color: #f1f1f1; }
.band--projects { padding-top: 0; }
.band--projects .proj-grid { gap: 1.6rem 2.2rem; }
.proj-grid .proj-card { border: 2px solid #f1f1f1; border-radius: .9rem; }
.proj-grid .proj-card__img { aspect-ratio: 1.24; }
.proj-grid .proj-card::after { content: ""; position: absolute; inset: auto 0 0 0; height: 32%; background: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, .75)); pointer-events: none; }
.proj-grid .proj-card__num { font-family: var(--display); font-size: 1.4rem; left: .9rem; bottom: .8rem; }
@media (max-width: 750px) {
  .tiles > .tile { flex-basis: 100%; }
  .form-intro h1, .form-intro h2 { font-size: 40px; }
  .form-intro p { font-size: 18px; }
  .contact-hero { padding: 28px var(--gutter) 44px; }
  .who__about { padding: 0 var(--gutter) 24px; }
  .who__about h2 { font-size: 28px; }
  .who__about p { font-size: 17px; }
  .about-grid__copy h1 { font-size: 40px; }
  .about-grid__copy p { font-size: 17px; }
  .proj-grid .proj-card__num { font-size: 20px; }
}

/* Section after the hero pulls its heading and button up into the
   hero's bottom edge, as on the live site. */
@media (min-width: 1001px) {
  .hero + .band { position: relative; z-index: 3; margin-top: -2.6rem; padding-top: 1.6rem; }
  .section-head .btn { min-height: 4.3rem; min-width: 25.5rem; font-size: 2rem; }
  .card .btn { min-height: 4.1rem; }
  .section-head h2, .card h3 { letter-spacing: -.02em; }
  .section-head p, .card p { letter-spacing: -.02em; }
  .section-head h2 { font-size: 3.6rem; }
  .card h3 { font-size: 1.95rem; }
  .section-head p { font-size: 1.6rem; }
  .card p { font-size: 1.08rem; }
  .section-head .btn svg { width: 1.15em; height: 1.15em; }
  .hero__lead { font-size: 1.68rem; }
  .who.divider { border-top: 0; }
  .who__copy h2 { font-size: 4.1rem; letter-spacing: -.02em; }
  .who__copy > p { letter-spacing: -.02em; }
  .who__copy h3 { letter-spacing: -.02em; }
  .who__copy .btn { font-weight: 400; }
  .who__bg img { opacity: .5; filter: grayscale(.4); }
  .who__bg::after { background: linear-gradient(180deg, rgba(0, 0, 0, .8) 0%, rgba(0, 0, 0, .3) 35%, rgba(0, 0, 0, .3) 65%, var(--bg) 100%), linear-gradient(90deg, rgba(0, 0, 0, .35) 0%, rgba(0, 0, 0, 0) 60%); }
}
/* Van keeps its proportions (it was stretched by the img height attribute). */
.who__art .van { height: auto; }
@media (min-width: 1001px) {
  .who { padding-right: 3.6%; }
  .who__art .a1 img { object-position: center 30%; }
  .who__art .a2 img { object-position: center 80%; }
  .who__art .van { left: -6.5rem; width: 54rem; bottom: -4rem; }
}
@media (min-width: 751px) and (max-width: 1000px) {
  .card h3 { font-size: 1.85rem; }
  .card p { font-size: 1.08rem; }
  .section-head p { font-size: 1.55rem; }
}

/* ============================================================
   TABLET (751px to 1000px), the Wix tablet breakpoint.
   Hero: logo top left, social buttons stacked beside it, the side
   photo as a box in the top right, copy below at full width, van
   bottom right, background photo full width.
   ============================================================ */
.hero__social, .hero__van--tablet { display: none; }
@media (min-width: 751px) and (max-width: 1000px) {
  .hero__bg { width: 100%; }
  /* Tablet gradient (Wix, Linear 0°): dark at the bottom edge, clear by 10%, black at the top. */
  .hero__bg::after { background: linear-gradient(0deg, #1d1f21 0%, rgba(255, 255, 255, 0) 10%, #000 100%); }
  .hero__grid { display: block; position: relative; min-height: 0; }
  .hero__side { position: static; }
  .hero__side-img { inset: 0 0 auto auto; width: 46%; height: 27vw; border: 2px solid rgba(255, 255, 255, .7); border-top: 0; border-right: 0; border-radius: 0 0 0 1.2vw; overflow: hidden; z-index: 1; }
  .hero__side-img img { object-position: center 12%; }
  .hero__logo { top: 2vw; left: .6vw; width: 40vw; height: 19vw; z-index: 3; }
  .hero__copy { position: static; padding: 28.6vw 3vw 14vw; }
  .hero .hero__top { display: block; margin-bottom: .6vw; }
  .hero__brand { font-size: 2.5vw; margin: 0; }
  .hero .hero__top .icon-btn, .hero .hero__top .phone-pill { display: none; }
  .hero__social { display: flex; flex-direction: column; gap: 2.6vw; position: absolute; top: 3.2vw; left: 47.5vw; z-index: 3; }
  .hero__social .icon-btn { width: 4.6vw; height: 4.6vw; }
  .hero__social .icon-btn svg { width: 2.4vw; height: 2.4vw; }
  .hero__social .icon-btn[aria-label^="Call"] svg { width: 2.2vw; height: 2.2vw; }
  .hero__eyebrow { font-size: 2.2vw; margin-bottom: .4vw; }
  .hero h1 { font-size: 8.6vw; line-height: .95; margin-bottom: 2.4vw; text-wrap: balance; }
  .hero--long h1 { font-size: 7.4vw; }
  .hero__lead { font-size: 2.6vw; line-height: 1.1; margin-bottom: 2.6vw; }
  .hero__cta .btn { min-width: 47vw; min-height: 7vw; font-size: 3.6vw; }
  .hero__van, .hero__van--tablet { display: block; position: absolute; right: -2.5vw; bottom: -2vw; width: 51vw; height: auto; max-width: none; z-index: 2; }
}

/* ============================================================
   WHO WE ARE, desktop. Measured off the live site at 1262px wide
   (1rem = 14.76px there); every value below is live px / 14.76.
   ============================================================ */
@media (min-width: 1001px) {
  .who { grid-template-columns: minmax(0, 1fr) 48.1%; padding-right: 3.29%; min-height: 65.25rem; background: #1a1c1e; }
  .who.divider { border-top: 0; }
  .who__bg img { opacity: .25; filter: none; }
  .who__bg::after {
    background:
      linear-gradient(0deg, rgba(154, 154, 156, 0) 0%, #1a1c1e 92.6%) top / 100% 2.85rem no-repeat,
      linear-gradient(90deg, #000 1.75%, rgba(26, 28, 30, 0) 100%) left / 50% 100% no-repeat,
      linear-gradient(180deg, #1a1c1e 0%, rgba(26, 28, 30, 0) 100%) right / 50% 100% no-repeat;
  }
  .who__copy { padding: 1.28rem 0.34rem 2.81rem 2.98rem; }
  .who__copy h2 { font-size: 4.27rem; line-height: 1.2; letter-spacing: -.05em; margin: 0 0 0.94rem; }
  .who__copy > p { font-size: 1.8rem; line-height: 1.15; letter-spacing: normal; max-width: 38.2rem; margin: 0; }
  .who__copy > .btn { margin-top: 1.22rem; min-width: 26.55rem; min-height: 4.53rem; font-size: 2.14rem; font-weight: 400; border-radius: 0.74rem; border: 1px solid #f1f1f1; box-shadow: 0 2px 6px 1px rgba(0, 0, 0, .6); }
  .who__copy h3 { margin: 2.64rem 0 0.74rem; font-size: 2.94rem; line-height: 1.1; letter-spacing: -.02em; }
  .who .trust { gap: 0; margin: 0 0 1.01rem; }
  .who .trust li { font-size: 2.44rem; line-height: 1.47; font-weight: 500; letter-spacing: normal; }
  .who .trust li:nth-child(4) { font-size: 2.94rem; line-height: 1.5; }
  .who__copy > .trust + .btn { min-width: 26.44rem; min-height: 4.47rem; font-size: 2.17rem; }
  .who__art { min-height: 0; margin-bottom: 5.22rem; }
  .who__art .a1 { height: 23.43rem; border: 2px solid #ddd; z-index: 1; }
  .who__art .a2 { top: 0; bottom: 0; border: 2px solid #ddd; }
  .who__art .a1 img, .who__art .a2 img { object-position: 50% 50%; }
  .who__art .van { left: -7.11rem; top: 40.23rem; bottom: auto; width: 52.76rem; height: auto; }
  /* Template Who We Are (area/type pages): live at 1280 - photo column 634-1265 flush right, floor photo y150-876,
     George photo bottom-left radius 11, van 790 wide at x574 y577, About heading 48/700, body 30/1.15. */
  .who--tpl { grid-template-columns: minmax(0, 1fr) 49.88%; padding-right: 0; }
  .who--tpl .who__copy { padding-bottom: 1.48vw; }
  .who--tpl .who__art .a1 { border-radius: 0 0 0 .86vw; overflow: hidden; }
  .who--tpl .who__art .a2 { top: 11.72vw; bottom: -.16vw; }
  .who--tpl .who__art .van { left: -4.69vw; top: auto; bottom: calc(-6.1vw - 40px); width: 61.72vw; height: 35.08vw; }
  /* Top padding keeps the About heading clear of the van's tires: van overhang below the photo column
     (6.1vw + 40px - 2.66vw transparent inset) minus the column's 6.07vw bottom margin. */
  .who--tpl .who__about { padding: max(0px, calc(40px - 2.63vw)) 2.34vw 4.3vw 3.52vw; }
  .who--tpl .who__about h2 { font-size: 3.75vw; font-weight: 700; line-height: 1.2; letter-spacing: -.05em; margin-bottom: .78vw; }
  .who--tpl .who__about p { font-size: 2.344vw; line-height: 1.15; color: #f1f1f1; }
  .who--tpl .who__about p:last-child { margin-bottom: 0; }

  /* AREA / TYPE TILES section, measured the same way (live px / 14.76). */
  .band--tight { padding-bottom: 1.49rem; }
  /* Live at 1280: head starts 17 down, tiles 127 below it, 50px arrow 5/6 from the tile corner, head button 329 wide. */
  .band--tight:has(.section-head) { padding-top: 1.17vw; }
  .band--tight .section-head + .tiles { margin-top: -.39vw; }
  .band--tight .section-head .btn { min-width: 0; width: 25.7vw; }
  .band--tight .tile .go { width: 3.9vw; height: 3.9vw; right: .39vw; bottom: .47vw; border: 1.6px solid #9a9a9c; }
  .band--tight .wrap { padding: 0 2.7rem 0 2.24rem; }
  .band--tight .section-head { margin-bottom: 2.78rem; }
  .band--tight .section-head h2.sm { font-size: 2.47rem; line-height: 1.2; letter-spacing: -.04em; font-weight: 500; color: #f1f1f1; }
  .band--tight .section-head .kicker { font-size: 1.61rem; line-height: 1.1; letter-spacing: normal; margin-top: 1.35rem; padding-left: .34rem; color: #c4c4c4; }
  .band--tight .section-head .btn { min-width: 23.3rem; min-height: 4.4rem; font-size: 1.87rem; border-radius: .41rem; }
  .tiles { gap: 1.49rem; }
  .tiles > .tile { flex: 0 0 calc((100% - 3 * 1.49rem) / 4); aspect-ratio: 277 / 244; border-radius: 1.08rem; }
  .tile span { font-size: 2.05rem; }
  .tile { background: #000; }
  .tile img { opacity: .6; }
  .tile::after { display: none; }

  /* SECTION TRANSITIONS: the live site's own section backgrounds and
     fade layers (no hard borders between these sections). */
  .hero__bg { bottom: 0; }
  .hero:not(.hero--compact) .hero__grid { min-height: 53.45rem; }
  .hero__bg::after { background: linear-gradient(0deg, #23282d 5.26%, rgba(51, 51, 51, 0) 22.1%, rgba(26, 28, 30, 0) 55.56%, rgba(0, 0, 0, .5) 82.69%, #000 100%); }
  .hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 5.35rem; z-index: 1; pointer-events: none; background: linear-gradient(0deg, #23282d 5.26%, rgba(51, 51, 51, 0) 55.79%); }
  .hero__side-img { -webkit-mask-image: none; mask-image: none; }
  .hero + .band { margin-top: 0; padding-top: 0; background: linear-gradient(0deg, #171a1d 0%, #23282d 100%); }
  .hero + .band .section-head { position: relative; z-index: 3; margin-top: -1.7rem; }
  /* Services heading, subtitle and card text: live px / 14.76. */
  .section-head h2 { font-size: 4.05rem; letter-spacing: -.03em; line-height: 1; font-weight: 500; }
  .section-head p { font-size: 1.87rem; letter-spacing: -.02em; line-height: 1.2; color: #c4c4c4; }
  .card h3 { font-size: 2.14rem; letter-spacing: -.04em; }
  .card p { font-size: 1.27rem; line-height: 1.1; letter-spacing: -.03em; margin-bottom: .8rem; }
  .card { padding: 1.69rem 1.49rem 1rem 1.69rem; border-radius: 1.35rem; border: 1.6px solid #9a9a9c; box-shadow: 0 4px 6px 2px rgba(0, 0, 0, .6); background: linear-gradient(31deg, #9aa9ac 0%, #f1f1f1 34.74%, #c4c4c4 71.05%, #fff 100%); }
  .card__img { aspect-ratio: 323 / 242; }
  .cards { column-gap: 1.76rem; row-gap: 1.69rem; }
  .card .btn { min-height: 3.8rem; margin-top: auto; }
  .band + .band, .who + .band { border-top: 0; }
  .band--tight { background: linear-gradient(180deg, #171a1d 0%, #1a1c1e 100%); padding-top: .14rem; }
  .hero + .band { padding-bottom: 2.24rem; }
  .who__copy { padding-bottom: 1.8rem; }
  /* Live: a 42px fade sits OVER the top of the photos, so the section
     above melts into George's photo instead of meeting a hard edge. */
  .who::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2.85rem; z-index: 3; pointer-events: none; background: linear-gradient(180deg, #1a1c1e 7.4%, rgba(26, 28, 30, 0) 100%); }
  .who__art .a1 { border-top: 0; }
  /* Trust lines, live styles: Oswald Medium italic, #f1f1f1, 5px blue or
     red glow, text glyph icons. Sizes are live px / 14.76. */
  .who__copy h3 { font-weight: 600; text-shadow: 1.8px 1.8px 1.7px #171a1d; }
  .who .trust li, .who .trust li:nth-child(n) { display: block; color: #f1f1f1; font-weight: 500; font-style: italic; font-size: 2.44rem; line-height: 1.48; letter-spacing: normal; text-shadow: 0 0 5px #2da8ff; }
  .who .trust li a { text-decoration: underline; text-decoration-thickness: auto; text-underline-offset: auto; }
  .who .trust li.trust--shield, .who .trust li.trust--check { text-shadow: 0 0 5px #e10600; }
  .who .trust li.trust--clock { font-size: 2.55rem; }
  .who .trust li.trust--check { font-size: 2.95rem; }
  /* WHO WE ARE scaling, live 1280 vs 1920: text, buttons, van width/left scale with the viewport (1.5x);
     George photo stays 345px; van top = 22vw + 318px; section = 57.5vw + 239px; floor photo fills the rest.
     Values below are the old rem values converted 1:1 at 1280 (rem 14.89 -> vw), so 1280 is unchanged. */
  .who:not(.who--tpl) { min-height: calc(57.5vw + 239px); }
  .who::before { height: 3.32vw; }
  .who__copy { padding: 1.49vw .4vw 2.09vw 3.47vw; }
  .who__copy h2 { font-size: 4.967vw; margin: 0 0 1.09vw; }
  .who__copy > p { font-size: 2.094vw; max-width: 44.44vw; }
  .who__copy > .btn { margin-top: 1.42vw; min-width: 30.89vw; min-height: 5.27vw; font-size: 2.49vw; border-radius: .86vw; }
  .who__copy h3 { margin: 3.07vw 0 .86vw; font-size: 3.42vw; }
  .who .trust { margin: 0 0 1.17vw; }
  /* Live: first two trust lines and the See Reviews button are fixed px; the last two lines scale. */
  .who .trust li, .who .trust li:nth-child(n) { font-size: 36px; line-height: 1.5; }
  .who .trust li.trust--clock { font-size: 2.97vw; }
  .who .trust li.trust--check, .who .trust li:nth-child(4) { font-size: 3.43vw; }
  .who__copy > .trust + .btn { margin-top: 0; min-width: 30.86vw; min-height: 67px; font-size: 32px; }
  .who__art { margin-bottom: 6.07vw; }
  .who__art .a1 { height: 347px; }
  /* Van is anchored to the BOTTOM of the photo column (which grows with the text), never a fixed top,
     so it can't ride up over the photo or the copy at narrow desktop widths. Live: van box bottom sits
     6.1vw + 74px below the column (152 @1280, 191 @1920). */
  .who__art .van { left: -8.28vw; top: auto; bottom: calc(-6.1vw - 74px); width: 61.72vw; height: 35.08vw; object-fit: contain; }
  /* Service pages (general + city): live's van sits ~42px higher at 1280, clear of the FAQ panel. */
  .who--service .who__art .van { bottom: calc(-6.1vw - 32px); }
  .trust__ico { font-style: normal; }
  /* GET IN TOUCH card (types section), measured off the live site. */
  .band--types .wrap { padding-right: 3.6rem; }
  .types-form .form-card { max-width: none; width: 100%; border: 1.6px solid #9aa9ac; border-radius: 1.32rem; background: linear-gradient(11deg, #4c0201 0%, #035691 100%); box-shadow: 0 3px 5px 5px rgba(0, 0, 0, .6); }
  .types-form .form-card__head { min-height: 10rem; }
  .types-form .form-card__head h2 { font-size: 4.33rem; font-weight: 600; }
  .types-form .form-card__head p { margin-top: .15rem; font-size: 1.49rem; font-weight: 500; letter-spacing: normal; color: #c4c4c4; }
  .types-form .form { padding: 1.45rem 3.5rem 2rem 2.8rem; gap: 1.35rem; }
  .types-form .form label, .types-form .form legend, .form-band .form label, .form-band .form legend { font-size: 16px; font-weight: 400; }
  .types-form .form input:not([type=radio]), .types-form .form textarea, .form-band .form input:not([type=radio]), .form-band .form textarea { height: 36px; border-radius: 6px; font-size: 16px; font-weight: 400; }
  .types-form .form textarea, .form-band .form textarea { height: 74px; min-height: 74px; }
  .types-form .form input::placeholder, .types-form .form textarea::placeholder, .form-band .form input::placeholder, .form-band .form textarea::placeholder { color: #1a1c1e; opacity: 1; }
  .types-form .form__row, .form-band .form__row { align-items: start; grid-template-columns: minmax(0, 1fr) minmax(0, 293px); margin-top: 2.2rem; }
  .types-form .form .radios, .form-band .form .radios { gap: .8rem 3.4rem; flex-wrap: wrap; }
  .types-form .form .radios label, .form-band .form .radios label { font-size: 16px; font-weight: 400; }
  /* Get Started band: live card 692 wide, header strip 150 tall, title 80.3px / 700, subtitle Barlow 28.1px / 500 (all at 1280, scaled). */
  .form-band:not(.form-band--intro) .form-card { max-width: 54.06vw; }
  .form-band:not(.form-band--intro) .form { padding-top: 10px; }
  .form-band .form__status { margin-top: -1.25rem; min-height: 0; }
  .form-band:not(.form-band--intro) .form-card__head { min-height: 11.72vw; padding: 1.8vw 1rem .4vw; }
  .form-band:not(.form-band--intro) .form-card__head h2 { font-size: 6.27vw; font-weight: 700; line-height: 1; }
  .form-band:not(.form-band--intro) .form-card__head p { margin: 0; font-size: 2.196vw; font-weight: 500; line-height: 1.3; letter-spacing: -.04em; color: #c4c4c4; }
  .types-form .form .btn--outline, .form-band .form .btn--outline { margin-top: 28px; width: 100%; min-height: 56px; font-size: 24px; font-weight: 400; border: 2.4px solid rgba(241, 241, 241, .75); border-radius: 100px; }
  .trust--check .trust__ico { color: #fff; }
  .who + .band--types { border-top: 0; margin-top: .5rem; position: relative; background: linear-gradient(180deg, #171a1d 0%, #23282d 100%); }
  .who + .band--types::before { content: ""; position: absolute; left: 0; right: 0; top: -.5rem; height: .47rem; background: linear-gradient(0deg, #aaa 0%, #fff 100%); }
  .faq.divider { border-top: 0; position: relative; background: linear-gradient(180deg, #1a1c1e 0%, #171a1d 100%); }
  /* FAQ, live values: question bars 11deg gradient, 56px tall, thin
     #f1f1f1 rule; button Barlow bold. The top rule sits BEHIND the title. */
  .faq summary, .faq--sentence summary { min-height: 3.8rem; font-size: 2.17rem; font-weight: 500; letter-spacing: -.012em; background: linear-gradient(11deg, #4c0201 0%, #035691 100%); }
  .faq details { border-bottom: .8px solid #f1f1f1; }
  .faq summary svg { width: 1.36rem; height: 1.36rem; }
  .faq__gallery .btn { width: 26.6rem; min-height: 4.55rem; font-family: var(--label); font-weight: 700; font-size: 2rem; border-radius: .75rem; border: .8px double #f1f1f1; background: linear-gradient(11deg, #4c0201 0%, #035691 100%); }
  /* SERVICE AREAS LIST: panel overlaps the hero 27px more, sits at the
     live x; marquee photos get a real width so they load. */
  .sa-list { grid-template-columns: 30.7% minmax(0, 1fr); }
  .sa-list__panel { margin-top: -4.35rem; }
  .sa-list__track picture { width: 28rem; flex: 0 0 28rem; height: 100%; }
  .sa-list__track img { width: 100%; height: 100%; }
  .sa-state summary { background: linear-gradient(11deg, #4c0201 0%, #035691 100%); border-bottom: .8px solid #f1f1f1; }
  .sa-state__body a { min-height: 4.15rem; font-size: 2.3rem; font-weight: 500; }
  /* Live: section height follows the list (closed = short, open = tall). */
  .sa-list { min-height: 0; }
  .sa-list__media { min-height: 0; }
  /* Corners, live: panel 11px top-left with a 1.6px #f1f1f1 frame and
     silver fill; the list inset 8px inside it; every state bar rounded
     11px top-left; marquee photos 3px with a thin light border. */
  .sa-list__panel { border: 1.6px solid #f1f1f1; border-right: 0; border-radius: .75rem 0 0 0; overflow: hidden; background: linear-gradient(31deg, #9aa9ac 0%, #f1f1f1 34.74%, #c4c4c4 71.05%, #fff 100%); }
  .sa-list__title { background: none; }
  .sa-state { margin-left: .54rem; border-top: 0; background: linear-gradient(180deg, #1a1c1e 0%, #171a1d 100%); }
  .sa-state summary { border-radius: 0; }
  /* Inner list frame, live: 1.6px #171a1d outline, 9.3px top-left corner. */
  .sa-state { border-left: 1.6px solid #171a1d; }
  .sa-state:first-of-type { border-top: 1.6px solid #171a1d; border-radius: .63rem 0 0 0; overflow: hidden; }
  .sa-state:first-of-type summary { border-radius: .55rem 0 0 0; }
  .sa-state summary { padding: 0 2.71rem; font-size: 2.17rem; letter-spacing: -.012em; min-height: 4.47rem; }
  .sa-state summary svg { width: 2.03rem; height: 1.28rem; }
  .faq summary svg { width: 1.36rem; height: .86rem; }
  .sa-list__track picture { border: .8px solid #f1f1f1; border-radius: 3px; overflow: hidden; }
  .sa-list__track img { border-right: 0; }
  .sa-list__cta { border-radius: .75rem; border: .8px double #f1f1f1; background: linear-gradient(11deg, #4c0201 0%, #035691 100%); }
  .sa-state__body--soon { height: auto; padding: 1.4rem 1.9rem; }
  .sa-state__body--soon p { margin: 0; font-size: 1.8rem; color: #f1f1f1; }
  .sa-state__body--soon a { display: inline; min-height: 0; border: 0; padding: 0; font-size: inherit; text-decoration: underline; }
  /* FOOTER (Contact Information), live px / 14.76 at 1267px. */
  .contact-info__title { font-size: 3.67rem; }
  .cg-name { font-size: 3.63rem; letter-spacing: -.02em; }
  .cg-line { font-size: 2.4rem; line-height: 1.2; color: #c4c4c4; }
  .cg-addr { font-size: 2.4rem; line-height: 1.2; letter-spacing: -.02em; color: #c4c4c4; }
  .cg-cell { min-height: 6.85rem; padding: .6rem 1.7rem; }
  .cg-icons { grid-template-rows: repeat(3, 6.85rem) 1fr; }
  .cg-icons > a > svg { width: 3.6rem; height: 3.6rem; }
  .cg-bottom { min-height: 7.6rem; }
  .cg-bottom picture, .cg-bottom img { height: 7.6rem; width: 14rem; }
  .cg-bottom a > svg { width: 4.2rem; height: 3.05rem; }
  .cg-bottom a { font-size: .8rem; }
  .newsletter > p { font-size: 1.63rem; line-height: 1.5; }
  .newsletter .form label { font-size: 18px; font-weight: 400; }
  .newsletter input[type="text"], .newsletter input[type="email"] { height: 40px; }
  /* CONTACT INFORMATION, live at 1280 (scaled). Title bar 87 tall. Grid rows 110 / 107 / 104 / 112 (= 433),
     columns 605 / 94 / 566, every cell edged 1.6px #9a9a9c incl. the left page edge. Newsletter: 50% black over
     the photo at 15% opacity, content x722-1240, intro 24/1.5 two lines, 45px fields (label->field 30, blocks 24 apart),
     Submit 157x49 solid #e10600 pill. */
  .contact-info { border-top: 1.6px solid #f1f1f1; background: linear-gradient(0deg, #000 0%, #171a1d 74.9%); }
  .contact-info__title { min-height: 6.67vw; font-weight: 700; border-bottom: 1.6px solid #9a9a9c; background: linear-gradient(0deg, #1a1c1e 0%, #1a1c1e 20.2%, #23282d 100%); }
  .contact-grid { grid-template-columns: 47.27vw 7.34vw minmax(0, 1fr); }
  .contact-grid > div { border-right: 1.6px solid #9a9a9c; }
  .contact-grid > div:first-child { border-left: 1.6px solid #9a9a9c; }
  .cg-cell { min-height: 0; border-bottom: 1.6px solid #9a9a9c; }
  .contact-grid > div:first-child > .cg-cell:nth-child(1) { height: 8.59vw; }
  .contact-grid > div:first-child > .cg-cell:nth-child(2) { height: 8.36vw; }
  .contact-grid > div:first-child > .cg-cell:nth-child(3) { height: 8.13vw; }
  .cg-bottom { min-height: 0; height: 8.75vw; }
  .cg-bottom a { border-right: 1.6px solid #9a9a9c; }
  .cg-bottom a:first-child { padding: 0 .4rem 0 2.2vw; }
  .cg-bottom picture, .cg-bottom img { height: 8.75vw; width: 16.25vw; }
  .cg-icons { grid-template-rows: 8.59vw 8.36vw 8.13vw 8.75vw; }
  .cg-icons > a { border-bottom: 1.6px solid #9a9a9c; }
  .cg-name { font-weight: 700; }
  .newsletter { padding: 1.56vw 1.875vw 0 1.75vw; background: rgba(0, 0, 0, .5); }
  .newsletter__bg img { opacity: .15; filter: none; }
  .newsletter > p { font-size: 1.875vw; line-height: 1.5; margin: 0 0 1.875vw; }
  .newsletter .form { gap: 1.875vw; }
  .newsletter .form label { font-size: 1.406vw; gap: .625vw; }
  .newsletter input[type="text"], .newsletter input[type="email"] { height: 3.52vw; border: 2.4px solid rgba(45, 168, 255, .75); background: rgba(255, 255, 255, .9); border-radius: 6px; }
  .newsletter .check { font-size: 1.25vw; }
  .newsletter .check input { appearance: none; width: 1.1vw; height: 1.1vw; border: 1.6px solid #2da8ff; border-radius: 2px; background: transparent; box-shadow: none; cursor: pointer; }
  .newsletter .check input:checked { background: #2da8ff; box-shadow: inset 0 0 0 2px #171a1d; }
  .newsletter .btn--red { min-width: 0; width: 12.27vw; min-height: 3.83vw; font-size: 1.5625vw; font-weight: 400; background: #e10600; border-radius: 100px; }
  .faq.divider::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: .34rem; z-index: 0; background: linear-gradient(0deg, #171a1d 0%, #9a9a9c 100%); }
}

/* ============================================================
   ACCORDION STYLE, every accordion at every width: homepage FAQ, the
   FAQ section on county / city / service / property pages, the /faqs
   page, and the service-areas state list. Visual only; sizes stay with
   each breakpoint.
   ============================================================ */
.faq summary, .faq--sentence summary, .faq--page summary, .sa-state summary {
  background: linear-gradient(11deg, #4c0201 0%, #035691 100%);
  color: #f1f1f1;
  border-bottom: 0;
}
.faq details, .sa-state { border-bottom: .8px solid #f1f1f1; }
.faq details > div { background: #1d2022; border-top: 1px solid #b4b7ba; }
.faq summary svg, .sa-state summary svg { width: 1.36rem; height: .86rem; flex: 0 0 auto; transition: transform .2s ease; }
.sa-state summary svg { width: 2.03rem; height: 1.28rem; }
.faq details[open] summary svg, .sa-state[open] summary svg { transform: rotate(180deg); }
/* Same frame as the Service Areas List: silver panel with an 11px
   top-left corner and a #f1f1f1 edge, the bars inset inside a dark
   1.6px outline with a 9px top-left corner. */
.faq__body { border: 1.6px solid #f1f1f1; border-right: 0; border-bottom: 0; border-radius: .75rem 0 0 0; overflow: hidden; background: linear-gradient(31deg, #9aa9ac 0%, #f1f1f1 34.74%, #c4c4c4 71.05%, #fff 100%); }
.faq__title { background: none; border-radius: 0; }
.faq__list, .faq--page .faq__list { margin-left: .54rem; padding-left: 0; background: #171a1d; border: 0; border-left: 1.6px solid #171a1d; border-top: 1.6px solid #171a1d; border-radius: .63rem 0 0 0; overflow: hidden; }
.faq details:first-child summary { border-radius: .55rem 0 0 0; }
.faq--page { border: 1.6px solid #f1f1f1; border-right: 0; border-radius: .75rem 0 0 0; overflow: hidden; background: linear-gradient(31deg, #9aa9ac 0%, #f1f1f1 34.74%, #c4c4c4 71.05%, #fff 100%); padding-top: .54rem; }
/* SERVICE AREAS, live at 1280 (scaled): heading 54 at top 21, intro 24/1.2, panel 830x450 radius 11 with a
   1.6px #f1f1f1 edge, state 40px inset 20, city 28.1/1.4, 28px pin, Find Your City 377x64 radius 6. */
@media (min-width: 1001px) {
  .areas__body { padding-top: .55vw; }
  .areas__body h2 { font-size: 4.22vw; line-height: 1; }
  .areas__body h2 svg { width: 4.22vw; height: 4.22vw; }
  .areas__body > p { margin: .78vw 0 .7vw .23vw; font-size: 1.875vw; line-height: 1.2; }
  .area-box { width: 64.84vw; height: 35.16vw; border-radius: .86vw; border: 1.6px solid #f1f1f1; padding: 1.56vw 0 1vw 1.17vw; }
  .area-box h3 { font-size: 3.125vw; line-height: 1; margin-top: 0; }
  .area-box li a { font-size: 2.196vw; line-height: 1.4; }
  /* Live pin at 1280: 45px circle, 28px icon, 1.6px #f1f1f1 edge, 31deg #e10600 / #035691 73% / #2da8ff. */
  .area-box .pin { width: 3.52vw; height: 3.52vw; margin-right: 1vw; border: 1.6px solid #f1f1f1; background: linear-gradient(31deg, #e10600 0%, #035691 73.33%, #2da8ff 100%); box-shadow: 1px 2px 8px 1px rgba(0, 0, 0, .07); }
  .area-box .pin svg { width: 2.19vw; height: 2.19vw; }
  .areas__body > .btn { margin-top: .78vw; min-width: 0; width: 29.45vw; min-height: 5vw; border-radius: 6px; }
}
/* Every form: its column can never grow past its card (a fixed-width row inside used to push the
   whole form wider than a narrow card, e.g. Speak With The Owner at 1100px). */
.form { grid-template-columns: minmax(0, 1fr); }
.form__row > * { min-width: 0; }
/* REVIEWS, live at 1280 (scaled): title 71.65/500 ls -.05em; cards 622 wide at x618, radius 20, 1.6px light edge,
   dark vertical gradient, quote 26/1.15, name 40/700, stars 267x45, Google mark 60, gap 138, See More 360x59. */
@media (min-width: 1001px) {
  .reviews__grid { grid-template-columns: minmax(0, 1fr) 48.59vw; padding-right: 1.95vw; }
  .reviews__title { font-size: 5.6vw; font-weight: 500; line-height: 1; letter-spacing: -.05em; }
  .reviews__list { gap: 10.78vw; }
  .review { border-radius: 1.5625vw; border: 1.6px solid rgba(241, 241, 241, .75); background: linear-gradient(0deg, #1a1c1e 0%, #23282d 100%); box-shadow: 0 6px 10px 1px rgba(0, 0, 0, .6); padding: .8vw 1.48vw 1vw 1.33vw; }
  .review blockquote { font-size: 2.03vw; font-weight: 400; line-height: 1.15; }
  .review cite { font-size: 3.125vw; font-weight: 700; line-height: 1.2; }
  .review .stars { display: inline-flex; gap: .7vw; }
  .review .stars svg { width: 3.52vw; height: 3.52vw; }
  .review .src { width: 4.69vw; height: 4.69vw; }
  .reviews__more .btn { min-width: 0; width: 28.13vw; min-height: 4.61vw; font-size: 2.19vw; font-weight: 400; }
}
/* FAQ section rows, live at 1280 (scaled): title 48/700 inset 26, question 28px lh 1.25 inset 40,
   single-line row 59 tall, chevron centered at 1206, rows split by .8px / 1.6px light rules. */
@media (min-width: 1001px) {
  .faq:not(.faq--page) { grid-template-columns: 38.02% minmax(0, 1fr); }
  .faq:not(.faq--page) .faq__gallery .btn { width: 30.08vw; bottom: 2.66vw; }
  .faq:not(.faq--page) .faq__title { font-size: 3.75vw; font-weight: 700; line-height: 1; padding-left: 2.03vw; }
  .faq:not(.faq--page) summary { min-height: 4.61vw; padding: .45vw 3.75vw .45vw 3.125vw; gap: 1.2vw; font-size: 2.1875vw; line-height: 1.25; letter-spacing: normal; }
  .faq:not(.faq--page) details { border-top: .8px solid rgba(241, 241, 241, .5); border-bottom: 1.6px solid rgba(241, 241, 241, .75); }
}
@media (max-width: 1000px) {
  .faq summary svg { width: 18px; height: 12px; }
  .sa-state summary svg { width: 24px; height: 15px; }
}

/* ============================================================
   VAN HEROES (service, property, county, city pages) + WHY CHOOSE US,
   live values from /service/epoxy-floor-installation (px / 14.76).
   ============================================================ */
@media (min-width: 1001px) {
  .hero.hero--van:not(.hero--compact) .hero__grid { min-height: 46rem; }
  .hero--van .hero__bg { width: 68.7%; }
  .hero--van .hero__bg img { opacity: .6; }
  .hero--van .hero__copy { padding-left: 1.7rem; }
  .hero.hero--van h1, .hero.hero--van.hero--xlong h1 { font-size: 4.29rem; font-weight: 500; line-height: 1; letter-spacing: -.01em; margin-bottom: .95rem; }
  .hero--van .hero__lead { font-size: 1.61rem; line-height: 1.1; letter-spacing: -.03em; }
  .hero--van .hero__van { width: 39.7rem; right: -2.17rem; bottom: 0; }
  /* County pages (live): the hero ends a fixed distance below Get Estimate, so the van and side photo end
     clear of "Some Of Our Services" instead of the heading sitting on the van. The 46rem floor is dropped
     here: it swallowed any extra padding, so the copy alone sets the height. */
  .page-county .hero.hero--van .hero__grid, .page-local-entity .hero.hero--van .hero__grid, .page-entity .hero.hero--van .hero__grid, .hero.hero--van:has(+ .band--textured) .hero__grid { min-height: 0; }
  .page-county .hero--van .hero__copy, .page-local-entity .hero--van .hero__copy, .page-entity .hero--van .hero__copy, .hero--van:has(+ .band--textured) .hero__copy { padding-bottom: 12rem; }
  /* The side photo stops at the middle of the van's wheels (the van is 39.7rem wide, its wheel centers sit
     ~4.3rem above its bottom), so the van always overlaps it and no road shows between photo and van. */
  .page-county .hero--van .hero__side-img, .page-local-entity .hero--van .hero__side-img, .page-entity .hero--van .hero__side-img, .hero--van:has(+ .band--textured) .hero__side-img { bottom: 4.3rem; }
  /* Keep the section edge fixed; title and pro cards protrude above it. */
  .hero--van + .band--textured { margin-top: 0; padding-top: 0; position: relative; z-index: 3; overflow: visible; }
  .hero--van + .band--textured > .wrap.split { position: relative; top: -2.24rem; margin-bottom: -2.24rem; }
  .band--textured .prose h2 { font-size: 2.82rem; font-weight: 500; line-height: 1.1; margin-bottom: .2rem; }
  .band--textured .prose p { font-size: 1.61rem; line-height: 1.1; margin: 0; }
  /* Why Choose Us, live service page at 1280 (scaled): text col x25 551 wide, cards x596 653x248, 40 apart,
     starting 19 below the heading; photo 226 inset 2px; text panel butts the photo (x825, 424 wide), 2.4px #f1f1f1
     edge, white/#c4c4c4 31deg gradient; card title 30.8/1.1, card text 20/1. */
  .band--textured .wrap.split { padding: 0 1.25vw 0 1.95vw; grid-template-columns: 43.05vw minmax(0, 1fr); gap: 1.56vw; }
  .band--textured .prose h2 { font-size: 3.28vw; line-height: 1.1; margin-bottom: 1.09vw; }
  .band--textured .prose p { font-size: 1.875vw; line-height: 1.1; color: #c4c4c4; }
  .band--textured .pro-list { gap: 3.125vw; margin-top: 1.48vw; }
  .band--textured .pro { grid-template-columns: 17.81vw minmax(0, 1fr); min-height: 19.38vw; border: 0; border-radius: 1vw; overflow: hidden; background: linear-gradient(270deg, rgba(3, 86, 145, .5) 0%, rgba(255, 255, 255, 0) 100%, rgb(3, 86, 145) 95.1379%), #f1f1f1; box-shadow: 0 1.7px 5.1px .85px rgba(0, 0, 0, .6); }
  .band--textured .pro__img { margin: 2px 0 2px 2px; border-radius: 1vw 0 0 1vw; }
  .band--textured .pro__body { margin-left: 0; padding: .15vw 1vw .9vw .9vw; border: 2.4px solid #f1f1f1; border-radius: .73vw 1vw 1vw .73vw; background: linear-gradient(31deg, #fff 0%, #c4c4c4 8.07%, #fff 100%); box-shadow: 0 1.7px 5.1px 1.7px rgba(0, 0, 0, .6); }
  .band--textured .pro__body h3 { font-size: 2.406vw; font-weight: 500; line-height: 1.1; letter-spacing: -.02em; color: #1a1c1e; margin-bottom: 1.25vw; }
  .band--textured .pro__body p { font-size: 1.5625vw; line-height: 1; letter-spacing: -.03em; color: #1a1c1e; }
}

/* ============================================================
   /get-estimate, live values (px / 14.76 at 1267px).
   ============================================================ */
.estimate-hero { padding: 1.35rem var(--gutter) 3.5rem; min-height: 61.4rem; }
.estimate-hero .contact-hero__bg img { filter: none; }
.estimate-hero .form-intro { margin-bottom: 1.1rem; }
.estimate-hero .form-intro h1 { font-size: 3.67rem; font-weight: 600; line-height: 1.2; }
.estimate-hero .form-intro p { font-size: 2.17rem; font-weight: 400; text-transform: uppercase; color: #c4c4c4; margin-top: 0; }
/* Heading + subtitle live INSIDE the card, in the band where the header photo used to be (no photo).
   No rule and no band fill: the title sits on the card's own gradient and flows straight into the fields. */
.estimate-hero { padding-top: 3rem; }
.estimate-hero .form-card__head--text { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 9.62rem; padding: 1.4rem 1.5rem .4rem; background: none; border-bottom: 0; isolation: auto; }
.estimate-hero .form-card__head--text h1 { font-size: 3.67rem; font-weight: 600; line-height: 1.05; letter-spacing: -.01em; text-shadow: 0 3.4px 1px #1a1c1e; }
.estimate-hero .form-card__head--text p { position: static; margin: .55rem 0 0; font-family: var(--display); font-size: 1.75rem; font-weight: 400; line-height: 1.1; letter-spacing: .01em; text-transform: uppercase; color: #c4c4c4; text-shadow: 0 2px 4px #171a1d; }
.estimate-hero .contact-hero__bg::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(23, 26, 29, .35) 0%, rgba(23, 26, 29, .1) 40%, #171a1d 100%); }
@media (max-width: 750px) {
  .estimate-hero { padding-top: 24px; }
  .estimate-hero .form-card__head--text { min-height: 0; padding: 22px 16px 18px; }
  .estimate-hero .form-card__head--text h1 { font-size: 34px; }
  .estimate-hero .form-card__head--text p { font-size: 17px; }
}
.estimate-hero .form-card { max-width: 44.85rem; border: 1.6px solid #9aa9ac; border-radius: 1.32rem; background: linear-gradient(12deg, #4c0201 0%, #035691 100%); box-shadow: 0 3px 5px 5px rgba(0, 0, 0, .6); }
.estimate-hero .form-card__photo { aspect-ratio: auto; height: 9.62rem; background: #000; }
.estimate-hero .form-card__photo img { opacity: .5; }
.estimate-hero .form { padding: 1.45rem 3.3rem .6rem; gap: 1.1rem; }
.estimate-hero .form label, .estimate-hero .form legend { font-size: 16px; font-weight: 400; }
.estimate-hero .form input:not([type=radio]), .estimate-hero .form textarea { height: 36px; border-radius: 6px; font-size: 16px; font-weight: 400; }
.estimate-hero .form textarea { height: 74px; min-height: 74px; }
.estimate-hero .form input::placeholder, .estimate-hero .form textarea::placeholder { color: #1a1c1e; opacity: 1; }
.estimate-hero .form__row { align-items: start; grid-template-columns: 1fr 293px; margin-top: 1rem; }
.estimate-hero .form .radios { gap: 3.4rem; }
.estimate-hero .form .radios label { font-size: 16px; font-weight: 400; }
.estimate-hero .form .btn--outline { margin-top: 28px; width: 100%; max-width: 293px; justify-self: end; min-height: 56px; font-size: 24px; font-weight: 400; border: 2.4px solid rgba(241, 241, 241, .75); border-radius: 100px; }
@media (max-width: 750px) {
  .estimate-hero { min-height: 0; }
  .estimate-hero .form-intro h1 { font-size: 36px; }
  .estimate-hero .form-intro p { font-size: 20px; }
  .estimate-hero .form { padding: 14px 18px 22px; }
  .estimate-hero .form__row { grid-template-columns: 1fr; }
  .estimate-hero .form .btn--outline { max-width: none; margin-top: 0; }
}

/* Live Wix arrow-button icon: tilted -40deg at rest, straightens on hover (.3s ease-in-out).
   "View Service" buttons are drawn straight on live. */
.ico-go { transform: rotate(-40deg); transition: transform .3s ease-in-out; }
a:hover .ico-go, button:hover .ico-go, a:focus-visible .ico-go, .tile:hover .ico-go { transform: rotate(0deg); }
.pro__body .btn .ico-go { transform: none; }
@media (prefers-reduced-motion: reduce) { .ico-go { transition: none; } }
/* Live Who We Are title and "Why ... Choose Us" are Wix oswald-medium at 700 = Oswald Bold. */
@media (min-width: 1001px) {
  .who__copy h2, .who__copy h3 { font-weight: 700; }
  /* Live icon sizes at 1280: More About Us / Meet The Team 36px, View Solutions 30px. */
  .who__copy > p + .btn svg.ico-go { width: 2.81vw; height: 2.81vw; }
  .tab-btn svg.ico-go { width: 2.34vw; height: 2.34vw; }
  /* Live Who We Are buttons: 2-stop 12deg red -> blue (no light-blue third stop). */
  .who__copy .btn { background: linear-gradient(12deg, #e10600 0%, #035691 100%); }
}

/* PROPERTY TYPES + GET IN TOUCH (desktop). Live scales this section with the viewport (1280 vs 1001:
   heading 42.1 -> 32.9, card 697 -> 544); only the form fields/labels/inner padding and the tab-button
   label stay fixed px. Values = live px at 1280 / 12.8. */
@media (min-width: 1001px) {
  .band--types .wrap { padding: 0 2.97vw 0 3.125vw; }
  .types-form { grid-template-columns: 35.16vw minmax(0, 1fr); gap: 3.125vw; }
  .types-form > div > h2 { font-size: 3.29vw; line-height: 1; width: 41.5vw; margin-bottom: max(calc(85px - 4.6vw), calc(1.94vw - 4px), 24px); }
  /* Live heading-to-first-card gap: 39 @1001, 24 @1280, 25 @1500, 32 @1861. The old calc(85px - 4.6vw)
     alone hit zero near 1850 and went negative past it, running the heading into the card. */
  /* Live card top below heading top: 92 @1001, 93 @1280, 106 @1500, 132 @1861. */
  .types-form .sticky { margin-top: max(92px, calc(6.71vw + 7px)); }
  .type-card h3 { font-size: 2.1875vw; line-height: 1; }
  .type-card p { font-size: 1.25vw; line-height: 1.1; }
  /* Live: photo is a fixed 218px tall at every desktop width, 12px above the card's outer bottom; the
     228x50 View Solutions button sits 1px in from the outer bottom-right corner (20px label at x 26). */
  .type-card { padding-bottom: 10px; }
  .type-card__img { aspect-ratio: auto; height: 218px; }
  .type-card .tab-btn { right: -1px; bottom: -1px; width: 228px; min-height: 50px; padding: 0 26px; justify-content: space-between; font-size: 20px; border-radius: 11px 0 11px 2px; }
  .types-form .form-card__head { min-height: 11.72vw; padding: 1.56vw 1rem .4vw; }
  .types-form .form-card__head h2 { font-size: 5.02vw; line-height: 1.15; }
  .types-form .form-card__head p { margin-top: .62vw; font-size: 1.726vw; }
  /* Live Submit narrows with the card (296 @1280, 223 @1001) so Residential/Commercial stay on one row;
     label-to-label pitch 156 @1280, 119 @1001. */
  .types-form .form__row { grid-template-columns: minmax(0, 1fr) calc(26.16vw - 39px); margin-top: 6px; }
  .types-form .form .radios { flex-wrap: nowrap; column-gap: calc(13.26vw - 115px); }
  .types-form .form .radios label { gap: 16px; }
  /* Live field pitch is a fixed 82px at every width; Message sits 6px lower again. */
  .types-form .form { row-gap: 19px; padding-bottom: 29px; }
  .types-form .form label:has(textarea) { margin-top: 6px; }
  .types-form .form__status:empty { display: none; }
  /* Live Submit and Message box run 13px past the other fields' right edge. */
  .types-form .form textarea { width: calc(100% + 13px); }
  .types-form .form .btn--outline { position: relative; left: 13px; }
}

/* ============================================================
   HERO H1 FONT - the live site sets every hero H1 in an uploaded
   Oswald Bold file (Wix ufont 7d39bc_f80aa005...) at weight 400,
   line-height 1, letter-spacing -.01em, hard 3px #171a1d shadow.
   Google Oswald 500/600 draws different glyphs, so load the same file.
   Last in the file so it wins over every hero variant rule.
   ============================================================ */
@font-face {
  font-family: "USA Oswald Bold";
  src: url("https://static.wixstatic.com/ufonts/7d39bc_f80aa00588a24f9e95f7c9379dbc75e6/woff2/file.woff2") format("woff2"),
       url("https://static.wixstatic.com/ufonts/7d39bc_f80aa00588a24f9e95f7c9379dbc75e6/woff/file.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
.hero .hero__copy > h1, .hero.hero--van.hero--xlong .hero__copy > h1 { font-family: "USA Oswald Bold", Oswald, "Arial Narrow", sans-serif; font-weight: 400; line-height: 1; letter-spacing: -.01em; text-shadow: 3.03px 3.03px 1.71px #171a1d; }

/* SECTION LINING after the Get Started band (e.g. Other Flooring Services on /service/*).
   Live: 2px #9aa9ac line, then a 10px fade #fff -> #aaa -> #171a1d into a #171a1d section;
   heading top 20px below the line. */
.form-band + .band { border-top: 2px solid #9aa9ac; border-image: none; background-color: #171a1d; }
.form-band + .band::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 10px; background: linear-gradient(180deg, #fff 0%, #aaa 22.1%, #171a1d 92.3%); pointer-events: none; }
/* Get Started band straight into Who We Are (service pages): the same lining, so the two sections don't
   run together. ::after because .who::before already draws its top fade; this sits above it and the photos. */
.form-band + .who { border-top: 2px solid #9aa9ac; border-image: none; }
.form-band + .who::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 10px; z-index: 4; background: linear-gradient(180deg, #fff 0%, #aaa 22.1%, rgba(23, 26, 29, 0) 92.3%); pointer-events: none; }
@media (min-width: 1001px) {
  .form-band + .band { padding-top: 18px; }
}
/* Area tiles after Other Flooring Services (service pages): no divider, the tiles run straight on from
   the service cards. Heading top 13px below the section's top edge. */
.band--lined { position: relative; border-top: 0; border-image: none; background-color: #171a1d; }
@media (min-width: 1001px) {
  .band--lined { padding-top: 13px; }
}

/* VAN HERO H1 + LEAD WIDTH (city hubs, service, property, county pages). Live at 1280: H1 and lead are
   727 wide (x33-760) and stop where the logo starts (x757), so a long H1 wraps instead of running
   under the logo. 727 / 1280 = 56.8vw; Wix scales it with the viewport. */
@media (min-width: 1001px) {
  .hero--van .hero__copy > h1, .hero--van .hero__lead { max-width: 56.8vw; }
}

/* SERVICE AREAS LIST accordion, live /service-areas at 1280 (px / 12.8 = vw). Title card 31deg
   #9aa9ac / #fff 36% / #c4c4c4 71% / #fff, title Oswald Medium 48 #1a1c1e inset 25. State bar 66 tall,
   label 32 inset 40. Open list 350 tall, scrolls; rows 396 wide in two columns 17 apart, inset 25 left /
   43 right; row 62 tall + 9 gap, county 34.2 Oswald Medium #f1f1f1 inset 8, 1.6px rgba(241,241,241,.5)
   rule; 42px circle 11deg #e10600 / #035691 73% / #2da8ff, .8px #f1f1f1 edge, 8px in from the row end. */
@media (min-width: 1001px) {
  .sa-list__panel { background: linear-gradient(31deg, #9aa9ac 0%, #fff 35.96%, #c4c4c4 71.05%, #fff 100%); }
  .sa-list__title { min-height: 5.7vw; padding: 0 1.95vw; font-size: 3.75vw; font-weight: 500; line-height: 1; color: #1a1c1e; }
  .sa-state summary { min-height: 5.16vw; padding: 0 3.125vw; font-size: 2.5vw; }
  .sa-state summary svg { width: 2.5vw; height: 1.55vw; }
  .sa-state__body { height: 27.34vw; padding: 0 3.36vw 0 1.95vw; }
  .sa-state__body ul { column-gap: 1.33vw; row-gap: .7vw; }
  .sa-state__body a { min-height: 4.84vw; padding: 0 .63vw; font-size: 2.67vw; font-weight: 500; line-height: 1.4; color: #f1f1f1; border-bottom: 1.6px solid rgba(241, 241, 241, .5); }
  .sa-state__body .go { width: 3.28vw; height: 3.28vw; background: linear-gradient(11deg, #e10600 0%, #035691 73.33%, #2da8ff 100%); border: .8px solid #f1f1f1; box-shadow: 1px 2px 8px 1px rgba(0, 0, 0, .07); }
  .sa-state__body .go svg { width: 1.4vw; height: 1.4vw; }
}
/* EVERY ACCORDION BAR (FAQ sections, /faqs, Service Areas List), every width: a shadow cast down onto
   the content below, and a light rule along the bar's bottom edge when it is open. A closed bar already
   gets its rule from the row border under it, so the bar only draws its own while open (no doubled line).
   The bar sits above the content so the shadow paints over it. */
.faq summary, .sa-state summary { position: relative; z-index: 1; box-shadow: 0 4px 8px 1px rgba(0, 0, 0, .6); }
.faq details[open] > summary, .sa-state[open] > summary { border-bottom: 1.6px solid #f1f1f1; }
.faq details > div { border-top: 0; }
/* No click / hover color change inside any accordion: rows keep their color, and phones draw no tap flash. */
.faq summary, .sa-state summary, .sa-state__body a { -webkit-tap-highlight-color: transparent; }
.sa-state__body a, .sa-state__body a:hover, .sa-state__body a:active, .sa-state__body a:focus { color: #f1f1f1; }

/* ============================================================
   PROJECT SHOWCASE (/project/{n}). Live's showcase layout, rebuilt
   in the site's own brand: dark #171a1d, the silver card gradient,
   the red-to-blue buttons, Oswald throughout. The one loud element
   is the project number in brushed silver over the finished floor.
   ============================================================ */
.ps {
  --ps-bg: #171a1d; --ps-panel: #1d2024; --ps-edge: #9a9a9c; --ps-hair: rgba(241, 241, 241, .14);
  --ps-text: #f1f1f1; --ps-muted: #c4c4c4;
  --ps-silver: linear-gradient(31deg, #9aa9ac 0%, #fff 35.96%, #c4c4c4 71.05%, #fff 100%);
  --ps-brand: linear-gradient(11deg, #e10600 0%, #035691 73.33%, #2da8ff 100%);
  --ps-deep: linear-gradient(11deg, #4c0201 0%, #035691 100%);
  --ps-gutter: clamp(16px, 3.6vw, 56px);
  position: relative; display: block; background: var(--ps-bg); color: var(--ps-text); overflow: clip;
}
.ps h1, .ps h2, .ps h3, .ps p { margin: 0; }
.ps img { display: block; max-width: 100%; }
.ps-wrap { width: min(1440px, 100%); margin: 0 auto; padding: 0 var(--ps-gutter); }

/* hero: finished floor full-bleed, copy anchored bottom-left */
.ps-hero { position: relative; isolation: isolate; display: flex; align-items: flex-end; min-height: clamp(560px, 52vw, 880px); padding: 0 var(--ps-gutter) clamp(36px, 5vw, 72px); }
.ps-hero__media { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.ps-hero__media img { width: 100%; height: 100%; object-fit: cover; animation: psSettle 1.4s cubic-bezier(.2, .7, .2, 1) both; }
.ps-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(23, 26, 29, .94) 0%, rgba(23, 26, 29, .7) 38%, rgba(23, 26, 29, .12) 72%, rgba(23, 26, 29, 0) 100%),
    linear-gradient(0deg, #171a1d 0%, rgba(23, 26, 29, 0) 34%),
    linear-gradient(180deg, rgba(0, 0, 0, .5) 0%, rgba(0, 0, 0, 0) 22%); }
.ps-hero__body { position: relative; max-width: min(780px, 64vw); }
.ps-crumbs { display: flex; align-items: center; gap: .6em; margin-bottom: clamp(10px, 1.4vw, 20px); font-size: clamp(15px, 1.25vw, 19px); color: var(--ps-muted); }
.ps-crumbs a { color: var(--ps-text); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; }
.ps-hero__h1 { display: flex; flex-direction: column; line-height: 1; text-transform: uppercase; }
.ps-hero__pre { font-family: var(--display); font-weight: 500; font-size: clamp(22px, 2.6vw, 42px); letter-spacing: -.01em; color: var(--ps-text); text-shadow: 2px 2px 2px #171a1d; }
.ps-hero__num { margin: .04em 0 0 -.04em; font-family: "USA Oswald Bold", Oswald, sans-serif; font-weight: 400; font-size: clamp(150px, 21vw, 340px); line-height: .82; letter-spacing: -.03em;
  background: var(--ps-silver); -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .55)); animation: psRise .9s .1s cubic-bezier(.2, .7, .2, 1) both; }
.ps-hero__date { margin-top: 12px; font-size: clamp(17px, 1.4vw, 21px); color: var(--ps-muted); }
.ps-tags { list-style: none; margin: clamp(14px, 1.6vw, 24px) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.ps-tags a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 18px; border-radius: 999px; border: 1.6px solid rgba(241, 241, 241, .6); background: rgba(23, 26, 29, .55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: var(--ps-text); text-decoration: none; font-size: clamp(16px, 1.3vw, 20px); font-weight: 500; transition: background .2s ease, border-color .2s ease; }
.ps-tags a:hover { background: var(--ps-deep); border-color: #f1f1f1; }
.ps-hero__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: clamp(18px, 2.2vw, 32px); }
.ps-hero__cta .btn { min-height: clamp(52px, 4.4vw, 64px); padding: 0 1.3em; font-size: clamp(20px, 1.9vw, 28px); }
.ps-hero__cta .phone-pill { height: clamp(48px, 3.9vw, 58px); font-size: clamp(19px, 1.7vw, 26px); }
.ps-nav { position: absolute; right: var(--ps-gutter); bottom: clamp(36px, 5vw, 72px); display: flex; align-items: center; gap: 10px; }
.ps-nav__step { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: var(--ps-brand); border: 1.6px solid #f1f1f1; color: #fff; box-shadow: 0 4px 10px rgba(0, 0, 0, .5); transition: transform .2s ease; }
.ps-nav__step:hover { transform: scale(1.06); }
.ps-nav__step svg { width: 22px; height: 22px; }
.ps-nav__all { display: inline-flex; align-items: center; gap: 10px; height: 52px; padding: 0 20px; border-radius: 999px; border: 1.6px solid rgba(241, 241, 241, .6); background: rgba(23, 26, 29, .6); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff; text-decoration: none; font-size: 18px; font-weight: 500; text-transform: uppercase; }
.ps-nav__all:hover { border-color: #f1f1f1; }
.ps-nav__all svg { width: 16px; height: 16px; }

/* blocks + heads */
.ps-block { position: relative; padding: clamp(40px, 5.5vw, 88px) 0; }
.ps-block + .ps-block { border-top: 1.6px solid var(--ps-hair); }
.ps-block--related { background: linear-gradient(180deg, #1a1c1e 0%, #0e0f11 100%); }
.ps-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 18px 32px; margin-bottom: clamp(20px, 2.6vw, 36px); }
.ps-head h2 { font-family: var(--display); font-weight: 500; font-size: clamp(34px, 4.05vw, 64px); line-height: 1; letter-spacing: -.03em; text-transform: uppercase; text-shadow: 0 .2rem .5rem rgba(0, 0, 0, .6); }
.ps-head__aside { font-size: clamp(17px, 1.5vw, 22px); color: var(--ps-muted); }
.ps-head .btn { min-height: clamp(50px, 4.2vw, 60px); font-size: clamp(19px, 1.8vw, 26px); }
.ps-overview p { max-width: 62ch; font-size: clamp(19px, 1.75vw, 26px); line-height: 1.45; color: var(--ps-muted); }

/* before / after, in the site's card frame */
.ps-ba { --split: 50%; position: relative; aspect-ratio: 16 / 8.5; overflow: hidden; border-radius: clamp(14px, 1.35vw, 22px); border: 1.6px solid var(--ps-edge); background: #000; box-shadow: 0 4px 6px 2px rgba(0, 0, 0, .6); cursor: ew-resize; user-select: none; touch-action: none; }
.ps-ba img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
.ps-ba__after { z-index: 1; }
.ps-ba__before { z-index: 2; clip-path: polygon(0 0, var(--split) 0, var(--split) 100%, 0 100%); }
.ps-ba__line { position: absolute; z-index: 4; top: 0; bottom: 0; left: var(--split); width: 3px; transform: translateX(-50%); background: #f1f1f1; box-shadow: 0 0 12px rgba(45, 168, 255, .8); }
.ps-ba__handle { position: absolute; z-index: 5; top: 50%; left: var(--split); width: 58px; height: 58px; display: grid; place-items: center; transform: translate(-50%, -50%); border-radius: 50%; background: var(--ps-brand); border: 2px solid #f1f1f1; color: #fff; box-shadow: 0 6px 18px rgba(0, 0, 0, .6); transition: transform .15s ease; }
.ps-ba__handle svg { width: 24px; height: 24px; }
.ps-ba:active .ps-ba__handle { transform: translate(-50%, -50%) scale(1.1); }
.ps-ba__tag { position: absolute; z-index: 6; top: 18px; padding: 6px 16px; border-radius: 999px; border: 1.6px solid rgba(241, 241, 241, .6); background: rgba(23, 26, 29, .7); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff; font-family: var(--display); font-size: clamp(16px, 1.3vw, 20px); font-weight: 500; text-transform: uppercase; pointer-events: none; }
.ps-ba__tag--before { left: 18px; }
.ps-ba__tag--after { right: 18px; }

/* photo sets: segmented control + full-width masonry */
.ps-seg { display: inline-flex; gap: 4px; padding: 5px; border-radius: 999px; border: 1.6px solid rgba(241, 241, 241, .35); background: var(--ps-panel); }
.ps-seg__tab { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 20px; border: 0; border-radius: 999px; background: transparent; color: var(--ps-muted); font-family: var(--display); font-size: clamp(17px, 1.4vw, 21px); font-weight: 500; text-transform: uppercase; cursor: pointer; transition: color .2s ease, background .2s ease; }
.ps-seg__tab:hover { color: #fff; }
.ps-seg__tab.is-active { background: var(--ps-deep); color: #fff; box-shadow: inset 0 0 0 1px rgba(241, 241, 241, .55); }
.ps-seg__count { display: grid; place-items: center; min-width: 26px; height: 26px; padding: 0 7px; border-radius: 999px; background: rgba(241, 241, 241, .14); font-size: 14px; }
.ps-seg__tab.is-active .ps-seg__count { background: #f1f1f1; color: #171a1d; }
.ps-gallery { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(10px, 1vw, 16px); }
.ps-gallery[hidden] { display: none; }
.ps-tile { position: relative; grid-column: span 4; min-height: clamp(200px, 18vw, 320px); padding: 0; overflow: hidden; border: 1.6px solid var(--ps-edge); border-radius: clamp(12px, 1.1vw, 18px); background: #000; box-shadow: 0 4px 6px 2px rgba(0, 0, 0, .45); cursor: zoom-in; opacity: 0; animation: psTileIn .5s cubic-bezier(.16, 1, .3, 1) forwards; }
.ps-tile:nth-child(6n+1) { grid-column: span 8; min-height: clamp(280px, 30vw, 520px); }
.ps-tile:nth-child(6n+2) { grid-column: span 4; min-height: clamp(280px, 30vw, 520px); }
.ps-tile:nth-child(6n+6) { grid-column: span 12; min-height: clamp(240px, 26vw, 460px); }
/* no holes when a set ends mid-row */
.ps-tile:nth-child(6n+1):last-child, .ps-tile:nth-child(6n+3):last-child { grid-column: span 12; }
.ps-tile:nth-child(6n+3):nth-last-child(2), .ps-tile:nth-child(6n+4):last-child { grid-column: span 6; }
.ps-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
.ps-tile:hover img, .ps-tile:focus-visible img { transform: scale(1.04); }
.ps-tile__meta { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; background: linear-gradient(0deg, rgba(0, 0, 0, .72), rgba(0, 0, 0, 0)); color: #f1f1f1; font-family: var(--display); font-size: 17px; font-weight: 500; opacity: 0; transform: translateY(8px); transition: opacity .25s ease, transform .25s ease; }
.ps-tile:hover .ps-tile__meta, .ps-tile:focus-visible .ps-tile__meta { opacity: 1; transform: none; }
.ps-tile__zoom { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--ps-brand); border: 1.6px solid #f1f1f1; }
.ps-tile__zoom svg { width: 18px; height: 18px; }

/* phones: card deck + grid toggle */
.ps-decks { display: none; }
.ps-deck { margin-bottom: 40px; }
.ps-deck:last-child { margin-bottom: 0; }
.ps-deck__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.ps-deck__title { font-family: var(--display); font-size: 28px; font-weight: 500; text-transform: uppercase; }
.ps-deck__badge { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px; border-radius: 999px; border: 1.6px solid rgba(241, 241, 241, .6); background: var(--ps-deep); color: #fff; font-family: var(--display); font-size: 18px; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.ps-deck__badge svg { width: 16px; height: 16px; }
.ps-deck.is-grid .ps-deck__badge { background: #f1f1f1; color: #171a1d; }
.ps-deck__area { position: relative; width: min(76vw, 320px); aspect-ratio: 3 / 4; margin: 0 auto; touch-action: none; }
.ps-deck__card { position: absolute; inset: 0; overflow: hidden; border-radius: 18px; border: 1.6px solid #f1f1f1; box-shadow: 0 8px 28px rgba(0, 0, 0, .65); will-change: transform; touch-action: none; transform-origin: center center; cursor: grab; }
.ps-deck__card:active { cursor: grabbing; }
.ps-deck__card img { width: 100%; height: 100%; object-fit: cover; pointer-events: none; -webkit-user-drag: none; user-select: none; -webkit-user-select: none; }
.ps-deck.is-grid .ps-deck__area { width: 100%; aspect-ratio: auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; touch-action: auto; }
.ps-deck.is-grid .ps-deck__card { position: relative; inset: auto; aspect-ratio: 1 / 1; transform: none !important; opacity: 1 !important; z-index: 1 !important; border-color: var(--ps-edge); box-shadow: none; cursor: zoom-in; touch-action: auto; }
.ps-deck__pips { display: flex; justify-content: center; gap: 6px; margin-top: 18px; }
.ps-deck.is-grid .ps-deck__pips { display: none; }
.ps-deck__pip { width: 7px; height: 7px; border-radius: 50%; background: rgba(241, 241, 241, .25); transition: background .3s ease, transform .3s ease; }
.ps-deck__pip.is-on { background: #2da8ff; transform: scale(1.35); }

/* related: the site's own project cards */
.ps-related { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(14px, 1.4vw, 22px); }

/* lightbox */
.ps-lb { position: fixed; inset: 0; z-index: 999999; display: flex; align-items: center; justify-content: center; padding: 22px; background: rgba(10, 11, 12, .94); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); opacity: 0; visibility: hidden; touch-action: none; transition: opacity .25s ease, visibility .25s ease; }
.ps-lb.is-open { opacity: 1; visibility: visible; }
.ps-lb__img { max-width: 92vw; max-height: 84vh; object-fit: contain; border-radius: 12px; border: 1.6px solid var(--ps-edge); background: #000; box-shadow: 0 20px 60px rgba(0, 0, 0, .6); transition: transform .3s cubic-bezier(.25, 1, .5, 1), opacity .25s ease; user-select: none; -webkit-user-drag: none; }
.ps-lb__close, .ps-lb__nav { position: absolute; z-index: 2; display: grid; place-items: center; border-radius: 50%; background: var(--ps-brand); border: 1.6px solid #f1f1f1; color: #fff; cursor: pointer; box-shadow: 0 4px 10px rgba(0, 0, 0, .5); transition: transform .15s ease; }
.ps-lb__close { top: 20px; right: 20px; width: 52px; height: 52px; }
.ps-lb__close svg { width: 22px; height: 22px; }
.ps-lb__close:hover { transform: scale(1.06); }
.ps-lb__nav { top: 50%; width: 60px; height: 60px; transform: translateY(-50%); }
.ps-lb__nav svg { width: 26px; height: 26px; }
.ps-lb__nav:hover { transform: translateY(-50%) scale(1.06); }
.ps-lb__prev { left: 20px; }
.ps-lb__next { right: 20px; }
.ps-lb__count { position: absolute; left: 50%; bottom: 22px; transform: translateX(-50%); font-family: var(--display); font-size: 20px; font-weight: 500; color: var(--ps-muted); pointer-events: none; }

@keyframes psRise { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
@keyframes psSettle { from { transform: scale(1.06); } to { transform: scale(1); } }
@keyframes psTileIn { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }

@media (max-width: 1000px) {
  .ps-hero__body { max-width: 100%; }
  .ps-nav { top: 20px; bottom: auto; }
  .ps-related { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 750px) {
  .ps-hero { min-height: clamp(520px, 125vw, 720px); }
  .ps-hero__num { font-size: 34vw; }
  .ps-nav { top: 14px; right: 14px; }
  .ps-nav__all span { display: none; }
  .ps-nav__all { width: 46px; height: 46px; padding: 0; justify-content: center; }
  .ps-nav__step { width: 46px; height: 46px; }
  .ps-hero__cta .btn { width: 100%; }
  .ps-ba { aspect-ratio: 4 / 4.5; }
  .ps-ba__handle { width: 48px; height: 48px; }
  .ps-board { display: none; }
  .ps-decks { display: block; }
  .ps-related { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .ps-related::-webkit-scrollbar { display: none; }
  .ps-head .btn { width: 100%; }
  .ps-lb__nav { width: 46px; height: 46px; }
  .ps-lb__prev { left: 10px; }
  .ps-lb__next { right: 10px; }
  .ps-lb__img { max-width: 86vw; max-height: 80vh; }
}
@media (prefers-reduced-motion: reduce) {
  .ps-hero__media img, .ps-hero__num { animation: none; }
  .ps-tile { animation: none; opacity: 1; }
  .ps-tile img, .ps-tile__meta { transition: none; }
}

/* ============================================================
   PROPERTY TYPE CARDS ("Other Property Types We Work On", type pages).
   Live at 1280 (px / 12.8 = vw): card 588x307, silver 31deg gradient, 1.6px #9a9a9c edge, radius 20,
   shadow 0 4 6 2; photo 188x193 inset 11/8, .8px #171a1d edge, radius 13.6/13.6/9.4/9.4; title 29px
   Oswald 700 #171a1d; description 19.6px lh 1; 50px arrow circle 8px in from the bottom-right corner.
   Two per row, 13px apart, rows 22px apart; an odd last card centers.
   ============================================================ */
.type-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.72vw 1.02vw; }
.type-cards > .tcard:last-child:nth-child(odd) { grid-column: 1 / -1; justify-self: center; width: calc((100% - 1.02vw) / 2); }
.tcard { position: relative; display: grid; grid-template-columns: 14.69vw minmax(0, 1fr); align-items: start; gap: 1.56vw; padding: .86vw 1.5vw .86vw .86vw; color: #171a1d; background: linear-gradient(31deg, #9aa9ac 0%, #f1f1f1 35.96%, #c4c4c4 71.05%, #fff 100%); border: 2px solid rgba(241, 241, 241, .9); border-radius: 1.56vw; box-shadow: 0 4px 6px 2px rgba(0, 0, 0, .6); }
.tcard__img { display: block; height: 15.08vw; overflow: hidden; border: .8px solid #171a1d; border-radius: 1.06vw 1.06vw .73vw .73vw; background: #2a2d31; }
.tcard__img picture, .tcard__img img { width: 100%; height: 100%; object-fit: cover; }
.tcard__body { padding: .47vw 0 0; }
.tcard h3 { font-size: 2.27vw; font-weight: 700; line-height: 1; letter-spacing: -.02em; text-transform: none; color: #171a1d; }
.tcard h3 a { color: inherit; text-decoration: none; }
.tcard h3 a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.tcard p { margin: .7vw 0 0; font-size: 1.17vw; line-height: 1.15; letter-spacing: -.01em; text-transform: capitalize; color: #171a1d; display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; overflow: hidden; }
.tcard .tcard__go { position: absolute; z-index: 1; right: .63vw; bottom: .55vw; width: 3.9vw; height: 3.9vw; background: linear-gradient(31deg, #e10600 0%, #035691 100%); border: 1.6px solid #9a9a9c; box-shadow: 4px 4px 8px 2px rgba(0, 0, 0, .6); }
.tcard .tcard__go svg { width: 64%; height: 64%; transform: rotate(-40deg); transition: transform .3s ease-in-out; }
.tcard:hover .tcard__go { background: linear-gradient(45deg, #4c0201 0%, #035691 100%); }
.tcard:hover .tcard__go svg { transform: rotate(0deg); }

/* GET IN TOUCH + AREA TILES (loaded type pages). Live at 1280: Get In Touch card 582 wide at x30,
   area column from x633: 28px heading, 20px kicker, 2x2 tiles 285x226, 21px apart. */
@media (min-width: 1001px) {
  .band--areas-form .wrap.types-form { grid-template-columns: 45.47vw minmax(0, 1fr); gap: 1.64vw; padding: 0 3.2vw 0 2.34vw; }
  .types-form.areas-form .sticky { margin-top: 0; }
  .areas-form .section-head { margin-bottom: 1.2vw; }
  .areas-form .section-head h2.sm { font-size: 2.19vw; line-height: 1.2; }
  .areas-form .section-head .kicker { font-size: 1.56vw; margin-top: .4vw; }
  .areas-form .tiles { gap: 1.64vw; }
  .areas-form .tiles > .tile { flex: 0 0 calc((100% - 1.64vw) / 2); aspect-ratio: 285 / 226; }
}
@media (max-width: 1000px) {
  .type-cards { gap: 16px; }
  .tcard { grid-template-columns: 34% minmax(0, 1fr); gap: 16px; padding: 10px 16px 10px 10px; border-radius: 16px; }
  .tcard__img { height: auto; aspect-ratio: 188 / 193; border-radius: 12px; }
  .tcard__body { padding: 4px 0 0; }
  .tcard h3 { font-size: 24px; }
  .tcard p { margin-top: 8px; font-size: 14px; line-height: 1.2; -webkit-line-clamp: 4; }
  .tcard .tcard__go { width: 44px; height: 44px; right: 8px; bottom: 8px; }
  .areas-form .tiles > .tile { flex-basis: calc((100% - 14px) / 2); }
}
@media (max-width: 750px) {
  .type-cards { grid-template-columns: 1fr; }
  .type-cards > .tcard:last-child:nth-child(odd) { width: 100%; }
  .band--typecards > .wrap { display: flex; flex-direction: column; gap: 16px; }
  .band--typecards .section-head { display: contents; }
  .band--typecards .section-head > .btn { order: 2; width: 100%; margin-top: 0; }
  .tcard { gap: 12px; padding: 6px; }
  .tcard__img { position: relative; align-self: stretch; aspect-ratio: auto; min-height: 0; }
  .tcard__img picture { position: absolute; inset: 0; }
  .tcard__body { padding: 4px 0 46px; }
  .tcard .tcard__go { right: 3px; bottom: 3px; }
  .tcard h3 { font-size: 22px; }
  .types-form.areas-form .sticky { order: 2; }
}

/* SERVICE AREAS box: a second grid (e.g. Nearby Counties We Also Serve) below the city lists, set off by
   a rule and the same underlined heading style as the state labels. */
.area-box h3.area-box__section { margin: 1.4rem 1rem .3rem 0; padding-top: 1.2rem; border-top: 2px solid rgba(23, 26, 29, .35); }

/* COUNTY Who We Are variant (who--county): the property-page layout. The county About (Who We Are) and the
   expanded county copy (About block) both run long, so both set smaller (21px at 1280, scaled). */
@media (min-width: 1001px) {
  .who--county .who__copy > p, .who--county .who__about p { font-size: 1.64vw; line-height: 1.2; }
  /* City hubs: the city About runs just as long, same smaller size. */
  .who--city .who__copy > p { font-size: 1.64vw; line-height: 1.2; }
}

/* ============================================================
   PHONE HERO, measured off live at 375 (vw = px / 3.75).
   Side photo 228 tall under the 50px header, logo 260x120 at its top-left.
   Facebook, Instagram (40px) and the phone pill (168x40, 9px corners) sit
   right-aligned 20px up into the photo's bottom edge; the brand link sits
   left of them, lower. Eyebrow 12px, H1 38px/1.1, lead 17px/1, Get Estimate
   305x63 at 32px with 6px corners. Text column 11px in from each side.
   Live scales logo, photo, text and positions with width, but keeps
   the buttons, icons, phone pill and the eyebrow/lead gaps in fixed
   px (checked at 375 and 440), so those stay px here.
   ============================================================ */
@media (max-width: 750px) {
  .hero__side { min-height: 60.8vw; }
  .hero__logo { left: .27vw; top: 2.67vw; width: 69.33vw; max-width: none; height: 32vw; }
  .hero__copy { margin-top: -5.33vw; padding: 0 2.93vw 29.33vw; }
  .hero .hero__top { position: relative; justify-content: flex-end; flex-wrap: nowrap; gap: 5px; min-height: 40px; margin: 0 calc(4.5px - 2.93vw) calc(12.9vw - 40px) 0; }
  .hero .hero__top .icon-btn[aria-label="Facebook"] { order: 1; }
  .hero .hero__top .icon-btn[aria-label="Instagram"] { order: 2; }
  .hero .hero__top .phone-pill { order: 3; }
  .hero__brand { position: absolute; left: .53vw; top: 5.87vw; margin: 0; font-size: 2.67vw; line-height: 1.1; }
  .hero .icon-btn { width: 40px; height: 40px; border-width: 1px; }
  .hero .icon-btn svg { width: 21px; height: 21px; }
  .hero .phone-pill { height: 40px; padding: 0 10px; font-size: 20px; border-radius: 9px; border-width: 1px; }
  .hero__eyebrow { font-size: 3.2vw; line-height: 1; margin-bottom: 5px; }
  .hero .hero__copy > h1 { font-size: 10.13vw; line-height: 1.1; margin-bottom: 2.4vw; }
  .hero__lead { font-size: 4.53vw; line-height: 1; margin-bottom: 21px; }
  .hero__cta .btn--lg { width: 305px; max-width: none; min-height: 63px; font-size: 32px; border-radius: 6px; }
  .hero__cta .btn--lg svg { width: 28px; height: 28px; }
}

/* Homepage phone services: the heading rises above the section edge.
   Keep the section background at its boundary and lift only the heading. */
@media (max-width: 750px) {
  .shared-sections .band--services {
    z-index: 4;
    padding-top: 0;
    background: linear-gradient(180deg, #23282d 0%, #171a1d 100%);
  }
  .shared-sections .band--services > .wrap { display: flex; flex-direction: column; }
  .shared-sections .band--services .section-head { display: contents; }
  .shared-sections .band--services .cards , .shared-sections .wwd__list .pro-list { order: 1; margin-top: 22px; }
  .shared-sections .band--services .section-head > .btn {
    order: 2;
    align-self: center;
    width: 100%;
    min-width: 0;
    margin-top: 24px;
  }
  .shared-sections .band--tiles { border-top: 0; border-image: none; }
  .shared-sections .band--services .section-head h2 {
    position: relative;
    margin-top: -22px;
    font-size: 8vw;
    line-height: 1;
    letter-spacing: -.03em;
  }
  .shared-sections .band--services .section-head p {
    margin-top: 12px;
    color: #c4c4c4;
    font-size: 17px;
    line-height: 1.2;
  }
  /* Card, measured off live at 375 and 440: 1.6px #9a9a9c border, 10px corners, 21deg silver,
     drop shadow only. Photo 367x248 with a .8px dark edge. Title 8vw/1 at -.04em; copy 17px/1
     fixed; button 55px, 24px label, 6px corners, 11deg red to blue, no border. Padding and
     gaps are fixed px (live keeps them at both widths); sizes that scale with width are vw. */
  .shared-sections .band--services .wrap { padding: 0 5.55vw; }
  .shared-sections .band--services .cards , .shared-sections .wwd__list .pro-list { gap: 25px; }
  .shared-sections .band--services .card , .shared-sections .wwd__list .pro {
    padding: 8.4px 8.9px 10.5px;
    border: 2px solid #9a9a9c;
    border-radius: 10px;
    background: linear-gradient(21deg, #9aa9ac 0%, #fff 35.96%, #c4c4c4 71.05%, #fff 100%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .65), 0 4px 6px 2px rgba(0, 0, 0, .6);
  }
  .shared-sections .band--services .card__img , .shared-sections .wwd__list .pro__img {
    margin: 0 1.4px 0 1.8px;
    aspect-ratio: 367 / 248.4;
    border: .8px solid rgba(23, 26, 29, .5);
    border-radius: 1.63vw;
    background-clip: padding-box;
  }
  .shared-sections .band--services .card h3 , .shared-sections .wwd__list .pro h3 {
    margin: 4.53vw 3.2px 2.93vw 0;
    font-size: 8vw;
    line-height: 1;
    letter-spacing: -.04em;
    color: #1a1c1e;
  }
  .shared-sections .band--services .card p , .shared-sections .wwd__list .pro p {
    margin: 0 3.2px 26px 0;
    color: #1a1c1e;
    font-size: 17px;
    line-height: 1;
    letter-spacing: -.02em;
  }
  .shared-sections .band--services .card .btn , .shared-sections .wwd__list .pro .btn {
    align-self: stretch;
    width: 100%;
    margin: auto 0 0;
    min-height: 55px;
    font-size: 24px;
    font-weight: 400;
    color: #f1f1f1;
    border: double #f1f1f1;
    border-width: 0 1px 2px;
    border-radius: 6px;
    box-shadow: 0 4px 5px rgba(35, 40, 45, .6);
    background: linear-gradient(11deg, #e10600 0%, #035691 73.33%, #2da8ff 100%);
  }
}

/* ============================================================
   PHONE HEADER + HERO PHOTO (measured off live at 375 and 440)
   Header 50.4px, #23282d to #141414. Labels 16px Oswald 500, home
   glyph 16px grey, hamburger 36px; all fixed px. Gaps between items
   grow with width (16px at 375, 27.7px at 440) with a separator
   centered in each; outer insets scale too. Photo box 462x267 from
   1px under the header; the header owns the 1.6px top divider,
   and the photo owns its 1.6px bottom edge. Black
   to #23282d gradient, photo at 30% (the uncropped landscape fit).
   ============================================================ */
@media (max-width: 750px) {
  .site-header { border-bottom: 1.6px solid #f1f1f1; box-shadow: none; background: linear-gradient(180deg, #23282d 0%, #141414 100%); }
  .nav { height: 50.4px; padding: 0 calc(7.7vw - 19.8px) 0 calc(9.23vw - 23.6px); }
  .nav__links { flex: 1 1 auto; max-width: none; }
  .nav__links li, .nav__links li.nav__home { flex: 0 0 auto; padding: 0 calc(8.85vw - 25.6px); }
  .nav__links li.nav__home { padding-left: 0; }
  .nav__links li + li { margin: 7px 0; }
  .nav__links li + li a { margin: -7px 0; }
  .nav__links a { font-size: 16px; font-weight: 500; color: #f1f1f1; }
  .nav__home svg { width: 16px; height: 16px; }
  .menu-btn { flex: 0 0 36px; padding: 0; }
  .menu-btn svg { width: 36px; height: 29px; }
  .hero__side { min-height: 60.66vw; margin-top: -1px; }
  .hero__side-img { inset: 0 -2.43vw; border-top: 0; border-bottom: 1.6px solid #f1f1f1; box-shadow: none; background: linear-gradient(0deg, #000 0%, #23282d 100%); }
  .hero__side-img::after { content: none; }
  .hero__side-img img { opacity: .3; object-position: 50% 50%; }
  .hero__brand { font-size: 2.9vw; background-image: linear-gradient(11deg, #e10600 0%, #fff 51.58%, #2da8ff 100%); }
  /* Homepage phone comparison: bring the photo edge and copy up together. */
  .shared-sections .hero__side { min-height: 58.66vw; }
  .shared-sections .hero__bg img { opacity: .65; }
  .shared-sections .hero__bg::after { background: linear-gradient(0deg, #23282d 0%, transparent 18%, rgba(0, 0, 0, .28) 65%, #000 100%); }
}

/* City landing-page phone hero. Keep the desktop van and image layout intact. */
@media (max-width: 750px) {
  .page-city .hero__van { display: none; }
  .page-city .hero__side-img img { opacity: .55; }
  .page-city .hero__bg { top: 58.66vw; bottom: 0; height: auto; width: 100%; }
  .page-city .hero__bg img { opacity: .45; object-position: center; }
  .page-city .hero__bg::after { background: linear-gradient(180deg, rgba(0, 0, 0, .65) 0%, rgba(0, 0, 0, .4) 45%, rgba(0, 0, 0, .25) 65%, #23282d 96%); }
  .page-city .hero.hero--van .hero__copy > h1 { text-shadow: 1px 1px 2px rgba(0, 0, 0, .45); }
}

/* Homepage mobile area tiles, matched to the supplied left-hand reference. */
@media (max-width: 750px) {
  .shared-sections .band--services { padding-bottom: 32px; }
  .shared-sections .band--services .section-head > .btn {
    width: 100%;
    margin-top: 14px;
    min-height: 54px;
    font-size: 28px;
    border-radius: 6px;
  }
  .shared-sections .band--tiles { padding-top: 0; }
  .shared-sections .band--tiles > .wrap {
    display: flex;
    flex-direction: column;
    padding-inline: 22px;
  }
  .shared-sections .band--tiles .section-head { display: contents; }
  .shared-sections .band--tiles .section-head > div { display: contents; }
  .shared-sections .band--tiles .section-head h2 {
    text-align: center;
    font-size: clamp(22px, 6.36vw, 28px);
    line-height: 1.1;
    letter-spacing: -.02em;
  }
  .shared-sections .band--tiles .section-head .kicker {
    position: sticky;
    top: 12px;
    z-index: 2;
    text-align: center;
    opacity: var(--area-caption-opacity, 1);
    margin: 8px 0 0;
    padding: 0;
    font-size: clamp(16px, 5vw, 22px);
    line-height: 1.15;
    letter-spacing: -.025em;
  }
  .shared-sections .band--tiles .tiles {
    display: flex;
    flex-direction: column;
    order: 1;
    margin-top: 12px;
    gap: 20px;
  }
  .shared-sections .band--tiles .section-head > .btn {
    order: 2;
    align-self: center;
    margin-top: 15px;
    width: calc(100% + 4px);
    min-width: 0;
    min-height: 59px;
    padding: 0 16px;
    font-size: 28px;
    font-weight: 500;
    line-height: 1;
    border: 1px solid #f1f1f1;
    border-radius: 6px;
    background: linear-gradient(11deg, #e00000 0%, #0a5694 75%, #2aa8f5 100%);
  }
  .shared-sections .band--tiles .section-head > .btn svg { display: none; }
  .shared-sections .band--tiles .tile {
    position: sticky;
    overflow: visible;
    top: 48px;
    flex: 0 0 auto;
    width: 100%;
    aspect-ratio: 398 / 286;
    border: 2px solid #f1f1f1;
    border-radius: 10px;
    box-shadow: 0 5px 5px rgba(0, 0, 0, .8);
  }
  /* Crop the photo separately from the sticky card's scrolling layer. */
  .shared-sections .band--tiles .tile picture { overflow: hidden; border-radius: 8px; }
  .shared-sections .band--tiles .tile::after { border-radius: 8px; }
  .shared-sections .band--tiles .tile img { filter: brightness(.7); }
  .shared-sections .band--tiles .tile span { font-size: 40px; text-shadow: 0 max(.5px, .53333vw) max(.5px, 2.4vw) #000; }
  .shared-sections .band--tiles .tile .go {
    right: -2px;
    bottom: -2px;
    width: 65%;
    height: 45px;
    gap: 16px;
    border: 2px solid #cfd1d4;
    border-radius: 10px 0 10px 0;
    background: linear-gradient(31deg, #e10600 0%, #035691 100%);
    font-style: normal;
    box-shadow: none;
  }
  .shared-sections .band--tiles .tile .go::before {
    content: "VIEW SERVICES";
    font-size: 20px;
    font-weight: 400;
  }
  .shared-sections .band--tiles .tile .go svg { width: 22px; height: 22px; }
}

/* Keep area headings at phone scale through tablet, without the former
   oversized mobile text / tiny tablet text jump. Include fractional widths. */
@media (750px < width < 1001px) {
  .shared-sections .band--tiles .section-head { flex-direction: column; gap: 16px; }
  .shared-sections .band--tiles .section-head h2 { font-size: 28px; line-height: 1.1; }
  .shared-sections .band--tiles .section-head .kicker { font-size: 22px; line-height: 1.15; }
}

@media (max-width: 750px) {
  /* Clip at the viewport, not a page-height ancestor of every sticky card. */
  html:has(> body.shared-sections) { overflow-x: hidden; }
  body.shared-sections { overflow-x: visible; }
  .shared-sections .who {
    display: flex;
    flex-direction: column;
    border-top: 0;
    border-image: none;
    background: #171a1d;
  }
  .shared-sections .who__mobile-heading {
    display: block;
    order: 0;
    padding: 18px 16px 14px;
    text-align: center;
    background: #171a1d;
    border-bottom: 1px solid #f1f1f1;
    box-shadow: 0 8px 12px -3px rgba(0, 0, 0, .85);
    position: relative;
    z-index: 3;
  }
  .shared-sections .who__mobile-heading > span {
    display: block;
    font-family: var(--label);
    font-size: 22px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: underline;
    text-transform: uppercase;
  }
  .shared-sections .who__mobile-heading h2 {
    margin: 0;
    font-size: 44px;
    line-height: 1.1;
    background: linear-gradient(11deg, #e10600 0%, #fff 51.58%, #2da8ff 100%);
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
  }
  .shared-sections .who__art {
    order: 1;
    height: 86.4vw;
    min-height: 0;
    margin: 0;
  }
  .shared-sections .who__art .a1 {
    inset: 0 auto auto 0;
    width: 100%;
    height: 69.5vw;
    border: 0;
    border-bottom: 1px solid #f1f1f1;
  }
  .shared-sections .who__art .a2 {
    inset: 0 0 auto auto;
    width: 51%;
    height: 42vw;
    border: 0;
    border-left: 1px solid #f1f1f1;
    z-index: 1;
  }
  .shared-sections .who__art .a1 img { object-position: 50% 50%; }
  .shared-sections .who__art .a2 img { object-position: 50% 100%; }
  .shared-sections .who__art .van { left: 10.5%; bottom: 4vw; top: auto; width: 100%; z-index: 2; }
  .page-city .who--city .who__art { height: 53vw; border-bottom: 1px solid #f1f1f1; }
  .page-city .who--city .who__art .a1 { inset: 0 auto 0 0; width: 56.5%; height: 100%; border-bottom: 0; }
  .page-city .who--city .who__art .a2 { inset: 0 0 0 auto; width: 43.5%; height: 100%; }
  .page-city .who--city .who__art .a1 img { object-position: left center; }
  .page-city .who--city .who__art .a2 img { object-position: center; }
  .page-city .who--city .who__art .van { display: none; }
  .shared-sections .who__copy { order: 2; padding: 26px 20px 30px; }
  .shared-sections .who__copy h2 { font-size: 34px; line-height: 1.15; margin-bottom: 10px; }
  .shared-sections .who__copy > p { font-size: 22px; line-height: 1.13; text-transform: capitalize; margin-bottom: 16px; }
  .shared-sections .who__copy > p + .btn {
    display: flex;
    width: 100%;
    min-width: 0;
    min-height: 64px;
    margin-top: 0;
    font-size: 30px;
    font-family: var(--display);
    font-weight: 600;
    font-style: normal;
    border: 1px solid #f1f1f1;
    border-radius: 8px;
    background: linear-gradient(11deg, #e10600 0%, #035691 100%);
  }
  .shared-sections .who__copy > .btn svg { width: 32px; height: 32px; flex: 0 0 32px; }
  .shared-sections .who__copy h3 { font-size: 28px; line-height: 1.18; margin: 20px 0 14px; }
  .shared-sections .who__bg img { opacity: .5; filter: grayscale(.4); }
  .shared-sections .who .trust { gap: 7px; margin: 0 0 18px; }
  .shared-sections .who .trust li {
    color: #fff;
    font-style: italic;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: normal;
    transform: translateX(var(--trust-offset, 0%));
    text-shadow: 0 0 3px #2b74c4, 0 0 8px #2b74c4;
  }
  .shared-sections .who .trust li:nth-child(even) { text-shadow: 0 0 3px #d0101a, 0 0 8px #d0101a; }
  .shared-sections .who .trust li:nth-child(3) { font-size: 30px; }
  .shared-sections .who .trust li:nth-child(4) { font-size: 34px; }
  .shared-sections .who .trust__ico { color: #fff; font-style: normal; }
  .shared-sections .who .trust a { color: #fff; font-style: inherit; }
  .shared-sections .who__copy > .trust + .btn {
    display: flex;
    width: 100%;
    min-width: 0;
    min-height: 60px;
    font-size: 28px;
    font-family: var(--display);
    font-weight: 500;
    font-style: normal;
    border: 1px solid #f1f1f1;
    border-radius: 8px;
    background: linear-gradient(11deg, #e10600 0%, #035691 100%);
    transform: scale(var(--trust-button-scale, 1));
  }
  .shared-sections .who__bg { top: calc(100px + 69.5vw); }
  /* Anchor the background to the copy row, exactly below the photos. */
  .page-city .who--city { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "heading" "photos" "copy"; }
  .page-city .who--city .who__mobile-heading { grid-area: heading; }
  .page-city .who--city .who__art { grid-area: photos; }
  .page-city .who--city .who__copy { grid-area: copy; }
  .page-city .who--city .who__bg { grid-area: copy; inset: 0; }
  .page-city .who--city .who__copy h2 { font-size: 38px; }
  .page-city .who--city .who__copy > p { font-size: 21px; line-height: 1.16; letter-spacing: -.025em; }
  .page-city .who--city .who__copy h3 { font-size: clamp(26px, 6.82vw, 32px); line-height: 1.15; letter-spacing: -.025em; text-wrap: balance; }
  .page-city .who--city .trust li:nth-child(3) { font-size: 32px; }
  .page-city .who--city .trust li:nth-child(4) { font-size: 36px; }
}

@media (max-width: 750px) {
  .shared-sections .band--types { padding-top: 0; margin-top: 0; border-top: 4px solid #aaa; }
  :is(.page-city, .page-home) #estimate.band--types { padding-bottom: 0; }
  .page-city .form-band > .form-card { border-radius: 9px; }
  .shared-sections .band--types .types-form { display: flex; flex-direction: column; gap: 0; padding: 0; max-width: none; }
  .shared-sections .types-form > div:not(.sticky) { width: 100%; padding: 16px 18px 28px; }
  .shared-sections .types-form > div > h2 { width: 100%; margin: 0 0 16px; text-align: start; font-size: 26px; line-height: 1.1; letter-spacing: -.025em; }
  .shared-sections .type-stack,
  .shared-sections .band--property-tiles .tiles { display: grid; grid-template-columns: 1fr; gap: 16px; }
  /* Match the loaded type-page cards only at the mobile breakpoint. */
  .shared-sections .type-card,
  .shared-sections .band--property-tiles .tile { position: relative; top: auto; display: grid; grid-template-columns: 34% minmax(0, 1fr); column-gap: 12px; min-height: 162px; padding: 6px; aspect-ratio: auto; color: #171a1d; border: 2px solid rgba(241, 241, 241, .9); border-radius: 16px; box-shadow: 0 4px 6px 2px rgba(0, 0, 0, .6); background: linear-gradient(31deg, #9aa9ac 0%, #f1f1f1 35.96%, #c4c4c4 71.05%, #fff 100%); }
  .shared-sections .type-card { grid-template-rows: auto auto 46px; }
  .shared-sections .type-card h3 { grid-column: 2; grid-row: 1; padding-top: 4px; font-size: 22px; font-weight: 700; line-height: 1; letter-spacing: -.02em; text-transform: none; margin: 0; }
  .shared-sections .type-card h3 a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
  .shared-sections .type-card > p { grid-column: 2; grid-row: 2; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; margin: 8px 0 0; font-size: 14px; line-height: 1.2; letter-spacing: -.01em; color: #171a1d; }
  .shared-sections .type-card__img { position: relative; grid-column: 1; grid-row: 1 / 4; align-self: stretch; inset: auto; width: 100%; height: auto; aspect-ratio: auto; border: .8px solid #171a1d; border-radius: 12px; }
  .shared-sections .type-card__img picture { position: absolute; inset: 0; width: 100%; height: 100%; }
  .shared-sections .type-card .tab-btn,
  .shared-sections .band--property-tiles .tile .go { left: auto; right: 3px; bottom: 3px; z-index: 1; width: 44px; height: 44px; min-height: 44px; padding: 0; gap: 0; justify-content: center; font-size: 0; border: 1.6px solid #9a9a9c; border-radius: 50%; background: linear-gradient(31deg, #e10600 0%, #035691 100%); box-shadow: 4px 4px 8px 2px rgba(0, 0, 0, .6); }
  .shared-sections .type-card .tab-btn svg,
  .shared-sections .band--property-tiles .tile .go svg { width: 64%; height: 64%; flex: 0 0 64%; }
  .shared-sections .band--property-tiles .tile picture { position: relative; align-self: stretch; inset: auto; height: auto; border: .8px solid #171a1d; border-radius: 12px; overflow: hidden; }
  .shared-sections .band--property-tiles .tile img { filter: none; }
  .shared-sections .band--property-tiles .tile span { position: static; align-self: start; display: block; padding: 4px 0 46px; text-align: start; font-size: 22px; font-weight: 700; line-height: 1; letter-spacing: -.02em; text-transform: none; color: #171a1d; text-shadow: none; }
  .shared-sections .band--property-tiles .tile::after,
  .shared-sections .band--property-tiles .tile .go::before { content: none; }
  .shared-sections .types-form__more { margin-top: 16px; padding: 0; }
  .shared-sections .types-form > .sticky { order: -1; width: 100%; margin: 0; }
  .shared-sections .types-form > .faq { width: 100%; margin: 0; }
  .shared-sections .faq { display: flex; flex-direction: column; gap: 0; padding: 0; border: 0; }
  .shared-sections .faq__body { order: 0; margin: 0 0 -24px; border: 0; border-radius: 0; background: linear-gradient(to bottom, #f1f1f1 0, #f1f1f1 calc(100% - 24px), transparent calc(100% - 24px), transparent 100%); position: relative; z-index: 2; overflow: visible; }
  .shared-sections .faq__title { padding: 12px 10px 10px; font-size: 32px; font-weight: 600; line-height: 1.1; }
  .shared-sections .faq__list { margin: 0 6px; border: 1px solid #c4c4c4; border-radius: 7px 7px 0 0; }
  .shared-sections .faq summary { min-height: 47px; padding: 9px 10px; font-size: 21px; font-weight: 500; letter-spacing: -.03em; line-height: 1.3; background: linear-gradient(11deg, #4c0201 0%, #035691 100%); }
  .shared-sections .faq summary svg { width: 20px; height: 13px; }
  .shared-sections .faq details > div { padding: 22px 36px 38px; font-size: 22px; line-height: 1.5; background: linear-gradient(110deg, #080a0c, #292d32); }
  .shared-sections .faq__body > .btn, .shared-sections .sa-list__cta { display: flex; justify-content: space-between; width: calc(100% - 12px); margin: 0 6px; padding: 12px 20px; min-height: 62px; border: 1px solid #f1f1f1; border-radius: 0 0 4px 4px; font-family: var(--label); font-size: 22px; font-weight: 600; background: linear-gradient(11deg, #4c0201 0%, #035691 100%); box-shadow: 0 6px 12px #0009; position: relative; z-index: 2; }
  .shared-sections .faq__body > .btn svg, .shared-sections .sa-list__cta svg { width: 30px; height: 30px; flex: 0 0 30px; }
  .shared-sections .faq__body { margin-bottom: -66px; background: linear-gradient(to bottom, #f1f1f1 calc(100% - 66px), transparent calc(100% - 66px)); }
  .shared-sections .faq__title { font-size: 34px; letter-spacing: -.035em; }
  .shared-sections .faq summary { min-height: 48px; }
  .shared-sections .faq__body > .btn, .shared-sections .sa-list__cta { min-height: 66px; font-size: 24px; box-shadow: 0 8px 14px 1px rgba(0, 0, 0, .75); }
  .shared-sections .faq__gallery { order: 1; width: 100%; height: 200px; min-height: 200px; border: 0; border-bottom: 4px solid #aaa; }
  .shared-sections .faq__gallery::after { content: ""; position: absolute; inset: 0 0 auto; height: 75px; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgba(0, 0, 0, .85) 0%, rgba(0, 0, 0, .45) 40%, transparent 100%); }
  .shared-sections .faq__gallery { height: 266px; min-height: 266px; }
  .shared-sections .faq__track picture { width: 60vw; flex-basis: 60vw; }
  .shared-sections .types-form .form-card {
    width: 100%;
    max-width: none;
    margin: 0;
    border-radius: 0;
    border: 1px solid #bfc2c4;
    box-shadow: none;
    background: linear-gradient(180deg, #233b7c 0%, #390020 100%);
  }
  .shared-sections .types-form .form-card__head { min-height: 140px; padding: 26px 12px 20px; border-bottom: 1px solid #bfc2c4; }
  .shared-sections .areas-form .form-card { border-radius: 9px; }
  .shared-sections .types-form .form-card__head h2 { font-size: 52px; line-height: 1.1; }
  .shared-sections .types-form .form-card__head p { font-size: 17px; margin: 6px 0 0; }
}


/* Mobile featured projects: manual swipe gallery. */
@media (max-width: 750px) {
  .shared-sections [data-carousel-section] { position: relative; border-top: 0; border-bottom: 0; border-image: none; padding-bottom: 28px; background: #171b1d; }
  .shared-sections .projects-head { min-height: 68px; padding: 8px 10px; justify-content: center; border: 1px solid #eee; border-bottom: 4px solid #ddd; }
  .shared-sections .projects-head h2 { margin: 0; font-size: 40px; line-height: 1.2; text-align: center; }
  .shared-sections .projects-head::after { bottom: -4px; height: 4px; width: max(20px, calc(var(--carousel-p, 0) * 100%)); animation: project-progress-glow 3.6s ease-in-out infinite; }
  .shared-sections .carousel { background: linear-gradient(180deg, #080a0b, #202528); }
  .shared-sections .carousel__btn { display: none; }
  .shared-sections .carousel__track { grid-auto-columns: 88%; gap: 10px; padding: 18px 5px 22px; scroll-padding-inline: 5px; }
  .shared-sections .carousel .proj-card { border: 1px solid #eee; border-radius: 12px; }
  .shared-sections .carousel .proj-card__num { height: 66px; padding: 0 10px; font-size: 16px; font-weight: 400; font-style: italic; background: linear-gradient(110deg, #eee, #c8c8c8); }
  .shared-sections .carousel .proj-card__img { aspect-ratio: 1.26; }
  .shared-sections .carousel .proj-card .tab-btn { left: 0; right: auto; bottom: 0; width: 60%; min-height: 44px; border: 1px solid #eee; border-radius: 0 8px 0 10px; font-family: var(--label); font-size: 22px; font-weight: 500; background: linear-gradient(11deg, #e10600, #035691); }
  .shared-sections .carousel .proj-card .tab-btn svg { width: 24px; height: 24px; }
  .shared-sections .projects-footer { position: relative; z-index: 2; display: flex; justify-content: center; margin-bottom: -7px; }
  .shared-sections .projects-footer::before { content: ""; position: absolute; top: 18px; left: 0; right: 0; height: 12px; background: linear-gradient(#fff, #999); z-index: -1; }
  .shared-sections .projects-footer .btn { width: 85%; min-height: 50px; padding: 8px 10px; border: 1px solid #eee; border-radius: 5px; font-family: var(--label); font-size: 26px; font-weight: 500; background: linear-gradient(11deg, #e10600, #035691); box-shadow: 0 5px 9px #0009; }
  .shared-sections .projects-footer .btn svg { width: 22px; height: 22px; }
}
@keyframes project-progress-glow {
  0%, 65%, 100% { opacity: 1; box-shadow: 0 0 0 transparent; }
  82% { opacity: .65; box-shadow: 0 0 6px #65b5ff; }
}
@media (prefers-reduced-motion: reduce) {
  .shared-sections .projects-head::after { animation: none; }
}

.reviews__title-container { display: contents; }
/* Mobile reviews: pinned container with an independently rising heading. */
@media (max-width: 750px) {
  .shared-sections [data-carousel-section] { z-index: 2; }
  .shared-sections .reviews--scroll { border-top: 0; border-image: none; margin-top: -28px; }
  /* Without projects between them, separate the FAQ gallery from the review map. */
  .shared-sections .faq + .reviews--scroll { margin-top: 0; border-top: 0; border-image: none; padding-top: 8px; }
  .shared-sections .faq + .reviews--scroll::before { content: ""; position: absolute; inset: 0 0 auto; height: 8px; z-index: 2; background: linear-gradient(180deg, #fff 0%, #aaa 22.1%, #171a1d 100%); pointer-events: none; }
  .shared-sections .reviews--scroll .reviews__grid { display: grid; grid-template-columns: minmax(0, 1fr); padding: 0 12px 24px; gap: 0; }
  .shared-sections .reviews--scroll .reviews__title-container { display: block; grid-area: 1 / 1; position: sticky; top: calc(10svh + 60px); margin-top: -40px; align-self: start; z-index: 0; pointer-events: none; }
  .shared-sections .faq + .reviews--scroll .reviews__title-container { margin-top: -96px; }
  .shared-sections [data-carousel-section] + .reviews--scroll .reviews__title-container { margin-top: -96px; }
  .shared-sections .reviews--scroll .reviews__title { position: relative; top: 0; z-index: 0; margin: 0; padding: 0; text-align: center; font-size: 42px; font-weight: 600; line-height: 1.05; letter-spacing: -.035em; will-change: transform; }
  .shared-sections .reviews--scroll .reviews__title br { display: none; }
  .shared-sections .reviews--scroll .reviews__grid > div:not(.reviews__title-container) { grid-area: 1 / 1; position: relative; z-index: 1; min-width: 0; pointer-events: none; }
  .shared-sections .reviews--scroll .reviews__list { padding-top: 68svh; gap: 76px; padding-bottom: 0; }
  .shared-sections .reviews--scroll .review { pointer-events: auto; padding: 14px 12px 18px; border: 2px solid #aeb0b2; border-radius: 10px; background: linear-gradient(31deg, #080a0c 0%, #23282d 50%, #1a1c1e 100%); box-shadow: 0 6px 10px 1px #0009; }
  .shared-sections .reviews--scroll .review blockquote { font-family: var(--display); font-size: 18px; font-weight: 300; line-height: 1.15; letter-spacing: -.02em; margin-bottom: 14px; }
  .shared-sections .reviews--scroll .review cite { font-family: var(--display); font-size: 34px; font-weight: 500; line-height: 1.15; }
  .shared-sections .reviews--scroll .review cite::before { content: "— "; }
  .shared-sections .reviews--scroll .review footer { gap: 14px 10px; }
  .shared-sections .reviews--scroll .review .stars { justify-self: center; gap: 12px; margin: 0; }
  .shared-sections .reviews--scroll .review .stars svg { width: 28px; height: 28px; }
  .shared-sections .reviews--scroll .review .src { width: 56px; height: 56px; padding: 5px; }
  .shared-sections .reviews--scroll .reviews__more { pointer-events: auto; }
}

@media (max-width: 750px) {
  .shared-sections .projects-footer .btn { background: linear-gradient(31deg, #e00000 0%, #0a5694 75%, #2aa8f5 100%); }
  .shared-sections .reviews--scroll { clip-path: inset(0); }
  .shared-sections .reviews--scroll .reviews__map img { filter: saturate(.65); }
  .shared-sections .reviews--scroll .reviews__map::after { display: block; background: rgba(27, 29, 32, .82); }
}

@media (max-width: 750px) {
  .shared-sections [data-carousel-section] { padding-bottom: 0; background: transparent; }
  .shared-sections .projects-footer { background: transparent; }
  .shared-sections .projects-footer .btn { background: linear-gradient(11deg, #e00000 0%, #0a5694 75%, #2aa8f5 100%); }
  .shared-sections .carousel .proj-card .tab-btn { padding-left: 28px; padding-right: 14px; justify-content: center; gap: 12px; }
  .shared-sections .reviews--scroll { margin-top: -50px; }
}

@media (max-width: 750px) {
  /* End the project background at the silver divider, not above the button. */
  .shared-sections [data-carousel-section] { background: linear-gradient(to bottom, #202528 0, #202528 calc(100% - 19px), transparent calc(100% - 19px)); }
  .shared-sections .reviews--scroll { margin-top: -19px; }
}

@media (max-width: 750px) {
  .shared-sections .reviews--scroll .reviews__map::after { background: linear-gradient(180deg, rgba(27, 29, 32, .72) 0%, rgba(20, 22, 25, .85) 45%, #17191c 100%); }
  .shared-sections .reviews--scroll .reviews__more { display: none; }
  .shared-sections .reviews--scroll .reviews__list { padding-top: 42svh; }
  .shared-sections .reviews--scroll .review { width: calc(100% - 24px); margin-inline: auto; }
  .shared-sections .types-form .form-card { background: linear-gradient(11deg, #4c0201 0%, #035691 100%); }
}




/* Keep the original shared card markup; only phones use the vertical layout. */
@media (max-width: 750px) {
  .shared-sections .wwd__list .pro { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
  .shared-sections .wwd__list .pro__body { display: contents; }
  .shared-sections .wwd__list .pro__img { flex: 0 0 auto; overflow: hidden; }
  .shared-sections .wwd__list .pro__img picture, .shared-sections .wwd__list .pro__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
}

/* General service phone hero: smaller brand artwork and legible copy. */
@media (max-width: 750px) {
  .page-service-general .hero__van, .page-property-area .hero__van, .page-county .hero__van, .page-local-property-type .hero__van { display: none; }
  .page-service-general .hero__logo { width: 48vw; height: 24vw; }
  .page-service-general .hero__side-img img { opacity: .7; }
  .page-service-general .hero__side { min-height: 58.2vw; }
  .page-service-general .hero.hero--van .hero__copy > h1 { font-size: 9.2727vw; line-height: 1.1; text-wrap: wrap; margin-bottom: 10px; }
  .page-service-general .hero__copy { padding-left: 2.83vw; padding-right: 2.53vw; padding-bottom: 34.4vw; }
  .page-service-general .hero__lead { font-family: "USA Oswald Regular", Oswald, sans-serif; color: #c4c4c4; font-size: 4.3788vw; line-height: 1; margin-bottom: 15px; }
  .band--pros > .wrap > .prose > p {
    color: #c4c4c4;
    font-size: 16px;
    line-height: 1.2;
  }
  .page-service-general .hero__bg { top: calc(58.2vw - 1px); height: auto; bottom: 0; }
  .page-service-general .hero__bg img { opacity: .65; object-position: center; }
  .page-service-general .hero__bg::after { background: linear-gradient(0deg, #23282d 0%, rgba(0, 0, 0, .2) 30%, rgba(0, 0, 0, .3) 65%, #171a1d 100%); }
  .hero + .band--pros {
    /* Overlap the hero with the section, keeping its heading inside the clip. */
    margin-top: -24px;
    padding-top: 0;
    background: #23282d;
    overflow: visible;
    z-index: 3;
  }
  .hero + .band--pros > .wrap.split {
    position: relative;
    top: 0;
    margin-bottom: 0;
  }
  .page-service-general .hero + .band--pros { margin-top: 0; }
  .page-service-general .band--pros > .wrap > .prose > h2 { font-family: "USA Oswald Medium", Oswald, sans-serif; font-size: 8.3993vw; font-weight: 400; line-height: 1.1; margin-bottom: 5px; }
}

/* Related services duplicate the established service design independently. */
@media (max-width: 750px) {
  .shared-sections .band--related-services {
    z-index: 4;
    padding-top: 24px;
    background: linear-gradient(180deg, #23282d 0%, #171a1d 100%);
  }
  .shared-sections .band--related-services > .wrap { display: flex; flex-direction: column; }
  .shared-sections .band--related-services .wrap { padding: 0 5.55vw; }
  .shared-sections .band--related-services .section-head { display: contents; }
  .shared-sections .band--related-services .cards { order: 1; margin-top: 22px; }
  .shared-sections .band--related-services .section-head > .btn {
    order: 2;
    align-self: center;
    width: 100%;
    min-width: 0;
    margin-top: 24px;
  }
  .shared-sections .band--related-services .section-head h2 {
    position: relative;
    margin-top: 0;
    font-size: 8vw;
    line-height: 1;
    letter-spacing: -.03em;
  }
  .shared-sections .band--related-services .section-head p {
    margin-top: 12px;
    color: #c4c4c4;
    font-size: 17px;
    line-height: 1.2;
  }
  .shared-sections .band--related-services .cards { gap: 25px; }
  .shared-sections .band--related-services .card {
    padding: 8.4px 8.9px 10.5px;
    border: 2px solid #9a9a9c;
    border-radius: 10px;
    background: linear-gradient(21deg, #9aa9ac 0%, #fff 35.96%, #c4c4c4 71.05%, #fff 100%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .65), 0 4px 6px 2px rgba(0, 0, 0, .6);
  }
  .shared-sections .band--related-services .card__img {
    margin: 0 1.4px 0 1.8px;
    aspect-ratio: 367 / 248.4;
    border: .8px solid rgba(23, 26, 29, .5);
    border-radius: 1.63vw;
    background-clip: padding-box;
  }
  .shared-sections .band--related-services .card h3 {
    margin: 4.53vw 3.2px 2.93vw 0;
    font-size: 8vw;
    line-height: 1;
    letter-spacing: -.04em;
    color: #1a1c1e;
  }
  .shared-sections .band--related-services .card p {
    margin: 0 3.2px 26px 0;
    color: #1a1c1e;
    font-size: 17px;
    line-height: 1;
    letter-spacing: -.02em;
  }
  .shared-sections .band--related-services .card .btn {
    align-self: stretch;
    width: 100%;
    margin: auto 0 0;
    min-height: 55px;
    font-size: 24px;
    font-weight: 400;
    color: #f1f1f1;
    border: double #f1f1f1;
    border-width: 0 1px 2px;
    border-radius: 6px;
    box-shadow: 0 4px 5px rgba(35, 40, 45, .6);
    background: linear-gradient(11deg, #e10600 0%, #035691 73.33%, #2da8ff 100%);
  }
  .shared-sections .band--related-services { padding-bottom: 32px; }
  .shared-sections .band--related-services .section-head > .btn {
    width: 100%;
    margin-top: 14px;
    min-height: 54px;
    font-size: 28px;
    border-radius: 6px;
  }
}

/* Phone pro sequence ends at the full-width contact form. */
@media (max-width: 750px) {
  :is(.page-service-general .form-band, .band--pros + .form-band) .form-card { border-radius: 9px; border: 2px solid #c4c4c4; box-shadow: 0 -8px 20px #0008; }
  .band--pros + .form-band {
    position: relative;
    z-index: 5;
    margin-top: 0;
    padding: 0;
    border-top: .3rem solid transparent;
    border-image: var(--divider) 1;
    overflow: visible;
  }
  :is(.page-service-general .form-band, .band--pros + .form-band) .form-band__strip { clip-path: inset(0); height: 100%; }
  .band--pros + .form-band > .form-card { position: relative; top: 0; margin: 0; width: 100%; max-width: none; border: 1px solid #f1f1f1; border-radius: 0; box-shadow: none; }
  :is(.page-service-general .form-band, .band--pros + .form-band) .form-band__strip picture { position: absolute; inset: 0; height: 100%; }
  /* Keep the requested breathing room after the last pro card. */
  .band--pros .pro-list { padding-bottom: 91px; }
  .band--pros .pro-list--scroll { display: block; }
  .band--pros .pro-list--scroll > .pro {
    position: relative;
    margin-bottom: 36px;
    background: transparent;
    border: 0;
    box-shadow: none;
    overflow: visible;
  }
  .band--pros .pro-list--scroll > .pro:last-of-type { margin-bottom: 0; }
  .band--pros .pro-list--scroll .pro__img { transform: translate3d(0, var(--pro-slide, 0px), 0); will-change: transform, clip-path; border: 2px solid #f1f1f1; border-radius: 16px 16px 0 0; overflow: hidden; }
  .band--pros .pro-list--scroll .pro__body { position: relative; z-index: 1; border: 1px solid #c4c4c4; transform-origin: center top; will-change: transform; }
}
@media (max-width: 750px) and (prefers-reduced-motion: reduce) {
  :is(.page-service-general .form-band, .band--pros + .form-band) .form-band__strip picture { position: absolute; height: 100%; }
}

/* The carousel progress bar follows its scroll container without a JS frame loop. */
@media (max-width: 750px) {
  /* Keep the same clipping without creating an unscrollable timeline source. */
  .who, .band--pros:has(.pro-list--scroll) { overflow: clip; }
}
@keyframes carousel-scroll-progress { from { width: 0%; } to { width: 100%; } }
@supports (animation-timeline: scroll()) {
  [data-carousel-section] { timeline-scope: --carousel-progress; }
  [data-carousel-section] .carousel__track { scroll-timeline: --carousel-progress inline; }
  [data-carousel-section] .projects-head::after {
    min-width: 4.3rem;
    transition: none;
    animation: carousel-scroll-progress auto linear both;
    animation-timeline: --carousel-progress;
  }
  @media (max-width: 750px) {
    .shared-sections [data-carousel-section] .projects-head::after {
      min-width: 20px;
      animation: project-progress-glow 3.6s ease-in-out infinite, carousel-scroll-progress auto linear both;
      animation-timeline: auto, --carousel-progress;
    }
  }
}
@media (prefers-reduced-motion: reduce) {
  [data-carousel-section] .projects-head::after { animation: none !important; }
  .ps-deck__card, .ps-lb__img { transition: none !important; }
}

/* One project list and one View All link at every breakpoint. */
.projects-section { display: grid; grid-template-columns: minmax(0, 1fr); }
.projects-section > .projects-head { grid-area: 1 / 1; }
.projects-section > .carousel { grid-area: 2 / 1; min-width: 0; container-type: inline-size; }
.projects-section > .projects-footer { grid-area: 1 / 1; justify-self: end; align-self: center; position: relative; margin-right: 1.9rem; }
.projects-section > .projects-footer .btn { min-width: 23.5rem; min-height: 3.9rem; font-size: 2.1rem; }
@media (min-width: 751px) {
  .projects-section > .projects-head { padding-right: 26.6rem; }
}
.project-slide { position: relative; min-width: 0; scroll-snap-align: start; scroll-snap-stop: always; }
.project-slide > .proj-card { height: 100%; scroll-snap-align: none; }
.projects-section .carousel__track { scroll-behavior: smooth; overscroll-behavior-x: contain; }
/* Real links work in Safari as well as Chromium. CSS scroll progress selects
   the corresponding previous/next pair and centers the current dot. */
@property --project-current { syntax: "<integer>"; inherits: true; initial-value: 0; }
@keyframes project-control-index { from { --project-current: 0; } to { --project-current: var(--project-control-steps); } }
.project-controls { --project-control-steps: max(0, calc(var(--project-steps) - 2)); position: relative; height: 44px; margin: 0 12px 24px; animation: project-control-index auto linear both; animation-timeline: --carousel-progress; }
.project-arrow-viewport { position: absolute; inset: 0; overflow: clip; }
/* Every pair sits in the same spot; only the current pair is shown and on top.
   Nothing translates, so the arrows stay put while the cards swipe. */
.project-arrow-pair { --pair-distance: max(calc(var(--index) - var(--project-current)), calc(var(--project-current) - var(--index))); --pair-on: max(0, calc(1 - var(--pair-distance))); position: absolute; inset: 0; opacity: var(--pair-on); z-index: calc(1 + var(--pair-on)); pointer-events: none; }
.project-arrow { position: absolute; top: 0; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #202528; color: #f1f1f1; border: 1px solid #73787b; cursor: pointer; pointer-events: auto; }
.project-arrow--prev { left: 0; }
.project-arrow--next { right: 0; }
.project-arrow svg { width: 22px; height: 22px; }
.project-arrow:disabled { opacity: .35; cursor: default; }
.project-arrow:focus-visible, .project-dot:focus-visible { outline: 2px solid #2da8ff; outline-offset: -3px; }
/* 30px per dot gives each one a finger-sized target, and the 16px dead zone
   between the strip and each 44px arrow keeps a missed arrow tap off the dots. */
.project-dots { --dot-pitch: 30px; position: absolute; inset: 4px 60px; container-type: inline-size; overflow: clip; }
.project-dot-track { display: flex; width: max-content; translate: calc(-1 * clamp(0px, (var(--project-current) + .5) * var(--dot-pitch) - 50cqw, max(0px, (var(--project-steps) + 1) * var(--dot-pitch) - 100cqw))) 0; }
.project-dot { --distance: max(calc(var(--index) - var(--project-current)), calc(var(--project-current) - var(--index))); --selected: max(0, calc(1 - var(--distance))); display: grid; place-items: center; flex: 0 0 var(--dot-pitch); width: var(--dot-pitch); height: 36px; }
.project-dot::after { content: ""; width: calc(6px + 2px * var(--selected)); height: calc(6px + 2px * var(--selected)); border-radius: 50%; background: rgb(calc(98 - 53 * var(--selected)), calc(105 + 63 * var(--selected)), calc(109 + 146 * var(--selected))); }
.project-slide { scroll-margin-block-start: 100px; }
@media (min-width: 751px) {
  .project-controls { position: static; height: 0; margin: 0; }
  .project-arrow-viewport { inset: 55% 1rem auto; height: 4rem; transform: translateY(-50%); z-index: 3; }
  .project-arrow { width: 4rem; height: 4rem; background: #fff; color: #111; border: 0; box-shadow: var(--shadow); }
  .project-arrow svg { width: 2.3rem; height: 2.3rem; }
  .project-dots { position: absolute; inset: auto auto 0 50%; translate: -50% 0; width: min(100%, 420px); height: 28px; }
  .project-dot { height: 28px; }
}
@media (min-width: 915px) {
  .project-slide { scroll-margin-inline-end: calc((100cqw - 1.1rem) * 2 / 3); }
  .project-controls { --project-control-steps: max(0, calc(var(--project-steps) - 2)); }
  .project-arrow-pair:nth-last-child(3) .project-arrow--next { opacity: .35; pointer-events: none; }
}

@media (max-width: 750px) {
  .shared-sections .projects-section > .projects-footer { grid-area: 3 / 1; justify-self: stretch; margin-right: 0; }
  .shared-sections .projects-section > .projects-footer .btn { min-width: 0; min-height: 50px; font-size: 26px; }
  .shared-sections .projects-section .carousel { display: block; padding: 0; }
  .shared-sections .projects-section .carousel__track { width: 100%; margin: 0; grid-auto-columns: 100%; gap: 0; padding: 28px 0 36px; scroll-padding: 0; touch-action: pan-x pan-y pinch-zoom; }
  .shared-sections .project-controls { --project-control-steps: var(--project-steps); }
  .shared-sections .project-slide { height: calc(min(78cqw, 380px) * 4 / 3 + 52px); }
  .shared-sections .project-slide > .proj-card { position: absolute; inset: 0; width: min(78cqw, 380px); height: auto; margin-inline: auto; border-radius: 16px; transform-origin: center; box-shadow: 0 12px 24px #0009; }
  .shared-sections .project-slide .proj-card img { -webkit-user-drag: none; user-select: none; }
  .shared-sections .project-slide .proj-card__num { height: 52px; padding: 0 14px; font-size: 20px; font-weight: 600; font-style: normal; letter-spacing: -.025em; }
  .shared-sections .project-slide .proj-card__img { aspect-ratio: 3 / 4; }
  .shared-sections .project-slide .proj-card .tab-btn { width: auto; min-width: 72%; min-height: 46px; padding: 8px 18px; font-size: 22px; font-weight: 600; letter-spacing: -.025em; }
  .shared-sections .project-slide .proj-card:focus-visible { outline: 3px solid #2da8ff; outline-offset: 4px; }
  /* Phone deck. site.js adds .is-deck; without JS this stays a plain swipe
     carousel. Each card's place in the stack comes from its distance to the
     current card (--project-current, set once per change), and CSS transitions
     do all the motion. During a drag site.js sets only --drag on the front card
     and --rise on the card it reveals. */
  .shared-sections .is-deck .carousel__track { overflow: clip; touch-action: pan-y pinch-zoom; scroll-snap-type: none; }
  .shared-sections .is-deck .project-slide {
    grid-area: 1 / 1;
    --o: calc(var(--index) - var(--project-current));
    --abs: max(var(--o), calc(-1 * var(--o)));
    --a: min(3, var(--abs));
    --s: calc(var(--o) / max(1, var(--abs)));
  }
  /* Cards past the visible stack sit fully covered at the back position, so they
     are hidden: no painting, decoding or compositing for them. */
  .shared-sections .is-deck .project-slide:not([data-near]) { visibility: hidden; }
  .shared-sections .is-deck .project-slide > .proj-card {
    /* Layers step by 2 so the card a drag uncovers (any --rise) moves up one,
       directly under the front card and above the top card of the other pile. */
    z-index: calc(100 - 2 * var(--abs) + min(1, var(--rise, 0) * 1000));
    transform: translateX(calc(18px * var(--a) * var(--s) * (1 - var(--rise, 0)) + var(--drag, 0) * 1px)) translateY(calc(4px * var(--a) * (1 - var(--rise, 0)))) scale(calc(1 - .045 * var(--a) * (1 - var(--rise, 0)))) rotate(calc((var(--a) * var(--s) * (1 - var(--rise, 0)) + var(--drag, 0) * .02) * 1deg));
    transition: transform .45s cubic-bezier(.25, 1, .5, 1);
    -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
  }
  /* Exiting cards drop the settle transition so nothing runs underneath the exit
     and replays when it ends. */
  .shared-sections .is-deck .project-slide > .proj-card.is-held,
  .shared-sections .is-deck .project-slide > .proj-card:is(.is-out-left, .is-out-right, .is-in-left, .is-in-right),
  .shared-sections .is-deck.is-jump .project-slide > .proj-card { transition: none; }
  .shared-sections .is-deck.is-fast .project-slide > .proj-card { transition-duration: .25s; }
  /* An exit is two steps, and each step's layer is a plain class value, never
     animated: out on top (300), then the moment it reaches its farthest point
     site.js swaps to the tuck, which sits under the front card (99) and above
     the other pile (98) for the whole way back in. */
  .shared-sections .is-deck .project-slide > .proj-card:is(.is-out-left, .is-out-right) { z-index: 300; }
  .shared-sections .is-deck .project-slide > .proj-card:is(.is-in-left, .is-in-right) { z-index: 99; }
  .shared-sections .is-deck .project-slide > .proj-card.is-out-left { animation: project-out-left .25s cubic-bezier(.2, .6, .4, 1) both; }
  .shared-sections .is-deck .project-slide > .proj-card.is-out-right { animation: project-out-right .25s cubic-bezier(.2, .6, .4, 1) both; }
  .shared-sections .is-deck .project-slide > .proj-card.is-in-left { animation: project-in-left .3s cubic-bezier(.3, .7, .4, 1) both; }
  .shared-sections .is-deck .project-slide > .proj-card.is-in-right { animation: project-in-right .3s cubic-bezier(.3, .7, .4, 1) both; }
  .shared-sections .is-deck.is-fast .project-slide > .proj-card:is(.is-out-left, .is-out-right) { animation-duration: .14s; }
  .shared-sections .is-deck.is-fast .project-slide > .proj-card:is(.is-in-left, .is-in-right) { animation-duration: .16s; }
  /* Controls follow --project-current from site.js instead of the scroll timeline. */
  .shared-sections .is-deck .project-controls { animation: none; }
  .shared-sections .is-deck .project-dot-track { transition: translate .35s ease; }
  .shared-sections [data-carousel-section].is-deck .projects-head::after { width: max(20px, calc(var(--carousel-p, 0) * 100%)); animation: project-progress-glow 3.6s ease-in-out infinite; transition: width .35s ease; }
  @media (prefers-reduced-motion: reduce) {
    .shared-sections .is-deck .project-slide > .proj-card { transition: none; animation: none !important; }
  }
}

/* Phone deck exits. Out: from where the finger let go (--from, 0 for arrows
   and dots) to 76cqw at 80% size, where the card's inner edge is just past the
   front card's edge even with the tilt. In: from there to its resting place
   one layer deep in that pile, the same values the stack rules give it. Both
   ends are explicit so Safari never fills a frame from stale style. */
@keyframes project-out-left {
  from { transform: translateX(calc(var(--from, 0) * 1px)) translateY(0) scale(1) rotate(calc(var(--from, 0) * .02deg)); }
  to { transform: translateX(-76cqw) translateY(0) scale(.8) rotate(-4deg); }
}
@keyframes project-in-left {
  from { transform: translateX(-76cqw) translateY(0) scale(.8) rotate(-4deg); }
  to { transform: translateX(-18px) translateY(4px) scale(.955) rotate(-1deg); }
}
@keyframes project-out-right {
  from { transform: translateX(calc(var(--from, 0) * 1px)) translateY(0) scale(1) rotate(calc(var(--from, 0) * .02deg)); }
  to { transform: translateX(76cqw) translateY(0) scale(.8) rotate(4deg); }
}
@keyframes project-in-right {
  from { transform: translateX(76cqw) translateY(0) scale(.8) rotate(4deg); }
  to { transform: translateX(18px) translateY(4px) scale(.955) rotate(1deg); }
}
@media (prefers-reduced-motion: reduce) {
  .projects-section .carousel__track { scroll-behavior: auto; }
}

/* About page, phone: matches the live mobile layout. The storefront photo leads
   full width with the social icons and phone pill over its top-right corner and
   the brand mark bottom-left; then the heading, copy and View Our Projects. The
   owner form follows on the plain dark band, without the photo strip. */
@media (max-width: 750px) {
  .shared-sections .about-grid { display: flex; flex-direction: column; min-height: 0; container-type: inline-size; }
  .shared-sections .about-grid__art { order: -1; display: block; border: 0; border-bottom: 2px solid #f1f1f1; overflow: clip; }
  .shared-sections .about-grid__art picture { display: block; }
  .shared-sections .about-grid__art picture + picture { display: none; }
  .shared-sections .about-grid__art img { display: block; width: 104.2%; max-width: none; margin-left: -2.1%; height: auto; aspect-ratio: 559 / 366; object-fit: cover; }
  .shared-sections .about-grid__copy { padding: 5px 2.93cqw 18px; background: linear-gradient(0deg, #23282d 0%, #1a1c1e 23.51%, #101112 62.81%, #1a1c1e 100%); }
  .shared-sections .about-grid__copy .hero__top { position: absolute; top: 0; left: 0; right: 0; z-index: 1; height: calc(104.2cqw * 366 / 559); max-height: none; display: flex; justify-content: flex-end; align-items: flex-start; gap: 6px; margin: 0; padding: 12px 6px 0; }
  .shared-sections .about-grid__copy :is(.icon-btn, .phone-pill) { border: 1px solid #c4c4c4; background: linear-gradient(11deg, #e10600 0%, #035691 73.33%, #2da8ff 100%); box-shadow: 4px 4px 8px 2px rgba(0, 0, 0, .6); }
  .shared-sections .about-grid__copy .icon-btn { width: 40px; height: 40px; border-radius: 50%; }
  .shared-sections .about-grid__copy .icon-btn svg { width: 24.6px; height: 24.6px; }
  .shared-sections .about-grid__copy .icon-btn[aria-label="Instagram"] svg :is(rect, circle[fill="none"]) { stroke-width: 1.8; }
  .shared-sections .about-grid__copy .phone-pill { height: 40px; min-height: 40px; padding: 0 10px 1px; border-radius: 9px; font-size: 20px; line-height: 1; }
  .shared-sections .about-grid__copy .hero__top > a:nth-child(3) { order: -1; } /* Facebook before Instagram, as live */
  .shared-sections .about-grid__copy .hero__brand { position: absolute; top: auto; left: 3.4cqw; bottom: 0; height: auto; margin: 0; font-family: var(--display); font-size: 12px; font-weight: 500; line-height: 1; text-transform: uppercase; text-decoration: underline; background: linear-gradient(31deg, #e10600, #fff 51.46%, #2da8ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
  .shared-sections .about-grid__copy h1 { margin: 0 0 10px; font-size: 11.2cqw; font-weight: 700; line-height: 1.1; color: #f1f1f1; }
  .shared-sections .about-grid__copy p { margin: 0; font-size: 5.39cqw; line-height: 1; letter-spacing: normal; color: #c4c4c4; }
  .shared-sections .about-grid__copy .btn { display: inline-flex; align-items: center; justify-content: center; width: 305px; max-width: 100%; min-height: 63px; margin-top: 20px; padding: 0 12px; border: .8px solid #f1f1f1; border-radius: 6px; font-family: var(--display); font-size: 32px; font-weight: 500; background: linear-gradient(11deg, #e10600 0%, #035691 79%, #2da8ff 100%); box-shadow: 0 2px 3px 1px #171a1d; }
  .shared-sections .about-grid + .form-band--intro { padding-top: 6px; }
  .shared-sections .about-grid + .form-band--intro .form-band__strip { display: none; }
  .shared-sections .about-grid + .form-band--intro .form-intro { margin-bottom: 6px; }
  .shared-sections .about-grid + .form-band--intro .form-intro h2 { font-size: 36px; font-weight: 700; letter-spacing: -.02em; color: #f1f1f1; white-space: nowrap; }
  .shared-sections .about-grid + .form-band--intro .form-intro p { font-size: 22px; line-height: 1.3; color: #c4c4c4; }
}

@font-face {
  font-family: "USA Oswald Regular";
  src: url("https://static.wixstatic.com/ufonts/91fdf4_395e0552f5704c5c85f91ff6c1907bb4/woff2/file.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "USA Oswald Medium";
  src: url("https://static.parastorage.com/tag-bundler/api/v1/fonts-cache/googlefont/woff2/s/oswald/v16/cgaIrkaP9Empe8_PwXbajFtXRa8TVwTICgirnJhmVJw.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Property-type pages use the smaller live mobile logo and heading. */
@media (max-width: 750px) {
  .page-property-type .hero__logo { left: 1vw; top: 1.91vw; width: 49.5vw; height: 23.86vw; }
  .page-property-type .hero__side { min-height: 58.06vw; }
  .page-property-type .hero .hero__copy > h1 { font-size: 8.7576vw; letter-spacing: -.03em; text-wrap: wrap; margin-bottom: 10px; }
  .page-property-type .hero__copy { padding-left: 2.83vw; padding-right: 2.53vw; padding-bottom: 33.33vw; }
  .page-property-type .hero .hero__top { margin-bottom: calc(12.9vw - 34.4px); }
  .page-property-type .hero__lead { font-size: 4.3788vw; color: #c4c4c4; margin-bottom: 15px; }
  .page-property-type .hero__bg { top: calc(58.06vw - 1px); bottom: 0; height: auto; }
  .page-property-type .hero__bg img { opacity: .55; object-position: center; }
  .page-property-type .hero__bg::after { background: linear-gradient(0deg, #23282d 0%, rgba(26, 28, 30, .3) 23.51%, rgba(0, 0, 0, .4) 62.81%, rgba(35, 40, 45, .95) 100%); }
  .band--wwd { background: #23282d; }
  .band--wwd > .wrap { row-gap: 12px; }
  .band--wwd > .wrap > .wwd__list > .pro-list { margin-top: 0; }
  .band--wwd > .wrap > .prose { margin-inline: -1px; }
  .band--wwd > .wrap > .prose > h2 { font-family: "USA Oswald Medium", Oswald, sans-serif; font-size: 8.391vw; font-weight: 400; line-height: 1.2; letter-spacing: -.02em; color: #f1f1f1; margin-bottom: 5px; text-shadow: -.5px .5px 1.72px #171a1d; }
  .page-property-type .band--wwd > .wrap > .prose > h2 { font-size: 7.218vw; }
  .band--wwd > .wrap > .prose > p { font-family: "USA Oswald Regular", Oswald, sans-serif; font-size: 16px; font-weight: 400; line-height: 1.1; letter-spacing: -.01em; color: #c4c4c4; margin: 0 0 17.6px; text-shadow: -1.93px 2.3px 3px rgba(23, 26, 29, .8); }
  .band--wwd > .wrap > .prose > p:last-child { margin-bottom: 0; }
  .page-property-type .who__about,
  .page-local-property-type .who__about,
  .page-property-area .who__about,
  .page-county .who__about { order: 3; }
}

/* Contact's mobile composition; other estimate forms keep their own layout. */
@media (max-width: 750px) {
  .shared-sections .contact-hero--contact { padding: 24px 4.03vw 8px; background: linear-gradient(0deg, #1a1c1e, #171a1d); }
  .contact-hero--contact .contact-hero__bg { top: -52px; }
  .contact-hero--contact .contact-hero__bg picture { display: block; height: 100%; }
  .contact-hero--contact .contact-hero__bg img { height: max(100%, 100svh); object-position: center top; filter: none; opacity: .2; }
  .contact-hero--contact .form-intro { margin-bottom: 15px; }
  .contact-hero--contact .form-intro h1 { font-size: 8.33vw; font-weight: 700; line-height: 1; white-space: nowrap; color: #f1f1f1; }
  .contact-hero--contact .form-intro p { margin-top: 8px; font-size: 20px; font-weight: 400; line-height: 1; color: #c4c4c4; }
  .contact-hero--contact .form-card { max-width: none; border: 1px solid #f1f1f1; border-radius: 9px; box-shadow: 0 2px 5px #0009; background: linear-gradient(12deg, #4c0201, #035691); }
  .estimate-hero .form-card { border-radius: 9px; }
  .contact-hero--contact .form { padding: 12px 23px 38px; gap: 18px; }
  .contact-hero--contact .form label { gap: 8px; font-size: 16px; font-weight: 400; line-height: 20px; }
  .contact-hero--contact .form input { height: 37px; font-size: 16px; border-radius: 6px; }
  .contact-hero--contact .form textarea { height: 90px; min-height: 90px; border-radius: 6px; font-size: 16px; }
  .contact-hero--contact .form__send { margin-top: 0; }
  .contact-hero--contact .form__send .btn { width: 100%; min-height: 55px; padding: 0 12px; border: 2.4px solid rgba(241, 241, 241, .75); border-radius: 100px; background: transparent; font-size: 24px; font-weight: 400; line-height: 1; box-shadow: none; }
  .contact-hero--contact .form__status:empty { min-height: 0; margin: 0; }
}