/* Micro Core 1.0.0. Micro Plumbing, Omaha. Logo red and graphite, concrete paper, Archivo at two widths:
   extended heavy italic for statements (the PLUMBING wordmark), normal width for reading. */
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 400 800; font-stretch: 100% 125%; font-display: swap; src: url(../fonts/archivo-latin-wdth-normal.woff2) format("woff2"); }
@font-face { font-family: "Archivo"; font-style: italic; font-weight: 400 800; font-stretch: 100% 125%; font-display: swap; src: url(../fonts/archivo-latin-wdth-italic.woff2) format("woff2"); }

:root {
  --red: #880710; --red-2: #A50D19; --red-ink: #5C040B;
  --ink: #151617; --ink-2: #1E1F21; --graphite: #292929; --iron: #3B3C3F;
  --steel: #8A8E94; --mist: #C8CACD; --line: #DADAD5; --paper: #F1F1EE; --white: #fff;
  --f: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --wrap: 1240px; --ease: cubic-bezier(.2,.7,.2,1);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 110px; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html, .rv-track { scroll-behavior: auto; } *, *::before, *::after { animation: none !important; transition: none !important; } }
body.mpl { margin: 0; background: var(--paper); color: #2B2C2E; font: 400 17px/1.62 var(--f); font-stretch: 100%; -webkit-font-smoothing: antialiased; }
:where(.mpl) img { max-width: 100%; height: auto; display: block; }
:where(.mpl) a { color: inherit; }
:where(.mpl) h1, :where(.mpl) h2, :where(.mpl) h3 { margin: 0; color: var(--ink); }
:where(.mpl) p { margin: 0 0 1em; }
:where(.mpl) ul, :where(.mpl) ol { margin: 0; padding: 0; list-style: none; }
.mpl :focus-visible { outline: 3px solid var(--red-2); outline-offset: 3px; }
:is(.util, .hero, .phero, .story, .five, .hire, .next, .three, .ft, .side-c, .job-l, .callbar, .emh, .emb, .sd-w, .rv-score, .mn-em, .side-emb) :focus-visible { outline-color: #fff; }
.wrap { width: min(var(--wrap), 100% - 48px); margin: 0 auto; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.sr:focus { position: fixed !important; left: 12px; top: 12px; width: auto; height: auto; clip: auto; z-index: 200; background: #fff; padding: 10px 14px; }
.ic { flex: none; }

/* Type: the statement face is the logo's PLUMBING, extended heavy italic capitals. */
:where(.mpl) h1, :where(.mpl) h2, .d { font-family: var(--f); font-stretch: 125%; font-weight: 800; font-style: italic; text-transform: uppercase; letter-spacing: -.01em; line-height: .94; text-wrap: balance; }
:where(.mpl) h2 { font-size: clamp(34px, 4.2vw, 60px); }
:where(.mpl) h3 { font-stretch: 108%; font-weight: 700; font-size: 20px; line-height: 1.25; }
.kick { font-stretch: 112%; font-weight: 700; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--red); margin: 0 0 16px; }
.lede { font-size: 19px; line-height: 1.6; color: #4A4C50; max-width: 36em; }
.sh { display: grid; gap: 18px; margin-bottom: 48px; }
.sh-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: end; gap: 48px; }
.sh .lede { margin: 0; }

/* Buttons and text links */
.btn { white-space: nowrap; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 54px; padding: 0 26px; border-radius: 3px; border: 2px solid transparent; font: 750 15px/1 var(--f); font-stretch: 112%; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: background .2s, border-color .2s, color .2s, transform .2s; }
.btn:active { transform: translateY(1px); }
.btn-r { background: var(--red); color: #fff !important; }
.btn-r:hover { background: var(--red-2); }
.btn-o { border-color: currentColor; color: var(--ink); background: transparent; }
.btn-o:hover { background: var(--ink); color: #fff !important; border-color: var(--ink); }
.btn-w { background: #fff; color: var(--ink) !important; }
.btn-w:hover { background: var(--paper); }
.btn-s { min-height: 44px; padding: 0 18px; font-size: 13.5px; }
.ctas { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.tl { display: inline-flex; align-items: center; gap: 12px; font: 750 14px/1.2 var(--f); font-stretch: 112%; letter-spacing: .08em; text-transform: uppercase; color: var(--red) !important; text-decoration: none; }
.tl::after { content: ""; width: 26px; height: 2px; background: currentColor; transition: width .3s var(--ease); }
.tl:hover::after { width: 42px; }
.tl-w { color: #fff !important; }

/* Concept note */
.concept { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 9px 48px; background: #000; color: var(--mist); font-size: 13px; text-align: center; position: relative; }
.concept b { color: #fff; font-stretch: 112%; text-transform: uppercase; letter-spacing: .08em; }
.concept button { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); background: none; border: 0; color: #fff; font-size: 22px; cursor: pointer; line-height: 1; }

/* Utility bar and header */
.util { background: var(--graphite); color: var(--mist); font-size: 13.5px; }
.util .wrap { display: flex; justify-content: space-between; align-items: center; gap: 18px; min-height: 38px; }
.util i { display: inline-block; width: 14px; height: 2px; background: var(--red-2); margin: 0 12px; vertical-align: middle; }
.u-r { display: flex; gap: 22px; }
.util a { text-decoration: none; color: #fff; }
.util a:hover { text-decoration: underline; }
.util a b { display: inline-block; margin-right: 8px; padding: 2px 8px; border-radius: 2px; background: var(--red); font-stretch: 112%; font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; }
.hdr { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.97); border-bottom: 1px solid var(--line); backdrop-filter: blur(10px); transition: box-shadow .3s; }
.admin-bar .hdr { top: 32px; }
.hdr.is-s { box-shadow: 0 14px 30px -20px rgba(0,0,0,.35); }
.hdr .wrap { display: flex; align-items: center; gap: 22px; min-height: 86px; }
.logo { flex: none; margin-right: auto; }
.logo img { height: 56px; width: auto; transition: height .3s var(--ease); }
.hdr.is-s .logo img { height: 46px; }
.main { display: flex; align-items: center; gap: 24px; }
.main > a, .has-mega > a { position: relative; display: block; padding: 32px 0; font: 700 13.5px/1 var(--f); font-stretch: 108%; letter-spacing: .07em; text-transform: uppercase; text-decoration: none; color: var(--ink); white-space: nowrap; }
.main > a::after, .has-mega > a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 24px; height: 2px; background: var(--red); transform: scaleX(0); transform-origin: left; transition: transform .3s var(--ease); }
.main > a:hover::after, .main > a[aria-current]::after, .has-mega:hover > a::after, .has-mega:focus-within > a::after, .has-mega > a[aria-current]::after { transform: scaleX(1); }
.main .em { color: var(--red); display: flex; align-items: center; gap: 8px; }
.main .em i { width: 8px; height: 8px; border-radius: 50%; background: var(--red-2); box-shadow: 0 0 0 0 rgba(165,13,25,.5); animation: mpl-ping 2.2s infinite; }
@keyframes mpl-ping { 0% { box-shadow: 0 0 0 0 rgba(165,13,25,.55); } 70%, 100% { box-shadow: 0 0 0 9px rgba(165,13,25,0); } }
.has-mega { position: relative; }
.mega { position: absolute; top: 100%; left: -28px; width: 720px; padding-top: 0; opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .2s, transform .25s var(--ease), visibility .2s; }
.has-mega:hover .mega, .has-mega:focus-within .mega { opacity: 1; visibility: visible; transform: none; }
.mega-in { display: grid; grid-template-columns: 1fr 1fr; background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--red); box-shadow: 0 30px 60px -24px rgba(0,0,0,.35); }
.mega a { display: flex; gap: 14px; padding: 18px 20px; text-decoration: none; border-bottom: 1px solid var(--line); color: var(--ink); }
.mega a:nth-child(odd) { border-right: 1px solid var(--line); }
.mega a .ic { color: var(--red); margin-top: 2px; }
.mega a b { display: block; font-stretch: 108%; font-weight: 700; font-size: 15.5px; }
.mega a small { display: block; font-size: 13.5px; line-height: 1.45; color: #6A6C70; margin-top: 3px; }
.mega a:hover { background: var(--paper); }
.hphone { display: flex; align-items: center; gap: 9px; text-decoration: none; font-stretch: 112%; font-weight: 800; font-size: 18px; color: var(--ink) !important; white-space: nowrap; }
.hphone .ic { color: var(--red); }
.menu { display: none; width: 48px; height: 48px; border: 0; background: var(--ink); border-radius: 3px; cursor: pointer; flex-direction: column; align-items: center; justify-content: center; gap: 5px; }
.menu span { width: 20px; height: 2px; background: #fff; transition: transform .25s, opacity .25s; }
.is-menu .menu span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.is-menu .menu span:nth-child(2) { opacity: 0; }
.is-menu .menu span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.mnav { position: fixed; inset: 0; z-index: 45; background: #fff; padding: 140px 24px 120px; overflow-y: auto; opacity: 0; visibility: hidden; transition: opacity .25s, visibility .25s; }
.is-menu .mnav { opacity: 1; visibility: visible; }
.mnav nav > a { display: block; padding: 14px 0; border-bottom: 1px solid var(--line); font: 800 26px/1.1 var(--f); font-stretch: 125%; font-style: italic; text-transform: uppercase; text-decoration: none; color: var(--ink); }
.mnav nav > a.em { color: var(--red); }
.mnav-cta { display: grid; gap: 10px; margin-top: 26px; }

/* Home hero: the van at sundown over the city, full bleed. Copy sits in the dark left third. */
.h1-k { display: block; margin-bottom: 22px; font-size: 14px; font-style: normal; font-weight: 700; font-stretch: 112%; letter-spacing: .16em; line-height: 1.4; color: var(--mist); }
.hero .lede { color: #D3D4D7; margin: 28px 0 32px; }
.hero .btn-o { color: #fff; }
.hero .btn-o:hover { background: #fff; color: var(--ink) !important; border-color: #fff; }
.trust { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 34px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.14); font-size: 14.5px; color: #C9CBCE; }
.trust li, .trust a { display: flex; align-items: center; gap: 8px; text-decoration: none; }
.trust .ic { color: var(--red); }
.trust a:hover { color: #fff; }

/* Problem finder */
.tri { background: #fff; color: var(--ink); border-top: 6px solid var(--red); padding: 30px 30px 24px; box-shadow: 0 40px 80px -30px rgba(0,0,0,.75); border-radius: 0 0 4px 4px; }
.tri-h { font-size: 30px; }
.tri-p { margin: 12px 0 18px; font-size: 15.5px; color: #5A5C60; }
.tri-l { border-top: 1px solid var(--line); }
.tri-l > li { border-bottom: 1px solid var(--line); }
.tri-b { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 2px; text-decoration: none; font-stretch: 106%; font-weight: 650; font-size: 16.5px; color: var(--ink) !important; }
.tri-b i { width: 22px; height: 22px; flex: none; position: relative; border-radius: 50%; background: var(--paper); transition: background .2s, transform .3s var(--ease); }
.tri-b i::before, .tri-b i::after { content: ""; position: absolute; left: 6px; right: 6px; top: 10px; height: 2px; background: var(--red); }
.tri-b i::after { transform: rotate(90deg); transition: transform .3s var(--ease); }
.tri-b[aria-expanded="true"] i { background: var(--red); }
.tri-b[aria-expanded="true"] i::before, .tri-b[aria-expanded="true"] i::after { background: #fff; }
.tri-b[aria-expanded="true"] i::after { transform: rotate(0); }
.tri-b:hover { color: var(--red) !important; }
.tri-b.urgent span::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--red-2); margin-right: 10px; vertical-align: 2px; animation: mpl-ping 2.2s infinite; }
.tri-a { padding: 0 2px 18px; }
.tri-a p { font-size: 15.5px; color: #4A4C50; margin-bottom: 14px; }
.tri-x { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }

/* The main line: a pipe down the left of the page that fills as you read, with a fitting at each section. */
.flow { position: relative; }
.flow > section { position: relative; }
@media (min-width: 1380px) {
  .flow::before, .flow::after { content: ""; position: absolute; top: 0; bottom: 0; left: calc((100vw - var(--wrap)) / 2 - 64px); width: 10px; border-radius: 0 0 6px 6px; z-index: 3; pointer-events: none; }
  .flow::before { background: linear-gradient(90deg, #5a5d62, #b9bcc0 45%, #6c6f74); box-shadow: 0 0 0 1px rgba(0,0,0,.12); }
  .flow::after { bottom: auto; height: calc(var(--p, 0) * 100%); background: linear-gradient(90deg, #6e0710, #d41f2a 45%, #7a0812); transition: height .12s linear; }
  .flow > section[data-fit]::before { content: ""; position: absolute; z-index: 4; top: 64px; left: calc((100vw - var(--wrap)) / 2 - 69px); width: 20px; height: 26px; border-radius: 3px; background: linear-gradient(90deg, #3c3e42, #8f9399 45%, #3c3e42); box-shadow: 0 0 0 2px rgba(0,0,0,.18); transition: background .4s; }
  .flow > section[data-fit].is-on::before { background: linear-gradient(90deg, var(--red-ink), var(--red) 45%, var(--red-ink)); }
  .flow > section[data-fit]::after { content: attr(data-fit); position: absolute; z-index: 4; top: 104px; left: calc((100vw - var(--wrap)) / 2 - 40px); transform: translateX(-50%) rotate(180deg); writing-mode: vertical-rl; font: 700 11px/1 var(--f); font-stretch: 112%; letter-spacing: .2em; text-transform: uppercase; color: #6A6C70; white-space: nowrap; padding: 10px 0; }
  .flow > section.story[data-fit]::after, .flow > section.five[data-fit]::after, .flow > section.hire[data-fit]::after { color: rgba(255,255,255,.6); }
}

/* Services grid */
.svc { padding: clamp(80px, 9vw, 130px) 0; }
.svc-g { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.svc-c { position: relative; display: flex; flex-direction: column; gap: 10px; height: 100%; min-height: 240px; padding: 30px 26px 56px; background: #fff; border: 1px solid var(--line); text-decoration: none; transition: border-color .2s, transform .3s var(--ease), box-shadow .3s; }
.svc-c::before { content: ""; position: absolute; left: -1px; right: -1px; top: -1px; height: 4px; background: var(--red); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease); }
.svc-c .ic { color: var(--red); margin-bottom: 10px; }
.svc-c b { font-stretch: 112%; font-weight: 800; font-size: 20px; line-height: 1.2; color: var(--ink); }
.svc-c span { font-size: 15.5px; line-height: 1.5; color: #5A5C60; }
.svc-c .go { position: absolute; right: 22px; bottom: 22px; width: 30px; height: 30px; border-radius: 50%; border: 1.5px solid var(--line); transition: background .2s, border-color .2s; }
.svc-c .go::after { content: ""; position: absolute; left: 9px; top: 10px; width: 8px; height: 8px; border-top: 2px solid var(--ink); border-right: 2px solid var(--ink); transform: rotate(45deg); }
.svc-c:hover { border-color: var(--ink); transform: translateY(-3px); box-shadow: 0 24px 40px -28px rgba(0,0,0,.45); }
.svc-c:hover::before { transform: scaleX(1); }
.svc-c:hover .go { background: var(--red); border-color: var(--red); }
.svc-c:hover .go::after { border-color: #fff; }

/* Since 1996 */
.story { background: var(--red); color: #fff; padding: clamp(80px, 9vw, 130px) 0; overflow: hidden; }
.story-g { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: center; }
.story-n { display: flex; align-items: flex-end; gap: 14px; line-height: .78; }
.story-n span { font: 800 clamp(150px, 20vw, 300px)/.78 var(--f); font-stretch: 125%; font-style: italic; letter-spacing: -.04em; color: #fff; }
.story-n small { font: 800 22px/1 var(--f); font-stretch: 125%; font-style: italic; text-transform: uppercase; color: rgba(255,255,255,.75); margin-bottom: 14px; }
.story h2 { color: #fff; font-size: clamp(34px, 3.8vw, 54px); margin-bottom: 24px; }
.story p { font-size: 18.5px; color: rgba(255,255,255,.9); max-width: 38em; }

/* The first five minutes */
.five { background: var(--ink); color: #fff; padding: clamp(80px, 9vw, 130px) 0; }
.five h2 { color: #fff; }
.five .kick { color: #fff; }
.five .lede { color: #C9CBCE; }
.five-l { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid rgba(255,255,255,.16); }
.five-l li { padding: 34px 28px 10px 0; position: relative; }
.five-l li + li { padding-left: 28px; border-left: 1px solid rgba(255,255,255,.1); }
.five-l li::before { content: ""; position: absolute; top: -1px; left: 0; width: 56px; height: 3px; background: var(--red-2); }
.five-l li + li::before { left: 28px; }
.five-l .n { display: block; font: 800 64px/1 var(--f); font-stretch: 125%; font-style: italic; color: #fff; margin-bottom: 18px; }
.five-l h3 { color: #fff; margin-bottom: 10px; }
.five-l p { font-size: 15.5px; color: #B9BBBF; }
.five-more { margin: 30px 0 0; }

/* Reviews */
.rev { background: #fff; padding: clamp(80px, 9vw, 130px) 0; }
.rev-lead { margin: 0 0 64px; max-width: 980px; }
.rev-lead blockquote { margin: 0; position: relative; padding-left: clamp(58px, 7vw, 96px); }
.rev-lead blockquote::before { content: "\201C"; position: absolute; left: 0; top: -.18em; font: 800 clamp(90px, 11vw, 160px)/1 var(--f); font-stretch: 125%; color: var(--red); }
.rev-lead p { font: 800 clamp(32px, 4vw, 58px)/1.02 var(--f); font-stretch: 118%; font-style: italic; text-transform: uppercase; letter-spacing: -.01em; color: var(--ink); margin: 0; }
.rev-lead figcaption { margin-top: 22px; padding-left: clamp(58px, 7vw, 96px); font-size: 14px; letter-spacing: .12em; text-transform: uppercase; font-stretch: 112%; font-weight: 700; color: #6A6C70; }
.rev-g { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 1px solid var(--line); }
.rev-g li { padding: 30px 30px 30px 0; }
.rev-g li + li { padding-left: 30px; border-left: 1px solid var(--line); }
.rev-g figure { margin: 0; }
.rev-g blockquote { margin: 0 0 16px; }
.rev-g p { font-size: 19px; line-height: 1.5; color: var(--ink); margin: 0; }
.rev-g figcaption b { font-stretch: 112%; font-size: 14px; letter-spacing: .1em; text-transform: uppercase; color: var(--red); }
.rev-more { display: flex; flex-wrap: wrap; gap: 30px; margin: 36px 0 0; }

/* Service area */
.area { padding: clamp(80px, 9vw, 130px) 0; }
.area-g { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(36px, 6vw, 90px); align-items: center; }
.towns { display: flex; flex-wrap: wrap; gap: 8px; margin: 26px 0 20px; }
.towns a { display: block; padding: 9px 14px; border: 1.5px solid var(--line); background: #fff; border-radius: 3px; text-decoration: none; font-stretch: 108%; font-weight: 650; font-size: 15px; transition: border-color .2s, color .2s; }
.towns a:hover { border-color: var(--red); color: var(--red); }
.area-note { font-size: 15px; color: #6A6C70; }
.area-m { background: var(--ink); padding: 18px; border-radius: 4px; box-shadow: 0 40px 70px -40px rgba(0,0,0,.6); }
.map { display: block; width: 100%; height: auto; font-family: var(--f); }
.m-grid { stroke: rgba(255,255,255,.05); stroke-width: 1; }
.m-river { fill: none; stroke: #3F5566; stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; opacity: .8; }
.m-platte { stroke-width: 4; }
.m-rl { fill: #6C8296; font-size: 11px; letter-spacing: .2em; text-transform: uppercase; font-stretch: 112%; font-weight: 700; }
.m-iowa { fill: rgba(255,255,255,.14); font-size: 13px; letter-spacing: .4em; font-weight: 800; font-stretch: 125%; text-anchor: middle; }
.m-line { fill: none; stroke: var(--red-2); stroke-width: 3; stroke-linecap: round; stroke-dasharray: 900; stroke-dashoffset: 0; }
.js .m-line { stroke-dashoffset: 900; }
.js .area-m.is-on .m-line { animation: mpl-draw 1.6s var(--ease) forwards; animation-delay: var(--d, 0s); }
@keyframes mpl-draw { to { stroke-dashoffset: 0; } }
.m-town circle { fill: #fff; stroke: var(--ink); stroke-width: 3; }
.m-town text { fill: #E6E7E9; font-size: 15px; font-weight: 650; font-stretch: 106%; }
.m-town text.big { font-size: 19px; font-weight: 800; font-stretch: 118%; font-style: italic; text-transform: uppercase; }
.m-town:hover text { fill: #fff; text-decoration: underline; }
.m-shop circle { fill: var(--red-2); stroke: #fff; stroke-width: 3; }
.m-shop .m-ring { fill: none; stroke: var(--red-2); stroke-width: 2; opacity: .6; transform-origin: center; transform-box: fill-box; animation: mpl-ring 2.6s infinite; }
@keyframes mpl-ring { from { transform: scale(.5); opacity: .8; } to { transform: scale(1.5); opacity: 0; } }
.m-shop text { fill: #fff; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; font-stretch: 112%; }

/* Brands */
.brands { background: #fff; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 38px 0; }
.brands .kick { color: #6A6C70; text-align: center; margin-bottom: 20px; }
.brands ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px 34px; }
.brands li { font: 800 20px/1 var(--f); font-stretch: 122%; font-style: italic; text-transform: uppercase; color: #808388; letter-spacing: -.01em; }

/* Careers band */
.hire { background: var(--graphite); color: #fff; padding: clamp(70px, 8vw, 110px) 0; }
.hire-g { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(30px, 5vw, 80px); align-items: end; }
.hire h2 { color: #fff; font-size: clamp(30px, 3.4vw, 48px); }
.hire .kick { color: #fff; }
.hire p { color: #CFD0D3; font-size: 18px; margin-bottom: 26px; }

/* Request service */
.req { padding: clamp(80px, 9vw, 130px) 0; }
.req-g { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(36px, 6vw, 90px); align-items: start; }
.req-c .lede { margin: 20px 0 34px; }
.req-call span { display: block; font-stretch: 112%; font-weight: 700; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: #6A6C70; margin-bottom: 8px; }
.req-tel { display: inline-block; font: 800 clamp(34px, 4vw, 54px)/1 var(--f); font-stretch: 125%; font-style: italic; color: var(--red) !important; text-decoration: none; letter-spacing: -.01em; }
.req-tel:hover { color: var(--red-2) !important; }
.req address { font-style: normal; margin-top: 28px; color: #5A5C60; font-size: 15.5px; }
/* 1.4.5: forms are cards with a colored header band so each one is clearly its own form. */
.frm { position: relative; display: block; background: #fff; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; box-shadow: 0 30px 60px -38px rgba(21,22,23,.5); }
.frm-head { display: flex; align-items: center; gap: 14px; padding: 18px clamp(22px, 3vw, 34px); color: #fff; }
.frm-head-ic { display: grid; place-items: center; width: 42px; height: 42px; flex: none; border-radius: 11px; background: rgba(255,255,255,.16); }
.frm-head-ic .ic { width: 23px; height: 23px; color: #fff; }
.frm-head-t { display: grid; gap: 3px; }
.frm-head-t b { font: 800 clamp(19px, 1.9vw, 23px)/1 var(--f); font-stretch: 118%; font-style: italic; text-transform: uppercase; letter-spacing: .005em; }
.frm-head-t span { font-size: 13.5px; font-weight: 500; color: rgba(255,255,255,.85); line-height: 1.35; }
.frm[data-form="svc"] .frm-head { background: var(--red); }
.frm[data-form="urgent"] { border-top: 4px solid var(--red-2); }
.frm[data-form="urgent"] .frm-head { background: var(--ink); }
.frm[data-form="urgent"] .frm-head-ic { background: var(--red); }
.frm[data-form="job"] .frm-head { background: var(--iron); }
.frm[data-form="job"] .frm-head-ic { background: var(--red); }
.frm-body { position: relative; display: grid; gap: 16px; padding: clamp(24px, 3.2vw, 38px); }
.frm.bk { display: grid; border-top: 6px solid var(--red); }

/* custom select arrow so the dropdowns do not look like raw browser widgets */
.frm select { appearance: none; -webkit-appearance: none; -moz-appearance: none; padding-right: 42px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23151617' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 18px; }

/* résumé dropzone */
.frm-file { position: relative; }
.frm-file-i { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); border: 0; }
.frm-file-l { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border: 1.5px dashed var(--mist); border-radius: 10px; background: #FBFBFA; cursor: pointer; transition: border-color .18s var(--ease), background .18s var(--ease); }
.frm-file-l:hover { border-color: var(--red); background: var(--paper); }
.frm-file-i:focus-visible + .frm-file-l { outline: none; border-color: var(--ink); box-shadow: 0 0 0 3px rgba(136,7,16,.15); }
.frm-file-ic { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: 10px; background: #fff; border: 1px solid var(--line); color: var(--red); }
.frm-file-ic .ic { width: 23px; height: 23px; }
.frm-file-t { display: grid; gap: 2px; }
.frm-file-t b { font-stretch: 108%; font-weight: 700; font-size: 15px; color: var(--ink); }
.frm-file-t em { font-style: normal; font-size: 13px; color: #6A6C70; }
.frm-file-l[hidden], .frm-file-has[hidden] { display: none; }
.frm-file-has { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1.5px solid var(--ink); border-radius: 10px; background: #fff; }
.frm-file-has .frm-file-ic { width: 38px; height: 38px; border-color: var(--mist); }
.frm-file-name { flex: 1; min-width: 0; font-weight: 700; font-size: 14.5px; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.frm-file-x { flex: none; background: none; border: 0; padding: 6px 8px; font: 700 13.5px var(--f); color: var(--red); cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.frm-file-x:hover { color: var(--red-2); }
.frm label { display: grid; gap: 7px; }
.frm label span { font-stretch: 108%; font-weight: 700; font-size: 14px; color: var(--ink); }
.frm label em { font-style: normal; font-weight: 400; color: #6A6C70; margin-left: 4px; }
.frm input, .frm select, .frm textarea { width: 100%; min-height: 52px; padding: 12px 14px; border: 1.5px solid var(--mist); border-radius: 3px; background: #fff; font: 400 16.5px/1.4 var(--f); color: var(--ink); transition: border-color .2s, box-shadow .2s; }
.frm textarea { min-height: 96px; resize: vertical; }
.frm input:focus, .frm select:focus, .frm textarea:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 3px rgba(136,7,16,.15); }
.frm .is-bad { border-color: var(--red-2); }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.frm .btn { justify-self: start; margin-top: 6px; }
.frm-n { font-size: 14px; color: #6A6C70; margin: 0; }
.frm-ok { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; gap: 8px; background: #fff; padding: 30px; }
.frm-ok[hidden] { display: none; }
.frm-ok b { font: 800 34px/1 var(--f); font-stretch: 125%; font-style: italic; text-transform: uppercase; color: var(--ink); }
.frm-e { color: var(--red-2); font-weight: 600; margin: 0; }
.hp { position: absolute; left: -9999px; }

/* Inner pages */
.phero { background: var(--ink); color: #fff; padding: clamp(44px, 5vw, 70px) 0 clamp(60px, 6vw, 90px); position: relative; overflow: hidden; }
.phero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 6px; background: var(--red); }
.phero-g { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.has-ph .phero-g { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
.crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; font-stretch: 110%; font-weight: 600; color: var(--steel); margin-bottom: 30px; }
.crumbs a { text-decoration: none; color: var(--mist); }
.crumbs a:hover { color: #fff; }
.crumbs [aria-current] { color: #fff; }
.phero .kick { color: #fff; }
.phero h1 { color: #fff; font-size: clamp(42px, 5.2vw, 78px); line-height: .92; }
.phero .lede { color: #CDCED1; margin: 26px 0 30px; }
.phero .btn-o { color: #fff; }
.phero .btn-o:hover { background: #fff; color: var(--ink) !important; border-color: #fff; }
.phero-ph { margin: 0; position: relative; aspect-ratio: 4 / 3.3; background: var(--ink-2); }
.phero-ph img { width: 100%; height: 100%; object-fit: cover; }
.phero-ph::before { content: ""; position: absolute; z-index: 1; left: -14px; top: -14px; width: 70px; height: 70px; border-top: 6px solid var(--red-2); border-left: 6px solid var(--red-2); }
.sd { padding: clamp(70px, 8vw, 110px) 0; }
.sd-g { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; }
.sd-b { background: #fff; border: 1px solid var(--line); padding: clamp(28px, 3.4vw, 46px); }
.sd-b h2 { font-size: clamp(26px, 2.6vw, 36px); margin-bottom: 26px; }
.sd-w { background: var(--ink); border-color: var(--ink); color: #fff; }
.sd-w h2 { color: #fff; }
.chk li, .dash li { position: relative; padding: 12px 0 12px 38px; border-bottom: 1px solid var(--line); font-size: 17px; }
.chk li::before { content: ""; position: absolute; left: 0; top: 13px; width: 22px; height: 22px; border-radius: 50%; background: var(--red); }
.chk li::after { content: ""; position: absolute; left: 8px; top: 17px; width: 6px; height: 10px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(45deg); }
.dash li { border-color: rgba(255,255,255,.12); color: #E3E4E6; }
.dash li::before { content: ""; position: absolute; left: 0; top: 23px; width: 20px; height: 3px; background: var(--red); }
.sd-n { margin: 22px 0 0; font-size: 15px; color: #B9BBBF; }
.faq { padding: clamp(70px, 8vw, 110px) 0; background: #fff; }
.faq-g { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(30px, 5vw, 80px); align-items: start; }
.faq h2 { font-size: clamp(30px, 3.2vw, 46px); }
.faq-l { border-top: 2px solid var(--ink); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { overflow: hidden; list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 20px; padding: 22px 0; font-stretch: 106%; font-weight: 700; font-size: 19px; color: var(--ink); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; flex: none; width: 24px; height: 24px; display: grid; place-items: center; font: 400 30px/1 var(--f); color: var(--red); transition: transform .25s var(--ease); }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq details p { padding: 0 40px 22px 0; color: #4A4C50; font-size: 17px; }
.rel { padding: 0 0 clamp(70px, 8vw, 110px); background: #fff; }
.rel h2 { font-size: clamp(26px, 2.6vw, 36px); margin-bottom: 24px; }
.rel-g { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.rel-g a { display: flex; align-items: center; gap: 12px; padding: 18px; border: 1.5px solid var(--line); text-decoration: none; font-stretch: 106%; font-weight: 650; color: var(--ink); transition: border-color .2s; }
.rel-g a .ic { color: var(--red); }
.rel-g a:hover { border-color: var(--ink); }
.tri-sec { padding: 0 0 clamp(70px, 8vw, 110px); }
.tri-wrap .tri { max-width: 720px; margin: 0 auto; }
.area-p .area-g { align-items: start; }
.town-l { display: grid; gap: 12px; }
.town-l li { background: #fff; border: 1px solid var(--line); border-left: 5px solid var(--red); padding: 20px 24px; scroll-margin-top: 140px; }
.town-l h2 { font-size: 24px; margin-bottom: 8px; }
.town-l p { margin: 0; font-size: 15.5px; color: #5A5C60; }
.town-l li:target { border-color: var(--ink); border-left-color: var(--red); }
.ab { padding: clamp(80px, 9vw, 130px) 0; background: #fff; }
.ab-g { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(36px, 6vw, 90px); }
.ab h2 { font-size: clamp(32px, 3.6vw, 50px); margin-bottom: 26px; }
.ab p { font-size: 18.5px; color: #3E4044; }
.tl-y li { display: grid; gap: 6px; padding: 26px 0 26px 30px; border-left: 3px solid var(--line); position: relative; }
.tl-y li::before { content: ""; position: absolute; left: -10px; top: 32px; width: 17px; height: 17px; border-radius: 50%; background: var(--red); border: 3px solid #fff; box-shadow: 0 0 0 1px var(--red); }
.tl-y b { font: 800 46px/1 var(--f); font-stretch: 125%; font-style: italic; color: var(--ink); }
.tl-y span { color: #5A5C60; }
.vals { padding: clamp(80px, 9vw, 130px) 0; }
.vals h2 { margin-bottom: 44px; }
.vals-g { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.vals-g li { background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--red); padding: 28px 26px; }
.vals-g h3 { margin-bottom: 10px; }
.vals-g p { margin: 0; font-size: 16px; color: #5A5C60; }
.next { padding: clamp(80px, 9vw, 130px) 0; background: var(--ink); }
.next h2 { color: #fff; margin-bottom: 44px; }
.next-l { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(255,255,255,.16); }
.next-l li { padding: 30px 26px 0 0; }
.next-l li + li { padding-left: 26px; border-left: 1px solid rgba(255,255,255,.1); }
.next-l b { display: block; font: 800 56px/1 var(--f); font-stretch: 125%; font-style: italic; color: #fff; margin-bottom: 16px; }
.next-l h3 { color: #fff; margin-bottom: 8px; }
.next-l p { color: #B9BBBF; font-size: 15.5px; }

/* Footer: logo red, white mark. */
/* 1.4.4: footer redesign (Nate: "make it look cooler, under designed"). Crisp machined top edge, a filled
   top band, three link columns plus a charcoal contact card as the anchor, accented headings, a trust row. */
.ft { position: relative; background: var(--red); color: #fff; padding: clamp(54px, 6vw, 84px) 0 34px; border-top: 5px solid var(--ink); }
.ft .wrap { position: relative; }
.ft-top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 26px 40px; padding-bottom: 36px; margin-bottom: 44px; border-bottom: 1px solid rgba(255,255,255,.18); }
.flogo img { height: clamp(68px, 7vw, 96px); width: auto; }
.ft-call { text-align: right; display: flex; flex-direction: column; align-items: flex-end; }
.ft-call-k { font-stretch: 112%; font-weight: 700; font-size: 12.5px; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.72); margin-bottom: 4px; }
.ft .ft-tel { font: 800 clamp(32px, 4.2vw, 58px)/.95 var(--f); font-stretch: 125%; font-style: italic; color: #fff !important; text-decoration: none; letter-spacing: -.01em; }
.ft .ft-tel:hover { color: #fff !important; opacity: .9; }
.ft-call-sub { font-size: 13.5px; color: rgba(255,255,255,.8); margin-top: 7px; }

.ft-g { display: grid; grid-template-columns: repeat(3, 1fr) 1.28fr; gap: 30px 34px; align-items: start; }
.ft h2 { font: 800 12px/1 var(--f); font-stretch: 112%; letter-spacing: .17em; text-transform: uppercase; color: #fff; margin: 0 0 20px; padding-bottom: 12px; border-bottom: 2px solid rgba(255,255,255,.22); }
.ft-col ul { list-style: none; margin: 0; padding: 0; }
.ft-col li { margin-bottom: 10px; }
.ft-col a { display: inline-flex; align-items: center; gap: 7px; color: rgba(255,255,255,.86); font-size: 15px; text-decoration: none; transition: color .18s var(--ease), transform .18s var(--ease); }
.ft-col a:hover { color: #fff; transform: translateX(3px); text-decoration: none; }
.ft-col a .ic { width: 15px; height: 15px; opacity: .85; }
.ft-all a, .ft-pay a { font-weight: 700; color: #fff; margin-top: 3px; }
.ft-all a .ic { transition: transform .18s var(--ease); }
.ft-all a:hover .ic { transform: translateX(2px); }

/* the charcoal contact card: the footer's anchor */
.ft-card { background: var(--ink); border: 1px solid rgba(255,255,255,.09); border-radius: 16px; padding: 26px 26px 24px; box-shadow: 0 24px 50px -28px rgba(0,0,0,.7); }
.ft-card h2 { color: #fff; border-bottom-color: var(--red-2); }
.ft-card address { font-style: normal; font-size: 15px; line-height: 1.6; color: var(--mist); margin: 0 0 18px; }
.ft-card address strong { color: #fff; font-weight: 700; }
.ft-card address a { color: #fff; text-decoration: none; }
.ft-card address a:hover { text-decoration: underline; }
.ft-card .ft-hrs { max-width: none; margin: 0 0 20px; }
.ft-card .ft-hrs div { border-color: rgba(255,255,255,.1); font-size: 14px; padding: 6px 0; color: var(--mist); }
.ft-card .ft-hrs dt { color: #fff; }
.ft-dir { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: 14px; color: #fff; text-decoration: none; border: 1.5px solid rgba(255,255,255,.28); border-radius: 999px; padding: 9px 16px; transition: background .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease); }
.ft-dir .ic { width: 17px; height: 17px; }
.ft-dir:hover { background: var(--red-2); border-color: var(--red-2); color: #fff; text-decoration: none; }
.ft-card-f { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 16px; margin-top: 20px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.1); }
.ft-rev { display: inline-flex; align-items: center; gap: 7px; color: var(--mist); font-size: 14px; text-decoration: none; }
.ft-rev .ic { width: 16px; height: 16px; color: var(--red-2); }
.ft-rev:hover { color: #fff; text-decoration: none; }

/* social icons */
.ft-soc { display: flex; flex-wrap: wrap; gap: 9px; margin: 0; padding: 0; list-style: none; }
.ft-soc li { margin: 0; }
.ft-soc a { display: grid; place-items: center; width: 40px; height: 40px; border: 1.5px solid rgba(255,255,255,.3); border-radius: 50%; color: #fff; transition: background .18s var(--ease), color .18s var(--ease), border-color .18s var(--ease); }
.ft-soc a:hover, .ft-soc a:focus-visible { background: #fff; border-color: #fff; color: var(--ink); text-decoration: none; }
.ft-soc .ic { width: 19px; height: 19px; }

/* trust badges */
.ft-trust { display: flex; flex-wrap: wrap; gap: 10px 12px; margin: 40px 0 0; padding-top: 30px; border-top: 1px solid rgba(255,255,255,.18); }
.ft-badge { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: rgba(255,255,255,.9); background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14); border-radius: 999px; padding: 7px 14px; text-decoration: none; }
.ft-badge .ic { width: 15px; height: 15px; opacity: .9; }
a.ft-badge { transition: background .18s var(--ease), border-color .18s var(--ease); }
a.ft-badge:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.3); text-decoration: none; }

.ft-b { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 20px; margin-top: 26px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.18); font-size: 13px; color: rgba(255,255,255,.72); }
.ft-legal { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.ft-b a { color: rgba(255,255,255,.72); text-decoration: none; }
.ft-b a:hover { color: #fff; text-decoration: underline; }

@media (max-width: 1040px) { .ft-g { grid-template-columns: 1fr 1fr; } .ft-card { grid-column: 1 / -1; } }
@media (max-width: 640px) {
	.ft-top { flex-direction: column; align-items: flex-start; }
	.ft-call { text-align: left; align-items: flex-start; }
	.ft-g { grid-template-columns: 1fr; gap: 26px; }
	.ft-card { padding: 22px 20px; }
	.ft-b { flex-direction: column; align-items: flex-start; }
}

.callbar { display: none; }

/* Responsive */
@media (max-width: 1440px) {
  .main > a[href*="reviews"] { display: none; }
}
@media (max-width: 1240px) {
  .main { gap: 20px; }
  .svc-g { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .hbtn { display: none; }
}
@media (max-width: 960px) {
  body.mpl { font-size: 16.5px; padding-bottom: 64px; }
  .main { display: none; }
  .menu { display: flex; }
  .hphone span { display: none; }
  .hphone { width: 48px; height: 48px; justify-content: center; border-radius: 3px; background: var(--red); }
  .hphone .ic { color: #fff; }
  .hdr .wrap { min-height: 74px; gap: 10px; }
  .logo img, .hdr.is-s .logo img { height: 44px; }
  .util .u-l { display: none; }
  .util .wrap { justify-content: center; }
  .sh-row, .area-g, .req-g, .hire-g, .faq-g, .ab-g, .has-ph .phero-g, .sd-g, .story-g { grid-template-columns: minmax(0, 1fr); }
  .five-l, .next-l { grid-template-columns: 1fr 1fr; }
  .five-l li:nth-child(3), .next-l li:nth-child(3) { padding-left: 0; border-left: 0; }
  .five-l li:nth-child(3)::before { left: 0; }
  .rev-g { grid-template-columns: 1fr; }
  .rev-g li + li { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); }
  .ft-g { grid-template-columns: 1fr 1fr; }
  .ft-call { text-align: left; }
  .rel-g { grid-template-columns: 1fr 1fr; }
  .callbar { display: grid; grid-template-columns: 1fr 1fr; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; box-shadow: 0 -10px 30px -10px rgba(0,0,0,.35); }
  .callbar a { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 60px; font: 800 14.5px/1 var(--f); font-stretch: 112%; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; }
  .cb-call { background: var(--red); color: #fff !important; }
  .cb-req { background: var(--ink); color: #fff !important; }
  .is-menu .callbar { display: none; }
}
@media (max-width: 600px) {
  .wrap { width: min(var(--wrap), 100% - 32px); }
  .concept { font-size: 12px; padding: 8px 40px 8px 14px; text-align: left; }
  .util { font-size: 12.5px; }
  .phero h1 { font-size: clamp(32px, 9.4vw, 44px); }
  .faq h2, .sd-b h2, .rel h2 { font-size: 27px; }
  :where(.mpl) h1, :where(.mpl) h2 { overflow-wrap: break-word; }
  .h1-k { font-size: 12px; letter-spacing: .12em; }
  .hero .lede, .lede { font-size: 17.5px; }
  .ctas .btn { flex: 1 1 100%; }
  .tri { padding: 24px 20px 18px; }
  .tri-h { font-size: 28px; }
  .svc-g { grid-template-columns: 1fr; }
  .svc-c { min-height: 0; }
  .five-l, .next-l { grid-template-columns: 1fr; }
  .five-l li, .five-l li + li, .next-l li, .next-l li + li { padding: 26px 0 8px; border-left: 0; }
  .five-l li + li::before { left: 0; }
  .five-l li + li, .next-l li + li { border-top: 1px solid rgba(255,255,255,.12); }
  .row2 { grid-template-columns: 1fr; }
  .rel-g, .ft-g { grid-template-columns: 1fr; }
  .flogo img { height: 70px; }
  .story-n span { font-size: 150px; }
  .phero-ph::before { left: -8px; top: -8px; width: 44px; height: 44px; border-width: 4px; }
  .frm .btn { justify-self: stretch; }
}
@media (max-width: 600px) { .m-town text { font-size: 22px; } .m-town text.big { font-size: 26px; } .m-shop text { font-size: 17px; } .m-rl { font-size: 15px; } }

/* 1.0.1: photos everywhere, careers up front */
.tag { display: inline-block; margin-left: 8px; padding: 3px 6px 2px; border-radius: 2px; background: var(--red); color: #fff; font: 800 10px/1 var(--f); font-stretch: 112%; letter-spacing: .1em; text-transform: uppercase; vertical-align: 3px; font-style: normal; }
.main .nav-job { display: flex; align-items: center; }
.mnav nav > a .tag { font-size: 11px; vertical-align: 6px; }


.svc-c { padding: 0 0 56px; gap: 8px; overflow: hidden; }
.svc-c .svc-ph { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--ink-2); margin-bottom: 0; }
.svc-c .svc-ph img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.svc-c:hover .svc-ph img { transform: scale(1.05); }
.svc-c .svc-i { position: relative; z-index: 1; display: grid; place-items: center; width: 54px; height: 54px; margin: -27px 0 6px 22px; background: #fff; border-top: 3px solid var(--red); box-shadow: 0 10px 20px -12px rgba(0,0,0,.5); }
.svc-c .svc-i .ic { margin: 0; }
.svc-c > b, .svc-c > span:not(.svc-ph):not(.svc-i) { padding: 0 26px; }

.story-g { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); }
.story-v { position: relative; padding-bottom: clamp(60px, 7vw, 110px); }
.story-ph { margin: 0; position: relative; aspect-ratio: 5 / 4; background: var(--red-ink); box-shadow: 18px 18px 0 0 var(--red-ink); }
.story-ph img { width: 100%; height: 100%; object-fit: cover; }
.story-ph::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(136,7,16,.75), rgba(136,7,16,0) 45%); }
.story-v .story-n { position: absolute; left: clamp(-10px, -1vw, 0px); bottom: 0; z-index: 1; }
.story-v .story-n span { font-size: clamp(130px, 15vw, 230px); text-shadow: 0 10px 40px rgba(92,4,11,.35); }

.hire-l { display: grid; gap: 8px; margin: 0 0 28px; }
.hire-l li { position: relative; padding-left: 28px; color: #fff; font-weight: 600; }
.hire-l li::before { content: ""; position: absolute; left: 0; top: 12px; width: 16px; height: 3px; background: var(--red); }
.hire .ctas { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; }

.job { padding: clamp(80px, 9vw, 130px) 0 clamp(40px, 5vw, 70px); }
.job-g { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 20px; align-items: start; }
.job-card { background: #fff; border: 1px solid var(--line); border-top: 6px solid var(--red); padding: clamp(28px, 3.4vw, 46px); position: sticky; top: 120px; }
.job-card h2 { font-size: clamp(32px, 3.4vw, 48px); margin-bottom: 26px; }
.job-f { margin: 0 0 30px; border-top: 2px solid var(--ink); }
.job-f div { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.job-f dt { font-stretch: 112%; font-weight: 750; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--red); padding-top: 3px; }
.job-f dd { margin: 0; font-size: 16.5px; color: #3E4044; }
.job-l { background: var(--ink); color: #fff; padding: clamp(28px, 3.4vw, 46px); }
.job-l h3 { color: #fff; font-size: 24px; margin: 0 0 14px; }
.job-l ul + h3 { margin-top: 38px; }
.job-l .chk li { border-color: rgba(255,255,255,.12); color: #E3E4E6; }
.next-l.next-3 { grid-template-columns: repeat(3, 1fr); }
.share { margin-top: 34px; padding: 22px 24px; border: 1.5px dashed var(--line); display: grid; gap: 6px; justify-items: start; }
.share b { font-stretch: 112%; font-size: 18px; color: var(--ink); }
.share span { font-size: 15.5px; color: #5A5C60; margin-bottom: 10px; }

@media (min-width: 1101px) {
  .main { gap: 20px; }
  .main > a, .has-mega > a { letter-spacing: .05em; }
}
@media (max-width: 1100px) {
  .main { display: none; }
  .menu { display: flex; }
}
@media (max-width: 960px) {
  .story-g { grid-template-columns: minmax(0, 1fr); }
  .story-v { max-width: 640px; }
}
@media (max-width: 960px) {
  .job-g { grid-template-columns: minmax(0, 1fr); }
  .job-card { position: static; }
  .next-l.next-3 { grid-template-columns: 1fr; }
  .next-l.next-3 li, .next-l.next-3 li + li { padding: 26px 0 8px; border-left: 0; }
  .next-l.next-3 li + li { border-top: 1px solid rgba(255,255,255,.12); }
  .story-ph { box-shadow: 10px 10px 0 0 var(--red-ink); }
}
@media (max-width: 600px) {
  .job-card h2 { font-size: clamp(24px, 7.4vw, 29px); }
  .req-c h2 { font-size: clamp(26px, 7.8vw, 34px); }
  .phero h1 { font-size: clamp(27px, 7.6vw, 40px); }
  .story-v .story-n span { font-size: 120px; }
  .job-f div { grid-template-columns: minmax(0, 1fr); gap: 4px; }
}

/* 1.0.3: the photo hero, the call-back bar, the problem finder band */
.hero { position: relative; overflow: hidden; isolation: isolate; background: var(--ink); color: #fff; min-height: clamp(600px, 78vh, 820px); display: flex; align-items: center; padding: 70px 0 130px; }
.hero-ph { position: absolute; inset: 0; z-index: -2; margin: 0; background: var(--ink-2); }
.hero-ph img { width: 100%; height: 100%; object-fit: cover; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(21,22,23,.95) 0%, rgba(21,22,23,.9) 34%, rgba(21,22,23,.55) 47%, rgba(21,22,23,0) 60%), linear-gradient(0deg, rgba(21,22,23,.5) 0%, rgba(21,22,23,0) 26%); }
.hero-g { display: block; }
.hero-c { max-width: 560px; }
.hero h1 { color: #fff; font-size: clamp(50px, 5.6vw, 86px); line-height: .88; text-shadow: 0 2px 24px rgba(0,0,0,.35); }
.hero .lede { max-width: 30em; }
.hero .ctas .btn-o { background: rgba(21,22,23,.35); }
.hero .ctas .btn-o:hover, .hero .ctas .btn-o:focus-visible { background: #fff; color: var(--ink) !important; border-color: #fff; } /* 1.3.2: the dark glass above beat the hover, leaving black text on dark */

.lbar { position: relative; z-index: 3; margin-top: -86px; }
.frm-ok span a { color: var(--red); font-weight: 700; }
.lbar .trust { margin: 0; padding: 18px 2px 0; border: 0; color: #4A4C50; justify-content: center; gap: 10px 30px; }
.lbar .trust .ic { color: var(--red); }
.lbar .trust a:hover { color: var(--ink); }
.sent { position: sticky; top: 0; z-index: 60; background: var(--ink); color: #fff; text-align: center; padding: 12px 16px; font-weight: 700; border-bottom: 4px solid var(--red); }

.tri-home { padding: clamp(70px, 8vw, 110px) 0 0; }
.tri-home-g { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.tri-home-h { font: 800 clamp(30px, 3.2vw, 46px)/1 var(--f); font-stretch: 125%; font-style: italic; text-transform: uppercase; color: var(--ink); margin: 0 0 20px; letter-spacing: -.01em; }
.tri-home-c > p:last-child { font-size: 17.5px; color: #4A4C50; max-width: 30em; }
.tri-home .tri { box-shadow: 0 30px 60px -36px rgba(0,0,0,.45); border: 1px solid var(--line); border-top: 6px solid var(--red); }

.hire-g { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; }
.hire-ph { margin: 0; position: relative; aspect-ratio: 4 / 3; background: var(--ink-2); box-shadow: 18px 18px 0 0 var(--red); }
.hire-ph img { width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 960px) {
  .hero { display: block; min-height: 0; padding: 0 0 120px; }
  .hero-ph { position: relative; inset: auto; aspect-ratio: 16 / 10; }
  .hero-ph img { object-position: 58% 50% !important; }
  .hero::before { top: auto; height: 46px; bottom: auto; background: none; }
  .hero-c { padding-top: 34px; }
  .lbar { margin-top: -88px; }
  .tri-home-g, .hire-g { grid-template-columns: minmax(0, 1fr); }
  .hire-ph { box-shadow: 10px 10px 0 0 var(--red); }
}
@media (max-width: 600px) {
  .hero h1 { font-size: 46px; }
  .lbar .trust { justify-content: flex-start; gap: 10px 20px; }
}
.hire h2 { margin-bottom: 18px; }
@media (min-width: 961px) { .phero.has-ph h1 { font-size: clamp(38px, 4vw, 60px); } .req-c h2 { font-size: clamp(30px, 2.9vw, 44px); overflow-wrap: normal; } }

/* 1.1.0: the live site's full service set. Grouped Services menu, Service area and About menus, long-form
   service pages with a side card, town pages, the blog, the directory and the site map. */
.hdr .wrap { position: relative; }
.has-mega { position: static; }
.mega { left: 0; right: 0; width: auto; }
.mega-in { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; border-bottom: 0; }
.mega .mg { padding: 22px 20px 18px; border-right: 1px solid var(--line); }
.mega .mg:last-child { border-right: 0; }
.mg-h { margin: 0 0 10px; font: 700 12px/1.2 var(--f); font-stretch: 112%; letter-spacing: .14em; text-transform: uppercase; color: var(--red); }
.mega .mg a, .mega .mg a:nth-child(odd) { display: block; padding: 6px 0; border: 0; font-size: 15px; line-height: 1.35; font-weight: 600; font-stretch: 104%; color: var(--ink); }
.mega .mg a:hover { background: none; color: var(--red); }
.mega-f { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 26px; padding: 14px 20px; background: var(--paper); border: 1px solid var(--line); border-top: 0; box-shadow: 0 30px 60px -24px rgba(0,0,0,.35); font-size: 14.5px; color: #5A5C60; }
.mega-f a, .mega-f a:nth-child(odd) { display: inline; padding: 0; border: 0; }
.mega-f span a { color: var(--red); font-weight: 700; text-decoration: none; }
.has-drop { position: relative; }
.has-drop > a { position: relative; display: block; padding: 32px 0; font: 700 13.5px/1 var(--f); font-stretch: 108%; letter-spacing: .07em; text-transform: uppercase; text-decoration: none; color: var(--ink); white-space: nowrap; }
.has-drop > a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 24px; height: 2px; background: var(--red); transform: scaleX(0); transform-origin: left; transition: transform .3s var(--ease); }
.has-drop:hover > a::after, .has-drop:focus-within > a::after, .has-drop > a[aria-current]::after { transform: scaleX(1); }
.drop { position: absolute; top: 100%; left: -22px; min-width: 250px; opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity .2s, transform .25s var(--ease), visibility .2s; }
.has-drop:hover .drop, .has-drop:focus-within .drop { opacity: 1; visibility: visible; transform: none; }
.drop ul { background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--red); box-shadow: 0 30px 60px -24px rgba(0,0,0,.35); padding: 10px 0; }
.drop a { display: block; padding: 9px 22px; font-size: 15px; font-weight: 600; text-decoration: none; color: var(--ink); white-space: nowrap; }
.drop a:hover { background: var(--paper); color: var(--red); }
@media (min-width: 1101px) { .has-drop > a { letter-spacing: .05em; } }
@media (max-width: 1499px) { .hphone span { font-size: 16.5px; } }

.mnav details.mn { border-bottom: 1px solid var(--line); }
.mnav summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; padding: 14px 0; font: 800 26px/1.1 var(--f); font-stretch: 125%; font-style: italic; text-transform: uppercase; color: var(--ink); }
.mnav summary::-webkit-details-marker { display: none; }
.mnav summary::after { content: "+"; font: 400 32px/1 var(--f); font-style: normal; color: var(--red); transition: transform .25s var(--ease); }
.mnav details[open] summary::after { transform: rotate(45deg); }
.mn-in { padding: 0 0 18px; }
.mn-h { margin: 14px 0 4px; font: 700 12px/1.2 var(--f); font-stretch: 112%; letter-spacing: .14em; text-transform: uppercase; color: var(--red); }
.mn-l { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 16px; }
.mn-l a { padding: 7px 0; font-size: 15.5px; line-height: 1.3; text-decoration: none; color: #3E4044; }
.mn-all { display: inline-block; margin-top: 12px; font-weight: 700; color: var(--red); text-decoration: none; }

.svc-all { margin: 34px 0 0; }
.dir { padding: clamp(70px, 8vw, 110px) 0; background: #fff; }
.dir-g { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.dir-c { border: 1px solid var(--line); border-top: 4px solid var(--red); background: var(--paper); padding: 24px 24px 18px; }
.dir-c h3 { margin-bottom: 10px; }
.dir-c li { border-bottom: 1px solid var(--line); }
.dir-c li:last-child { border-bottom: 0; }
.dir-c a { display: block; padding: 9px 0; text-decoration: none; font-weight: 600; color: var(--ink); }
.dir-c a:hover { color: var(--red); }
.dir-wide { grid-column: 1 / -1; margin-top: 14px; }
.dir-wide ul { columns: 3 260px; column-gap: 30px; }
.dir-wide li { break-inside: avoid; }

.svx { padding: clamp(70px, 8vw, 110px) 0; background: #fff; }
.svx-g { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 360px); gap: clamp(32px, 5vw, 80px); align-items: start; }
.prose { max-width: 760px; min-width: 0; }
.prose h2 { font-size: clamp(26px, 2.5vw, 36px); margin: 1.5em 0 .55em; }
.prose > h2:first-child { margin-top: 0; }
.prose h3 { margin: 1.4em 0 .4em; font-size: 21px; }
.prose p, .prose li { font-size: 18px; line-height: 1.65; color: #3E4044; }
.prose a { color: var(--red); font-weight: 600; text-underline-offset: 3px; }
.prose a:hover { color: var(--red-2); }
.post-b ul, .post-b ol { margin: 0 0 1.1em; padding-left: 1.3em; }
.post-b ul { list-style: disc; }
.post-b ol { list-style: decimal; }
.post-b li { margin-bottom: .35em; }
.post-b img { margin: 1.2em 0; height: auto; }
.post-b figure { margin: 1.2em 0; }
.post-b figcaption { font-size: 14px; color: var(--steel); }
.post-b blockquote { margin: 1.4em 0; padding: 4px 0 4px 22px; border-left: 4px solid var(--red); }
.post-b table { width: 100%; border-collapse: collapse; margin: 1.2em 0; font-size: 16px; }
.post-b th, .post-b td { border: 1px solid var(--line); padding: 8px 10px; text-align: left; }
.post-b .wp-block-image, .post-b .aligncenter { margin-left: auto; margin-right: auto; }
.post-b iframe { max-width: 100%; }
.side { position: sticky; top: 118px; }
.admin-bar .side { top: 150px; }
.side-c { background: var(--ink); color: #fff; padding: clamp(24px, 2.6vw, 32px); border-top: 6px solid var(--red); }
.side .kick { color: #fff; margin-bottom: 8px; }
.side-tel { display: inline-block; white-space: nowrap; font: 800 clamp(24px, 2.05vw, 31px)/1 var(--f); font-stretch: 125%; font-style: italic; color: #fff !important; text-decoration: none; letter-spacing: -.01em; }
.side-n { margin: 12px 0 18px; font-size: 15px; color: #C9CBCE; }
.side .btn { width: 100%; margin: 4px 0 18px; }
.side address { font-style: normal; font-size: 14px; color: var(--steel); margin-top: 14px; }
.hrs { margin: 0 0 18px; }
.hrs div { display: flex; justify-content: space-between; gap: 14px; padding: 7px 0; border-bottom: 1px solid var(--line); font-size: 15px; }
.hrs dt { font-weight: 700; font-stretch: 106%; }
.hrs dd { margin: 0; text-align: right; }
.side .hrs div { border-color: rgba(255,255,255,.14); color: #E3E4E6; }
.ft-hrs { max-width: 300px; }
.ft-hrs div { border-color: rgba(255,255,255,.22); font-size: 14.5px; }
.req-hrs { max-width: 380px; margin-top: 28px; }

.phero-mp { min-width: 0; }
.phero-mp .area-m { box-shadow: none; background: var(--ink-2); border: 1px solid rgba(255,255,255,.08); }
.m-line.m-dim { opacity: .18; }
.m-town.m-dim text { fill: rgba(230,231,233,.5); }
.m-town.m-dim circle { stroke-width: 2; }
.m-town.m-on circle { fill: var(--red-2); stroke: #fff; }
.m-town.m-on text { fill: #fff; font-weight: 800; font-size: 19px; font-stretch: 118%; font-style: italic; text-transform: uppercase; }
.town-l h2 a { text-decoration: none; }
.town-l h2 a:hover { color: var(--red); }
.town-l p + p { margin-top: 8px; }
.town-m { font-weight: 700; color: var(--ink) !important; }
.tfacts { margin: 30px 0 0; border-top: 2px solid var(--ink); }
.tfacts div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 16px; padding: 13px 0; border-bottom: 1px solid var(--line); }
.tfacts dt { font-stretch: 112%; font-weight: 750; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--red); padding-top: 3px; }
.tfacts dd { margin: 0; font-size: 17px; color: #3E4044; }
.tfacts dd a { color: var(--ink); font-weight: 700; text-decoration: none; }
.tsvc { padding: clamp(70px, 8vw, 110px) 0; }
.tsvc h2 { margin-bottom: 34px; }
.tsvc-g { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.tsvc-g a { display: grid; gap: 8px; height: 100%; padding: 24px 22px; background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--red); text-decoration: none; transition: border-color .2s, transform .3s var(--ease); }
.tsvc-g a:hover { border-color: var(--ink); transform: translateY(-2px); }
.tsvc-g .ic { color: var(--red); }
.tsvc-g b { font-stretch: 110%; font-size: 18px; color: var(--ink); line-height: 1.25; }
.tsvc-g span { font-size: 15px; color: #5A5C60; }
.tstrip { margin-top: 34px; }
.tstrip:first-child { margin-top: 0; }
.tstrip .kick { color: var(--steel); margin-bottom: 4px; }
.tstrip .towns { margin: 10px 0 0; }
.faq-alt { background: var(--paper); }

.bl { padding: clamp(70px, 8vw, 110px) 0; }
.bl-more { background: #fff; padding-top: 0; }
.bl-more h2 { font-size: clamp(26px, 2.6vw, 36px); margin-bottom: 24px; }
.bl-g { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.bl-c { display: flex; flex-direction: column; gap: 10px; height: 100%; padding: 0 0 24px; background: #fff; border: 1px solid var(--line); text-decoration: none; transition: border-color .2s, transform .3s var(--ease); overflow: hidden; }
.bl-c:hover { border-color: var(--ink); transform: translateY(-2px); }
.bl-c > time, .bl-c > b, .bl-c > span:not(.bl-ph) { padding: 0 24px; }
.bl-c > time:first-child { padding-top: 24px; }
.bl-ph { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--ink-2); margin-bottom: 8px; }
.bl-ph img { width: 100%; height: 100%; object-fit: cover; }
.bl-c time { font-stretch: 112%; font-weight: 700; font-size: 12.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--red); }
.bl-c b { font-stretch: 110%; font-weight: 800; font-size: 20px; line-height: 1.25; color: var(--ink); }
.bl-c span { font-size: 15.5px; color: #5A5C60; }
.pg { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 40px; }
.pg a, .pg span { display: grid; place-items: center; min-width: 46px; height: 46px; padding: 0 12px; border: 1.5px solid var(--line); background: #fff; text-decoration: none; font-weight: 700; color: var(--ink); }
.pg span[aria-current] { background: var(--ink); border-color: var(--ink); color: #fff; }
.pg a:hover { border-color: var(--red); color: var(--red); }
.pmeta { margin: 22px 0 0; color: #CDCED1; font-size: 16px; }
.phero-post h1 { font-size: clamp(36px, 4.2vw, 64px); line-height: .95; }
.phero-wp img { width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 1240px) {
  .mega-in { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .mega .mg:nth-child(3) { border-right: 0; }
  .mega .mg:nth-child(n+4) { border-top: 1px solid var(--line); }
}
@media (max-width: 960px) {
  .svx-g { grid-template-columns: minmax(0, 1fr); }
  .side { position: static; }
  .dir-g, .bl-g { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .phero-mp { max-width: 560px; }
}
@media (max-width: 600px) {
  .dir-g, .bl-g { grid-template-columns: minmax(0, 1fr); }
  .prose p, .prose li { font-size: 17px; }
  .tfacts div { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .phero-post h1 { font-size: clamp(27px, 7.6vw, 40px); }
  .mnav summary { font-size: 24px; }
}
.flow > section:not(.faq) + .rel, .flow > .faq.faq-alt + .rel { padding-top: clamp(60px, 7vw, 100px); }
@media (min-width: 961px) {
  .rev-g li:nth-child(3n+1) { padding-left: 0; border-left: 0; }
  .rev-g li:nth-child(n+4) { border-top: 1px solid var(--line); }
}
.ft-b span a { margin-right: 14px; }

/* ======================================================================
 * 1.1.2: The Pipeline (blog)
 * ==================================================================== */

/* Post hero: the lead photo ghosted behind the title, full color on the right. */
.phero-post::before { content: ""; position: absolute; inset: -24px; background: var(--ghost, none) center / cover no-repeat; filter: grayscale(1) contrast(1.15); opacity: .16; transform: scale(1.03); pointer-events: none; -webkit-mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.8) 45%, rgba(0,0,0,.3) 100%); mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.8) 45%, rgba(0,0,0,.3) 100%); }
.phero-post > .wrap, .bhero > .wrap { position: relative; z-index: 1; }
.phero-post .phero-ph { box-shadow: 0 30px 70px rgba(0,0,0,.55); }
.phero-post .phero-ph::after { content: ""; position: absolute; z-index: 1; right: -14px; bottom: -14px; width: 70px; height: 70px; border-right: 6px solid var(--red-2); border-bottom: 6px solid var(--red-2); pointer-events: none; }
.ph-tag { position: absolute; z-index: 2; left: 0; bottom: 0; padding: 11px 15px; background: var(--red); color: #fff; font: 700 12px/1 var(--f); font-stretch: 112%; letter-spacing: .14em; text-transform: uppercase; }
.kick-l a { color: inherit; text-decoration: none; }
.kick-l a:hover { color: #fff; }
.kick-l span { margin: 0 10px; color: var(--steel); }
.pmeta .rt { display: inline-block; margin-left: 12px; padding: 5px 10px; border: 1px solid rgba(255,255,255,.22); border-radius: 3px; font: 700 12px/1 var(--f); font-stretch: 112%; letter-spacing: .1em; text-transform: uppercase; color: #fff; vertical-align: 2px; }
@media (min-width: 961px) { .phero.phero-long h1 { font-size: clamp(32px, 3.3vw, 50px); } }

/* Blog and topic pages: the name ghosted in outline behind the hero. */
.bhero::before { content: attr(data-word); position: absolute; right: -.03em; bottom: -.17em; font: italic 800 clamp(96px, 15vw, 270px)/.8 var(--f); font-stretch: 125%; letter-spacing: -.02em; text-transform: uppercase; white-space: nowrap; color: transparent; -webkit-text-stroke: 1.5px rgba(255,255,255,.08); pointer-events: none; }
.bhero h1 .h1-s { display: block; margin-top: 14px; font-size: .36em; letter-spacing: .02em; line-height: 1.1; color: #fff; }

/* Topic chips. */
.tpx { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 30px; }
.tpx a { display: inline-flex; align-items: center; gap: 9px; min-height: 46px; padding: 0 16px; border: 1.5px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink); font: 700 14.5px/1 var(--f); font-stretch: 110%; text-decoration: none; transition: border-color .2s, background .2s, color .2s; }
.tpx a .ic { color: var(--red); flex: none; }
.tpx a span { display: inline-grid; place-items: center; min-width: 26px; height: 22px; padding: 0 7px; border-radius: 999px; background: var(--paper); color: var(--iron); font-size: 12.5px; }
.tpx a:hover { border-color: var(--ink); }
.tpx a[aria-current] { background: var(--ink); border-color: var(--ink); color: #fff; }
.tpx a[aria-current] .ic { color: var(--red); }
.tpx a[aria-current] span { background: var(--red); color: #fff; }
.tpx-svc { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: -6px 0 30px; padding: 16px 20px; background: var(--paper); border-left: 6px solid var(--red); font-weight: 600; color: var(--ink); }
.tpx-svc .ic { color: var(--red); }

/* Cards: every card leads with a photo and its topic. */
.bl-ph { position: relative; }
.bl-tag { position: absolute; left: 12px; top: 12px; padding: 7px 10px; background: rgba(21,22,23,.88); color: #fff; font: 700 11px/1 var(--f); font-style: normal; font-stretch: 112%; letter-spacing: .14em; text-transform: uppercase; }
.bl-c .bl-ph img { transition: transform .5s var(--ease); }
.bl-c:hover .bl-ph img { transform: scale(1.04); }

/* Article. */
.post-b::after { content: ""; display: block; clear: both; }
.post-b .p-lede { font-size: 21px; line-height: 1.55; color: var(--ink); }
.post-b h2, .post-b h3 { clear: both; scroll-margin-top: 140px; }
.post-b h2::before { content: ""; display: block; width: 44px; height: 4px; margin-bottom: 14px; background: var(--red); }
.post-b h3 { font: 800 22px/1.25 var(--f); font-stretch: 112%; color: var(--ink); }
.post-b img { border-radius: 3px; }
.post-b img.p-sm { float: right; width: auto; max-width: min(44%, 300px); margin: .35em 0 1em 1.6em; border: 6px solid #fff; box-shadow: 0 10px 30px rgba(21,22,23,.16); }
.post-b .p-toc { margin: 1.6em 0 2em; padding: 22px 26px 20px; background: var(--paper); border-left: 6px solid var(--red); }
.post-b .p-toc .p-toc-t { margin: 0 0 12px; font: 700 13px/1 var(--f); font-stretch: 112%; letter-spacing: .16em; text-transform: uppercase; color: var(--red); }
.post-b .p-toc ol { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; counter-reset: toc; }
.post-b .p-toc li { display: flex; gap: 12px; margin: 0; font-size: 17px; line-height: 1.35; counter-increment: toc; }
.post-b .p-toc li::before { content: counter(toc, decimal-leading-zero); font: italic 800 15px/1.4 var(--f); font-stretch: 125%; color: var(--red); }
.post-b .p-toc a { color: var(--ink); font-weight: 700; text-decoration: none; }
.post-b .p-toc a:hover { color: var(--red); }
.post-b .p-cta { margin: 2.2em 0; padding: 28px 30px 30px; background: var(--ink); border-top: 6px solid var(--red); }
.post-b .p-cta .p-cta-k { margin: 0 0 8px; font: 700 13px/1 var(--f); font-stretch: 112%; letter-spacing: .16em; text-transform: uppercase; color: #fff; }
.post-b .p-cta .p-cta-t { margin: 0 0 20px; font: italic 800 clamp(24px, 2.4vw, 32px)/1.05 var(--f); font-stretch: 125%; text-transform: uppercase; color: #fff; }
.post-b .p-cta .btn { font-weight: 750; text-decoration: none; }
.post-b .p-cta .btn-o { color: #fff !important; border-color: rgba(255,255,255,.45); }
.post-b .p-cta .btn-o:hover { background: #fff; color: var(--ink) !important; border-color: #fff; }
.post-b .p-topic { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 20px; margin: 2.6em 0 0; padding: 26px 26px 22px; border: 1px solid var(--line); border-top: 6px solid var(--ink); background: #fff; }
.post-b .p-topic .p-topic-i { display: grid; place-items: center; width: 58px; height: 58px; background: var(--red); color: #fff; }
.post-b .p-topic .p-topic-k { margin: 0; font: 700 12.5px/1 var(--f); font-stretch: 112%; letter-spacing: .16em; text-transform: uppercase; color: var(--steel); }
.post-b .p-topic .p-topic-n { margin: 8px 0 0; font: italic 800 26px/1 var(--f); font-stretch: 125%; text-transform: uppercase; }
.post-b .p-topic .p-topic-n a { color: var(--ink); text-decoration: none; }
.post-b .p-topic .p-topic-n a:hover { color: var(--red); }
.post-b .p-topic .p-topic-d { margin: 10px 0 0; font-size: 16.5px; }
.post-b .p-topic .p-topic-l { display: flex; flex-wrap: wrap; gap: 12px 28px; margin: 16px 0 0; }
.post-b .p-topic .tl { font-weight: 750; text-decoration: none; }

@media (max-width: 600px) {
  .phero.phero-long h1 { font-size: clamp(24px, 6.6vw, 32px); }
  .phero-post .phero-ph::after { right: -8px; bottom: -8px; width: 44px; height: 44px; border-width: 4px; }
  .pmeta .rt { margin: 10px 0 0; }
  .post-b img.p-sm { float: none; display: block; max-width: 100%; margin: 1.2em auto; }
  .post-b .p-topic { grid-template-columns: minmax(0, 1fr); }
  .post-b .p-cta { padding: 24px 20px; }
  .tpx a { min-height: 42px; padding: 0 13px; font-size: 13.5px; }
}

/* ==========================================================================
   1.1.3 (Nate): emergency gets its own red, the booking panel gets stronger,
   one hiring mention in the header, no concept bar.
   ========================================================================== */
.btn-k { background: var(--ink); color: #fff !important; }
.btn-k:hover { background: var(--graphite); }
.btn-ow { border-color: rgba(255,255,255,.7); color: #fff !important; background: transparent; }
.btn-ow:hover { background: #fff; color: var(--ink) !important; border-color: #fff; }

/* Live shop status (open now / opens at) */
.open { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; }
.open i { width: 8px; height: 8px; border-radius: 50%; background: var(--steel); flex: none; }
.open.is-open i { background: #2BB673; box-shadow: 0 0 0 0 rgba(43,182,115,.5); animation: mpl-go 2.4s infinite; }
@keyframes mpl-go { 0% { box-shadow: 0 0 0 0 rgba(43,182,115,.55); } 70%, 100% { box-shadow: 0 0 0 8px rgba(43,182,115,0); } }
.util .u-open { color: #fff; margin-right: 22px; }
.open .txs { display: none; }

/* The Emergency tab: a red box with white type, same red as the logo. */
.main .em-btn { display: inline-flex; align-items: center; gap: 9px; padding: 11px 15px 11px 13px; background: var(--red); color: #fff; border-radius: 3px; font: 800 13px/1 var(--f); font-stretch: 112%; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; white-space: nowrap; transition: background .2s; }
.main .em-btn:hover, .main .em-btn[aria-current] { background: var(--red-2); }
.em-btn i, .emb-k i, .emh-k i, .kick-em i, .cb-em i, .mn-em i { width: 8px; height: 8px; border-radius: 50%; background: #fff; flex: none; box-shadow: 0 0 0 0 rgba(255,255,255,.6); animation: mpl-wp 2s infinite; }
@keyframes mpl-wp { 0% { box-shadow: 0 0 0 0 rgba(255,255,255,.6); } 70%, 100% { box-shadow: 0 0 0 9px rgba(255,255,255,0); } }

/* Home: booking panel and emergency box, side by side over the hero edge */
.hero { padding-bottom: 190px; }
.lbar { margin-top: -150px; }
.dock { display: grid; grid-template-columns: minmax(0, 1.62fr) minmax(0, 1fr); box-shadow: 0 40px 80px -36px rgba(0,0,0,.6); }
.bk { border-radius: 0; border-top-width: 6px; box-shadow: none; padding: 30px 32px 26px; gap: 18px; grid-template-columns: minmax(0, 1fr); align-content: start; }
.bk-t { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 6px 20px; }
.bk-t h2 { font-size: clamp(30px, 2.7vw, 40px); }
.bk-t p { grid-column: 1; margin: 0; font-size: 15.5px; color: #55575B; line-height: 1.45; }
.bk-t .open { grid-column: 2; grid-row: 1 / span 2; align-self: start; color: var(--ink); background: var(--paper); padding: 8px 12px; border-radius: 3px; white-space: nowrap; }
.bk-chips { border: 0; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.bk-chips label { display: block; }
.bk-chips input, .em-pick input, .em-off input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.bk-chips span { display: grid; justify-items: center; gap: 8px; padding: 14px 6px 12px; border: 1.5px solid var(--line); border-radius: 3px; text-align: center; font-stretch: 106%; font-weight: 700; font-size: 13px; line-height: 1.2; color: var(--ink); cursor: pointer; transition: border-color .2s, background .2s, color .2s; }
.bk-chips span .ic { color: var(--red); }
.bk-chips label:hover span { border-color: var(--ink); }
.bk-chips input:checked + span { border-color: var(--red); background: var(--red); color: #fff; }
.bk-chips input:checked + span .ic { color: #fff; }
.bk-chips input:focus-visible + span, .em-pick input:focus-visible + span, .em-off input:focus-visible + span { outline: 3px solid var(--red-2); outline-offset: 2px; }
.bk-f { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; gap: 10px; }
.bk-f label { display: block; }
.bk .btn { margin: 0; min-height: 52px; justify-self: stretch; }
.bk-n { font-size: 13.5px; }
.bk.is-sent .bk-chips, .bk.is-sent .bk-f, .bk.is-sent .bk-n { visibility: hidden; }

.emb { position: relative; overflow: hidden; isolation: isolate; background: var(--red); color: #fff; padding: 30px 30px 26px; display: grid; align-content: start; gap: 14px; }
.emb::before { content: ""; position: absolute; z-index: -1; right: -70px; top: -70px; width: 240px; height: 240px; border-radius: 50%; border: 2px solid rgba(255,255,255,.14); box-shadow: 0 0 0 36px rgba(255,255,255,.04), 0 0 0 72px rgba(255,255,255,.03); }
.emb-k, .emh-k { display: inline-flex; align-items: center; gap: 10px; margin: 0; font: 800 12.5px/1 var(--f); font-stretch: 112%; letter-spacing: .16em; text-transform: uppercase; color: #fff; }
.emb h2 { color: #fff; font-size: clamp(24px, 2.1vw, 31px); line-height: .98; }
.emb-tel, .emh-tel { display: inline-flex; align-items: center; gap: 12px; color: #fff !important; text-decoration: none; font: 800 clamp(30px, 2.8vw, 40px)/1 var(--f); font-stretch: 125%; font-style: italic; letter-spacing: -.01em; }
.emb-tel .ic, .emh-tel .ic { flex: none; padding: 9px; box-sizing: content-box; border-radius: 50%; background: #fff; color: var(--red); }
.emb-tel:hover span, .emh-tel:hover span { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 6px; }
.emb .open, .emh .open { color: rgba(255,255,255,.88); }
.emb .open i, .emh .open i { background: rgba(255,255,255,.55); }
.emb .open.is-open i, .emh .open.is-open i { background: #7CF2B4; }
.emb .btn-w { justify-self: start; color: var(--red) !important; min-height: 50px; }
.emb .btn-w:hover { background: var(--ink); color: #fff !important; }
.emb-l { font-size: 14px; color: rgba(255,255,255,.85) !important; text-underline-offset: 4px; }
.emb-l:hover { color: #fff !important; }

/* The first five minutes: emergency label and real actions */
.five .kick-em { display: inline-flex; align-items: center; gap: 10px; color: #fff; background: var(--red); padding: 8px 12px; border-radius: 3px; }
.five-more { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin: 40px 0 0; }
.five-more .tl { margin-left: 10px; }

/* The urgent form */
.frm[data-form="urgent"] { border-top-color: var(--ink); }
.em-pick, .em-off { border: 0; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.em-pick legend, .em-off legend { font-stretch: 108%; font-weight: 700; font-size: 14px; color: var(--ink); margin-bottom: 8px; padding: 0; }
.em-pick label, .em-off label { display: block; }
.em-pick span, .em-off span { display: inline-block; padding: 10px 14px; border: 1.5px solid var(--mist); border-radius: 3px; font-weight: 600; font-size: 14.5px; color: var(--ink); cursor: pointer; transition: border-color .2s, background .2s; }
.em-pick label span, .em-off label span { font-stretch: 100%; }
.em-pick label:hover span, .em-off label:hover span { border-color: var(--ink); }
.em-pick input:checked + span { background: var(--red); border-color: var(--red); color: #fff; }
.em-off input:checked + span { background: var(--ink); border-color: var(--ink); color: #fff; }
.frm[data-form="urgent"] .btn-w { background: var(--red); color: #fff !important; justify-self: stretch; }
.frm[data-form="urgent"] .btn-w:hover { background: var(--red-2); }

/* Emergency page hero: Micro red, white type */
.emh { background: var(--red); color: #fff; padding: clamp(40px, 5vw, 70px) 0 clamp(56px, 6vw, 90px); position: relative; overflow: hidden; isolation: isolate; }
.emh::before { content: ""; position: absolute; z-index: -1; left: -160px; bottom: -220px; width: 560px; height: 560px; border-radius: 50%; border: 2px solid rgba(255,255,255,.12); box-shadow: 0 0 0 60px rgba(255,255,255,.035), 0 0 0 120px rgba(255,255,255,.025); }
.emh-g { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.emh .crumbs, .emh .crumbs a { color: rgba(255,255,255,.8) !important; }
.emh h1 { color: #fff; font-size: clamp(40px, 4.8vw, 72px); line-height: .92; margin: 18px 0 0; }
.emh .lede { color: rgba(255,255,255,.9); margin: 22px 0 28px; }
.emh-tel { font-size: clamp(38px, 4vw, 56px); }
.emh-tel .ic { padding: 11px; }
.emh .open { display: flex; margin-top: 16px; font-size: 15px; }
.emh-after { margin: 10px 0 0; font-size: 15.5px; color: #fff; }
.emh-x { display: grid; gap: 10px; margin-top: 30px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.22); font-size: 15px; color: rgba(255,255,255,.9); }
.emh-x li { display: flex; align-items: center; gap: 10px; }
.emh-f { background: #fff; color: #2B2C2E; padding: clamp(24px, 3vw, 36px); border-radius: 3px; box-shadow: 0 40px 80px -40px rgba(0,0,0,.6); scroll-margin-top: 110px; }
.emh-f h2 { font-size: clamp(26px, 2.4vw, 36px); }
.emh-f > p { margin: 10px 0 18px; color: #55575B; font-size: 15.5px; }
.emh-f .frm { border: 0; border-radius: 0; box-shadow: none; }
.emh-f .frm-head { display: none; }
.emh-f .frm-body { padding: 0; }

/* Phone menu and call bar */
.mnav nav > a.mn-em { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 4px 12px; margin: 18px 0 6px; padding: 18px; background: var(--red); color: #fff; border: 0; border-radius: 3px; font-style: normal; }
.mn-em b { font: 800 22px/1 var(--f); font-stretch: 125%; font-style: italic; text-transform: uppercase; }
.mn-em span { grid-column: 2; font: 500 14px/1.3 var(--f); text-transform: none; color: rgba(255,255,255,.85); }
.mn-em i { grid-row: 1; }

@media (max-width: 1240px) { .bk-chips { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .dock { grid-template-columns: minmax(0, 1fr); } .emb { grid-template-columns: minmax(0, 1fr) auto; align-items: center; } .emb-k, .emb h2 { grid-column: 1 / -1; } }
@media (max-width: 960px) {
  .callbar { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 1fr; }
  .callbar a { font-size: 13px; letter-spacing: .05em; padding: 0 6px; }
  .cb-call { background: var(--ink); }
  .cb-req { background: var(--graphite); }
  .cb-em { background: var(--red); color: #fff !important; }
  .cb-em i { margin-right: 2px; }
  .emh-g { grid-template-columns: minmax(0, 1fr); }
  .hero { padding-bottom: 150px; }
  .lbar { margin-top: -120px; }
  .util .u-open { margin-right: 0; }
}
@media (max-width: 600px) {
  .bk { padding: 22px 18px 18px; }
  .bk-t { grid-template-columns: minmax(0, 1fr); }
  .bk-t .open { grid-column: 1; grid-row: auto; justify-self: start; }
  .bk-f { grid-template-columns: minmax(0, 1fr); }
  .emb { padding: 24px 18px; grid-template-columns: minmax(0, 1fr); }
  .emb .btn-w { justify-self: stretch; }
  .emh-tel { font-size: 34px; }
  .emh-f { margin: 0 -8px; }
}
/* 1.1.3 polish */
.bk-chips label { display: flex; }
.bk-chips span { flex: 1; align-content: center; min-height: 86px; }
.emb-tel, .emh-tel { white-space: nowrap; }
.emb-tel { font-size: clamp(24px, 2.25vw, 33px); }
.emh .crumbs [aria-current], .emh .crumbs span { color: #fff !important; opacity: .7; }
@media (max-width: 600px) {
  .emh-tel { font-size: 28px; gap: 10px; }
  .emh-tel .ic { padding: 7px; width: 20px; height: 20px; }
  .emb-tel { font-size: 28px; }
  .bk-chips span { min-height: 78px; }
}
.side-emb { display: grid; gap: 6px; margin: 18px 0 4px; padding: 16px 18px; background: var(--red); color: #fff !important; border-radius: 3px; text-decoration: none; transition: background .2s; }
.side-emb:hover { background: var(--red-2); }
.side-emb-k { display: inline-flex; align-items: center; gap: 9px; font: 800 12px/1 var(--f); font-stretch: 112%; letter-spacing: .14em; text-transform: uppercase; }
.side-emb-k i { width: 8px; height: 8px; border-radius: 50%; background: #fff; animation: mpl-wp 2s infinite; }
.side-emb-t { font-weight: 700; font-size: 16px; }
/* 1.1.4: the header phone is an icon button */
.hphone { width: 48px; height: 48px; justify-content: center; gap: 0; background: transparent; border: 2px solid var(--ink); border-radius: 3px; transition: background .2s, color .2s; }
.hphone .ic { color: var(--ink); }
.hphone:hover { background: var(--ink); }
.hphone:hover .ic { color: #fff; }

/* 1.1.8 (Mike and Rhoda): Pay a bill up front, live Google reviews with stars, and the three things
   customers come for (schedule, pay, review) above the footer on every page. */
.stars { position: relative; display: inline-block; line-height: 0; vertical-align: middle; }
.stars svg { display: inline-block; flex: none; fill: currentColor; }
.st-b { display: inline-flex; gap: 2px; color: #D9D9D4; }
.st-f { position: absolute; left: 0; top: 0; display: inline-flex; gap: 2px; overflow: hidden; white-space: nowrap; color: var(--red-2); }
.u-r { align-items: center; }
.util .u-rev { display: inline-flex; align-items: center; gap: 8px; }
.util .u-rev .st-b { color: rgba(255,255,255,.25); }
.util .u-rev .st-f { color: #fff; }
.util .u-rev b { margin: 0; padding: 0; background: none; font-size: 13.5px; letter-spacing: 0; text-transform: none; font-stretch: 100%; }
.util .u-pay { display: inline-flex; align-items: center; gap: 8px; margin: -4px 0; padding: 5px 14px; border-radius: 999px; background: var(--red); color: #fff; font-weight: 700; font-stretch: 108%; }
.util .u-pay:hover { background: var(--red-2); text-decoration: none; }
.util .u-tel { font-weight: 700; color: #fff; }
@media (min-width: 1101px) {
  .hdr .wrap { gap: 16px; }
  .main { gap: 14px; }
  .hbtn { padding: 0 18px; }
}
@media (min-width: 1101px) and (max-width: 1420px) { .logo img { height: 48px; } .main > a, .has-mega > a, .has-drop > a { font-size: 12.5px; } .hbtn { padding: 0 16px; font-size: 13.5px; } }
@media (max-width: 600px) { .util .u-rev { display: none; } .util .u-pay { padding: 4px 12px; } }

.h-rate { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; margin: 26px 0 0; }
.h-rate a { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: #fff; }
.h-rs .st-b { color: rgba(255,255,255,.28); }
.h-rs .st-f { color: #fff; }
.h-rs b { font: 800 20px/1 var(--f); font-stretch: 112%; }
.h-rs span { color: #D3D4D7; font-size: 15.5px; }
.h-rs:hover span { text-decoration: underline; }
.h-rw { font: 750 13.5px/1 var(--f); font-stretch: 112%; letter-spacing: .08em; text-transform: uppercase; padding: 9px 14px; border: 1px solid rgba(255,255,255,.35); border-radius: 999px; }
.h-rw:hover { background: #fff; color: var(--ink) !important; }
.h-rw .ic { color: #fff; }

.rv { background: #fff; }
.rv-top { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 56px; align-items: center; margin-bottom: 56px; }
.rv-score { padding: 34px 34px 30px; background: var(--ink); color: #fff; border-radius: 4px; border-top: 6px solid var(--red); }
.rv-score .kick { color: #fff; margin-bottom: 8px; }
.rv-n { margin: 0; font: 800 clamp(84px, 9vw, 120px)/.9 var(--f); font-stretch: 125%; font-style: italic; letter-spacing: -.03em; }
.rv-st { margin: 14px 0 12px; }
.rv-score .st-b { color: rgba(255,255,255,.2); }
.rv-score .st-f { color: #fff; }
.rv-c { margin: 0; color: var(--mist); font-size: 16px; }
.rv-ask .lede { margin: 18px 0 20px; }
.rv-pick { display: inline-flex; gap: 6px; margin-bottom: 24px; }
.rv-pick a { display: block; width: 46px; height: 46px; padding: 4px; color: #D9D9D4; transition: color .15s, transform .15s; }
.rv-pick svg { width: 100%; height: 100%; fill: currentColor; }
.rv-pick a:hover, .rv-pick a:focus-visible, .rv-pick a.on { color: var(--red-2); transform: scale(1.08); }
.rv-rail { position: relative; }
.rv-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 48px) / 3); gap: 24px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding: 4px 2px 18px; scrollbar-width: thin; }
.rv-track:focus-visible { outline: 3px solid var(--red-2); outline-offset: 4px; }
.rv-card { scroll-snap-align: start; display: flex; flex-direction: column; padding: 28px 26px 24px; background: var(--ink-2); color: #fff; border-radius: 3px; border-top: 3px solid var(--red-2); min-height: 100%; transition: transform .18s ease, box-shadow .18s ease; }
.rv-card:hover { transform: translateY(-5px); box-shadow: 0 24px 46px -20px rgba(0,0,0,.6); }
.rv-card .st-b { color: rgba(255,255,255,.16); }
.rv-card .st-f { color: var(--red-2); }
.rv-h { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.rv-card blockquote { margin: 0; flex: 1; }
.rv-card blockquote p { margin: 0; font-size: 17px; line-height: 1.55; color: #ECECEA; display: -webkit-box; -webkit-line-clamp: 7; -webkit-box-orient: vertical; overflow: hidden; }
.rv-card.is-open blockquote p { display: block; -webkit-line-clamp: unset; }
.rv-more { align-self: flex-start; margin: 12px 0 0; padding: 0; border: 0; background: none; cursor: pointer; font: 750 13px/1 var(--f); font-stretch: 112%; letter-spacing: .08em; text-transform: uppercase; color: #fff; border-bottom: 2px solid var(--red-2); padding-bottom: 2px; }
.rv-more:hover { color: var(--red-2); }
.rv-who { display: flex; align-items: center; gap: 12px; margin-top: 20px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.12); }
.rv-av { width: 44px; height: 44px; flex: none; border-radius: 50%; overflow: hidden; background: var(--red); color: #fff; display: grid; place-items: center; font: 800 18px/1 var(--f); font-stretch: 112%; }
.rv-av img { width: 100%; height: 100%; object-fit: cover; }
.rv-who b { display: block; font-stretch: 106%; font-size: 15.5px; color: #fff; }
.rv-who b a { text-decoration: none; }
.rv-who b a:hover { text-decoration: underline; }
.rv-who small { display: block; font-size: 13.5px; color: var(--steel); }
.rv-nav { display: flex; gap: 10px; justify-content: flex-end; margin-top: 6px; }
.rv-nav button { width: 48px; height: 48px; border: 2px solid var(--ink); border-radius: 3px; background: #fff; cursor: pointer; font: 800 20px/1 var(--f); color: var(--ink); transition: background .2s, color .2s; }
.rv-nav button:hover { background: var(--ink); color: #fff; }
.rv-nav button[disabled] { opacity: .3; cursor: default; background: #fff; color: var(--ink); }
.rv-attr { margin: 18px 0 0; font-size: 13.5px; color: #6A6C70; }
.rev-more-s { padding-top: 0; }
.rev-h2 { margin-bottom: 40px; }
@media (max-width: 1100px) { .rv-track { grid-auto-columns: calc((100% - 24px) / 2); } }
@media (max-width: 960px) { .rv-top { grid-template-columns: minmax(0, 1fr); gap: 34px; } }
@media (max-width: 600px) { .rv-track { grid-auto-columns: 86%; gap: 14px; } .rv-pick a { width: 44px; height: 44px; } .rv-nav { display: none; } .h-rs span { font-size: 14.5px; } }

.three { background: var(--ink); padding: 0; border-top: 6px solid var(--red); }
.three-g { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.t3 { position: relative; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 18px; align-items: center; align-content: center; padding: 34px 54px 34px 30px; text-decoration: none; color: #fff !important; border-left: 1px solid rgba(255,255,255,.12); transition: background .2s; }
.t3:first-child { border-left: 0; }
.t3 > .ic, .t3 > .stars { grid-row: 1 / 3; color: #fff; }
.t3 > .stars { align-self: center; }
.t3 .st-b { color: rgba(255,255,255,.22); }
.t3 .st-f { color: #fff; }
.t3-st svg { width: 16px; height: 16px; }
.t3 b { font: 800 24px/1 var(--f); font-stretch: 125%; font-style: italic; text-transform: uppercase; }
.t3 span { font-size: 15px; color: var(--mist); margin-top: 6px; }
.t3 i { position: absolute; right: 26px; top: 50%; transform: translateY(-50%); font-style: normal; font-size: 24px; color: #fff; transition: transform .25s var(--ease); }
.t3:hover { background: var(--red); }
.t3:hover i { transform: translate(6px, -50%); color: #fff; }
.t3:hover > .ic, .t3:hover .st-f { color: #fff; }
@media (max-width: 960px) { .three-g { grid-template-columns: minmax(0, 1fr); } .t3 { border-left: 0; border-top: 1px solid rgba(255,255,255,.12); padding: 24px 54px 24px 4px; } .t3:first-child { border-top: 0; } }
.util .u-r > *, .util .u-l, .util .u-l > * { white-space: nowrap; }
@media (max-width: 1300px) { .util .u-fam { display: none; } }
@media (max-width: 960px) { .util .u-l { display: none; } }


/* 1.1.8: residential and commercial band on the home page */
.biz { padding: clamp(56px, 7vw, 96px) 0; background: var(--paper); }
.biz h2 { font-size: clamp(26px, 3.2vw, 40px); line-height: 1.08; font-stretch: 108%; max-width: 22ch; margin-bottom: 32px; }
.biz-g { display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 4px solid var(--ink); }
.biz-c { padding: 28px 32px 8px 0; }
.biz-c + .biz-c { padding-left: 32px; border-left: 1px solid var(--line); }
.biz-c h3 { font-size: 21px; font-stretch: 108%; margin-bottom: 10px; }
.biz-c p { color: var(--iron); max-width: 54ch; }
.biz-c ul { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; }
.biz-c li a { font-weight: 700; color: var(--ink); text-decoration: none; border-bottom: 2px solid var(--red); padding-bottom: 2px; }
.biz-c li a:hover { color: var(--red); }
@media (max-width: 760px) {
  .biz-g { grid-template-columns: 1fr; }
  .biz-c, .biz-c + .biz-c { padding: 24px 0 8px; border-left: 0; }
  .biz-c + .biz-c { border-top: 1px solid var(--line); }
}

/* 1.1.13: audit fixes */
.vals-g .tl { display: inline; line-height: 1.5; }
.vals-g .tl::after { display: inline-block; vertical-align: middle; margin-left: 12px; }
@media (max-width: 600px) {
  .u-r { gap: 12px; min-width: 0; align-items: center; }
  .util .u-open { min-width: 0; overflow: hidden; white-space: nowrap; }
  .util .u-open .txt { display: none; }
  .util .u-open .txs { display: inline; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .util .u-open i { margin: 0; }
  .util .u-pay { flex: none; }
}
@media (max-width: 360px) { .btn { white-space: normal; text-align: center; line-height: 1.2; } }
.t3 i .ic, .rv-nav .ic { display: block; }
.rv-nav button { display: grid; place-items: center; }
/* 1.1.13: the full menu shows from 1101px (it fits down to about 1080px). From 961 to 1100px the header keeps the
   Emergency button beside the menu button, so no width is left without it (the call bar covers 960 and below). */
.hem { display: none; }
@media (min-width: 961px) and (max-width: 1100px) {
  .hdr .hem { display: inline-flex; align-items: center; gap: 9px; padding: 11px 15px 11px 13px; background: var(--red); color: #fff; border-radius: 3px; font: 800 13px/1 var(--f); font-stretch: 112%; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; white-space: nowrap; transition: background .2s; }
  .hdr .hem:hover, .hdr .hem[aria-current] { background: var(--red-2); }
}

/* 1.1.14 (Nate): one red. Every red on the site is the brand red (--red, with --red-2 only as its hover shade).
   On dark bands a red label carries the red: white words on a brand red tag, like the Hiring tag in the menu. */
.hire .kick, .phero .kick, .side .kick, .rv-score .kick, .post-b .p-cta .p-cta-k, .bhero h1 .h1-s { display: inline-block; background: var(--red); color: #fff; padding: 7px 11px 6px; border-radius: 3px; line-height: 1.2; }
.bhero h1 .h1-s { display: table; }
.t3 > .ic { background: var(--red); border-radius: 50%; padding: 9px; box-sizing: content-box; }

/* 1.1.14: testimonials page, one featured Google review and the older quotes as matching cards */
.rv-feat { margin: 0 0 48px; padding: clamp(28px, 4vw, 48px); background: var(--paper); border-left: 6px solid var(--red); border-radius: 4px; }
.rv-feat .stars { color: var(--red); }
.rv-feat blockquote { margin: 18px 0 0; }
.rv-feat blockquote p { margin: 0; font-size: clamp(20px, 2.2vw, 27px); line-height: 1.45; color: var(--ink); max-width: 62ch; }
.rv-feat .rv-who { border-top: 0; padding-top: 0; margin-top: 24px; }
.rv-feat .rv-av, .rv-feat .rv-av img { width: 56px; height: 56px; }
.rv-old-s { padding-top: 0; }
.rv-old-s .lede { margin: -8px 0 28px; color: var(--iron); }
.rv-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 24px; }
.rv-old .rv-q { fill: var(--red); }
.rv-old blockquote p { -webkit-line-clamp: unset; display: block; }

/* 1.1.14: brand logos in the brands strip, one height, gray until hovered */
.brands li.br-l { display: flex; align-items: center; }
.brands .br-img { display: block; height: 34px; width: auto; max-width: 150px; object-fit: contain; filter: grayscale(1); opacity: .72; transition: filter .25s, opacity .25s; }
.brands li.br-l:hover .br-img { filter: none; opacity: 1; }


/* 1.2.4 (Nate): a calmer menu bar. Service area moved into Services and About, "Now Hiring" is one plain item,
   more room between items, and the open menus stay open while the pointer travels down into them. */
@media (min-width: 1101px) {
  .main { gap: 34px; align-self: stretch; }
  .has-mega, .has-drop { display: flex; align-items: center; }
  .has-mega > a, .has-drop > a, .main > a { padding: 0; line-height: 86px; }
  .main > a::after, .has-mega > a::after, .has-drop > a::after { bottom: 26px; }
  .has-drop { position: relative; }
  .drop { top: 100%; }
  .drop::before, .mega::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; } /* the bridge */
  .main .nav-job { color: var(--red); }
  .main .nav-job::after { background: var(--red); }
  .main .em-btn { margin-left: 6px; }
}
@media (min-width: 1101px) and (max-width: 1420px) { .main { gap: 26px; } }
.has-mega.is-open .mega, .has-drop.is-open .drop { opacity: 1; visibility: visible; transform: none; }
.mega-t { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; padding: 12px 20px 14px; background: #fff; border: 1px solid var(--line); border-top: 0; box-shadow: 0 30px 60px -24px rgba(0,0,0,.35); font-size: 14px; }
.mega-t a, .mega-t a:nth-child(odd) { display: inline; padding: 0; border: 0; color: #4A4C50; text-decoration: none; font-weight: 600; }
.mega-t a b { display: inline; font-size: 12.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--red); font-stretch: 112%; margin-right: 4px; }
.mega-t a:hover { color: var(--red); background: none; }

/* 1.2.8: the "I'm a real person" box */
.frm-hu { display: flex !important; grid-template-columns: none; align-items: center; gap: 10px; cursor: pointer; font-weight: 700; font-size: 15px; color: var(--ink); margin: 2px 0 4px; }
.frm-hu input { width: 22px; height: 22px; margin: 0; accent-color: var(--red); flex: none; }
.frm-hu span { font-stretch: 100% !important; font-size: 15px !important; }
.frm-hu.is-bad { color: var(--red); }
.frm-hu.is-bad input { outline: 2px solid var(--red); outline-offset: 2px; }

/* 1.2.8: brand logos in one color, all on the same 3:1 canvas, sized so they look even (not the same box height).
   No brand colors, even on hover. Moen shows as its name until a logo is added. */
.brands ul { gap: 6px 10px; align-items: center; }
.brands .br-img.br-own { height: 60px; width: 180px; max-width: none; filter: none; opacity: .58; transition: opacity .2s; }
.brands li.br-l:hover .br-img.br-own { filter: none; opacity: .9; }
.brands .br-img:not(.br-own), .brands li.br-l:hover .br-img:not(.br-own) { filter: grayscale(1); }
.brands li:not(.br-l) { padding: 0 18px; }
@media (max-width: 600px) { .brands .br-img.br-own { height: 46px; width: 138px; } .brands ul { gap: 4px 6px; } }

/* 1.3.2: cookie notice (Got it) and the legal pages */
.ck { position: fixed; z-index: 45; left: 16px; bottom: 16px; max-width: 460px; display: flex; align-items: center; gap: 14px; padding: 14px 16px; background: var(--ink); color: #fff; border-radius: 6px; box-shadow: 0 18px 40px -16px rgba(0,0,0,.55); font-size: 14px; line-height: 1.45; }
.ck[hidden] { display: none; }
.ck p { margin: 0; flex: 1; }
.ck a { color: #fff; text-decoration: underline; text-underline-offset: 2px; margin-left: 6px; }
.ck .btn { flex: none; min-height: 42px; }
@media (max-width: 960px) { .ck { left: 10px; right: 10px; bottom: 70px; max-width: none; gap: 10px; padding: 10px 12px; font-size: 12.5px; line-height: 1.4; } .ck .btn { min-height: 38px; padding: 0 14px; font-size: 12.5px; } .ck a { margin-left: 4px; } }
.legal-d { color: var(--mute, #6A6C70); font-size: 14px; }
.legal-t { overflow-x: auto; margin: 18px 0 26px; }
.legal-t table { width: 100%; border-collapse: collapse; font-size: 15px; min-width: 560px; }
.legal-t th, .legal-t td { text-align: left; vertical-align: top; padding: 10px 12px; border-top: 1px solid var(--line, #e3e3df); }
.legal-t th { font-weight: 800; background: var(--paper, #f5f4f0); }
.legal-t td:first-child { font-weight: 700; white-space: nowrap; }
.wp-list { list-style: none; padding: 0; }
.wp-list li { padding: 12px 0; border-top: 1px solid var(--line, #e3e3df); }

/* 1.3.6: bill pay (preview). One focused card on paper, the summary beside it, Micro red only on the Pay button. */
.bp-flag { background: var(--graphite); color: #fff; text-align: center; font-size: 14px; padding: 9px 16px; } .bp-flag b { color: #fff; }
.bp { padding: 44px 0 70px; }
.bp-g { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 40px; align-items: start; }
.bp .kick { color: var(--red); font: 800 13px/1 var(--f); font-stretch: 112%; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 10px; }
.bp h1 { font: 900 italic clamp(40px, 5vw, 64px)/.9 var(--f); font-stretch: 125%; letter-spacing: -.01em; text-transform: uppercase; }
.bp-lede { margin: 14px 0 26px; font-size: 18px; color: var(--iron); max-width: 34em; }
.bp-card { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 26px 26px 22px; box-shadow: 0 24px 50px -34px rgba(21,22,23,.45); }
.bp-step { border: 0; margin: 0 0 22px; padding: 0; min-width: 0; }
.bp-step legend { display: flex; align-items: center; gap: 10px; font: 800 17px/1.2 var(--f); color: var(--ink); margin-bottom: 14px; padding: 0; width: 100%; }
.bp-n { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--ink); color: #fff; font-size: 13px; }
.bp-pre { margin-left: auto; font: 600 12.5px/1 var(--f); color: #1f7a3d; font-style: normal; background: #e8f4ec; border-radius: 99px; padding: 5px 10px; }
.bp label { display: block; font-size: 13.5px; font-weight: 700; color: var(--ink); margin-bottom: 12px; }
.bp input { display: block; width: 100%; margin-top: 6px; height: 50px; padding: 0 14px; border: 1px solid #C9CAC6; border-radius: 6px; background: #fff; font: 500 17px/1 var(--f); color: var(--ink); }
.bp input:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 3px rgba(136,7,16,.15); }
.bp input.is-bad { border-color: var(--red); box-shadow: 0 0 0 3px rgba(136,7,16,.12); }
.bp-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.bp-row3 { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 0 14px; }
.bp-amt { position: relative; display: block; }
.bp-amt i { position: absolute; left: 14px; top: 50%; transform: translateY(-36%); font-style: normal; font-weight: 700; color: var(--iron); }
.bp-amt input { padding-left: 28px; font-weight: 800; }
.bp-express { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.bp-x { height: 50px; border-radius: 6px; border: 0; cursor: pointer; font: 700 17px/1 var(--f); display: flex; align-items: center; justify-content: center; gap: 4px; }
.bp-apple { background: #000; color: #fff; } .bp-apple svg { width: 17px; height: 20px; margin-top: -3px; }
.bp-gpay { background: #fff; color: #3c4043; border: 1px solid #C9CAC6; } .bp-gpay b { font-weight: 800; color: #4285F4; }
.bp-cash { background: #00D64F; color: #fff; font-size: 15px; } .bp-cash b { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; background: #fff; color: #00D64F; font-weight: 900; margin-right: 4px; }
.bp-venmo { background: #008CFF; color: #fff; font: 900 italic 19px/1 var(--f); letter-spacing: -.02em; }
.bp-zl { list-style: decimal; padding-left: 22px; margin: 0 0 10px; font-size: 15px; color: var(--ink); } .bp-zl li { margin: 0 0 6px; } .bp-ex { color: var(--steel); font-size: 13px; }
.bp-x:hover { filter: brightness(.94); }
.bp-or { display: flex; align-items: center; gap: 12px; margin: 16px 0; color: var(--steel); font-size: 13px; }
.bp-or::before, .bp-or::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.bp-tabs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 14px; }
.bp-tabs button { height: 46px; border: 1px solid #C9CAC6; border-radius: 6px; background: #fff; font: 700 14.5px/1 var(--f); color: var(--iron); cursor: pointer; }
.bp-tabs button[aria-selected="true"] { border: 2px solid var(--ink); color: var(--ink); }
.bp-demo { position: relative; display: block; }
.bp-demo input, .bp-pane input[readonly] { background: #F7F7F5; color: var(--iron); cursor: not-allowed; }
.bp-brands { position: absolute; right: 10px; top: 50%; transform: translateY(-36%); display: flex; gap: 4px; font-style: normal; }
.bp-brands b { font-size: 9.5px; font-weight: 800; letter-spacing: .04em; border: 1px solid var(--line); border-radius: 3px; padding: 3px 4px; color: var(--iron); background: #fff; }
.bp-note { font-size: 13px; color: var(--steel); margin: 4px 0 0; }
.bp-bank { width: 100%; text-align: left; border: 1px solid #C9CAC6; border-radius: 6px; background: #fff; padding: 14px 16px; cursor: pointer; font: inherit; }
.bp-bank span { display: block; font-weight: 800; color: var(--ink); font-size: 16px; } .bp-bank small { color: var(--iron); font-size: 13.5px; }
.bp-bank:hover { border-color: var(--ink); }
.bp-later { font-size: 15px; color: var(--iron); margin-bottom: 8px; }
.bp-split { font-size: 15px; color: var(--ink); margin-bottom: 12px; }
.bp-bnpl { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.bp-bnpl .bp-x { background: #fff; border: 1px solid #C9CAC6; color: var(--ink); font-weight: 800; }
.bp-err { color: var(--red); font-weight: 700; font-size: 14px; margin: 0 0 10px; }
.bp-go { width: 100%; min-height: 58px; font-size: 17px; }
.bp-go:disabled { opacity: .7; cursor: progress; }
.bp-sec { display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 13px; color: var(--steel); margin: 12px 0 0; }
.bp-sec svg { width: 13px; height: 15px; }
.bp-done { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 34px 26px; text-align: center; }
.bp-done:focus { outline: none; }
.bp-check { width: 64px; height: 64px; border-radius: 50%; background: #1f7a3d; color: #fff; display: grid; place-items: center; margin: 0 auto 14px; } .bp-check svg { width: 34px; height: 34px; }
.bp-done h2 { font: 900 italic 34px/1 var(--f); font-stretch: 125%; text-transform: uppercase; margin-bottom: 8px; }
.bp-paid { font-size: 17px; color: var(--ink); }
.bp-rec { display: grid; grid-template-columns: auto 1fr; gap: 6px 18px; max-width: 360px; margin: 16px auto; text-align: left; font-size: 15px; }
.bp-rec dt, .bp-sum dt { color: var(--steel); } .bp-rec dd, .bp-sum dd { margin: 0; color: var(--ink); font-weight: 700; }
.bp-side { position: sticky; top: 120px; }
.bp-sum { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 22px; }
.bp-logo { width: 190px; margin-bottom: 18px; }
.bp-sum dl { display: grid; grid-template-columns: auto 1fr; gap: 8px 16px; font-size: 15px; margin: 0; }
.bp-sum dd { text-align: right; }
.bp-tot { display: flex; justify-content: space-between; align-items: baseline; border-top: 1px solid var(--line); margin: 16px 0 0; padding-top: 14px; }
.bp-tot span { font-weight: 700; color: var(--ink); } .bp-tot b { font: 900 28px/1 var(--f); color: var(--ink); }
.bp-help { font-size: 14px; color: var(--iron); margin: 16px 0 0; } .bp-help a { color: var(--red); font-weight: 700; }
.bp-notes { background: var(--ink); color: #D9DADC; padding: 50px 0 60px; }
.bp-notes h2 { color: #fff; font: 900 italic 30px/1 var(--f); font-stretch: 120%; text-transform: uppercase; margin-bottom: 22px; }
.bp-ng { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; margin-bottom: 26px; }
.bp-ng h3 { color: #fff; font-size: 17px; margin-bottom: 6px; } .bp-ng p { font-size: 15px; margin: 0; }
.bp-fees { width: 100%; border-collapse: collapse; font-size: 15px; margin-bottom: 20px; }
.bp-fees th { text-align: left; color: #fff; padding: 10px 12px 10px 0; border-bottom: 1px solid rgba(255,255,255,.25); }
.bp-fees td { padding: 10px 12px 10px 0; border-bottom: 1px solid rgba(255,255,255,.1); } .bp-fees .mu { color: var(--steel); }
.bp-q { font-size: 15.5px; max-width: 60em; } .bp-q b { color: #fff; }
@media (max-width: 960px) { .bp-g { grid-template-columns: 1fr; } .bp-side { position: static; } .bp-logo { display: none; } .bp-ng { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .bp-brands { display: none; } .bp-card { padding: 18px 16px; } .bp-row2, .bp-row3 { grid-template-columns: 1fr; } .bp-express, .bp-tabs { grid-template-columns: 1fr 1fr; } .bp-tabs button { font-size: 13px; } .bp-fees { font-size: 13.5px; } .bp-pre { display: none; } }