/* Archivo, self-hosted (latin subset, variable wdth 62-125 / wght 400-900), 2026-10-23 speed pass */
@font-face{font-family:'Archivo';font-style:normal;font-weight:400 900;font-stretch:62% 125%;font-display:swap;src:url(/assets/fonts/archivo-latin-var.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Excel Plumbing, round B f2 "The Shop Floor" (header + hero carried from h1 "Main Street") */
:root{
  --navy:#243447; --ink:#111827; --cu:#E3884A; --cu-d:#C96F33; --slate:#3F6E8C; --ground:#F5F7FA; --white:#fff;
  --display:"Archivo", system-ui, sans-serif;
  --body:"Archivo", system-ui, sans-serif;
  --wrap:1312px;
  --gut:max(20px, calc((100vw - var(--wrap)) / 2));
  --util:36px; --hdr:84px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--body);font-stretch:100%;color:var(--navy);background:var(--white);line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{width:100%;max-width:calc(var(--wrap) + 2 * 20px);margin-inline:auto;padding-inline:var(--gut)}
@media (min-width:1352px){.wrap{max-width:none;padding-inline:var(--gut)}}
.nw{white-space:nowrap}

/* utility line */
.util{background:var(--ink);color:#C9D2DD;font-size:13px;letter-spacing:.02em}
.util__in{display:flex;justify-content:space-between;align-items:center;height:var(--util);gap:24px}
.util__r{display:flex;align-items:center;gap:14px}
.util__sep{width:14px;height:1px;background:var(--cu);transform:rotate(-55deg)}

/* header */
.hdr{background:var(--white);border-bottom:1px solid #E4E8EE;position:relative;z-index:5}
.hdr__in{display:flex;align-items:center;height:var(--hdr);gap:28px}
.hdr__logo img{height:54px;width:auto}
.hdr__nav{display:flex;gap:26px;margin-left:auto}
.hdr__nav{align-items:center}
.hdr__nav>a,.hdr__nav .dd__t{display:flex;align-items:center;gap:6px;text-decoration:none;font-weight:600;font-size:15.5px;color:var(--navy)}
.hdr__nav>a:hover,.hdr__nav .dd__t:hover{color:var(--cu-d)}
.hdr__nav svg{width:10px;height:6px;fill:none;stroke:currentColor;stroke-width:1.6}
.hdr__tel{display:flex;align-items:center;min-height:44px;gap:8px;text-decoration:none;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:18px;color:var(--navy);margin-left:8px}
.hdr__tel svg{width:18px;height:18px;fill:var(--cu)}
.hdr__book{display:inline-flex;align-items:center;height:48px;padding:0 22px;background:var(--navy);color:#fff;text-decoration:none;font-weight:800;font-size:14px;letter-spacing:.06em;text-transform:uppercase}
.hdr__book:hover{background:var(--ink)}
.hdr__menu{display:none;width:48px;height:48px;border:0;background:var(--navy);padding:0 13px;flex-direction:column;justify-content:center;gap:5px;cursor:pointer}
.hdr__menu span{display:block;height:2px;background:#fff}

/* hero: bright photo plate bleeding right, solid navy poster panel straddling it */
.hero{
  --h:clamp(620px, calc(100svh - var(--util) - var(--hdr)), 800px);
  --keep:.70;           /* fraction of the photo's height shown: spire tip to just under the van */
  --shift:36px;         /* crop off the right edge */
  --pw:min(720px, 54vw);
  position:relative;height:var(--h);background:var(--ground);overflow:hidden;isolation:isolate}
.hero__photo{margin:0;position:absolute;top:0;right:calc(-1 * var(--shift));height:calc(var(--h) / var(--keep));aspect-ratio:1650/2048;z-index:0}
.hero__photo img{width:100%;height:100%;object-fit:cover}
.hero__photo figcaption{position:absolute;right:calc(var(--shift) + 20px);top:20px;background:rgba(17,24,39,.78);color:#fff;font-size:12.5px;font-weight:600;letter-spacing:.04em;padding:7px 12px 7px 26px}
.hero__photo figcaption::before{content:"";position:absolute;left:10px;top:50%;width:8px;height:8px;margin-top:-4px;background:var(--cu);transform:rotate(45deg)}

.hero__panel{position:absolute;z-index:2;left:var(--gut);top:clamp(28px,6vh,52px);bottom:0;width:var(--pw);
  background:var(--navy);color:#fff;display:flex;align-items:center;
  --cut:64px;
  clip-path:polygon(0 0, calc(100% - var(--cut)) 0, 100% var(--cut), 100% 100%, 0 100%)}
/* their promo graphic's copper diagonal frame lines, carried into the cut corner */
.hero__panel::before{content:"";position:absolute;top:0;right:0;width:150px;height:150px;pointer-events:none;
  background:linear-gradient(225deg, transparent 0 58px, var(--cu) 58px 61px, transparent 61px 70px, var(--cu) 70px 72px, transparent 72px)}
.hero__panel::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:6px;background:var(--cu)}
.hero__copy{padding:40px clamp(28px,4vw,56px) 48px;width:100%}
.hero h1{margin:0 0 18px;font-family:var(--body);font-weight:700;font-size:15px;letter-spacing:.16em;text-transform:uppercase;color:#F2B58A;display:flex;align-items:center;gap:12px}
.hero h1::before{content:"";width:28px;height:3px;background:var(--cu)}
.big{margin:0;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(40px,5.6vw,80px);line-height:.94;letter-spacing:-.01em;text-transform:uppercase;color:#fff}
.big>span{display:block}
.big b{color:var(--cu);font-weight:900}
.lede{margin:22px 0 0;max-width:34em;font-size:clamp(16px,1.3vw,19px);line-height:1.5;color:#D5DDE7}
.hero__btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:64px;padding:0 30px;text-decoration:none;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:18px;letter-spacing:.02em;text-transform:uppercase;transition:background .15s, transform .15s}
.btn svg{width:22px;height:22px;fill:currentColor;flex:none}
.btn--cu{background:var(--cu);color:var(--ink);box-shadow:0 6px 0 var(--cu-d)}
.btn--cu:hover{background:#EC9A61;transform:translateY(-1px)}
.btn--wh{background:#fff;color:var(--navy);box-shadow:0 6px 0 #B9C4D1}
.btn--wh:hover{background:var(--ground)}
.rating{display:inline-flex;align-items:center;gap:10px;min-height:44px;margin-top:20px;margin-bottom:-10px;text-decoration:none;color:#fff;font-size:15px}
.rating__g{width:22px;height:22px;background:#fff;border-radius:50%;padding:3px}
.rating strong{font-family:var(--display);font-stretch:112%;font-weight:900;font-size:19px}
.stars{display:inline-flex;gap:3px}
.stars i{width:16px;height:16px;background:var(--cu);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
.rating__n{color:#D5DDE7;text-decoration:underline;text-decoration-color:rgba(227,136,74,.6);text-underline-offset:4px}

/* strip under the hero */
.strip{background:var(--white);border-bottom:1px solid #E4E8EE}
.strip__in{list-style:none;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding-block:26px}
.strip li{position:relative;padding:0 24px 0 28px;font-weight:600;font-size:15px;line-height:1.35;color:var(--navy)}
.strip li::before{content:"";position:absolute;left:0;top:3px;width:12px;height:12px;border:2px solid var(--cu);transform:rotate(45deg)}

/* ---------- tablet landscape / small desktop ---------- */
@media (max-width:1180px){
  :root{--util:32px;--hdr:76px}
  .hdr__nav{display:none}
  .hdr__in{gap:14px}
  .hdr__logo img{height:46px}
  .hdr__tel{margin-left:auto}
  .hdr__menu{display:flex}
  .hero{--pw:min(500px, 50vw);--shift:56px}
  .hero__panel{--cut:48px}
  .hero__panel::before{background:linear-gradient(225deg, transparent 0 44px, var(--cu) 44px 47px, transparent 47px 55px, var(--cu) 55px 57px, transparent 57px)}
  .hero__copy{padding:32px 34px 40px}
  .big{font-size:clamp(36px,4.6vw,54px)}
  .lede{font-size:16px;margin-top:16px}
  .hero__btns{margin-top:24px;gap:12px}
  .btn{min-height:58px;padding:0 18px;font-size:15px}
  .btn svg{width:19px;height:19px}
  .rating{margin-top:12px}
  .strip__in{grid-template-columns:repeat(2,1fr);row-gap:14px;padding-block:22px}
}

/* ---------- portrait tablet + phone: van on top, panel rises over the road ---------- */
@media (max-width:820px){
  .util{display:none}
  :root{--util:0px;--hdr:76px}
  .hero{height:auto;overflow:hidden;background:var(--ground);padding-bottom:0;
    --pw:auto;--imgw:100vw;--keep:.70;--box:calc(var(--imgw) * 2048 / 1650 * var(--keep));--over:40px}
  .hero__photo{position:relative;right:auto;top:auto;height:var(--box);aspect-ratio:auto;overflow:hidden}
  .hero__photo picture{position:absolute;top:var(--ytop,0px);left:var(--xleft,0px);width:var(--imgw)}
  .hero__photo img{width:100%;height:auto}
  .hero__photo figcaption{top:16px;bottom:auto;right:16px}
  .hero__panel{position:relative;left:auto;top:auto;bottom:auto;width:auto;margin:calc(-1 * var(--over)) var(--gut) 0;display:block}
  .hero__copy{padding:30px 32px 34px}
  .big{font-size:clamp(34px,7.4vw,58px)}
  .big>span{display:inline}
  .hero__copy{display:flex;flex-direction:column}
  .hero__btns{order:3}
  .lede{order:4}
  .rating{order:5}
  .hero__copy{padding:26px 32px 30px}
  .strip__in{padding-block:22px}
}
@media (max-width:600px){
  :root{--hdr:64px}
  .hdr__logo img{height:38px}
  .hdr__tel span{display:none}
  .hdr__tel{width:44px;height:44px;justify-content:center;border:2px solid var(--cu)}
  .hdr__book{display:none}
  .hdr__menu{width:44px;height:44px;padding:0 12px}
  .hero{--imgw:106vw;--xleft:-3vw;--keep:.70;--over:36px}
  .hero__photo figcaption{display:none}
  .hero__panel{margin-inline:12px;--cut:36px}
  .hero__panel::before{width:90px;height:90px;background:linear-gradient(225deg, transparent 0 32px, var(--cu) 32px 34px, transparent 34px 40px, var(--cu) 40px 41.5px, transparent 41.5px)}
  .hero__copy{padding:22px 20px 24px}
  .hero h1{font-size:12px;letter-spacing:.14em;margin-bottom:12px}
  .hero h1::before{width:18px}
  .big{font-size:clamp(30px,9.4vw,40px)}
  .lede{display:none}
  .hero__btns{display:grid;grid-template-columns:1.45fr 1fr;gap:10px;margin-top:20px}
  .btn{min-height:54px;padding:0 8px;font-size:14px;gap:7px;font-stretch:100%;letter-spacing:0}
  .btn svg{width:18px;height:18px}
  .rating{margin-top:8px;font-size:13.5px;gap:8px}
  .rating strong{font-size:16px}
  .stars i{width:13px;height:13px}
  .strip__in{grid-template-columns:1fr;row-gap:12px}
  .strip li{font-size:14.5px}
}

/* =====================================================================
   ROUND B, f2 "THE SHOP FLOOR": everything below the hero
   ===================================================================== */
:root{--sec:clamp(68px,7vw,108px);--line:#D5DDE7;--mute:#4A5A6D}
:where(main section:not(.hero),.ftr,.drawer) img{height:auto}
html{scroll-behavior:smooth}
body.is-locked{overflow:hidden}

/* header dropdowns (desktop) */
.dd{position:relative}
.dd__p{position:absolute;top:calc(100% + 24px);left:-22px;min-width:270px;background:#fff;border-top:4px solid var(--cu);box-shadow:0 22px 44px rgba(17,24,39,.18);padding:10px 0;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .15s,transform .15s,visibility 0s .15s;z-index:20}
.dd__p::before{content:"";position:absolute;left:0;right:0;top:-28px;height:28px}
.dd:hover .dd__p,.dd:focus-within .dd__p{opacity:1;visibility:visible;transform:none;transition:opacity .15s,transform .15s}
.dd__p--wide{display:grid;grid-template-columns:1fr 1fr;min-width:580px}
.hdr__nav .dd__p a{display:block;padding:11px 22px;font-weight:600;font-size:15px;color:var(--navy);text-decoration:none}
.hdr__nav .dd__p a:hover{background:var(--ground);color:var(--cu-d)}

/* shared type */
.kick{display:flex;align-items:center;gap:12px;margin:0 0 18px;font-weight:700;font-size:13.5px;letter-spacing:.16em;text-transform:uppercase;color:#A35722}
.kick::before{content:"";width:28px;height:3px;background:var(--cu);flex:none}
.kick--lt{color:#F2B58A}
.kick--ink{color:var(--ink)}
.kick--ink::before{background:var(--ink)}
.h-xl{margin:0;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(34px,4.3vw,62px);line-height:.98;letter-spacing:-.012em;text-wrap:balance}
.h-xl b{color:var(--cu);font-weight:900}
.btn--navy{background:var(--navy);color:#fff;box-shadow:0 6px 0 var(--ink)}
.btn--navy:hover{background:var(--ink)}
.stars--sm i{width:14px;height:14px}

/* ---------- problem index ---------- */
.fix{background:var(--ground);padding:var(--sec) 0}
.fix__head{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);column-gap:64px;align-items:end}
.fix__head .kick{grid-column:1}
.fix__head .h-xl{grid-column:1;color:var(--navy)}
.fix__lede{grid-column:2;grid-row:1 / span 2;align-self:end;margin:0;font-size:18px;line-height:1.55;color:var(--mute)}
.fix__list{list-style:none;margin:44px 0 0;padding:0;border-top:4px solid var(--navy)}
.fix__row{position:relative;display:grid;grid-template-columns:72px minmax(0,1.2fr) minmax(0,1fr);gap:28px;padding:22px 0;border-bottom:1px solid #C3CDD8;transition:background .15s}
.fix__row::after{content:"";position:absolute;left:0;top:-1px;bottom:-1px;width:0;background:var(--cu);transition:width .15s}
.fix__row:hover{background:#fff}
.fix__row:hover::after{width:5px}
.fix__n{padding-top:10px;font-family:var(--display);font-stretch:125%;font-weight:800;font-size:15px;color:#A35722;padding-left:18px}
.fix__t{margin:0;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(28px,3.1vw,46px);line-height:.96;letter-spacing:-.01em;text-transform:uppercase;color:var(--navy)}
.fix__row--cold .fix__t{color:var(--slate)}
.fix__d{padding-top:4px}
.fix__d p{margin:0 0 12px;font-size:17px;line-height:1.5;color:var(--mute)}
.svc{display:flex;align-items:flex-start;gap:12px;padding:6px 0;font-weight:700;font-size:15.5px;line-height:1.35;color:var(--navy);text-decoration:none}
.svc::before{content:"";flex:none;width:16px;height:2px;margin-top:.62em;background:var(--cu)}
.svc:hover{color:var(--cu-d)}
.fix__foot{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:44px}
.fix__foot p{margin:0;font-size:20px;font-weight:600;color:var(--navy)}

/* ---------- the work (navy field) ---------- */
.work{background:var(--navy);color:#fff;padding:var(--sec) 0;overflow:hidden}
.work__head{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);column-gap:64px;align-items:end}
.work__lede{grid-column:2;grid-row:1 / span 2;margin:0;font-size:18px;line-height:1.55;color:#C9D2DD}
.feat{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,4.4vw,72px);margin-top:60px;align-items:start}
.feat__big{position:relative;margin:0 0 0 calc(-1 * var(--gut));height:clamp(560px,52vw,740px)}
.feat__big img{width:100%;height:100%;object-fit:cover;object-position:50% 34%}
.feat__big figcaption,.feat__small figcaption{position:absolute;left:var(--gut);bottom:0;background:var(--cu);color:var(--ink);font-weight:700;font-size:13.5px;letter-spacing:.02em;padding:10px 16px}
.feat__copy{padding-top:18px}
.feat__t{margin:0 0 18px;font-family:var(--display);font-stretch:118%;font-weight:800;font-size:clamp(28px,2.7vw,40px);line-height:1.04;letter-spacing:-.01em}
.feat__copy>p:not(.kick){margin:0;font-size:17.5px;line-height:1.6;color:#C9D2DD}
.feat__small{position:relative;margin:40px 0 0}
.feat__small img{width:100%;aspect-ratio:5/4;object-fit:cover;object-position:50% 40%}
.feat__small figcaption{left:0;background:var(--ink);color:#fff}
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:clamp(48px,5vw,72px)}
.trio__item{margin:0;display:flex;flex-direction:column}
.trio__item img{width:100%;aspect-ratio:1/1.1;object-fit:cover}
.trio__item figcaption{background:#1A2738;padding:20px 24px 22px;border-top:4px solid var(--cu)}
.trio__item strong{display:block;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(20px,2vw,28px);text-transform:uppercase;line-height:1}
.trio__item span{display:block;margin-top:8px;font-size:14.5px;color:#C9D2DD}

/* ---------- repair before replace ---------- */
.rbr{background:#fff;padding:var(--sec) 0}
.rbr__in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(40px,6vw,96px);align-items:center}
.poster-sm{margin:0 0 26px;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(48px,5.8vw,92px);line-height:.88;letter-spacing:-.015em;text-transform:uppercase;color:var(--navy)}
.poster-sm>span{display:block}
.poster-sm b{color:var(--cu)}
.rbr__lede{margin:0;font-size:20px;line-height:1.5;color:var(--navy);max-width:28em}
.ticks{list-style:none;margin:28px 0 0;padding:0;border-top:2px solid var(--navy)}
.ticks li{position:relative;padding:14px 0 14px 34px;border-bottom:1px solid var(--line);font-weight:600;font-size:16px;color:var(--navy)}
.ticks li::before{content:"";position:absolute;left:4px;top:19px;width:12px;height:7px;border-left:3px solid var(--cu);border-bottom:3px solid var(--cu);transform:rotate(-45deg)}
.ba{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.ba__item{position:relative;margin:0}
.ba__item img{width:100%;aspect-ratio:3/4;object-fit:cover}
.ba__item--after{margin-top:56px}
.ba__item figcaption{position:absolute;left:0;top:0}
.tag{display:inline-block;padding:10px 16px;font-family:var(--display);font-stretch:118%;font-weight:800;font-size:14px;letter-spacing:.06em;text-transform:uppercase}
.tag--ink{background:var(--ink);color:#fff}
.tag--cu{background:var(--cu);color:var(--ink)}

/* ---------- promise band (copper field) ---------- */
.promise{background:var(--cu);color:var(--ink);padding:var(--sec) 0}
.promise__in{display:grid;grid-template-columns:minmax(0,6.2fr) minmax(0,5fr);gap:clamp(40px,6vw,96px);align-items:center}
.promise .h-xl b{color:#fff}
.steps{list-style:none;margin:40px 0 0;padding:0}
.steps li{display:grid;grid-template-columns:64px 1fr;gap:18px;padding:20px 0;border-top:2px solid rgba(17,24,39,.22)}
.steps li:last-child{border-bottom:2px solid rgba(17,24,39,.22)}
.steps__n{font-family:var(--display);font-stretch:125%;font-weight:900;font-size:44px;line-height:.9}
.steps h3{margin:0 0 4px;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:21px;line-height:1.15}
.steps p{margin:0;font-size:16.5px;line-height:1.5;color:#2B2016}
.ticket{background:#fff;color:var(--navy);box-shadow:16px 16px 0 var(--navy)}
.ticket__top{margin:0;padding:16px 30px;background:var(--navy);color:#fff;font-weight:800;font-size:13.5px;letter-spacing:.16em;text-transform:uppercase}
.ticket__row{display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);gap:24px;align-items:center;padding:28px 30px;border-bottom:2px dashed #C3CDD8}
.ticket__row--last{grid-template-columns:1fr;gap:6px;border-bottom:0}
.ticket__big{margin:0;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(54px,5.4vw,84px);line-height:.85;letter-spacing:-.02em;white-space:nowrap}
.ticket__mid{margin:0;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:26px;text-transform:uppercase;line-height:1}
.ticket__txt{margin:0;font-size:15.5px;line-height:1.45;color:var(--mute)}
.ticket__txt strong{display:block;color:var(--navy);font-size:16.5px;margin-bottom:2px}

/* ---------- winter (full-bleed photo, navy panel with the cut corner) ---------- */
.winter{position:relative;min-height:clamp(600px,48vw,700px);display:flex;align-items:flex-end;overflow:hidden;background:var(--ink);isolation:isolate}
.winter__photo{position:absolute;inset:0;margin:0;z-index:-1}
.winter__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 62%}
.winter__photo figcaption{position:absolute;right:var(--gut);top:24px;background:rgba(17,24,39,.78);color:#fff;font-size:12.5px;font-weight:600;letter-spacing:.04em;padding:7px 12px 7px 26px}
.winter__photo figcaption::before,.area__photo figcaption::before{content:"";position:absolute;left:10px;top:50%;width:8px;height:8px;margin-top:-4px;background:var(--cu);transform:rotate(45deg)}
.winter__wrap{padding-top:140px}
.winter__panel{position:relative;max-width:640px;padding:52px 56px 56px;background:var(--navy);color:#fff;--cut:64px;clip-path:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.winter__panel::before{content:"";position:absolute;top:0;right:0;width:150px;height:150px;pointer-events:none;background:linear-gradient(225deg,transparent 0 58px,var(--cu) 58px 61px,transparent 61px 70px,var(--cu) 70px 72px,transparent 72px)}
.winter__panel::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:6px;background:var(--cu)}
.winter__panel>p:not(.kick){margin:20px 0 0;font-size:17.5px;line-height:1.55;color:#D5DDE7}
.winter__list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;margin:24px 0 32px;padding:0}
.winter__list li{position:relative;padding-left:22px;font-weight:600;font-size:15.5px;color:#fff}
.winter__list li::before{content:"";position:absolute;left:0;top:7px;width:8px;height:8px;background:var(--cu);transform:rotate(45deg)}

/* ---------- rentals (slate field) ---------- */
.rent{background:var(--slate);color:#fff;padding:var(--sec) 0}
.rent__in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(48px,7vw,112px);align-items:center}
.rent__list{list-style:none;margin:32px 0 36px;padding:0}
.rent__list li{padding:16px 0;border-top:1px solid rgba(255,255,255,.28);font-size:16.5px;line-height:1.5;color:#E3EAF1}
.rent__list strong{display:block;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:19px;color:#fff;margin-bottom:2px}
.rent__quote{position:relative;margin:0;padding:92px 48px 44px;background:var(--navy);box-shadow:-16px 16px 0 var(--cu)}
.rent__mark{position:absolute;top:-2px;left:40px;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:150px;line-height:1;color:var(--cu)}
.rent__quote blockquote{margin:0;font-weight:600;font-size:clamp(20px,1.8vw,25px);line-height:1.42}
.rent__quote figcaption{display:flex;align-items:center;gap:12px;margin-top:24px;font-weight:700;font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:#C9D2DD}

/* ---------- crew moment ---------- */
.crew{background:#fff;padding:var(--sec) 0 calc(var(--sec) + 20px)}
.crew__in{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(56px,8vw,128px);align-items:center}
.crew__photo{position:relative;margin:0 36px 36px 0;max-width:380px;isolation:isolate}
.crew__photo::before{content:"";position:absolute;inset:36px -36px -36px 36px;background:var(--cu);z-index:-1}
.crew__photo img{width:100%;aspect-ratio:560/860;object-fit:cover;object-position:50% 0}
.crew__photo figcaption{position:absolute;left:0;bottom:0;background:var(--ink);color:#fff;font-weight:600;font-size:13px;letter-spacing:.03em;padding:9px 14px}
.crew__tape{position:absolute;top:30px;left:-18px;background:var(--navy);color:#fff;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:15px;letter-spacing:.1em;text-transform:uppercase;padding:11px 18px;transform:rotate(-4deg);box-shadow:0 8px 18px rgba(17,24,39,.25)}
.crew__copy .h-xl{color:var(--navy)}
.crew__lede{margin:24px 0 14px;font-size:21px;line-height:1.5;font-weight:500;color:var(--navy)}
.crew__copy>p:not(.kick):not(.crew__lede){margin:0;font-size:17px;line-height:1.6;color:var(--mute)}
.ledger{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:36px 0 0;border-top:4px solid var(--navy)}
.ledger div{padding:18px 16px 0 0}
.ledger dt{font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(34px,3.4vw,48px);line-height:1;color:var(--navy)}
.ledger dd{margin:8px 0 0;font-size:14.5px;line-height:1.35;color:var(--mute)}

/* ---------- reviews wall ---------- */
.revs{background:var(--ground);padding:var(--sec) 0}
.revs__head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(40px,5vw,80px);align-items:end;margin-bottom:52px}
.revs__head .h-xl{color:var(--navy)}
.revs__score{display:flex;align-items:center;gap:20px;text-decoration:none;color:var(--navy);padding-right:clamp(40px,5vw,80px);border-right:4px solid var(--navy)}
.revs__num{font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(92px,10vw,150px);line-height:.8;letter-spacing:-.03em}
.revs__meta{display:flex;flex-direction:column;gap:10px;font-weight:600;font-size:15px}
.revs__meta>span:last-child{text-decoration:underline;text-decoration-color:var(--cu);text-underline-offset:4px}
.wall{columns:3;column-gap:18px}
.rv{break-inside:avoid;margin:0 0 18px;background:#fff;padding:28px 28px 24px;border-top:4px solid var(--navy);color:var(--navy)}
.rv blockquote{margin:14px 0 18px;font-size:16.5px;line-height:1.55}
.rv figcaption{font-weight:800;font-size:15px}
.rv figcaption span{display:block;margin-top:2px;font-weight:500;font-size:13px;color:var(--mute)}
.rv--feature{background:var(--navy);color:#fff;border-top-color:var(--cu);padding:36px 34px 30px}
.rv--feature blockquote{font-size:20px;line-height:1.5;font-weight:500}
.rv--feature figcaption span{color:#C9D2DD}
.rv--cu{background:var(--cu);border-top-color:var(--ink);color:var(--ink)}
.rv--cu blockquote,.rv--big blockquote{font-family:var(--display);font-stretch:118%;font-weight:800;font-size:24px;line-height:1.18}
.rv--cu .stars i{background:var(--ink)}
.rv--cu figcaption span{color:#3A2A1C}
.rv--slate{background:var(--slate);border-top-color:var(--cu);color:#fff}
.rv--slate figcaption span{color:#DCE5EE}
.revs__all{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font-weight:800;font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--navy);text-decoration:underline;text-decoration-color:var(--cu);text-decoration-thickness:2px;text-underline-offset:6px}
.revs__all svg{width:16px;height:16px;fill:none;stroke:var(--cu);stroke-width:2}

/* ---------- poster band ---------- */
.poster{position:relative;background:var(--navy);color:#fff;overflow:hidden;border-bottom:12px solid var(--cu)}
.poster__in{position:relative;padding-top:var(--sec);padding-bottom:calc(var(--sec) - 20px)}
.poster__t{margin:0;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(44px,8.6vw,130px);line-height:.86;letter-spacing:-.02em;text-transform:uppercase}
.poster__t>span{display:block}
.poster__t b{color:var(--cu)}
.poster__foot{margin-top:34px;max-width:30em}
.poster__foot p{margin:0;font-size:18px;line-height:1.5;color:#C9D2DD}
.poster__foot a{color:#fff;font-weight:800;text-decoration-color:var(--cu);text-underline-offset:4px}
.poster__van{position:absolute;right:var(--gut);bottom:-14px;width:clamp(300px,33vw,500px);height:auto;filter:drop-shadow(0 18px 24px rgba(0,0,0,.35))}

/* ---------- service area: Mount Stuart full-bleed, framed map rising onto a slate field ---------- */
.area{background:var(--slate);color:#fff;padding-bottom:var(--sec);--lift:clamp(170px,15vw,240px)}
.area__photo{position:relative;margin:0;height:clamp(380px,38vw,560px);overflow:hidden}
.area__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.area__photo figcaption{position:absolute;right:var(--gut);top:24px;background:rgba(17,24,39,.78);color:#fff;font-size:12.5px;font-weight:600;letter-spacing:.04em;padding:7px 12px 7px 26px}
.area__grid{position:relative;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(36px,5vw,88px);align-items:start}
.area__mapcol{margin-top:calc(-1 * var(--lift))}
.map-frame{position:relative;background:#fff;padding:12px;border-top:6px solid var(--cu);box-shadow:0 40px 70px -30px rgba(17,24,39,.6)}
.map-slot{width:100%;aspect-ratio:720/470;overflow:hidden;background:var(--ground)}
.map-img{display:block;width:100%;height:100%;object-fit:cover;object-position:60% 50%}
.area__roslyn{position:relative;width:56%;margin:-56px 0 0 auto;border:8px solid var(--slate);aspect-ratio:3/2;overflow:hidden;background:var(--slate)}
.area__roslyn img{width:100%;height:100%;object-fit:cover}
.area__roslyn figcaption{position:absolute;left:0;bottom:0;background:var(--ink);color:#fff;font-size:12.5px;font-weight:600;padding:7px 12px}
.area__copy{padding-top:56px}
.area__copy>p:not(.kick){margin:18px 0 0;font-size:18px;line-height:1.55;color:#E2EAF1}
.towns{margin:30px 0 0;border-top:4px solid #fff}
.towns div{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.28)}
.towns dt{font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(28px,2.8vw,40px);line-height:1;text-transform:uppercase;color:#fff}
.towns div:first-child dt{color:#F2B58A}
.towns dd{margin:0;font-size:14.5px;font-weight:600;color:#D7E2EC}
.area .area__more{font-size:16px}
.area__more a{color:#fff;font-weight:800;text-decoration-color:var(--cu);text-underline-offset:4px;white-space:nowrap}

/* ---------- FAQ ---------- */
.faq{background:var(--ground);padding:var(--sec) 0}
.faq__in{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(40px,6vw,96px);align-items:start}
.faq__head{position:sticky;top:28px}
.faq__head .h-xl{color:var(--navy)}
.faq__head>p:not(.kick){margin:18px 0 0;font-size:17px;color:var(--mute)}
.faq__head a{color:var(--navy);font-weight:800;text-decoration-color:var(--cu);text-underline-offset:4px}
.faq__list{border-top:4px solid var(--navy)}
.faq details{border-bottom:1px solid #C3CDD8}
.faq summary{position:relative;list-style:none;cursor:pointer;padding:24px 60px 24px 0;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:20px;line-height:1.25;color:var(--navy)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:50%;width:36px;height:36px;margin-top:-18px;display:grid;place-items:center;background:var(--navy);color:#fff;font-weight:700;font-size:22px;line-height:1;transition:transform .15s,background .15s}
.faq details[open] summary::after{content:"\2212";background:var(--cu);color:var(--ink)}
.faq details p{margin:0 0 24px;max-width:60ch;font-size:17px;line-height:1.6;color:var(--mute)}

/* ---------- book: two-step request form, built for conversion ---------- */
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.book{background:var(--navy);color:#fff;padding:var(--sec) 0}
.book__head{max-width:760px;margin-bottom:40px}
.book__in{display:grid;grid-template-columns:minmax(0,7.4fr) minmax(0,4.6fr);gap:clamp(32px,4.4vw,72px);align-items:start}
.fcard{position:relative;background:#fff;color:var(--navy);border-top:6px solid var(--cu);box-shadow:0 44px 80px -34px rgba(0,0,0,.55);padding:clamp(22px,2.8vw,40px) clamp(22px,2.8vw,40px) 0;scroll-margin-top:16px}
.fhours{display:flex;align-items:center;gap:10px;margin:0 0 22px;padding:0 0 16px;border-bottom:1px solid var(--line);font-weight:700;font-size:14.5px;line-height:1.35;color:var(--navy)}
.fhours__dot{flex:none;width:10px;height:10px;border-radius:50%;background:#8C9BAD}
.fhours.is-open .fhours__dot{background:#2F8F5B;box-shadow:0 0 0 4px rgba(47,143,91,.18)}
.fstep{border:0;margin:0;padding:0;min-width:0}
.fstep[hidden]{display:none}
.fstep__lg{float:left;width:100%;padding:0;margin:0 0 20px}
.fstep__lg+*{clear:both}
.fstep__k{display:block;margin-bottom:10px;font-weight:700;font-size:12.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--cu-d)}
.fstep__t{display:block;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(25px,2.3vw,32px);line-height:1.02;letter-spacing:-.01em;color:var(--navy)}
.ferr{display:flex;align-items:center;gap:10px;margin:10px 0 0;font-weight:700;font-size:14.5px;line-height:1.35;color:#B42318}
.ferr::before{content:"!";flex:none;width:20px;height:20px;display:grid;place-items:center;background:#B42318;color:#fff;font-size:13px;font-weight:900}
.ferr[hidden]{display:none}

/* step 1 tiles */
.probs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.opt{position:relative;display:flex;flex-direction:column;cursor:pointer;background:#fff;border:2px solid #D5DDE7;transition:border-color .15s,transform .15s,box-shadow .15s}
.opt input,.seg__o input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.opt__media{display:grid;place-items:center;aspect-ratio:16/9;overflow:hidden;background:var(--navy)}
.opt__media img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.opt--type .opt__media{background:var(--navy) repeating-linear-gradient(135deg,rgba(255,255,255,.045) 0 2px,transparent 2px 12px)}
.opt__media svg{width:46px;height:46px;fill:none;stroke:var(--cu);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.opt__l{display:flex;align-items:center;flex:1;min-height:52px;padding:8px 14px 10px;font-family:var(--display);font-stretch:110%;font-weight:800;font-size:15.5px;line-height:1.15;color:var(--navy);transition:background .15s,color .15s}
.opt__ck{position:absolute;top:8px;right:8px;width:28px;height:28px;background:var(--cu);transform:scale(0);transition:transform .15s}
.opt__ck::after{content:"";position:absolute;left:8px;top:7px;width:11px;height:6px;border-left:3px solid var(--ink);border-bottom:3px solid var(--ink);transform:rotate(-45deg)}
@media (hover:hover){.opt:hover{border-color:var(--navy);transform:translateY(-2px);box-shadow:0 10px 20px -12px rgba(17,24,39,.4)}.opt:hover .opt__media img{transform:scale(1.04)}.seg__o:hover span{border-color:var(--navy)}}
.opt:has(input:checked){border-color:var(--cu);box-shadow:0 0 0 2px var(--cu)}
.opt:has(input:checked) .opt__l{background:var(--cu);color:var(--ink)}
.opt:has(input:checked) .opt__ck{transform:scale(1)}
.opt:has(input:focus-visible),.seg__o:has(input:focus-visible) span{outline:3px solid var(--cu);outline-offset:3px}

/* step 2 */
.chip{display:inline-flex;align-items:center;gap:8px;margin:0 0 22px;padding:6px 6px 6px 14px;background:var(--ground);border-left:4px solid var(--cu);font-weight:800;font-size:15px;color:var(--navy)}
.chip__dot{color:#8C9BAD}
.chip__chg{min-height:44px;padding:0 12px;border:0;background:none;cursor:pointer;font:inherit;font-weight:700;color:var(--cu-d);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.chip__chg:focus-visible{outline:3px solid var(--cu);outline-offset:2px}
.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 18px}
.fld--full{grid-column:1 / -1}
.fld label,.grp__l{display:block;margin:0 0 8px;font-weight:700;font-size:15.5px;color:var(--navy)}
.fld label span{margin-left:8px;font-weight:500;font-size:13.5px;color:var(--mute)}
.fld input,.fld textarea,.sel select{display:block;width:100%;min-height:58px;padding:14px 16px;border:2px solid #C3CDD8;border-radius:0;background:#F6F8FB;font-family:var(--body);font-size:17px;line-height:1.4;color:var(--navy);-webkit-appearance:none;appearance:none;transition:border-color .15s,background .15s}
.fld textarea{min-height:104px;resize:vertical}
.sel{position:relative}
.sel select{padding-right:48px;background:#fff;border-color:var(--navy);cursor:pointer;font-weight:600}
.sel::after{content:"";position:absolute;right:20px;top:50%;width:9px;height:9px;margin-top:-7px;border-right:2.5px solid var(--cu-d);border-bottom:2.5px solid var(--cu-d);transform:rotate(45deg);pointer-events:none}
@media (hover:hover){.fld input:hover,.fld textarea:hover{border-color:#8C9BAD}}
.fld input:not(:placeholder-shown),.fld textarea:not(:placeholder-shown){background:#fff;border-color:var(--navy)}
.fld input:focus,.fld textarea:focus,.sel select:focus{outline:3px solid var(--cu);outline-offset:2px;border-color:var(--navy);background:#fff}
.fld input[aria-invalid="true"]{border-color:#B42318;background:#FFF6F5}
.fld--note{display:flex;flex-direction:column;justify-content:flex-end}
.addnote{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;min-height:58px;padding:0 4px;border:0;background:none;cursor:pointer;font:inherit;font-weight:800;font-size:16px;color:var(--navy);text-decoration:underline;text-decoration-color:var(--cu);text-decoration-thickness:2px;text-underline-offset:5px}
.addnote span{display:grid;place-items:center;width:26px;height:26px;background:var(--navy);color:#fff;text-decoration:none;font-size:18px;line-height:1}
.addnote[aria-expanded="true"]{display:none}
.addnote:focus-visible{outline:3px solid var(--cu);outline-offset:2px}
.fld--note.is-open{grid-column:1 / -1}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.fsubmit{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:64px;margin-top:24px;padding:0 24px;border:0;cursor:pointer;background:var(--cu);color:var(--ink);box-shadow:0 6px 0 var(--cu-d);font-family:var(--display);font-stretch:112%;font-weight:800;font-size:18px;letter-spacing:.03em;text-transform:uppercase;transition:background .15s,transform .15s}
.fsubmit svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2.2}
@media (hover:hover){.fsubmit:hover{background:#EC9A61;transform:translateY(-1px)}}
.fsubmit:focus-visible{outline:3px solid var(--navy);outline-offset:3px}
.fsubmit__spin{display:none;width:20px;height:20px;border:3px solid rgba(17,24,39,.25);border-top-color:var(--ink);border-radius:50%;animation:fspin .7s linear infinite}
.fsubmit.is-busy{cursor:progress;background:#E9A170}
.fsubmit.is-busy .fsubmit__spin{display:block}
.fsubmit.is-busy svg{display:none}
@keyframes fspin{to{transform:rotate(360deg)}}
.fassure{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:6px}
.fassure li{position:relative;padding-left:24px;font-size:14.5px;line-height:1.45;color:var(--mute)}
.fassure li::before{content:"";position:absolute;left:3px;top:6px;width:10px;height:6px;border-left:2.5px solid var(--cu-d);border-bottom:2.5px solid var(--cu-d);transform:rotate(-45deg)}

/* secondary call path + proof, inside the card */
.fcall{display:flex;align-items:center;justify-content:center;gap:12px;min-height:58px;margin:22px 0 0;border:2px solid var(--navy);color:var(--navy);text-decoration:none;font-weight:600;font-size:16.5px}
.fcall strong{font-family:var(--display);font-stretch:112%;font-weight:900;white-space:nowrap}
.fcall svg{width:20px;height:20px;fill:var(--cu-d)}
@media (hover:hover){.fcall:hover{background:var(--navy);color:#fff}.fcall:hover svg{fill:var(--cu)}}
.fproof{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:18px 22px;margin:24px calc(-1 * clamp(22px,2.8vw,40px)) 0;padding:18px clamp(22px,2.8vw,40px);background:var(--ground);border-top:1px solid var(--line)}
.fproof__r{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--navy);text-decoration:none;font-size:14px;font-weight:600}
.fproof__r strong{font-family:var(--display);font-stretch:125%;font-weight:900;font-size:22px}
.fproof__r>span:last-child{text-decoration:underline;text-decoration-color:var(--cu);text-underline-offset:3px}
.fproof__q{margin:0;padding-left:20px;border-left:2px solid var(--line)}
.fproof__q blockquote{margin:0;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:15.5px;color:var(--navy)}
.fproof__q blockquote::before{content:"\201C";color:var(--cu-d)}
.fproof__q blockquote::after{content:"\201D";color:var(--cu-d)}
.fproof__q figcaption{margin-top:2px;font-size:13px;color:var(--mute)}
.fproof__l{margin:0;max-width:15em;font-weight:700;font-size:13.5px;line-height:1.35;color:var(--navy)}

/* success */
.fdone[hidden]{display:none}
.fdone:focus{outline:none}
.fdone__top{display:flex;align-items:center;gap:20px}
.fdone__ck{flex:none;display:grid;place-items:center;width:64px;height:64px;background:var(--cu)}
.fdone__ck svg{width:38px;height:38px;fill:none;stroke:var(--ink);stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round}
.fdone__t{margin:0;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(32px,3.4vw,48px);line-height:.98;letter-spacing:-.015em;color:var(--navy)}
.fdone__next{list-style:none;counter-reset:n;margin:24px 0 0;padding:0;border-top:4px solid var(--navy)}
.fdone__next li{counter-increment:n;display:grid;grid-template-columns:44px 1fr;align-items:baseline;padding:13px 0;border-bottom:1px solid var(--line);font-weight:600;font-size:16.5px;line-height:1.45;color:var(--navy)}
.fdone__next li::before{content:counter(n);font-family:var(--display);font-stretch:125%;font-weight:900;font-size:26px;line-height:1;color:var(--cu-d)}
.prep{margin:28px 0 0;padding:24px;background:var(--ground)}
.prep__t{margin:0 0 18px;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:20px;color:var(--navy)}
.prep__t span{font-family:var(--body);font-stretch:100%;font-weight:500;font-size:15px;color:var(--mute)}
.grp{margin:0 0 20px}
.seg{display:grid;gap:10px}
.seg--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.seg__o{position:relative;cursor:pointer}
.seg__o span{display:flex;align-items:center;gap:12px;min-height:54px;padding:8px 14px;border:2px solid #D5DDE7;background:#fff;font-weight:700;font-size:15.5px;line-height:1.2;color:var(--navy);transition:background .15s,border-color .15s,color .15s}
.seg__o span::before{content:"";flex:none;width:18px;height:18px;border:2px solid #9AA8B8;border-radius:50%;background:#fff}
.seg__o input:checked+span{background:var(--navy);border-color:var(--navy);color:#fff}
.seg__o input:checked+span::before{border-color:var(--cu);background:var(--cu);box-shadow:inset 0 0 0 4px var(--navy)}
.prep .fld input,.prep .fld textarea{background:#fff}
.prep__row{display:flex;align-items:center;gap:16px;margin-top:20px}
.fbtn{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:0 26px;border:0;cursor:pointer;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:15.5px;letter-spacing:.03em;text-transform:uppercase}
.fbtn--navy{background:var(--navy);color:#fff;box-shadow:0 5px 0 var(--ink)}
.fbtn:focus-visible{outline:3px solid var(--cu);outline-offset:3px}
.prep__saved{display:flex;align-items:center;gap:8px;margin:0;font-weight:800;font-size:16px;color:#2F8F5B}
.prep__saved::before{content:"";width:12px;height:7px;border-left:3px solid currentColor;border-bottom:3px solid currentColor;transform:rotate(-45deg) translateY(-2px)}
.prep__saved[hidden]{display:none}
.fdone__urgent{margin:22px 0 0;font-weight:700;font-size:16.5px;color:var(--navy)}
.fdone__urgent a{white-space:nowrap;color:var(--navy);font-family:var(--display);font-stretch:118%;font-weight:900;text-decoration-color:var(--cu);text-decoration-thickness:2px;text-underline-offset:4px}

/* side panel */
.bside{color:#fff;padding-top:6px}
.bside__k{display:flex;align-items:center;gap:12px;margin:0 0 12px;font-weight:700;font-size:13.5px;letter-spacing:.16em;text-transform:uppercase;color:#F2B58A}
.bside__k::before{content:"";width:28px;height:3px;background:var(--cu)}
.bside__tel{display:inline-flex;align-items:center;min-height:48px;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(32px,3.15vw,48px);line-height:1;letter-spacing:-.01em;color:#fff;text-decoration:none;white-space:nowrap}
.bside__tel:hover{color:#F2B58A}
.bside__hrs{margin:10px 0 0;font-size:16px;line-height:1.55;color:#C9D2DD}
.bside__price{margin:28px 0 0;padding-top:22px;border-top:2px solid rgba(255,255,255,.18);font-size:16px;line-height:1.5;color:#E2EAF1}
.bside__price strong{font-family:var(--display);font-stretch:125%;font-weight:900;font-size:22px;color:#fff;margin-right:4px}
.bside__van{display:block;width:100%;height:auto;margin-top:34px;filter:drop-shadow(0 18px 24px rgba(0,0,0,.35))}

/* quick-pick strip under the hero */
.qp{background:var(--ground);border-bottom:1px solid #E4E8EE}
.qp__in{display:flex;align-items:center;gap:24px;padding-block:18px}
.qp__h{flex:none;margin:0;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:20px;line-height:1;color:var(--navy)}
.qp__h b{color:var(--cu)}
.qp__row{display:flex;flex-wrap:wrap;gap:10px}
.qp__b{display:inline-flex;align-items:center;min-height:46px;padding:0 16px;border:2px solid var(--navy);background:#fff;color:var(--navy);text-decoration:none;font-weight:700;font-size:15px;white-space:nowrap;transition:background .15s,color .15s}
@media (hover:hover){.qp__b:hover{background:var(--navy);color:#fff}}
.qp__b:focus-visible{outline:3px solid var(--cu);outline-offset:2px}

/* "Book this" in the services index */
.bookthis{display:inline-flex;align-items:center;gap:8px;margin-top:8px;font-weight:800;font-size:13.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--cu-d);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.bookthis svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2}
.bookthis:hover{color:var(--navy)}

/* ---------- footer ---------- */
.ftr{background:var(--ink);color:#C9D2DD}
.ftr__cta{position:relative;overflow:hidden;border-bottom:1px solid rgba(255,255,255,.1)}
.ftr__cta::before{content:"";position:absolute;top:0;right:0;width:260px;height:260px;pointer-events:none;background:linear-gradient(225deg,transparent 0 96px,var(--cu) 96px 100px,transparent 100px 114px,var(--cu) 114px 117px,transparent 117px)}
.ftr__cta-in{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap;padding-block:64px}
.ftr__big{margin:0;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(40px,6vw,92px);line-height:.88;letter-spacing:-.02em;text-transform:uppercase;color:#fff}
.ftr__big b{color:var(--cu)}
.ftr__btns{display:flex;flex-wrap:wrap;gap:14px}
.ftr__trust{list-style:none;margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding-block:28px;border-bottom:1px solid rgba(255,255,255,.1)}
.ftr__trust li{position:relative;padding-left:24px;font-weight:600;font-size:14.5px;color:#fff}
.ftr__trust li::before{content:"";position:absolute;left:0;top:4px;width:10px;height:10px;border:2px solid var(--cu);transform:rotate(45deg)}
.ftr__cols{display:grid;grid-template-columns:1.3fr 1.3fr .8fr 1.1fr;gap:40px;padding-block:60px}
.ftr__brand img{height:78px;width:auto}
.ftr__brand p{margin:18px 0 0;font-size:15px;line-height:1.55;max-width:24em}
.ftr h3{margin:0 0 16px;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:#fff}
.ftr__cols ul{list-style:none;margin:0;padding:0}
.ftr__cols li{margin:0}
.ftr__cols li a{display:block;padding:5px 0;font-size:15px;color:#C9D2DD;text-decoration:none}
.ftr__cols li a:hover{color:#fff}
.ftr__tel{display:block;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:26px;color:#fff;text-decoration:none}
.ftr__contact p{margin:14px 0 0;font-size:15px;line-height:1.55}
.ftr__link{display:inline-block;margin-top:16px;color:#fff;font-weight:700;font-size:15px;text-decoration-color:var(--cu);text-underline-offset:4px}
.ftr__base{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;padding-block:26px 34px;border-top:1px solid rgba(255,255,255,.1)}
.ftr__base p{margin:0;font-size:12.5px;line-height:1.6;color:#8B97A7;max-width:76em}
.ftr__top{display:inline-flex;align-items:center;gap:8px;flex:none;color:#fff;font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;min-height:44px}
.ftr__top svg{width:16px;height:16px;fill:none;stroke:var(--cu);stroke-width:2}

/* ---------- phone call/book bar ---------- */
.mobile-bar{display:none}

/* ---------- drawer ---------- */
.scrim{position:fixed;inset:0;background:rgba(17,24,39,.6);z-index:55}
.scrim[hidden]{display:none}
.drawer{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;background:#fff;transform:translateX(100%);visibility:hidden;transition:transform .3s ease,visibility 0s .3s}
.drawer.is-open{transform:none;visibility:visible;transition:transform .3s ease}
.drawer__head{display:flex;align-items:center;justify-content:space-between;height:76px;padding:0 var(--gut);border-bottom:1px solid #E4E8EE;flex:none}
.drawer__head img{height:42px;width:auto}
.drawer__x{width:48px;height:48px;border:0;background:var(--navy);display:grid;place-items:center;cursor:pointer}
.drawer__x svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:2.4}
.drawer__nav{flex:1;overflow-y:auto;padding:6px var(--gut) 20px}
.acc__t,.drawer__link{display:flex;width:100%;align-items:center;justify-content:space-between;padding:18px 0;border:0;border-bottom:1px solid #E4E8EE;background:none;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:24px;text-transform:uppercase;color:var(--navy);text-decoration:none;cursor:pointer;text-align:left}
.acc__t svg{width:14px;height:9px;fill:none;stroke:var(--cu);stroke-width:2;transition:transform .2s}
.acc__t[aria-expanded="true"] svg{transform:rotate(180deg)}
.acc__p{display:none;padding:8px 0 14px}
.acc.is-open .acc__p{display:block}
.acc__p a{display:block;padding:11px 0 11px 18px;border-left:3px solid var(--cu);font-weight:600;font-size:16.5px;color:var(--navy);text-decoration:none}
.drawer__foot{flex:none;display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:18px var(--gut) calc(18px + env(safe-area-inset-bottom));background:var(--ground);border-top:1px solid #E4E8EE}
.drawer__foot p{grid-column:1 / -1;margin:0;font-weight:600;font-size:14px;color:var(--mute)}
.drawer__foot .btn{min-height:56px;padding:0 12px;font-size:15px}

/* ---------- small desktop / tablet landscape ---------- */
@media (max-width:1180px){
  .fix__row{grid-template-columns:56px minmax(0,1.1fr) minmax(0,1fr);gap:22px}
  .fix__n{padding-left:12px}
  .ledger{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:18px}
  .ftr__cols{grid-template-columns:1fr 1fr;row-gap:48px}
  .ftr__trust{grid-template-columns:repeat(2,minmax(0,1fr))}
  .poster__van{width:clamp(280px,34vw,420px)}
  .drawer__foot{max-width:none}
}

/* ---------- portrait tablet + phone ---------- */
@media (max-width:820px){
  :root{--sec:68px}
  .fix__head,.work__head{grid-template-columns:1fr}
  .fix__lede,.work__lede{grid-column:1;grid-row:auto;margin-top:18px}
  .fix__list{margin-top:36px}
  .fix__row{grid-template-columns:40px minmax(0,1fr);gap:10px 14px;padding:24px 0}
  .fix__n{padding:6px 0 0}
  .fix__d{grid-column:2;padding-top:0}
  .fix__t{font-size:clamp(26px,5.4vw,38px)}
  .fix__row:hover{background:none}
  .fix__row::after{display:none}
  .fix__foot{flex-direction:column;align-items:flex-start;gap:18px;margin-top:32px}
  .fix__foot p{font-size:18px}

  .feat{grid-template-columns:1fr;margin-top:40px;gap:28px}
  .feat__big{margin:0 calc(-1 * var(--gut));height:auto}
  .feat__big img{height:auto;aspect-ratio:4/4.6}
  .feat__copy{padding-top:0}
  .feat__small{margin-top:28px}
  .trio{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:minmax(0,62%);overflow-x:auto;scroll-snap-type:x mandatory;margin:56px calc(-1 * var(--gut)) 0;padding:0 var(--gut) 6px;scroll-padding-inline-start:var(--gut);scrollbar-width:none}
  .trio::-webkit-scrollbar{display:none}
  .trio__item{scroll-snap-align:start}

  .rbr__in{grid-template-columns:1fr;gap:40px}
  .ba__item--after{margin-top:48px}
  .promise__in{grid-template-columns:1fr;gap:56px}
  .ticket{margin-right:16px}

  .winter{display:block;min-height:0;background:var(--ground)}
  .winter__photo{position:relative;inset:auto;height:62vw;z-index:0}
  .winter__wrap{padding-top:0;margin-top:-64px;position:relative;z-index:1}
  .winter__panel{max-width:none;padding:40px 32px 40px}

  .rent__in{grid-template-columns:1fr;gap:72px}
  .crew__in{grid-template-columns:1fr;gap:56px}
  .crew__photo{max-width:min(420px,72%)}
  .revs__head{grid-template-columns:1fr;gap:28px}
  .revs__score{border-right:0;padding-right:0;padding-bottom:24px;border-bottom:4px solid var(--navy)}
  .wall{columns:2}

  .poster__t{font-size:clamp(40px,9.2vw,76px)}
  .poster__in{padding-bottom:0}
  .poster__van{position:relative;right:auto;bottom:auto;display:block;width:min(78%,460px);margin:28px -8px -10px auto}

  .faq__in{grid-template-columns:1fr;gap:28px}
  .faq__head{position:static}

  .ftr__cta-in{padding-block:64px}
  .ftr__base{flex-direction:column;gap:18px}
  .ftr{padding-bottom:64px}
  .mobile-bar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:grid;grid-template-columns:1fr 1fr;transform:translateY(110%);transition:transform .25s ease;padding-bottom:env(safe-area-inset-bottom);background:var(--navy);box-shadow:0 -8px 22px rgba(17,24,39,.2)}
  .mobile-bar.is-on{transform:none}
  .svc{padding:11px 0;min-height:44px}
  .ftr__cols li a{padding:11px 0}
  .ftr__tel{display:inline-flex;align-items:center;min-height:48px}
  .ftr__link,.revs__all{display:inline-flex;align-items:center;min-height:44px}
  .mobile-bar a{display:flex;align-items:center;justify-content:center;gap:9px;height:62px;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:16px;letter-spacing:.03em;text-transform:uppercase;text-decoration:none}
  .mobile-bar svg{width:19px;height:19px;fill:currentColor}
  .mobile-bar__call{background:var(--cu);color:var(--ink)}
  .mobile-bar__book{background:var(--navy);color:#fff}
}
@media (max-width:600px){
  :root{--sec:60px}
  .kick{font-size:12px;letter-spacing:.13em;margin-bottom:14px}
  .kick::before{width:20px}
  .h-xl{font-size:clamp(29px,8.4vw,36px)}
  main section:not(.hero) .btn,.ftr .btn{min-height:58px;padding:0 22px;font-size:15px;font-stretch:112%;letter-spacing:.02em}
  .fix__lede,.work__lede{font-size:16.5px}
  .fix__row{grid-template-columns:30px minmax(0,1fr);column-gap:10px}
  .fix__n{font-size:13px;padding-top:4px}
  .fix__t{font-size:clamp(23px,6.6vw,28px)}
  .fix__d p{font-size:16px}
  .fix__foot .btn{width:100%}
  .feat__t{font-size:27px}
  .feat__big figcaption{left:var(--gut);font-size:12px;padding:8px 12px}
  .trio{grid-auto-columns:78%}
  .poster-sm{font-size:clamp(44px,13.4vw,60px)}
  .rbr__lede{font-size:18px}
  .ba{gap:10px}
  .ba__item--after{margin-top:36px}
  .tag{font-size:12px;padding:8px 10px}
  .steps li{grid-template-columns:44px 1fr;gap:12px}
  .steps__n{font-size:34px}
  .ticket{margin-right:12px;box-shadow:12px 12px 0 var(--navy)}
  .ticket__row{grid-template-columns:1fr;gap:10px;padding:22px 22px}
  .ticket__top{padding:14px 22px}
  .ticket__big{font-size:60px}
  .winter__photo{height:78vw}
  .winter__panel{padding:34px 22px 34px;--cut:40px}
  .winter__panel::before{width:96px;height:96px;background:linear-gradient(225deg,transparent 0 36px,var(--cu) 36px 38px,transparent 38px 44px,var(--cu) 44px 45.5px,transparent 45.5px)}
  .winter__list{grid-template-columns:1fr}
  .winter__photo figcaption,.area__photo figcaption{right:12px;top:12px;font-size:11.5px}
  .rent__quote{padding:64px 24px 30px;box-shadow:-10px 10px 0 var(--cu);margin-left:10px}
  .rent__mark{left:22px;font-size:120px}
  .crew__photo{max-width:76%;margin:0 28px 28px 0}
  .crew__photo::before{inset:28px -28px -28px 28px}
  .crew__lede{font-size:18.5px}
  .crew__photo figcaption{font-size:11.5px;white-space:nowrap;padding:8px 10px}
  .ledger dt{font-size:34px}
  .revs__num{font-size:96px}
  .wall{columns:auto;display:grid;grid-auto-flow:column;grid-auto-columns:84%;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(-1 * var(--gut));padding:0 var(--gut) 6px;scroll-padding-inline-start:var(--gut);scrollbar-width:none;align-items:start}
  .wall::-webkit-scrollbar{display:none}
  .rv{margin:0;scroll-snap-align:start}
  .rv--feature blockquote{font-size:17.5px}
  .poster__t{font-size:clamp(30px,10.4vw,44px);font-stretch:100%;letter-spacing:-.01em}
  .poster__foot p{font-size:16.5px}
  .faq summary{font-size:17.5px;padding:20px 52px 20px 0}
  .faq summary::after{width:32px;height:32px;margin-top:-16px}
  .ftr__trust{grid-template-columns:1fr}
  .ftr__cols{grid-template-columns:1fr 1fr;gap:36px 20px}
  .ftr__brand{grid-column:1 / -1}
  .ftr__contact{grid-column:1 / -1}
  .ftr__btns{width:100%;display:grid;grid-template-columns:1fr}
  .ftr__cta::before{width:150px;height:150px;background:linear-gradient(225deg,transparent 0 56px,var(--cu) 56px 59px,transparent 59px 67px,var(--cu) 67px 69px,transparent 69px)}
  .drawer__head{height:64px}
  .drawer__head img{height:36px}
  .acc__t,.drawer__link{font-size:21px;padding:16px 0}
}

/* ---------- portrait tablet only: keep two-up compositions, not the phone stack ---------- */
@media (min-width:601px) and (max-width:820px){
  .feat__copy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:28px;align-items:start}
  .feat__copy .kick,.feat__copy .feat__t{grid-column:1 / -1}
  .feat__copy>p:not(.kick){grid-column:1}
  .feat__small{grid-column:2;grid-row:3;margin-top:0}
  .trio{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-columns:auto;overflow:visible;margin:48px 0 0;padding:0;gap:12px}
  .trio__item figcaption{padding:16px 16px 18px}
  .trio__item strong{font-size:18px}
  .crew__in{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:start}
  .crew__photo{max-width:none;margin:0 24px 24px 0}
  .crew__photo::before{inset:24px -24px -24px 24px}
  .crew__photo figcaption{font-size:11.5px;padding:8px 10px}
  .crew__copy .h-xl{font-size:clamp(32px,4.6vw,40px)}
  .crew__lede{font-size:18px;margin-top:18px}
  .ledger{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rent__quote{margin-left:16px}
}
.drawer__foot{grid-template-columns:1.45fr 1fr}
.drawer__foot .btn{white-space:nowrap;font-stretch:100%;letter-spacing:0;gap:8px}
.drawer__foot .btn--wh{border:2px solid var(--navy);box-shadow:0 6px 0 var(--navy)}

/* service area, tablet and phone */
@media (max-width:820px){
  .area{--lift:110px}
  .area__grid{grid-template-columns:1fr;gap:0}
  .area__copy{padding-top:44px}
  .area__roslyn{width:62%}
}
@media (max-width:600px){
  .area{--lift:64px}
  .area__photo{height:280px}
  .map-frame{padding:8px}
  .map-slot{aspect-ratio:1/1}
  .area__roslyn{width:72%;margin-top:-32px;border-width:6px}
  .towns dt{font-size:28px}
}

/* form, tablet and phone */
@media (max-width:1180px){
  .book__in{grid-template-columns:minmax(0,1fr) 300px}
  .bside__tel{font-size:30px}
  .fproof{grid-template-columns:auto minmax(0,1fr)}
  .fproof__l{grid-column:1 / -1;max-width:none}
  .qp__in{flex-direction:column;align-items:flex-start;gap:12px}
}
@media (max-width:820px){
  .book__in{grid-template-columns:1fr;gap:44px}
  .bside{display:grid;grid-template-columns:auto 1fr;column-gap:32px;align-items:end}
  .bside__k,.bside__tel,.bside__hrs,.bside__price{grid-column:1}
  .bside__van{grid-column:2;grid-row:1 / span 4;width:100%;max-width:340px;margin:0 0 0 auto}
  .bookthis{min-height:44px;margin-top:2px}
}
@media (max-width:600px){
  .book__head{margin-bottom:26px}
  .fcard{padding:18px 16px 0}
  .fhours{font-size:14px;margin-bottom:18px;padding-bottom:14px}
  .probs{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .opt__media{aspect-ratio:16/10}
  .opt__media svg{width:40px;height:40px}
  .opt__l{font-size:14.5px;min-height:52px;padding:8px 10px}
  .opt__ck{width:24px;height:24px;top:6px;right:6px}
  .opt__ck::after{left:6px;top:6px;width:9px;height:5px}
  .fields{grid-template-columns:1fr;gap:16px}
  .fld--note{grid-column:auto}
  .addnote{min-height:52px}
  .fsubmit{min-height:62px;font-size:17px}
  .seg--3{grid-template-columns:1fr}
  .prep{padding:18px 14px;margin-inline:-2px}
  .fproof{grid-template-columns:1fr;gap:12px;margin-inline:-16px;padding:16px}
  .fproof__q{padding-left:14px}
  .bside{display:block}
  .bside__tel{font-size:clamp(30px,9.6vw,38px)}
  .bside__van{width:86%;margin:26px 0 0 auto}
  .fdone__top{gap:14px}
  .fdone__ck{width:52px;height:52px}
  .fdone__next li{grid-template-columns:36px 1fr;font-size:15.5px}
  .qp__in{padding-block:16px 14px;gap:10px}
  .qp__h{font-size:18px}
  .qp__row{flex-wrap:nowrap;overflow-x:auto;width:calc(100% + 2 * var(--gut));margin-inline:calc(-1 * var(--gut));padding:2px var(--gut) 4px;scroll-padding-inline-start:var(--gut);scrollbar-width:none;gap:8px}
  .qp__row::-webkit-scrollbar{display:none}
  .qp__b{min-height:48px;padding:0 14px;font-size:15px}
}

/* ---------- single-card form: chip row for the problem ---------- */
.pkset{border:0;margin:0 0 18px;padding:0;min-width:0}
.pkset__lg{padding:0;margin:0 0 12px;font-family:var(--display);font-stretch:118%;font-weight:900;font-size:clamp(21px,1.9vw,26px);line-height:1.1;color:var(--navy)}
.pks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.pk{position:relative;display:block;cursor:pointer}
.pk input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.pk>span,.pk{min-width:0}
.pk{display:flex;align-items:center;gap:10px;min-height:54px;padding:8px 12px;border:2px solid #D5DDE7;background:#fff;font-weight:700;font-size:15px;line-height:1.2;color:var(--navy);transition:background .15s,border-color .15s,color .15s}
.pk svg{flex:none;width:22px;height:22px;fill:none;stroke:var(--cu-d);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
@media (hover:hover){.pk:hover{border-color:var(--navy)}}
.pk:has(input:checked){background:var(--navy);border-color:var(--navy);color:#fff}
.pk:has(input:checked) svg{stroke:var(--cu)}
.pk:has(input:focus-visible){outline:3px solid var(--cu);outline-offset:2px}
.pks.is-err .pk{border-color:#E6A39C}
.fcard .fields{gap:14px 16px}
.fcard .fld input,.fcard .sel select{min-height:54px;padding-block:12px}
.fcard .addnote{min-height:54px}
.fcard .fsubmit{margin-top:18px}
.fcard .fassure{margin-top:12px;gap:4px}
.fcard .fcall{margin-top:16px;min-height:54px}
.fcard .fproof{margin-top:18px;padding-block:14px}
.fcard .fhours{margin-bottom:16px;padding-bottom:12px}
@media (max-width:600px){
  .pks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pk{min-height:54px;padding:8px 10px;font-size:14.5px;gap:8px}
  .fcard .fld input,.fcard .sel select{min-height:56px}
}
.fcard.is-done .fcall{display:none}
.fproof{grid-template-columns:auto minmax(0,1fr)}
.fproof__q blockquote{white-space:nowrap}
.fproof__l{grid-column:1 / -1;max-width:none;padding-top:10px;border-top:1px solid var(--line);font-size:13.5px}
@media (max-width:600px){.fproof{grid-template-columns:1fr}.fproof__q blockquote{white-space:normal}}

/* ---------- breakpoint review 2026-10-19 (Josh: "review breakpoints") ---------- */
/* 1. portrait tablet: shorter photo box so the panel and call button sit higher; crop from the top so the van stays in */
@media (min-width:601px) and (max-width:820px){
  .hero{--keep:.50;--ytop:calc(var(--imgw) * 2048 / 1650 * -0.16)}
}
/* 2. services index between phone and desktop: smaller, balanced titles (no stranded last word) */
@media (min-width:821px) and (max-width:1180px){
  .fix__t{font-size:clamp(26px,2.75vw,34px)}
}
.fix__t{text-wrap:balance}
/* 3. footer on tablets: brand across the top, then three even columns */
@media (min-width:601px) and (max-width:1180px){
  .ftr__cols{grid-template-columns:1.25fr 1fr 1fr;gap:40px 32px}
  .ftr__brand{grid-column:1 / -1;display:flex;align-items:center;gap:28px}
  .ftr__brand p{margin:0}
  .ftr__contact{grid-column:auto}
}
/* 4. portrait tablet form panel: the van shrank to a sticker beside the price line; drop it there */
@media (min-width:601px) and (max-width:820px){
  .bside{display:block}
  .bside__van{display:none}
}
@media (min-width:601px) and (max-width:1180px){.ftr__tel{white-space:nowrap;font-size:clamp(20px,2.7vw,26px)}}

/* ================= production layer (2026-10-20): inner pages + live form states =================
   Same tokens, type and devices as the approved homepage (f2): navy cut-corner panel with the copper frame lines,
   copper period after headlines, Archivo Expanded display. Appended after base.css by build.py. */

/* page header: photo plate right, navy poster panel left (the homepage hero, at page height) */
.ph{position:relative;background:var(--ground);overflow:hidden;isolation:isolate}
.ph__in{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);min-height:clamp(460px,58vh,600px)}
.ph__panel{position:relative;z-index:2;align-self:stretch;margin:clamp(28px,5vh,48px) 0 0;background:var(--navy);color:#fff;
  display:flex;align-items:center;--cut:64px;clip-path:polygon(0 0, calc(100% - var(--cut)) 0, 100% var(--cut), 100% 100%, 0 100%)}
.ph__panel::before{content:"";position:absolute;top:0;right:0;width:150px;height:150px;pointer-events:none;
  background:linear-gradient(225deg, transparent 0 58px, var(--cu) 58px 61px, transparent 61px 70px, var(--cu) 70px 72px, transparent 72px)}
.ph__panel::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:6px;background:var(--cu)}
.ph__copy{padding:44px clamp(28px,4vw,60px) 52px;width:100%}
.ph h1{margin:0 0 18px;font-family:var(--body);font-weight:700;font-size:15px;letter-spacing:.16em;text-transform:uppercase;color:#F2B58A;display:flex;align-items:center;gap:12px}
.ph h1::before{content:"";width:28px;height:3px;background:var(--cu);flex:none}
.ph .big{font-size:clamp(36px,4.4vw,64px)}
.ph .big>span{display:inline}
.ph__photo{margin:0;position:relative;margin-left:-40px;z-index:1}
.ph__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.crumbs{margin:0 0 22px;font-size:13.5px;color:#B9C4D1}
.crumbs a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(227,136,74,.6)}
.crumbs span{margin:0 8px;color:var(--cu)}

/* article + side card */
.art{padding:clamp(56px,8vw,104px) 0}
.art__in{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:clamp(40px,6vw,96px);align-items:start}
.prose{max-width:44em;font-size:18px;line-height:1.65;color:var(--navy)}
.prose h2{margin:56px 0 16px;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(26px,2.6vw,36px);line-height:1.04;letter-spacing:-.01em;text-wrap:balance}
.prose h2:first-child{margin-top:0}
.prose h2 b{color:var(--cu)}
.prose h3{margin:32px 0 8px;font-weight:800;font-size:20px}
.prose p{margin:0 0 18px}
.prose a{color:var(--navy);text-decoration-color:var(--cu);text-underline-offset:3px;text-decoration-thickness:2px}
.prose .ticks{margin:8px 0 30px}
.prose .ticks li{font-weight:500;font-size:17px;line-height:1.5}
.prose .ticks li a{font-weight:700}
.prose .callout{margin:30px 0;padding:24px 28px;background:var(--ground);border-left:6px solid var(--cu)}
.prose .callout p:last-child{margin:0}
.prose figure{margin:34px 0}
.prose figure img{width:100%;height:auto}
.legal h2{font-size:clamp(22px,2vw,28px);margin-top:40px}

.side{position:sticky;top:24px;display:grid;gap:18px}
.side__card{background:var(--navy);color:#fff;padding:30px 30px 32px;position:relative;--cut:36px;
  clip-path:polygon(0 0, calc(100% - var(--cut)) 0, 100% var(--cut), 100% 100%, 0 100%)}
.side__card::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:5px;background:var(--cu)}
.side__k{margin:0 0 10px;font-weight:700;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:#F2B58A}
.side__tel{display:flex;align-items:center;min-height:48px;white-space:nowrap;font-family:var(--display);font-stretch:112%;font-weight:900;font-size:clamp(24px,2.3vw,32px);color:#fff;text-decoration:none;line-height:1.1}
.side__hrs{margin:8px 0 20px;color:#D5DDE7;font-size:15px}
.side__card .btn{width:100%;min-height:58px;font-size:15.5px}
.side__card .btn+.btn{margin-top:14px}
.side__fix{background:var(--ground);padding:26px 28px}
.side__fix h2{margin:0 0 12px;font-weight:800;font-size:17px}
.side__fix ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:15.5px}
.side__fix li{position:relative;padding-left:20px}
.side__fix li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;background:var(--cu);transform:rotate(45deg)}

/* related services / towns */
.rel{padding:0 0 clamp(56px,8vw,96px)}
.rel__h{margin:0 0 22px;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(24px,2.4vw,32px)}
.rel__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:2px;background:#E4E8EE;border:2px solid #E4E8EE}
.rel__grid a{display:flex;justify-content:space-between;align-items:center;gap:16px;height:100%;min-height:76px;padding:18px 22px;background:#fff;text-decoration:none;font-weight:700;font-size:16.5px;color:var(--navy)}
.rel__grid a svg{width:16px;height:16px;flex:none;fill:none;stroke:var(--cu);stroke-width:2}
@media (hover:hover){.rel__grid a:hover{background:var(--navy);color:#fff}}

/* services index cards */
.sx{padding:clamp(56px,8vw,96px) 0}
.sx__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.sx__item{display:grid;grid-template-columns:200px minmax(0,1fr);background:var(--ground);min-height:220px}
.sx__item figure{margin:0;position:relative}
.sx__item img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.sx__body{padding:24px 26px 26px;display:flex;flex-direction:column;gap:10px}
.sx__body h2{margin:0;font-family:var(--display);font-stretch:112%;font-weight:900;font-size:21px;line-height:1.12}
.sx__body h2 a{text-decoration:none;color:var(--navy)}
.sx__body p{margin:0;font-size:15.5px;line-height:1.5}
.sx__more{margin-top:auto;display:flex;gap:18px;flex-wrap:wrap;font-weight:800;font-size:14px;letter-spacing:.06em;text-transform:uppercase}
.sx__more a{display:inline-flex;align-items:center;min-height:44px;color:var(--cu-d);text-decoration:none}

/* form: live states */
.ferr--send{margin-top:14px}
.fcard .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* thank-you */
.ty{padding:clamp(64px,10vw,140px) 0}
.ty__card{max-width:720px}

@media (max-width:1180px){
  .art__in{grid-template-columns:minmax(0,1fr) 320px;gap:44px}
  .sx__item{grid-template-columns:150px minmax(0,1fr)}
}
@media (max-width:820px){
  .ph__in{grid-template-columns:1fr;min-height:0}
  .ph__photo{order:-1;margin:0 calc(-1 * var(--gut));height:clamp(220px,52vw,380px)}
  .ph__panel{margin:-40px 0 0;--cut:48px}
  .ph__copy{padding:30px 30px 34px}
  .ph .big{font-size:clamp(32px,7vw,52px)}
  .art__in{grid-template-columns:1fr}
  .side{position:static}
  .prose{font-size:17px}
  .sx__grid{grid-template-columns:1fr}
}
@media (max-width:600px){
  .ph__panel{--cut:36px}
  .ph__panel::before{width:90px;height:90px;background:linear-gradient(225deg, transparent 0 32px, var(--cu) 32px 34px, transparent 34px 40px, var(--cu) 40px 41.5px, transparent 41.5px)}
  .ph__copy{padding:22px 20px 26px}
  .ph h1{font-size:12px;letter-spacing:.14em;margin-bottom:12px}
  .ph h1::before{width:18px}
  .ph .big{font-size:clamp(28px,8.6vw,38px)}
  .crumbs{font-size:12.5px;margin-bottom:14px}
  .sx__item{grid-template-columns:1fr}
  .sx__item figure{height:180px}
  .side__card{padding:26px 22px 28px}
}

.ftr__legal{margin:0;font-size:13.5px}.ftr__legal a{color:inherit}

/* ================= layout pass (2026-10-23): inner-page polish =================
   From the review of all 23 pages at 1440, 1180, 1024, 820, 768 and 390. Same tokens and devices as the approved homepage. */

/* buttons inside article text keep their own colors (.prose a painted the navy button's label navy on /thank-you/ and /404) */
.prose .btn{text-decoration:none}
.prose .btn--navy{color:#fff}
.prose .btn--cu{color:var(--ink)}
.prose .btn--wh{color:var(--navy)}

/* in-article job photos are portrait (3:4 up to 9:16): a 4:3 frame keeps one photo from filling the whole screen */
.prose figure img{aspect-ratio:4/3;object-fit:cover}

/* reviews quoted in the article: a navy review card (the homepage .rv) instead of a plain paragraph */
.prose .rv--quote{position:relative;margin:38px 0;padding:32px 34px 28px 96px;background:var(--navy);color:#fff;border-top:4px solid var(--cu)}
.prose .rv--quote::before{content:"\201C";position:absolute;left:30px;top:20px;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:78px;line-height:1;color:var(--cu)}
.prose .rv--quote blockquote{margin:0 0 16px;font-size:18px;line-height:1.55;font-weight:500}
.prose .rv--quote figcaption{font-weight:800;font-size:15px;color:#fff}
.prose .rv--quote figcaption span{display:block;margin-top:2px;font-weight:500;font-size:13px;color:#C9D2DD}
.prose .rv--quote+.rv--quote{margin-top:-20px}

/* related and nearby links: separate tiles that share each row, so a short last row leaves no grey empty cells */
.rel__grid{display:flex;flex-wrap:wrap;gap:12px;background:none;border:0}
.rel__grid li{flex:1 1 200px}
.rel__grid a{border:2px solid #E4E8EE}
@media (hover:hover){.rel__grid a:hover{border-color:var(--navy)}}

/* portrait hero photo (About, Kitchen): keep the face in the frame instead of the center of the jacket */
.ph__photo img[src*="tech-portrait"]{object-position:50% 20%}

/* contact: one row of office details instead of a second phone card under the booking panel */
.office{padding:clamp(56px,8vw,104px) 0;background:#fff}
.office__h{margin:0 0 26px;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(26px,2.6vw,36px);line-height:1.04;letter-spacing:-.01em;color:var(--navy)}
.office__h b{color:var(--cu)}
.office__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.office__grid li{background:var(--ground);border-top:4px solid var(--navy);padding:26px 28px 26px;color:var(--navy);font-size:15.5px;line-height:1.5}
.office__grid p{margin:0}
.office__grid li p+p{margin-top:4px}
.office__grid .office__k{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-weight:700;font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.office__k::before{content:"";width:22px;height:3px;background:var(--cu);flex:none}
.office__grid .office__v{display:block;margin-bottom:6px;font-family:var(--display);font-stretch:112%;font-weight:900;font-size:clamp(20px,1.9vw,26px);line-height:1.15;color:var(--navy);text-decoration:none}
.office__grid a.office__v{display:flex;align-items:center;min-height:44px;margin-bottom:2px}
.office__grid a:not(.office__v){display:inline-flex;align-items:center;min-height:32px;color:var(--navy);font-weight:700;text-decoration-color:var(--cu);text-underline-offset:3px;text-decoration-thickness:2px}
.office__tip{margin-top:18px;padding:22px 28px;border:2px solid #E4E8EE;border-left:6px solid var(--cu);color:var(--navy);font-size:16.5px;line-height:1.5}
.office__tip p{margin:0}

@media (max-width:820px){
  .rel__grid li{flex-basis:calc(50% - 6px)}
  .office__grid{grid-template-columns:1fr}
}

@media (max-width:600px){
  /* inner-page hero buttons: the homepage hero's phone sizing, so "Call 509-968-4529" stays on one line */
  .ph .hero__btns .btn{min-height:54px;padding:0 8px;font-size:14px;gap:7px;font-stretch:100%;letter-spacing:0;white-space:nowrap}
  .prose figure img{aspect-ratio:4/5}
  .prose .rv--quote{padding:60px 22px 22px}
  .prose .rv--quote::before{left:20px;top:12px;font-size:60px}
  .prose .rv--quote blockquote{font-size:16.5px}
  .rel__grid{gap:10px}
  .rel__grid li{flex-basis:100%}
  .office__grid li{padding:22px 22px 22px}
}

/* proof in numbers (Josh's inspo list, 2026-10-21): 4.9 stars and 500 reviews from GBP, opened 1994 (Logan 10-22), 4 trucks (intake 10-21) */
.proof{background:var(--navy);color:#fff;border-top:6px solid var(--cu)}
.proof__in{list-style:none;margin:0 auto;padding-top:clamp(40px,5vw,64px);padding-bottom:clamp(40px,5vw,64px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.proof__in li{display:flex;flex-direction:column;gap:8px;padding-left:22px;border-left:2px solid rgba(255,255,255,.18)}
.proof__n{font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(40px,4.6vw,68px);line-height:.95;letter-spacing:-.02em;color:#fff}
.proof__l{font-size:15.5px;font-weight:600;line-height:1.4;color:#D5DDE7}
.proof__l a{display:inline-flex;align-items:center;min-height:32px;color:#fff;text-decoration-color:var(--cu);text-underline-offset:3px;text-decoration-thickness:2px}
@media (max-width:820px){.proof__in{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px}}
@media (max-width:600px){.proof__in li{padding-left:16px}.proof__l{font-size:14.5px}}

/* homepage "The work, up close": the small photo fills the copy column so its bottom lines up with the big photo (side-by-side layout only) */
@media (min-width:821px){
  .feat{align-items:stretch}
  .feat__big{height:auto;min-height:clamp(560px,52vw,740px)}
  .feat__big img{position:absolute;inset:0}
  .feat__copy{display:flex;flex-direction:column}
  .feat__small{flex:1 1 auto;min-height:220px}
  .feat__small img{position:absolute;inset:0;height:100%;aspect-ratio:auto}
}

/* homepage crew photo: fill its column on desktop instead of stopping at 380px */
@media (min-width:821px){
  .crew__photo{max-width:none}
}
/* the face sits at 40% across the source photo (nose at x 222 of 560): a 444px-wide window starting at the left edge,
   from y 105, centers it and still shows the jacket logo and phone number (to y 788 at 13:20) */
.crew__frame{display:block;overflow:hidden;aspect-ratio:13/20}
.crew__photo .crew__frame img{display:block;width:126.13%;max-width:none;height:auto;aspect-ratio:auto;margin-top:-23.65%;object-fit:fill}

/* ================= hover and focus (2026-10-23) =================
   Buttons lift on hover and press on click; text links firm up their underline and warm toward copper.
   Hover only where the device can hover, the same cue for keyboard focus, and no motion for people who ask for less. */
.btn{transition:background-color .15s ease,color .15s ease,transform .15s ease,box-shadow .15s ease}
@media (hover:hover){
  .btn:hover{transform:translateY(-2px)}
  .btn--cu:hover{box-shadow:0 8px 0 var(--cu-d)}
  .btn--wh:hover{box-shadow:0 8px 0 #B9C4D1}
  .btn--navy:hover{box-shadow:0 8px 0 var(--ink)}
  .drawer__foot .btn--wh:hover{box-shadow:0 8px 0 var(--navy)}
}
.btn:active{transform:translateY(3px)}
.btn--cu:active{box-shadow:0 3px 0 var(--cu-d)}
.btn--wh:active{box-shadow:0 3px 0 #B9C4D1}
.btn--navy:active{box-shadow:0 3px 0 var(--ink)}
.drawer__foot .btn--wh:active{box-shadow:0 3px 0 var(--navy)}
.btn:focus-visible{outline:3px solid var(--navy);outline-offset:4px}
.hero__btns .btn:focus-visible,.winter__panel .btn:focus-visible,.rent__copy .btn:focus-visible,.ftr__btns .btn:focus-visible,.side__card .btn:focus-visible,.book .btn:focus-visible{outline-color:#fff}

/* text links */
.prose a,.ticks a,.callout a,.faq__head a,.acc__p a,.ty__card a,.office__grid a,.revs__all,.revs__score,.fproof__r,.hdr__tel,
.crumbs a,.proof__l a,.area__more a,.poster__foot a,.rating,.ftr__tel,.ftr__link,.ftr__top,.ftr__legal a,.side__tel,.bside__tel,.office__v{
  transition:color .15s ease,text-decoration-color .15s ease,text-decoration-thickness .15s ease,border-color .15s ease}
@media (hover:hover){
  /* on light backgrounds */
  .prose a:hover,.ticks a:hover,.callout a:hover,.faq__head a:hover,.ty__card a:hover,.office__grid a:not(.office__v):hover,.revs__all:hover{
    color:var(--cu-d);text-decoration-color:currentColor;text-decoration-thickness:3px}
  .acc__p a:hover,.revs__score:hover,.fproof__r:hover,.hdr__tel:hover,.office__v:hover{color:var(--cu-d)}
  /* on navy, slate and ink backgrounds */
  .proof__l a:hover,.area__more a:hover,.poster__foot a:hover,.ftr__link:hover{color:#F2B58A;text-decoration-color:currentColor;text-decoration-thickness:3px}
  .crumbs a:hover{color:#F2B58A;border-bottom-color:#F2B58A}
  .rating:hover,.ftr__tel:hover,.ftr__top:hover,.side__tel:hover{color:#F2B58A}
  .ftr__legal a:hover{color:#fff}
}
.prose a:focus-visible,.ticks a:focus-visible,.callout a:focus-visible,.faq__head a:focus-visible,.acc__p a:focus-visible,.ty__card a:focus-visible,
.office__grid a:focus-visible,.revs__all:focus-visible,.revs__score:focus-visible,.fproof__r:focus-visible,.hdr__tel:focus-visible{outline:3px solid var(--cu-d);outline-offset:3px}
.crumbs a:focus-visible,.proof__l a:focus-visible,.area__more a:focus-visible,.poster__foot a:focus-visible,.rating:focus-visible,.ftr__tel:focus-visible,
.ftr__link:focus-visible,.ftr__top:focus-visible,.ftr__legal a:focus-visible,.ftr__cols li a:focus-visible,.side__tel:focus-visible,.bside__tel:focus-visible{outline:3px solid #F2B58A;outline-offset:3px}

.prose .btn:focus-visible{outline-color:var(--navy)}
/* the form's own focus rings on its white card: the darker copper reads at 3:1, the bright one did not */
.fld input:focus,.fld textarea:focus,.sel select:focus,.addnote:focus-visible,.qp__b:focus-visible,.chip__chg:focus-visible,.fbtn:focus-visible,
.opt:has(input:focus-visible),.seg__o:has(input:focus-visible) span,.pk:has(input:focus-visible){outline-color:var(--cu-d)}
@media (prefers-reduced-motion:reduce){
  .btn,.btn:hover,.btn:active{transition:none;transform:none}
}

/* sticky header (2026-10-23): stays at the top, hides past 300px while scrolling down, back on any scroll up (site.js) */
.hdr{position:sticky;top:0;z-index:50;transition:transform .25s ease,box-shadow .25s ease}
.hdr.is-hidden{transform:translateY(-100%);box-shadow:none}
.hdr.is-stuck{box-shadow:0 8px 20px -14px rgba(17,24,39,.45)}
html{scroll-padding-top:calc(var(--hdr) + 12px)}
/* the service-page sidebar clears the header while it is showing */
.side{transition:top .25s ease}
.hdr-on .side{top:calc(var(--hdr) + 24px)}
@media (prefers-reduced-motion:reduce){.hdr,.side{transition:none}}

/* "$175" count-up on the Excel promise card (site.js): digits stay a fixed width so the line beside it does not move */
.count{display:inline-block;min-width:3ch;text-align:left;font-variant-numeric:tabular-nums}

/* request form: one resting look for every field. Town always has a value, so it wore the "filled" navy border while
   Name and Phone sat grey beside it; now all fields and the problem chips share a white fill and the same light border,
   and only the field in use turns navy (focus) or red (error) */
.fld input,.fld textarea,.sel select{background:#fff;border-color:#C3CDD8}
.fld input:not(:placeholder-shown),.fld textarea:not(:placeholder-shown){border-color:#C3CDD8}
.sel select{font-weight:400}
.pk{border-color:#C3CDD8}
@media (hover:hover){.sel select:hover,.fld input:not(:placeholder-shown):hover,.fld textarea:not(:placeholder-shown):hover{border-color:#8C9BAD}}
.fld input:focus,.fld textarea:focus,.sel select:focus{border-color:var(--navy)}
.fld input[aria-invalid="true"]{border-color:#B42318;background:#FFF6F5}

/* footer logo links home, like the header logo */
.ftr__logo{display:inline-block;line-height:0;transition:opacity .15s ease}
@media (hover:hover){.ftr__logo:hover{opacity:.85}}
.ftr__logo:focus-visible{outline:3px solid #F2B58A;outline-offset:4px}

/* ================= homepage: Josh's inspo list (2026-10-23) =================
   proof in numbers in the hero, one named promise, a transparent pricing block. Copy is the site's own wording. */

/* proof in numbers: four stats in the hero panel (was a single rating line) */
.hstats{list-style:none;margin:28px 0 0;padding:20px 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;border-top:1px solid rgba(255,255,255,.18)}
.hstat{display:flex;flex-direction:column;gap:4px;color:#fff;text-decoration:none}
.hstat__n{font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(26px,2.3vw,34px);line-height:1;letter-spacing:-.01em}
.hstat__l{display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;line-height:1.3;color:#C9D2DD}
.hstat__g{width:15px;height:15px;flex:none}
a.hstat{transition:color .15s ease}
@media (hover:hover){a.hstat:hover .hstat__n{color:#F2B58A}a.hstat:hover .hstat__l{color:#fff;text-decoration:underline;text-decoration-color:var(--cu);text-underline-offset:3px}}
a.hstat:focus-visible{outline:3px solid #F2B58A;outline-offset:4px}
@media (max-width:1180px){.hstats{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 22px;margin-top:22px}}
@media (max-width:820px){.hstats{order:5}}
@media (max-width:600px){.hstats{margin-top:18px;padding-top:16px;gap:14px 18px}.hstat__l{font-size:12.5px}}

/* one named promise: "Reliable. Experienced. On time." and the three promises it stands for */
.poster__k{margin-bottom:22px}
.vows{list-style:none;margin:44px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:28px;max-width:calc(100% - clamp(300px,33vw,500px) - 48px)}
.vows li{padding-top:16px;border-top:3px solid var(--cu)}
.vows h3{margin:0 0 8px;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:21px;line-height:1.05;text-transform:uppercase;color:#fff}
.vows h3 b{color:var(--cu)}
.vows p{margin:0;font-size:16px;line-height:1.5;color:#C9D2DD}
.vows+.poster__foot{margin-top:30px}
@media (max-width:1180px){.vows{max-width:calc(100% - clamp(280px,34vw,420px) - 36px);gap:22px}}
@media (max-width:820px){.vows{max-width:none;margin-top:34px}}
@media (max-width:600px){.vows{grid-template-columns:1fr;gap:18px}.vows h3{font-size:19px}.vows p{font-size:15.5px}}

/* transparent pricing: the card is about price only now */
.ticket__list{list-style:none;margin:0;padding:22px 30px 26px;display:grid;gap:12px}
.ticket__list li{position:relative;padding-left:30px;font-weight:700;font-size:16px;line-height:1.4;color:var(--navy)}
.ticket__list li::before{content:"";position:absolute;left:3px;top:.32em;width:12px;height:7px;border-left:3px solid var(--cu);border-bottom:3px solid var(--cu);transform:rotate(-45deg)}
@media (max-width:600px){.ticket__list{padding:18px 22px 22px}}

/* short desktop screens (1366x768, 1280x800, 1440x800...): the hero text was taller than the navy panel and got
   clipped by its cut-corner shape, even before the stats row. Scale the headline with the window height and tighten
   the spacing, side-by-side layout only; screens taller than 880px are unchanged. */
@media (min-width:821px) and (max-height:880px){
  .hero .big{font-size:min(clamp(40px,5.6vw,80px),8vh)}
  .hero__copy{padding-top:28px;padding-bottom:32px}
  .hero .lede{margin-top:16px}
  .hero__btns{margin-top:22px}
  .hstats{margin-top:20px;padding-top:14px}
}
@media (min-width:821px) and (max-width:1180px) and (max-height:880px){
  .hero .big{font-size:min(clamp(36px,4.6vw,54px),8vh)}
}

/* inspo pass (2026-10-23): Beehive / Radiant put a "why us" row right under the hero; Applewood / John C. Flood
   pair the service quick-nav with icons. The trust strip (same four points on all 18 pages) gets one icon per
   point, drawn in the request form's line style, and the homepage problem chips reuse the form's own icons. */
.strip li{padding-left:36px}
.strip li::before{top:-1px;width:24px;height:24px;border:0;transform:none;background:var(--cu-d);
  -webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat}
.strip li:nth-child(1){--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v5c0 4.5-3 8.2-7 10-4-1.8-7-5.5-7-10V6z'/%3E%3Cpath d='M8.6 12.1l2.4 2.4 4.4-4.8'/%3E%3C/svg%3E")}
.strip li:nth-child(2){--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12.5' r='8.5'/%3E%3Cpath d='M12 8v4.6l3 1.9M9.5 2.5h5'/%3E%3C/svg%3E")}
.strip li:nth-child(3){--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='9' r='5.8'/%3E%3Cpath d='M9.4 9.1l1.8 1.8 3.4-3.6'/%3E%3Cpath d='M8.6 13.8L7.4 21l4.6-2.3 4.6 2.3-1.2-7.2'/%3E%3C/svg%3E")}
.strip li:nth-child(4){--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M14.6 9.2c-.5-.9-1.5-1.4-2.6-1.4-1.5 0-2.6.8-2.6 2 0 2.7 5.3 1.4 5.3 4.2 0 1.2-1.2 2.1-2.7 2.1-1.2 0-2.2-.6-2.7-1.5M12 6v12'/%3E%3C/svg%3E")}
.qp__b{display:inline-flex;align-items:center;gap:8px}
.qp__b svg{width:20px;height:20px;flex:none;fill:none;stroke:var(--cu-d);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transition:stroke .15s ease}
@media (hover:hover){.qp__b:hover svg{stroke:var(--cu)}}
@media (max-width:600px){.strip li{padding-left:34px}.strip li::before{width:22px;height:22px}}
/* with icons, the six chips no longer fit one row at 1440: tighten them on wide screens so the row stays single */
@media (min-width:1181px){.qp__b{padding:0 12px;gap:7px}.qp__b svg{width:18px;height:18px}}
/* 1181-1365px: the row is ~22px short at 1280 (one row before the icons), so the chips tighten a little more there */
@media (min-width:1181px) and (max-width:1365px){.qp__b{padding:0 10px;gap:6px}.qp__b svg{width:16px;height:16px}}

/* ================= recommendations from the new reference sites (2026-10-23) ================= */
/* 1. "What happens next" beside the request form: three steps in the site's own wording */
.bside__next{margin:0 0 28px;padding-bottom:26px;border-bottom:1px solid rgba(255,255,255,.18)}
.nexts{list-style:none;margin:16px 0 0;padding:0;counter-reset:n;display:grid;gap:14px}
.nexts li{position:relative;padding-left:42px;counter-increment:n;font-size:15.5px;line-height:1.5;color:#D5DDE7}
.nexts li::before{content:counter(n);position:absolute;left:0;top:0;width:28px;height:28px;display:grid;place-items:center;border:2px solid var(--cu);color:#fff;font-family:var(--display);font-stretch:112%;font-weight:900;font-size:14px;line-height:1}
.nexts strong{color:#fff}

/* 2. a verbatim customer quote in the corner of the service-page photo; desktop only, the phone layout stacks the photo above the text */
.ph__quote{position:absolute;z-index:2;right:22px;bottom:22px;max-width:min(330px,72%);padding:16px 18px 14px 48px;background:#fff;color:var(--navy);border-top:4px solid var(--cu);box-shadow:0 16px 32px -14px rgba(17,24,39,.5)}
.ph__quote::before{content:"\201C";position:absolute;left:14px;top:8px;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:46px;line-height:1;color:var(--cu)}
.ph__q{display:block;font-weight:700;font-size:15px;line-height:1.45}
.ph__by{display:block;margin-top:8px;font-size:12.5px;font-weight:600;color:var(--mute)}
@media (max-width:820px){.ph__quote{display:none}}

/* 3. sub-service tags on the Services hub cards, terms from each card's own text */
.sx__tags{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.sx__tags li{padding:4px 10px;background:#fff;border:1px solid #C3CDD8;font-size:12.5px;font-weight:700;line-height:1.3;color:var(--navy)}


/* ================= sub pages as full-width bands (2026-10-23) =================
   Service and town pages were one long text column beside a sticky sidebar. The same content now runs as alternating
   full-width bands: lead + call card, checklist grids, photo splits, price cards, paired
   text cards, navy review bands and a closing "before you call / where we work" band with the map. Words unchanged. */
.sp{padding:clamp(56px,7vw,96px) 0;background:#fff}
.sp--alt{background:var(--ground)}
.sp .prose{max-width:none}
.sp .prose h2:first-child{margin-top:0}

/* lead: heading and intro beside the call card that used to be the sidebar */
.sp__lead{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:clamp(40px,6vw,96px);align-items:start}
.sp__intro h2+p{font-size:20px;line-height:1.6}
.sp__side{display:grid;gap:18px}
.sp__ticks{margin-top:44px}
.sp__lead-photo{margin-top:40px;max-width:820px}

/* checklists become a grid of tick cards */
.sp__ticks .ticks{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin:0;border-top:0}
.sp__ticks .ticks li{margin:0;padding:20px 20px 20px 54px;background:#fff;border:1px solid #E4E8EE;border-top:3px solid var(--cu);font-weight:600;font-size:16.5px;line-height:1.45}
.sp__ticks .ticks li::before{left:22px;top:27px}
.sp:not(.sp--alt) .sp__ticks .ticks li{background:var(--ground)}
.sp__checkhead,.sp__after,.sp__narrow{max-width:820px}
.sp--check .sp__ticks{margin-top:30px}
.sp__after{margin-top:26px}

/* photo beside text, alternating sides */
.sp__split{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(36px,6vw,88px);align-items:center}
.sp__split--flip .sp__media{order:-1}
.sp__media figure{margin:0 16px 16px 0}
.sp__media img{aspect-ratio:4/5;object-fit:cover;width:100%;height:auto;box-shadow:16px 16px 0 var(--cu)}

/* "what it costs" callout as a price card */
.sp__priced{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(36px,6vw,88px);align-items:center}
.sp__pricecard .callout{margin:0 16px 16px 0;padding:30px 30px 28px;background:#fff;border-left:0;border-top:6px solid var(--cu);box-shadow:16px 16px 0 var(--navy);font-size:18px;line-height:1.55}

/* short text sections paired as cards */
.sp__duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.sp__card{padding:34px 34px 30px;background:#fff;border-top:4px solid var(--navy)}
.sp:not(.sp--alt) .sp__card{background:var(--ground)}
.sp__card h2{font-size:clamp(24px,2.2vw,30px)}
.sp__card p:last-child{margin-bottom:0}

/* reviews on a navy band */
.sp--rev{background:var(--navy);color:#fff}
.sp--rev .prose,.sp--rev .prose h2{color:#fff}
.sp--rev .prose p{color:#D5DDE7}
.sp--rev .prose a{color:#fff}
.sp__revrow{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(36px,6vw,88px);align-items:center}
.sp__rev{max-width:900px}
.sp__revrow .sp__rev{max-width:none}
.sp--rev .prose .rv--quote{margin:0;background:#fff;color:var(--navy);border-top:4px solid var(--cu);padding:36px 36px 30px 100px}
.sp--rev .prose .rv--quote blockquote{font-size:20px;line-height:1.5;font-weight:600}
.sp--rev .prose .rv--quote figcaption{color:var(--navy)}
.sp--rev .prose .rv--quote figcaption span{color:var(--mute)}
.sp--rev .prose .rv--quote+.rv--quote{margin-top:0}
.sp__rev--two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;max-width:none}

/* closing band: the before-you-call tip beside where we work and the map */
.sp__close{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:24px;align-items:stretch}
.sp__tip{padding:36px;background:var(--navy);color:#fff;border-top:4px solid var(--cu)}
.sp__tip.prose h2{color:#fff}
.sp__tip.prose p{color:#D5DDE7}
.sp__area{padding:36px;background:#fff;border:1px solid #E4E8EE}
.sp:not(.sp--alt) .sp__area{background:var(--ground)}
.sp__map{display:block;width:100%;height:auto;margin-top:18px;border:1px solid #E4E8EE;background:#fff}

@media (max-width:1180px){.sp__lead{grid-template-columns:minmax(0,1fr) 320px;gap:44px}}
@media (max-width:820px){
  .sp__lead,.sp__split,.sp__priced,.sp__revrow,.sp__duo,.sp__close,.sp__rev--two{grid-template-columns:1fr}
  .sp__split--flip .sp__media{order:0}
  .sp__media img{aspect-ratio:4/3}
}
@media (max-width:600px){
  .sp{padding:48px 0}
  .sp__card,.sp__tip,.sp__area{padding:24px 22px}
  .sp__ticks .ticks li{padding:16px 16px 16px 46px}
  .sp__ticks .ticks li::before{left:18px;top:23px}
  .sp--rev .prose .rv--quote{padding:60px 22px 22px}
  .sp__pricecard .callout{padding:24px 22px}
  .sp__intro h2+p{font-size:18px}
}
/* checklist cards: rows that wrap, so a short last row stretches across instead of leaving an empty cell.
   --cols is set from the item count on wide screens (:has), 2 on tablets, 1 on phones. */
.sp__ticks .ticks{display:flex;flex-wrap:wrap;--cols:3}
.sp__ticks .ticks>li{flex:1 1 calc((100% - (var(--cols) - 1) * 14px) / var(--cols))}
@media (min-width:1181px){
  .sp__ticks .ticks:has(>li:nth-child(2):last-child){--cols:2}
  .sp__ticks .ticks:has(>li:nth-child(4):last-child){--cols:4}
  .sp__ticks .ticks:has(>li:nth-child(7)){--cols:4}
}
@media (min-width:601px) and (max-width:1180px){.sp__ticks .ticks{--cols:2}}
@media (max-width:600px){.sp__ticks .ticks{--cols:1}}
.sp__tip{align-self:start}
@media (max-width:600px){.sp--rev .prose .rv--quote blockquote{font-size:17px}}
/* the page's own "What we fix" list sits under the intro as compact chips (it was the sidebar's second card) */
.sp__intro .side__fix{margin-top:26px;padding:22px 24px;background:var(--ground)}
.sp__intro .side__fix h2{margin:0 0 12px;font-family:var(--body);font-stretch:100%;font-weight:800;font-size:17px;letter-spacing:0}
.sp__intro .side__fix ul{display:flex;flex-wrap:wrap;gap:8px}
.sp__intro .side__fix li{padding:6px 12px 6px 26px;background:#fff;border:1px solid #E4E8EE;font-size:15px;font-weight:600}
.sp__intro .side__fix li::before{left:11px;top:50%;margin-top:-4px}
/* single-column phone grids must be allowed to shrink below their longest word, or a link like
   "Toilet repair and replacement" pushes the page sideways */
@media (max-width:820px){.sp__lead,.sp__split,.sp__priced,.sp__revrow,.sp__duo,.sp__close,.sp__rev--two{grid-template-columns:minmax(0,1fr)}}
.sp__lead>*,.sp__split>*,.sp__priced>*,.sp__revrow>*,.sp__duo>*,.sp__close>*,.sp__ticks .ticks>li{min-width:0;overflow-wrap:break-word}
/* text-only sections as feature bands: topic icon + heading on the left, the words in a card on the right,
   the same icon drawn large and faint behind the band */
.sp--feat{position:relative;overflow:hidden}
.sp__feat{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,88px);align-items:center}
.sp__fhead{display:grid;gap:26px;justify-items:start}
.sp__ficon{display:grid;place-items:center;width:96px;height:96px;background:var(--navy);box-shadow:8px 8px 0 var(--cu)}
.sp__fi{width:52px;height:52px;fill:none;stroke:var(--cu);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.sp__feat.prose .sp__fhead h2{margin:0;font-size:clamp(32px,3.6vw,48px);line-height:1.04}
.sp__fbody{padding:clamp(28px,3.4vw,44px);background:var(--ground);border-left:5px solid var(--cu)}
.sp--alt .sp__fbody{background:#fff}
.sp__fbody p{font-size:19px;line-height:1.65}
.sp__fbody p:last-child{margin-bottom:0}
.sp__fwm{position:absolute;right:-60px;top:50%;width:min(460px,46vw);height:auto;transform:translateY(-50%) rotate(-8deg);fill:none;stroke:var(--navy);stroke-width:.7;opacity:.045;pointer-events:none}
@media (max-width:820px){
  .sp__feat{grid-template-columns:minmax(0,1fr)}
  .sp__fhead{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:20px}
  .sp__ficon{width:64px;height:64px;box-shadow:6px 6px 0 var(--cu)}
  .sp__fi{width:32px;height:32px}
  .sp__fwm{right:-120px;top:auto;bottom:-80px;transform:rotate(-8deg)}
}
@media (max-width:600px){.sp__fbody p{font-size:17px}.sp__fbody{padding:24px 22px}}
.sp__feat>*{min-width:0;overflow-wrap:break-word}
/* About: values as four icon cards */
.sp__vals{list-style:none;margin:34px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;counter-reset:val}
.sp__val{position:relative;padding:34px 28px 30px;background:#fff;border-top:4px solid var(--navy);counter-increment:val;transition:transform .25s ease,box-shadow .25s ease}
.sp__val::after{content:none;position:absolute;top:26px;right:26px;font-family:var(--display);font-weight:800;font-size:15px;letter-spacing:.08em;color:var(--cu-d)}
.sp__vicon{display:grid;place-items:center;width:64px;height:64px;margin-bottom:24px;background:var(--navy);box-shadow:6px 6px 0 var(--cu)}
.sp__vi{width:34px;height:34px;fill:none;stroke:var(--cu);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.sp__val h3{margin:0 0 10px;font-family:var(--display);font-stretch:125%;font-weight:800;font-size:22px;line-height:1.15}
.sp__val p{margin:0;font-size:16.5px;line-height:1.6;color:#3B4A5C}
@media (hover:hover){.sp__val:hover{transform:translateY(-4px);box-shadow:0 18px 36px -18px rgba(36,52,71,.35)}}
/* Service area hub: one card per town, the call card as the last tile */
.sp__towns{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.sp__town{position:relative;display:flex;flex-direction:column;padding:30px 26px 26px;background:var(--ground);border-top:4px solid var(--navy);transition:transform .25s ease,box-shadow .25s ease}
.sp__town--home{border-top-color:var(--cu)}
.sp__tpin{display:grid;place-items:center;width:46px;height:46px;margin-bottom:18px;background:var(--navy)}
.sp__ti{width:24px;height:24px;fill:none;stroke:var(--cu);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sp__town.prose h2{margin:0 0 10px;font-size:clamp(22px,1.9vw,27px);line-height:1.1;scroll-margin-top:120px}
.sp__town p{margin:0;font-size:16px;line-height:1.6}
.sp__town p a{font-weight:700}
@media (hover:hover){.sp__town:hover{transform:translateY(-4px);box-shadow:0 18px 36px -18px rgba(36,52,71,.35)}}
.sp__towncall .side__card{height:100%;margin:0}
.sp__townfix{margin-top:28px}
.sp__townfix .side__fix{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;padding:20px 24px;background:var(--ground)}
.sp__townfix .side__fix h2{margin:0;font-family:var(--body);font-stretch:100%;font-weight:800;font-size:17px;letter-spacing:0}
.sp__townfix .side__fix ul{display:flex;flex-wrap:wrap;gap:8px;margin:0}
.sp__townfix .side__fix li{padding:6px 12px 6px 26px;background:#fff;border:1px solid #E4E8EE;font-size:15px;font-weight:600}
.sp__townfix .side__fix li::before{left:11px;top:50%;margin-top:-4px}
@media (max-width:1180px){.sp__vals,.sp__towns{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.sp__vals,.sp__towns{grid-template-columns:minmax(0,1fr)}.sp__val,.sp__town{padding:26px 22px 22px}}
.sp__vals>*,.sp__towns>*{min-width:0;overflow-wrap:break-word}
/* Google score in the navy review bands: under a bare heading, or beside a lone quote */
.sp__score{display:inline-flex;align-items:center;gap:18px;margin-top:22px;color:#fff;text-decoration:none}
.sp__revrow--score .sp__score{margin-top:0}
.sp__snum{font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(64px,7vw,104px);line-height:.85;letter-spacing:-.02em}
.sp__smeta{display:grid;gap:8px;font-size:15px;color:#D5DDE7}
.sp__smeta>span:last-child{text-decoration:underline;text-decoration-color:var(--cu);text-underline-offset:4px;text-decoration-thickness:2px}
.sp__score:hover .sp__smeta>span:last-child{color:#fff;text-decoration-thickness:3px}
.sp__revrow--score{grid-template-columns:auto minmax(0,1fr)}
.sp__revrow--score .sp__revtext{padding-right:clamp(24px,4vw,64px);border-right:1px solid rgba(255,255,255,.18);align-self:stretch;display:flex;align-items:center}
/* town pages: the "customers say" heading sits on the navy band, joined to the quotes below it */
.sp--revhead{padding-bottom:0}
.sp--revhead+.sp--rev{padding-top:40px}
.sp--revhead .sp__pricecard .callout{box-shadow:16px 16px 0 var(--cu);color:var(--navy)}
.sp--revhead .sp__pricecard .callout a{color:var(--navy)}
@media (max-width:820px){
  .sp__revrow--score{grid-template-columns:minmax(0,1fr)}
  .sp__revrow--score .sp__revtext{padding:0 0 24px;border-right:0;border-bottom:1px solid rgba(255,255,255,.18)}
}
.prose a.sp__score{color:#fff;text-decoration:none}
/* two paired-card bands in a row: the second pair goes navy so the page does not read as one repeated block */
.sp--duo+.sp--duo.sp--alt .sp__card{background:var(--navy);border-top-color:var(--cu)}
.sp--duo+.sp--duo.sp--alt .sp__card.prose h2{color:#fff}
.sp--duo+.sp--duo.sp--alt .sp__card.prose p,.sp--duo+.sp--duo.sp--alt .sp__card.prose li{color:#D5DDE7}
.sp--duo+.sp--duo.sp--alt .sp__card.prose a{color:#fff}
.sp--revhead .sp__pricecard .callout p{color:var(--navy)}
/* related and nearby links carry the service or town photo (same images as the services page and town heroes) */
.rel__grid a{min-height:92px}
.rel__grid a.rel__card{justify-content:flex-start;gap:18px;padding:0 22px 0 0;overflow:hidden}
.rel__img{flex:none;width:92px;height:92px;object-fit:cover;transition:transform .35s ease}
.rel__t{flex:1;min-width:0;line-height:1.25}
@media (hover:hover){.rel__grid a.rel__card:hover .rel__img{transform:scale(1.06)}}
@media (prefers-reduced-motion:reduce){.rel__img{transition:none}}
@media (max-width:600px){.rel__grid a{min-height:76px}.rel__img{width:76px;height:76px}}
/* fade-up for sub-page cards (site.js adds .rv-wait only to cards below the fold) */
.rv-wait{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.rv-wait.is-in{opacity:1;transform:none}
/* the closing tip fills its column, with a call button at the foot */
.sp__tip{align-self:stretch;display:flex;flex-direction:column}
.sp__tip.prose .sp__tipcall{margin-top:auto;align-self:flex-start;text-decoration:none}
.sp__tip.prose p:last-of-type{margin-bottom:28px}
.sp__tip{position:relative;overflow:hidden}
.sp__tip>*{position:relative;z-index:1}
.sp__tip::after{content:"";position:absolute;right:-50px;bottom:-60px;width:300px;height:300px;opacity:.09;transform:rotate(-12deg);
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E3884A' stroke-width='1' stroke-linejoin='round'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z'/%3E%3C/svg%3E") center/contain no-repeat}
.sp__tip.prose p.sp__tiphrs{margin:16px 0 0;font-size:15px;color:#AEBBCB}
@media (max-width:820px){.sp__tip::after{width:200px;height:200px}}
/* thank-you: the confirmation beside the same three next steps the form shows (step one ticked), with the van */
.ty__grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(36px,6vw,88px);align-items:start}
.ty__next{padding:clamp(28px,3vw,40px);background:var(--navy);border-top:4px solid var(--cu)}
.ty__k{margin:0 0 6px;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--cu)}
.ty__steps li{font-size:16.5px}
.ty__steps li.is-done::before{content:"";background:var(--cu) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/16px no-repeat}
.ty__photo{margin:28px 0 0}
.ty__photo img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
/* 404: the most-asked services in Logan's priority order, as photo tiles */
.ty__more{margin-top:clamp(48px,6vw,72px)}
@media (max-width:820px){.ty__grid{grid-template-columns:minmax(0,1fr)}}
.ty__grid>*{min-width:0}
/* About: three-stop timeline (facts from Logan via Josh 10-22: opened 1994, incorporated 2007) */
.sp--story{background:var(--navy);color:#fff}
.sp--story .prose h2{color:#fff}
.sp__kick{margin:0 0 10px;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--cu)}
.story{list-style:none;margin:44px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;position:relative}
.story::before{content:"";position:absolute;left:0;right:0;top:15px;height:2px;background:rgba(255,255,255,.2)}
.story__i{position:relative;padding-top:52px}
.story__i::before{content:"";position:absolute;left:0;top:6px;width:20px;height:20px;background:var(--navy);border:3px solid var(--cu);transform:rotate(45deg)}
.story__i--now::before{background:var(--cu)}
.story__y{display:block;font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(44px,5vw,72px);line-height:.9;color:var(--cu)}
.story__i h3{margin:16px 0 8px;font-family:var(--display);font-stretch:125%;font-weight:800;font-size:22px;color:#fff}
.story__i p{margin:0;font-size:16.5px;line-height:1.6;color:#D5DDE7;max-width:34ch}
@media (max-width:820px){
  .story{grid-template-columns:minmax(0,1fr);gap:36px;padding-left:36px}
  .story::before{left:9px;right:auto;top:0;bottom:0;width:2px;height:auto}
  .story__i{padding-top:0}
  .story__i::before{left:-36px;top:12px}
}
/* contact: where we work, town links as chips beside the map */
.sp__townlinks{list-style:none;margin:22px 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.sp__townlinks li{margin:0;padding:0}
.sp__townlinks li::before{display:none}
.prose .sp__townlinks a{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;background:#fff;border:1px solid #E4E8EE;border-left:3px solid var(--cu);font-weight:700;text-decoration:none;color:var(--navy)}
@media (hover:hover){.prose .sp__townlinks a:hover{border-color:var(--navy);border-left-color:var(--cu);background:var(--navy);color:#fff}}
.sp__mapwrap .sp__map{margin:0;box-shadow:16px 16px 0 var(--cu)}
.sp__mapwrap{padding:0 16px 16px 0}
.ty__card h1{margin-bottom:22px}
/* top bar: the Google rating next to "since 1994" (Frank Gay puts the review count up top) */
.util__l{display:flex;align-items:center;gap:14px}
.util__rate{display:inline-flex;align-items:center;gap:7px;color:#fff;font-weight:600;text-decoration:none}
.util__star{width:12px;height:12px;background:var(--cu);clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
@media (hover:hover){.util__rate:hover{text-decoration:underline;text-decoration-color:var(--cu);text-underline-offset:3px}}
@media (max-width:1000px){.util__r>span:first-child,.util__r>.util__sep{display:none}}
/* homepage "About Excel": next steps under the lede */
.crew__cta{display:flex;flex-wrap:wrap;gap:14px;margin:30px 0 0}
.btn--out{background:#fff;color:var(--navy);box-shadow:inset 0 0 0 2px var(--navy),0 6px 0 #B9C4D1}
.btn--out:hover{background:var(--ground)}
.btn--out:active{box-shadow:inset 0 0 0 2px var(--navy),0 3px 0 #B9C4D1}
.crew__cta .btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
@media (max-width:600px){.crew__cta .btn{flex:1 1 100%}}
/* contextual next step under a checklist or section: one button that opens the form with the right problem or town
   already picked, and the phone number beside it */
.ctarow{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:32px}
.prose .ctarow .btn,.ctarow .btn{text-decoration:none;color:var(--ink)}
.prose .ctarow .ctarow__tel,.ctarow__tel{font-weight:700;color:var(--navy);text-decoration:underline;text-decoration-color:var(--cu);text-underline-offset:4px;text-decoration-thickness:2px}
.sp--rev .ctarow__tel,.sp--story .ctarow__tel{color:#fff}
@media (max-width:600px){.ctarow .btn{flex:1 1 100%}.ctarow__tel{margin:0 auto}}
/* services: who we work for */
.who__grid{list-style:none;margin:34px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.who__c{display:flex;flex-direction:column;padding:34px 30px 30px;background:#fff;border-top:4px solid var(--navy)}
.who__c h3{margin:0 0 10px;font-family:var(--display);font-stretch:125%;font-weight:800;font-size:22px;line-height:1.15}
.who__c p{margin:0 0 22px;font-size:16.5px;line-height:1.6;color:#3B4A5C}
.who__a{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-weight:800;color:var(--navy);text-decoration:none;text-transform:uppercase;letter-spacing:.06em;font-size:14px}
.who__a svg{width:16px;height:16px;fill:none;stroke:var(--cu);stroke-width:2;transition:transform .2s}
@media (hover:hover){.who__a:hover svg{transform:translateX(4px)}.who__a:hover{color:var(--cu-d)}}
/* services: everything we fix, by service (each page's own "What we fix" list) */
.fixidx__grid{margin-top:34px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:34px 28px}
.fixidx__col h3{margin:0 0 12px;padding-bottom:10px;border-bottom:2px solid var(--navy);font-family:var(--display);font-stretch:112%;font-weight:800;font-size:17px}
.fixidx__col h3 a{color:var(--navy);text-decoration:none}
@media (hover:hover){.fixidx__col h3 a:hover{color:var(--cu-d)}}
.fixidx__col ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.fixidx__col li{position:relative;padding-left:18px;font-size:15px;line-height:1.45;color:#3B4A5C}
.fixidx__col li::before{content:"";position:absolute;left:0;top:.5em;width:7px;height:7px;background:var(--cu);transform:rotate(45deg)}
.fixidx__more{margin-top:44px;padding:28px 32px;background:var(--ground);border-left:5px solid var(--cu);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px}
.fixidx__more p{margin:0;font-weight:700;font-size:18px}
.fixidx__more .ctarow{margin-top:0}
@media (max-width:1180px){.fixidx__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:820px){.fixidx__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.who__grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:480px){.fixidx__grid{gap:26px 18px}.fixidx__col h3{font-size:15.5px}.fixidx__col li{font-size:14px;padding-left:15px}}
.who__grid>*,.fixidx__grid>*{min-width:0;overflow-wrap:break-word}
/* kicker sits right on its heading (prose h2 margin was pushing them apart) */
.sp__kick+h2,.prose .sp__kick+h2{margin-top:0}
/* motion, all of it opt-in from site.js and none of it with reduced motion */
.draw-wait.kick::before,.draw-wait.sp__kick::before{transform:scaleX(0);transform-origin:left;transition:transform .7s cubic-bezier(.2,.7,.2,1) .15s}
.draw-wait.is-drawn.kick::before,.draw-wait.is-drawn.sp__kick::before{transform:scaleX(1)}
.sp__kick{display:flex;align-items:center;gap:12px}
.sp__kick::before{content:"";width:28px;height:3px;background:var(--cu);flex:none}
.story.draw-wait::before{transform:scaleX(0);transform-origin:left;transition:transform 1.4s cubic-bezier(.2,.7,.2,1) .2s}
.story.draw-wait.is-drawn::before{transform:scaleX(1)}
@media (max-width:820px){.story.draw-wait::before{transform:scaleY(0);transform-origin:top}.story.draw-wait.is-drawn::before{transform:scaleY(1)}}
/* photos beside text wipe in from the side they sit on */
.sp__media.rv-wait{opacity:1;transform:none}
.sp__media.rv-wait img{clip-path:inset(0 100% 0 0);transition:clip-path 1s cubic-bezier(.65,0,.35,1)}
.sp__split--flip .sp__media.rv-wait img{clip-path:inset(0 0 0 100%)}
.sp__media.rv-wait.is-in img{clip-path:inset(0 0 0 0)}
/* small hover cues: cards lift, arrows nudge */
.who__c,.fixidx__col{transition:transform .25s ease,box-shadow .25s ease}
@media (hover:hover){
  .who__c:hover{transform:translateY(-4px);box-shadow:0 18px 36px -18px rgba(36,52,71,.35)}
  .crew__cta .btn svg,.rel__grid a svg{transition:transform .2s ease}
  .crew__cta .btn:hover svg,.rel__grid a:hover svg{transform:translateX(4px)}
  .sp__ficon,.sp__vicon{transition:transform .25s ease,box-shadow .25s ease}
  .sp__feat:hover .sp__ficon,.sp__val:hover .sp__vicon,.who__c:hover .sp__vicon{transform:translate(-3px,-3px);box-shadow:11px 11px 0 var(--cu)}
}
@media (prefers-reduced-motion:reduce){
  .who__c,.fixidx__col,.sp__ficon,.sp__vicon,.crew__cta .btn svg,.rel__grid a svg{transition:none}
}
/* FAQ answers slide open (Chrome/Edge 131+; elsewhere they open instantly as before) */
@media (prefers-reduced-motion:no-preference){
  .faq{interpolate-size:allow-keywords}
  .faq details::details-content{block-size:0;overflow:hidden;transition:block-size .35s cubic-bezier(.2,.7,.2,1),content-visibility .35s allow-discrete}
  .faq details[open]::details-content{block-size:auto}
  .faq summary::after{transition:transform .25s ease,background .15s}
  .faq details[open] summary::after{transform:rotate(180deg)}
}
@media (max-width:600px){.nexts li{font-size:15px}}

/* checklist items carry an icon for what they are (faucet, toilet, drain, water heater ...) in place of the tick */
.sp__ticks .ticks li.has-ti{padding-left:62px}
.sp__ticks .ticks li.has-ti::before{display:none}
.ti{position:absolute;left:20px;top:19px;width:28px;height:28px;fill:none;stroke:var(--cu-d);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:600px){.sp__ticks .ticks li.has-ti{padding-left:54px}.ti{left:16px;top:15px;width:26px;height:26px}}
/* homepage frozen-pipes card: room below it, so the card floats in the photo instead of sitting on the next band */
.winter{padding-bottom:clamp(56px,6vw,96px)}
@media (max-width:820px){.winter{padding-bottom:48px}}
@media (max-width:600px){.winter{padding-bottom:36px}}
/* homepage "Family-owned" tape: lands on the photo like a label being stuck down */
@keyframes tapeOn{
  0%{opacity:0;transform:translate(-10px,-28px) rotate(-15deg) scale(1.35);box-shadow:0 26px 30px rgba(17,24,39,.18)}
  55%{opacity:1;transform:translate(0,3px) rotate(-2.5deg) scale(.96);box-shadow:0 4px 8px rgba(17,24,39,.3)}
  78%{opacity:1;transform:translate(0,0) rotate(-4.8deg) scale(1.02)}
  100%{opacity:1;transform:rotate(-4deg) scale(1);box-shadow:0 8px 18px rgba(17,24,39,.25)}
}
.crew__tape.draw-wait{opacity:0}
.crew__tape.draw-wait.is-drawn{animation:tapeOn .75s cubic-bezier(.2,.8,.2,1) .35s both}
/* big display words rising from behind a mask (site.js adds the wrappers) */
.rise__ln{clip-path:inset(-.25em -.2em -.25em -.2em)}
.ftr__big .rise__ln{display:inline-block}
.rise__in{display:inline-block}
.rise-wait .rise__in{transform:translateY(145%);transition:transform .9s cubic-bezier(.2,.75,.2,1)}
.rise-wait.is-risen .rise__in{transform:none}
/* homepage town list: each town links to its page */
.towns dt a{color:inherit;text-decoration:none;transition:color .2s}
@media (hover:hover){.towns dt a:hover{color:var(--cu)}.towns div:first-child dt a:hover{color:#fff}}
.towns #area-more dt{font-size:clamp(22px,2vw,28px)}
.poster__t .rise__in,.poster-sm .rise__in{display:block}
/* parallax backdrops: the photo is taller than its frame so it can drift without showing an edge */
.area__photo.plx img,.winter__photo.plx img{position:absolute;left:0;top:-12%;width:100%;height:124%;will-change:transform}
.winter__photo.plx{overflow:hidden}
/* tap targets: small text links get a 44px-tall hit area without moving anything (padding in, margin back out) */
.ctarow__tel{display:inline-block;padding-block:10px;margin-block:-10px}
.who__a{min-height:44px}
.proof__l a,.office__grid li a:not(.office__v){display:inline-flex;align-items:center;min-height:44px;margin-block:-6px}
/* footer base: one tidy row (copyright, legal links, back to top), the two licenses as labelled badges, then the
   photo credits on their own muted line (the CC BY-SA photos need the attribution visible) */
.ftr__base{display:block;padding-block:26px 34px}
.ftr__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 32px}
.ftr__base p.ftr__copy{font-size:13.5px;color:#C9D2DD}
.ftr__nav{list-style:none;margin:0 auto 0 0;padding:0;display:flex;flex-wrap:wrap;gap:0 22px}
.ftr__nav a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;font-size:13.5px;color:#C9D2DD;text-decoration:none}
@media (hover:hover){.ftr__nav a:hover{color:#fff;text-decoration:underline;text-decoration-color:var(--cu);text-underline-offset:4px}}
.ftr__lic{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.ftr__lic li{padding:7px 12px;border:1px solid rgba(255,255,255,.16);font-size:12.5px;font-weight:700;letter-spacing:.04em;color:#fff}
.ftr__lic span{font-weight:500;letter-spacing:0;color:#8B97A7;margin-right:4px}
.ftr__base p.ftr__credits{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08);font-size:11.5px;line-height:1.6;color:#8B97A7;max-width:none}
@media (max-width:820px){.ftr__row{flex-direction:column;align-items:flex-start;gap:4px}.ftr__nav{margin:0}}
/* "Details" / "Book this" as real buttons (services cards + homepage problem rows): Book this is the solid primary,
   Details the outlined secondary, both 44px tall, same chunky offset style as the site's big buttons */
.sx__more{gap:12px}
.sx__more a,.bookthis{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:13px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;transition:background .15s,transform .15s,box-shadow .15s}
.sx__more a[data-pick],.bookthis{background:var(--cu);color:var(--ink);box-shadow:0 4px 0 var(--cu-d)}
.sx__more a:not([data-pick]){background:#fff;color:var(--navy);box-shadow:inset 0 0 0 2px var(--navy),0 4px 0 #B9C4D1}
.bookthis{margin-top:12px}
.bookthis svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;transition:transform .2s}
@media (hover:hover){
  .sx__more a[data-pick]:hover,.bookthis:hover{background:#EC9A61;color:var(--ink);transform:translateY(-1px)}
  .sx__more a:not([data-pick]):hover{background:var(--navy);color:#fff;transform:translateY(-1px)}
  .bookthis:hover svg{transform:translateX(3px)}
}
.sx__more a[data-pick]:active,.bookthis:active{transform:translateY(2px);box-shadow:0 2px 0 var(--cu-d)}
.sx__more a:focus-visible,.bookthis:focus-visible{outline:3px solid var(--navy);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.sx__more a,.bookthis,.bookthis svg{transition:none}}
/* checklist sections on wide screens: heading, intro, closing note and the booking button in a left column, the cards
   two-up beside them (Zoom Drain's "Drain or sewer issues?" split), instead of one wide text line over a wide grid */
@media (min-width:1181px){
  .sp--check>.wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(48px,5vw,88px);align-items:start}
  .sp--check>.wrap>*{grid-column:1}
  .sp--check>.wrap>.sp__ticks{grid-column:2;grid-row:1 / span 6;margin-top:0}
  .sp--check .sp__checkhead,.sp--check .sp__after{max-width:none}
  .sp--check .sp__checkhead.prose h2{font-size:clamp(34px,3vw,46px);line-height:1.05}
  .sp--check .sp__checkhead.prose h2+p{font-size:18.5px;line-height:1.65}
  .sp--check .sp__after{margin-top:22px}
  .sp--check .ctarow{margin-top:28px}
  .sp--check .sp__ticks .ticks:has(>li:nth-child(1)){--cols:2}
}
/* checklist cards that define something ("Tank: ...", "Runs all night: ...") read as small cards: icon on top, the name
   as a title, the explanation underneath in regular weight */
.sp__ticks .ticks li.has-def{display:flex;flex-direction:column;gap:8px;padding:26px 26px 28px}
.sp__ticks .ticks li.has-def .ti{position:static;width:34px;height:34px;margin-bottom:6px}
.ti__h{font-family:var(--display);font-stretch:112%;font-weight:800;font-size:19px;line-height:1.2;color:var(--navy)}
.ti__d{font-weight:400;font-size:16px;line-height:1.6;color:#3B4A5C}
@media (max-width:600px){.sp__ticks .ticks li.has-def{padding:22px 20px 24px}.ti__h{font-size:18px}}
/* services cards: the two buttons share the card's width as equal halves, so they line up across all ten cards */
.sx__more{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%;max-width:420px}
.sx__more a{min-height:48px;padding:0 14px;font-size:13.5px}
.sx__more a:not([data-pick]){box-shadow:inset 0 0 0 2px var(--navy)}
@media (hover:hover){.sx__more a:not([data-pick]):hover{box-shadow:inset 0 0 0 2px var(--navy)}}
/* footer call band: Logan's shop-and-fleet photo framed beside "Something leaking?" (Applewood / Michael & Son end
   on their own trucks). The photo is 526px, so it stays a framed card rather than a blurry full-bleed background. */
@media (min-width:821px){
  .ftr__cta-in{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:clamp(40px,5vw,80px);row-gap:30px;align-items:end;justify-content:stretch}
  .ftr__big{grid-column:1;grid-row:1}
  .ftr__btns{grid-column:1;grid-row:2;align-self:start}
  .ftr__fleet{grid-column:2;grid-row:1 / span 2;align-self:center;margin:0 18px 18px 0;width:clamp(280px,28vw,400px)}
  .ftr__fleet img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:50% 60%;box-shadow:18px 18px 0 var(--cu)}
}
@media (max-width:820px){.ftr__fleet{display:none}}
/* About already shows this photo in its own section */
body:has(main img[src*="shop-fleet-dusk"]) .ftr__fleet{display:none}
/* Google review labels carry the Google "G" so the source reads at a glance (Applewood marks each review this way) */
.g-src{display:inline-flex;align-items:center;gap:6px}
.g-src::before{content:"";width:13px;height:13px;flex:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='%23FFC107' d='M43.6 20.1H42V20H24v8h11.3C33.7 32.7 29.2 36 24 36c-6.6 0-12-5.4-12-12s5.4-12 12-12c3.1 0 5.8 1.2 7.9 3.1l5.7-5.7C34 6.1 29.3 4 24 4 12.9 4 4 12.9 4 24s8.9 20 20 20 20-8.9 20-20c0-1.3-.1-2.6-.4-3.9z'/%3E%3Cpath fill='%23FF3D00' d='M6.3 14.7l6.6 4.8C14.7 15.1 19 12 24 12c3.1 0 5.8 1.2 7.9 3.1l5.7-5.7C34 6.1 29.3 4 24 4 16.3 4 9.7 8.3 6.3 14.7z'/%3E%3Cpath fill='%234CAF50' d='M24 44c5.2 0 9.9-2 13.4-5.2l-6.2-5.2C29.2 35.1 26.7 36 24 36c-5.2 0-9.6-3.3-11.3-7.9l-6.5 5C9.5 39.6 16.2 44 24 44z'/%3E%3Cpath fill='%231976D2' d='M43.6 20.1H42V20H24v8h11.3c-.8 2.2-2.2 4.2-4.1 5.6l6.2 5.2C37 39.2 44 34 44 24c0-1.3-.1-2.6-.4-3.9z'/%3E%3C/svg%3E") center/contain no-repeat}
/* the brand's double copper diagonal (hero panel, footer band) in the corner of the navy review bands on inner pages */
.sp--rev{position:relative;overflow:hidden}
.sp--rev::before{content:"";position:absolute;top:0;right:0;width:220px;height:220px;pointer-events:none;background:linear-gradient(225deg,transparent 0 80px,var(--cu) 80px 83px,transparent 83px 95px,var(--cu) 95px 97px,transparent 97px)}
.sp--revhead+.sp--rev::before{display:none}
@media (max-width:600px){.sp--rev::before{width:130px;height:130px;background:linear-gradient(225deg,transparent 0 46px,var(--cu) 46px 48px,transparent 48px 55px,var(--cu) 55px 56.5px,transparent 56.5px)}}
.g-src::before{display:inline-block;vertical-align:-2px;margin-right:6px}
/* inner-page heroes: the homepage's proof numbers in a compact row under the buttons (Pipe Wrench's stats card),
   so ad traffic that lands on a service or town page sees the rating first */
.hstats--sm{margin-top:24px;padding-top:16px;gap:14px}
.hstats--sm .hstat__n{font-size:clamp(20px,1.6vw,25px)}
.hstats--sm .hstat__l{font-size:12.5px}
@media (min-width:1181px) and (max-height:820px){.hstats--sm{margin-top:16px;padding-top:12px}.hstats--sm .hstat__n{font-size:20px}}
@media (max-width:1180px){.hstats--sm{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}}
@media (max-width:600px){.hstats--sm{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 18px}}
/* header Services dropdown as a small mega menu: the ten services with their icons in Logan's priority order, and a
   navy side panel with the phone (Applewood / Beehive show services this way) */
.dd__p--mega{display:grid;grid-template-columns:minmax(0,1fr) 230px;min-width:760px;padding:0}
.dd__list{display:grid;grid-template-columns:1fr 1fr;padding:12px 8px}
.hdr__nav .dd__p--mega .dd__list a{display:flex;align-items:center;gap:12px;padding:11px 14px;line-height:1.25}
.dd__i{width:22px;height:22px;flex:none;fill:none;stroke:var(--cu-d);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.dd__side{display:flex;flex-direction:column;justify-content:center;gap:12px;padding:26px 24px;background:var(--navy);color:#fff}
.dd__side p{margin:0;font-size:14.5px;line-height:1.5;color:#D5DDE7}
.hdr__nav .dd__side a.dd__tel{padding:0;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:21px;color:#fff;background:none}
.hdr__nav .dd__side a.dd__all{padding:0;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#F2B58A;background:none;text-decoration:underline;text-underline-offset:4px}
.hdr__nav .dd__side a:hover{background:none;color:#fff}
@media (max-width:1300px){.dd__p--mega{min-width:680px;grid-template-columns:minmax(0,1fr) 200px}}
.hdr__nav .dd__p--mega svg.dd__i{width:22px;height:22px;fill:none;stroke:var(--cu-d);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* phone menu: services carry the same icons and priority order as the desktop menu */
.acc__p--svc a{display:flex;align-items:center;gap:12px}
.drawer .acc__p--svc svg.acc__i{width:22px;height:22px;flex:none;fill:none;stroke:var(--cu-d);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* "What we find" label: slate instead of near-black, so it stands off the dark pipe photo (white on slate 5.6:1) */
.tag--ink{background:var(--slate);color:#fff}
/* services cards: Details gets the same 4px ledge as Book this (navy), so both buttons end on the same line */
.sx__more a:not([data-pick]){box-shadow:inset 0 0 0 2px var(--navy),0 4px 0 var(--navy)}
@media (hover:hover){.sx__more a:not([data-pick]):hover{box-shadow:inset 0 0 0 2px var(--navy),0 4px 0 var(--ink)}}
.sx__more a:not([data-pick]):active{transform:translateY(2px);box-shadow:inset 0 0 0 2px var(--navy),0 2px 0 var(--navy)}
/* services cards: room between the tags and the buttons (the row still sits at the foot of the card) */
.sx__more{padding-top:22px}
/* service-area town list: two columns on wide screens (name over its line), so the list ends level with the map and
   photo collage beside it instead of running far past them */
@media (min-width:1181px){
  .towns{display:grid;grid-template-columns:1fr 1fr;column-gap:28px}
  .towns div{flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:6px;padding:16px 0}
  .towns dt{font-size:clamp(24px,2vw,30px)}
  .towns #area-more dt{font-size:clamp(18px,1.4vw,21px);line-height:1.1}
}
@media (min-width:1181px){
  .area__roslyn{width:68%;aspect-ratio:4/3}
  /* the map + photo collage rides along while the town list scrolls past, so the left side is never an empty block */
  .area__mapcol{position:sticky;top:calc(var(--hdr) + 28px)}
}
/* compact hero stats: the two Google links get a 44px tap height (qa-kit MED) without changing the row's look */
.hstats--sm a.hstat{min-height:44px;justify-content:center}
/* header Service Area dropdown in the same style as Services: pins with each town's one-line description from the
   homepage list, and a navy side panel with the service-area map; it opens leftward so it stays on screen */
.dd__p--area{left:auto;right:-22px;min-width:720px;grid-template-columns:minmax(0,1fr) 250px}
.hdr__nav .dd__p--area .dd__list a{align-items:flex-start}
.hdr__nav .dd__p--area .dd__list a span{display:flex;flex-direction:column;gap:2px}
.hdr__nav .dd__p--area .dd__list b{font-weight:700;font-size:15px;color:var(--navy)}
.hdr__nav .dd__p--area .dd__list small{font-weight:500;font-size:12.5px;line-height:1.35;color:var(--mute)}
.hdr__nav .dd__p--area .dd__list a:hover b{color:var(--cu-d)}
.dd__p--area .dd__side{justify-content:center;gap:16px}
.dd__map{display:block;width:100%;height:auto;background:#fff;border:3px solid #fff}
@media (max-width:1300px){.dd__p--area{min-width:640px;grid-template-columns:minmax(0,1fr) 210px}}
/* both mega dropdowns open centred on the page, directly under the header (positioned against the header row, not
   their link), so Services and Service Area land in the same spot */
.hdr__in{position:relative}
.hdr__nav .dd:has(.dd__p--mega){position:static}
.hdr__nav .dd__p--mega{top:100%;left:0;right:0;margin-inline:auto;min-width:0;width:760px}
.hdr__nav .dd__p--area{width:720px}
.hdr__nav .dd__p--mega::before{top:-40px;height:40px}
@media (max-width:1300px){.hdr__nav .dd__p--mega{width:680px}.hdr__nav .dd__p--area{width:640px}}
/* on narrower desktops the centred panel must still reach under the Services link (it sits further left there), so
   moving the pointer straight down from either link lands inside the menu */
@media (max-width:1300px){.hdr__nav .dd__p--mega,.hdr__nav .dd__p--area{width:860px;grid-template-columns:minmax(0,1fr) 230px}}
/* Service Area list flows down two columns instead of a row grid, so a long entry (Easton, Vantage, Mattawa) does
   not open a gap above the next town */
.hdr__nav .dd__p--area .dd__list{display:block;columns:2;column-gap:8px}
.hdr__nav .dd__p--area .dd__list a{break-inside:avoid}
/* footer: Instagram under "Find us on Google" (Logan's account from the intake; Facebook waits on Logan) */
.ftr__link{display:flex;width:max-content}
.ftr__link+.ftr__ig{margin-top:2px}
.ftr__ig{align-items:center;gap:8px}
.ftr__ig svg{width:18px;height:18px;flex:none;fill:none;stroke:var(--cu);stroke-width:1.8}
.ftr__ig circle:last-child{fill:var(--cu);stroke:none}
/* footer: Google and Instagram links under the brand line, each with its icon */
.ftr__social{display:flex;flex-direction:column;gap:4px;margin-top:18px}
.ftr__social .ftr__link{margin-top:0;align-items:center;gap:10px;min-height:36px}
.ftr__g svg{width:18px;height:18px;flex:none}
@media (max-width:820px){.ftr__social .ftr__link{min-height:44px}}
/* footer link icons in one style: the same small outlined tile, both glyphs in brand copper (the Google G drops its
   four brand colours here so it matches the line-drawn Instagram mark) */
.ftr__social .ftr__link svg{box-sizing:content-box;width:16px;height:16px;padding:7px;border:1px solid rgba(255,255,255,.22)}
.ftr__g svg path{fill:var(--cu)}
.ftr__ig svg{stroke-width:2}
@media (hover:hover){.ftr__social .ftr__link:hover svg{border-color:var(--cu)}}
/* back to top: the label beside an outlined arrow tile (same tile as the footer's Google / Instagram icons); on hover
   the tile fills copper and the arrow lifts */
.ftr__top{gap:14px}
.ftr__top-i{display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(255,255,255,.22);transition:background .2s,border-color .2s}
.ftr__top-i svg{width:16px;height:16px;fill:none;stroke:var(--cu);stroke-width:2;transition:transform .25s ease,stroke .2s}
@media (hover:hover){
  .ftr__top:hover{color:#fff}
  .ftr__top:hover .ftr__top-i{background:var(--cu);border-color:var(--cu)}
  .ftr__top:hover .ftr__top-i svg{stroke:var(--ink);transform:translateY(-3px)}
}
@media (prefers-reduced-motion:reduce){.ftr__top-i,.ftr__top-i svg{transition:none}.ftr__top:hover .ftr__top-i svg{transform:none}}
/* legal pages: the text in a reading column with a sticky "On this page" list and a call card beside it */
.legalpage{padding-block:clamp(48px,6vw,88px)}
.legal__grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(40px,6vw,96px);align-items:start}
.legal__grid .legal{max-width:760px}
.legal h2{scroll-margin-top:120px}
.legal__date{display:inline-block;margin:6px 0 4px;padding:6px 12px;background:var(--ground);font-size:14px;font-weight:700;color:var(--mute)}
.legal__group{margin:48px 0 0;padding-top:20px;border-top:3px solid var(--navy);font-family:var(--display);font-stretch:112%;font-weight:800;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--cu-d)}
.legal__side{position:sticky;top:calc(var(--hdr) + 24px);display:grid;gap:18px;max-height:calc(100vh - var(--hdr) - 48px);overflow:auto}
.legal__toc{padding:22px 22px 18px;background:var(--ground);border-top:4px solid var(--cu)}
.legal__k{margin:0 0 10px;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--navy)}
.legal__toc ol{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.legal__toc a{display:block;padding:6px 0;font-size:14px;line-height:1.35;color:#3B4A5C;text-decoration:none}
@media (hover:hover){.legal__toc a:hover{color:var(--cu-d)}}
.legal__call{padding:22px;background:var(--navy);color:#fff}
.legal__call p{margin:0;font-size:14.5px;line-height:1.5;color:#D5DDE7}
.legal__call a{display:inline-flex;align-items:center;min-height:44px;font-family:var(--display);font-stretch:112%;font-weight:800;font-size:22px;color:#fff;text-decoration:none}
.legal__call .legal__hrs{font-size:13px;color:#AEBBCB}
@media (max-width:1024px){.legal__grid{grid-template-columns:minmax(0,1fr)}.legal__side{position:static;max-height:none}.legal__toc{display:none}}
/* legal lists (restored from the old site's flattened text): small copper markers; label/value rows for the SMS terms */
.legal .legal__list{list-style:none;margin:6px 0 22px;padding:0;display:grid;gap:8px}
.legal .legal__list li{position:relative;padding-left:22px;font-size:17px;line-height:1.55}
.legal .legal__list li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;background:var(--cu);transform:rotate(45deg)}
.legal .legal__list--kv{gap:0;border-top:1px solid #E4E8EE}
.legal .legal__list--kv li{padding:12px 0 12px 22px;border-bottom:1px solid #E4E8EE}
.legal .legal__list--kv li::before{top:calc(12px + .62em)}
.legal .legal__list--kv strong{color:var(--navy)}
.legal .legal__addr{padding:18px 20px;background:var(--ground);border-left:4px solid var(--cu);line-height:1.7}
/* homepage brand line under the hero: Logan's "Reliable. Experienced. On time." as one strong strip (Morris-Jenkins
   runs "Fast. Friendly. Fair." in the same spot) */
.bline{padding:clamp(28px,4vw,48px) 0;background:#fff;border-bottom:1px solid #E4E8EE}
.bline__t{margin:0;display:flex;flex-wrap:wrap;justify-content:center;gap:4px clamp(20px,3.5vw,56px);font-family:var(--display);font-stretch:125%;font-weight:900;font-size:clamp(28px,4.4vw,64px);line-height:1;letter-spacing:-.01em;text-transform:uppercase;color:var(--navy)}
.bline__t b{color:var(--cu)}
.bline__t .rise__ln{display:inline-block}
@media (max-width:600px){.bline__t{gap:2px 14px;font-size:clamp(24px,7.5vw,32px)}}
.bline__t{font-size:clamp(26px,3.4vw,52px)}@media (max-width:600px){.bline__t{font-size:clamp(24px,7.5vw,32px)}}

/* A2P consent: two optional boxes above the submit button */
.fconsent{display:grid;gap:10px;margin:4px 0 18px}
.fchk{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;font-size:14.5px;line-height:1.45;color:var(--ink);cursor:pointer}
.fchk input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--cu-d)}
.fconsent__fine{margin:0;font-size:13px;line-height:1.45;color:var(--mute)}
.fconsent__fine a{color:inherit}

/* logo link keeps a 44px tap target with the shorter horizontal logo */
.hdr__logo{display:inline-flex;align-items:center;min-height:44px}