/* =========================================================
   Abe & Sons Painting — styles
   Direction: bold contractor (Z's Exteriors-inspired) in oxblood/black.
   Type: Montserrat (display) · Anton (stats) · Hanken Grotesk (body).
   ========================================================= */
:root{
  --oxblood:#7a1430;
  --oxblood-deep:#56091c;
  --oxblood-bright:#9c1a3e;
  --ink:#141013;
  --ink-2:#1d171a;
  --ink-3:#271f23;
  --bg:#ffffff;
  --surface:#f6f2ef;
  --brass:#ffffff;
  --text:#241c1f;
  --muted:#6d6166;
  --line:#e7ded9;
  --line-dark:#392e33;
  --fs-12:.75rem; --fs-14:.875rem; --fs-16:1rem; --fs-18:1.125rem;
  --fs-21:1.3125rem; --fs-28:1.75rem; --fs-40:2.5rem; --fs-56:3.5rem;
  --container:1240px;
  --radius:12px; --radius-sm:8px;
  --shadow-sm:0 1px 3px rgba(20,16,19,.08);
  --shadow:0 16px 44px rgba(20,16,19,.14);
  --shadow-oxblood:0 16px 40px rgba(122,20,48,.34);
  --ease-out:cubic-bezier(.22,.7,.25,1);
  --t-fast:.16s; --t:.24s;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:"Hanken Grotesk",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  color:var(--text);background:var(--bg);font-size:var(--fs-16);line-height:1.65;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{font-family:"Montserrat",system-ui,sans-serif;font-weight:800;
  line-height:1.06;letter-spacing:-.02em;color:var(--ink)}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--oxblood);outline-offset:3px;border-radius:3px}

.container{max-width:var(--container);margin-inline:auto;padding-inline:clamp(20px,5vw,44px)}
.section{padding-block:clamp(56px,8vw,108px)}
.eyebrow{font-family:"Montserrat",sans-serif;font-size:var(--fs-12);font-weight:700;
  letter-spacing:.18em;text-transform:uppercase;color:var(--oxblood);
  display:inline-flex;align-items:center;gap:.7em}
.eyebrow::before{content:"";width:28px;height:3px;background:currentColor}
.lede{font-size:var(--fs-18);color:var(--muted);max-width:60ch}
.sec-head{max-width:680px;margin-bottom:clamp(32px,5vw,56px)}
.sec-head h2{font-size:clamp(1.9rem,4.4vw,var(--fs-40));margin:.55em 0 .35em;text-transform:none}
.sec-head.center{margin-inline:auto;text-align:center}
.sec-head h2.upper{text-transform:uppercase}
.eyebrow--nodash::before{display:none}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55em;min-height:50px;
  padding:.85em 1.6em;border:2px solid transparent;border-radius:var(--radius-sm);
  font-family:"Montserrat",sans-serif;font-weight:700;font-size:var(--fs-14);letter-spacing:.04em;
  text-transform:uppercase;cursor:pointer;background:var(--oxblood);color:#fff;
  transition:transform var(--t-fast) var(--ease-out),box-shadow var(--t),background var(--t)}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-oxblood)}
.btn:active{transform:translateY(0)}
.btn svg{width:18px;height:18px}
.btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.btn--ghost:hover{background:rgba(255,255,255,.14);box-shadow:none}
.btn--light{background:#fff;color:var(--oxblood)}
.btn--dark{background:var(--ink);color:#fff}
.btn--lg{min-height:56px;padding:1em 2em;font-size:var(--fs-16)}

/* utility bar */
.utility{background:var(--ink);color:#e9e1e3;font-size:var(--fs-14)}
.utility .container{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px}
.utility a{color:#e9e1e3;transition:color var(--t-fast)}
.utility a:hover{color:#fff}
.utility .u-left{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.utility .u-left svg{width:15px;height:15px;vertical-align:-2px;color:var(--brass)}
.utility .dot{width:4px;height:4px;border-radius:50%;background:var(--brass);opacity:.85}
.utility .u-right{color:#cbb6bc;white-space:nowrap;display:flex;align-items:center;gap:14px}
.utility .u-right svg{width:15px;height:15px;vertical-align:-2px;color:var(--brass)}
.utility .u-review{display:inline-flex;align-items:center;gap:5px;background:var(--oxblood-bright);color:#fff;
  font-weight:700;font-size:var(--fs-12);line-height:1;padding:7px 13px;border-radius:999px;
  letter-spacing:.02em;transition:background var(--t-fast),transform var(--t-fast)}
.utility .u-review:hover{background:#b3204a;color:#fff;transform:translateY(-1px)}

/* header / nav */
.header{position:sticky;top:0;z-index:100;background:rgba(20,16,19,.97);
  backdrop-filter:saturate(140%) blur(8px);color:#fff;transition:box-shadow var(--t)}
.header.scrolled{box-shadow:0 6px 26px rgba(0,0,0,.4)}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:80px;gap:24px}
.brand{display:flex;align-items:center;gap:12px;color:#fff}
.brand img{height:54px;width:auto;display:block}
.nav-links{display:flex;align-items:center;gap:30px;margin-left:auto;margin-right:8px}
.nav-links a{font-family:"Montserrat",sans-serif;font-size:var(--fs-14);font-weight:600;
  color:#d8cdcf;position:relative;padding:6px 0;transition:color var(--t-fast)}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:#fff}
.nav-links a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:3px;background:var(--brass)}
.nav-toggle{display:none;background:none;border:0;color:#fff;cursor:pointer;
  min-width:46px;min-height:46px;align-items:center;justify-content:center}
.nav-toggle svg{width:28px;height:28px}

/* ---------- HERO (Z's-style full-bleed photo + overlapping stats) ---------- */
.hero{position:relative;background:var(--ink);color:#fff;overflow:hidden;isolation:isolate}
.hero__bg{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center;
  background-image:linear-gradient(160deg,#2a1218,#141013)}
.hero__scrim{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(15,10,12,.94) 0%,rgba(15,10,12,.8) 40%,rgba(15,10,12,.45) 100%),
  linear-gradient(0deg,rgba(15,10,12,.9),transparent 38%),
  radial-gradient(1100px 560px at 88% 16%,rgba(122,20,48,.46),transparent 62%)}
.hero .container{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:40px;
  padding-top:clamp(48px,7vw,80px);padding-bottom:clamp(150px,16vw,210px);min-height:min(84vh,640px)}
.hero__eyebrow{color:#fff}.hero__eyebrow::before{background:var(--brass)}
.hero h1{font-size:clamp(2.1rem,4.6vw,3.5rem);font-weight:800;margin:.35em 0 .5em;
  max-width:13ch;color:#fff;text-transform:uppercase;letter-spacing:-.01em;line-height:1.04;
  text-shadow:0 2px 24px rgba(0,0,0,.5)}
.hero h1 .accent{color:#fff}
.hero p.lead{font-size:var(--fs-18);color:#e7dce0;max-width:48ch}
.hero__actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:var(--s4,2rem)}
.hero__rating{display:flex;align-items:center;gap:10px;margin-top:20px;color:#dcd0d3;font-size:var(--fs-14)}
.stars{color:var(--brass);letter-spacing:.1em;font-size:var(--fs-18)}
.hero__van{position:relative;z-index:1}
.hero__van img{width:100%;filter:drop-shadow(0 26px 42px rgba(0,0,0,.62))}

/* overlapping stat cards */
.stats{position:relative;z-index:5;margin-top:clamp(-130px,-12vw,-96px)}
.stats .container{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.4vw,18px)}
.stat{background:rgba(28,21,25,.92);backdrop-filter:blur(6px);border:1px solid var(--line-dark);
  border-top:4px solid var(--oxblood);border-radius:var(--radius);padding:24px 22px;color:#fff;
  box-shadow:var(--shadow)}
.stat__big{font-family:"Anton",sans-serif;font-style:italic;font-weight:400;text-transform:uppercase;
  line-height:.92;letter-spacing:.01em;font-size:clamp(1.6rem,2.5vw,2.15rem);color:#fff}
.stat__big em{color:var(--oxblood-bright);font-style:italic}
.stat__label{font-family:"Montserrat",sans-serif;font-weight:700;text-transform:uppercase;
  letter-spacing:.04em;font-size:var(--fs-12);color:var(--brass);margin-top:10px}
.stat__sub{font-size:var(--fs-14);color:#b7acb0;margin-top:5px}

/* ---------- services: image cards w/ hover-reveal (Z's style) ---------- */
.services{background:var(--surface)}
.deck{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,22px)}
.svc{position:relative;display:block;border-radius:var(--radius);overflow:hidden;
  aspect-ratio:4/3.1;color:#fff;box-shadow:var(--shadow-sm);isolation:isolate;
  transition:transform var(--t) var(--ease-out),box-shadow var(--t)}
.svc:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.svc__media{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center;
  transition:transform .5s var(--ease-out)}
.svc:hover .svc__media{transform:scale(1.06)}
.svc__shade{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(20,16,19,.05) 0%,rgba(20,16,19,.35) 46%,rgba(20,16,19,.9) 100%);
  transition:background .35s}
.svc:hover .svc__shade{background:linear-gradient(180deg,rgba(122,20,48,.32) 0%,rgba(20,16,19,.78) 60%,rgba(20,16,19,.96) 100%)}
.svc__content{position:absolute;left:0;right:0;bottom:0;padding:22px 24px}
.svc__content h3{color:#fff;font-size:clamp(1.25rem,1.7vw,1.6rem);font-weight:800;
  text-transform:uppercase;letter-spacing:.01em}
.svc__rule{display:block;width:52px;height:4px;border-radius:2px;background:var(--oxblood);margin-top:10px}
.svc__reveal{display:block;max-height:0;opacity:0;overflow:hidden;
  transition:max-height .4s var(--ease-out),opacity .3s,margin .4s}
.svc__reveal p{color:#e7dce0;font-size:var(--fs-14);margin-top:8px}
.svc__more{margin-top:12px;display:inline-flex;align-items:center;gap:6px;font-family:"Montserrat",sans-serif;
  font-weight:700;font-size:var(--fs-12);text-transform:uppercase;letter-spacing:.04em;color:#f0c6d0}
.svc__more svg{width:16px;height:16px}
@media (hover:hover){
  .svc:hover .svc__reveal,.svc:focus-visible .svc__reveal{max-height:200px;opacity:1;margin-top:2px}
}
/* touch devices: keep just the title + rule at bottom; tap opens the service page */

/* ---------- editorial "read" section ---------- */
.read{background:var(--ink);color:#fff;overflow:hidden}
.read .container{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(28px,4vw,60px);align-items:center}
.read__copy .eyebrow{color:#fff}
.read__copy h2{color:#fff;font-size:clamp(1.9rem,4.2vw,3rem);text-transform:none;margin:.5em 0 .6em;max-width:16ch}
.read__copy p{color:#d8cdd0;font-size:var(--fs-18);max-width:54ch}
.read__points{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px 18px;margin:26px 0 30px}
.read__points li{display:flex;gap:10px;align-items:center;font-weight:600;font-size:var(--fs-14);color:#f2ebed}
.read__points svg{flex:none;width:20px;height:20px;stroke:var(--brass);fill:none;stroke-width:2.4}
.read__media{position:relative}
.read__frame{position:absolute;inset:auto -18px -18px auto;width:78%;height:86%;z-index:0;
  background:linear-gradient(135deg,var(--oxblood),var(--oxblood-deep));border-radius:14px;
  clip-path:polygon(14% 0,100% 0,100% 100%,0 100%)}
.read__carousel{position:relative;z-index:1;border-radius:14px;overflow:hidden;
  clip-path:polygon(0 0,100% 0,100% 86%,86% 100%,0 100%);box-shadow:0 24px 50px rgba(0,0,0,.5)}
.read__track{display:flex}
.read__track img{flex:0 0 100%;width:100%;object-fit:cover;aspect-ratio:5/4}
.carousel__btn{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:46px;height:46px;
  border:0;border-radius:50%;background:rgba(20,16,19,.55);color:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px);transition:background var(--t-fast),transform var(--t-fast)}
.carousel__btn:hover{background:var(--oxblood)}
.carousel__btn:active{transform:translateY(-50%) scale(.94)}
.carousel__btn svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:2.4}
.carousel__btn--prev{left:12px}.carousel__btn--next{right:12px}
.carousel__dots{position:absolute;left:0;right:14%;bottom:12px;z-index:3;display:flex;gap:7px;justify-content:center}
.carousel__dots button{width:8px;height:8px;border-radius:50%;border:0;padding:0;cursor:pointer;
  background:rgba(255,255,255,.5);transition:background var(--t-fast),width var(--t-fast)}
.carousel__dots button[aria-current="true"]{background:#fff;width:20px;border-radius:5px}
.read__badge{position:absolute;z-index:2;left:-14px;bottom:24px;background:#fff;color:var(--ink);
  border-radius:12px;padding:14px 18px;box-shadow:var(--shadow);display:flex;align-items:center;gap:12px}
.read__badge .stars{font-size:1.1rem;color:var(--oxblood)}
.read__badge b{font-family:"Anton",sans-serif;font-style:italic;font-size:1.4rem;color:var(--oxblood);display:block;line-height:1}
.read__badge span{font-size:var(--fs-12);color:var(--muted)}

/* ---------- breadcrumbs ---------- */
.crumbs{background:var(--surface);border-bottom:1px solid var(--line)}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  margin:0;padding:13px 0;font-size:var(--fs-14)}
.crumbs li{display:flex;align-items:center;gap:8px;color:var(--muted)}
.crumbs li:not(:last-child)::after{content:"›";color:var(--muted);opacity:.55}
.crumbs a{color:var(--muted);transition:color var(--t-fast)}
.crumbs a:hover{color:var(--oxblood)}
.crumbs li[aria-current]{color:var(--ink);font-weight:600}

/* ---------- testimonials ---------- */
.testi{background:var(--surface)}
.testi__stats{display:flex;justify-content:center;gap:clamp(16px,3vw,40px);flex-wrap:wrap;
  max-width:680px;margin:0 auto 44px;padding-bottom:32px;border-bottom:1px solid var(--line)}
.testi__stat{flex:1 1 0;min-width:120px;text-align:center}
.testi__stat b{font-family:"Montserrat",sans-serif;font-weight:800;font-size:clamp(1.8rem,3vw,2.4rem);color:var(--oxblood);display:block;line-height:1}
.testi__stat span{font-size:var(--fs-14);color:var(--muted);font-weight:600}
/* horizontal review carousel — 2 per view on desktop, 1 on mobile */
.treview{position:relative;display:flex;align-items:center;gap:clamp(8px,1.5vw,16px)}
.treview__track{display:grid;grid-auto-flow:column;grid-auto-columns:calc(50% - 11px);
  gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding:6px 2px;flex:1;min-width:0;align-items:start;-ms-overflow-style:none;scrollbar-width:none}
.treview__track::-webkit-scrollbar{display:none}
.treview__track>.tcard{scroll-snap-align:start}
.treview__arrow{flex:0 0 auto;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);
  background:#fff;color:var(--oxblood);display:flex;align-items:center;justify-content:center;
  cursor:pointer;box-shadow:var(--shadow-sm);transition:background .15s,color .15s,transform .15s,opacity .15s}
.treview__arrow svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round}
.treview__arrow:hover{background:var(--oxblood);color:#fff;transform:scale(1.06)}
.treview__arrow:disabled{opacity:.35;cursor:default;pointer-events:none}
.tcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px 24px;
  box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:14px}
.tcard__stars{color:var(--oxblood);font-size:var(--fs-18);letter-spacing:.08em}
.tcard__text{color:var(--text);font-size:var(--fs-16);line-height:1.6;flex:1}
.tcard__who{display:flex;align-items:center;gap:12px;border-top:1px solid var(--line);padding-top:16px}
.tcard__id{flex:1;min-width:0}
.tcard__ava{flex:0 0 auto;width:42px;height:42px;border-radius:50%;background:var(--oxblood);color:#fff;
  display:flex;align-items:center;justify-content:center;font-family:"Montserrat",sans-serif;font-weight:700;font-size:var(--fs-14)}
.tcard__name{font-family:"Montserrat",sans-serif;font-weight:700;font-size:var(--fs-14);color:var(--ink)}
.tcard__city{font-size:var(--fs-12);color:var(--muted)}
.tcard__google{flex:0 0 auto;width:28px;height:28px;align-self:flex-start}

/* ---------- service-area map ---------- */
.map{background:var(--ink);color:#fff;overflow:hidden}
.map .container{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(28px,4vw,56px);align-items:center}
.map__copy .eyebrow{color:#fff}
.map__copy h2{color:#fff;text-transform:none;font-size:clamp(1.9rem,4vw,2.8rem);margin:.5em 0 .4em}
.map__copy .lede{color:#c6bbbe}
.map__cities{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}
.map__cities a{display:flex;align-items:center;gap:10px;background:var(--ink-3);border:1px solid var(--line-dark);
  border-radius:10px;padding:13px 16px;font-family:"Montserrat",sans-serif;font-weight:600;font-size:var(--fs-14);
  color:#eee;transition:border-color var(--t),background var(--t),transform var(--t)}
.map__cities a:hover{border-color:var(--oxblood);background:#2c2024;transform:translateX(2px)}
.map__cities svg{flex:none;width:16px;height:16px;color:var(--brass)}
.map__leaflet{width:100%;aspect-ratio:6/5;border-radius:var(--radius);overflow:hidden;
  border:1px solid var(--line-dark);background:#15100f;z-index:0}
.map__leaflet .leaflet-control-zoom a{background:var(--ink-3);color:#fff;border-color:var(--line-dark)}
.map__leaflet .leaflet-control-zoom a:hover{background:var(--oxblood)}
.map__leaflet .leaflet-tooltip{background:var(--ink);color:#fff;border:1px solid var(--oxblood);
  font-family:"Montserrat",sans-serif;font-weight:700;font-size:12px;box-shadow:0 6px 18px rgba(0,0,0,.5)}
.map__leaflet .leaflet-tooltip-top::before{border-top-color:var(--oxblood)}
.map__leaflet .leaflet-bar{border:none}
.map__hint{margin-top:10px;font-size:var(--fs-12);color:#9a8f93}

/* ---------- why ---------- */
.why{background:var(--bg)}
.why__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px)}
.why__list{display:grid;gap:16px}
.why__item{display:flex;gap:14px;padding:18px 20px;border:1px solid var(--line);border-radius:var(--radius);
  background:#fff;transition:border-color var(--t)}
.why__item:hover{border-color:var(--oxblood)}
.why__num{flex:none;font-family:"Anton",sans-serif;color:var(--oxblood);font-size:1.5rem;width:38px;line-height:1.2}
.why__item h3{font-size:var(--fs-18);margin-bottom:3px;text-transform:none}
.why__item p{font-size:var(--fs-14);color:var(--muted)}
.why__aside{background:var(--ink);color:#fff;border-radius:var(--radius);padding:clamp(26px,4vw,40px);
  display:flex;flex-direction:column;justify-content:center;border-top:4px solid var(--oxblood)}
.why__aside .stars{font-size:1.4rem}
.why__aside blockquote{font-family:"Montserrat",sans-serif;font-weight:700;
  font-size:clamp(1.25rem,2.3vw,1.6rem);line-height:1.28;margin:14px 0 18px;color:#fff;letter-spacing:-.01em}
.why__aside cite{font-style:normal;color:#cdbcc1;font-size:var(--fs-14)}

/* ---------- service areas ---------- */
.areas{background:var(--ink);color:#fff}
.areas .sec-head h2{color:#fff}
.areas .eyebrow{color:#edb9c6}
.areas .lede{color:#c6bbbe}
.area-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.area{display:block;background:var(--ink-3);border:1px solid var(--line-dark);border-radius:var(--radius);
  padding:20px 22px;transition:transform var(--t) var(--ease-out),border-color var(--t),background var(--t)}
.area:hover{transform:translateY(-3px);border-color:var(--oxblood);background:#2c2024}
.area h3{color:#fff;font-size:var(--fs-21);text-transform:none}
.area p{color:#a99fa3;font-size:var(--fs-14);margin-top:4px}
.area__link{margin-top:10px;display:inline-flex;align-items:center;gap:6px;color:var(--brass);
  font-family:"Montserrat",sans-serif;font-size:var(--fs-12);font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.area__link svg{width:15px;height:15px}

/* ---------- CTA band ---------- */
.cta{background:linear-gradient(135deg,var(--oxblood),var(--oxblood-deep));color:#fff;text-align:center}
.cta h2{font-size:clamp(1.9rem,4vw,var(--fs-40));margin-bottom:.4em;color:#fff;text-transform:uppercase}
.cta p{max-width:54ch;margin:0 auto 28px;color:#f3dde3;font-size:var(--fs-18)}
.cta__actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ---------- quote form ---------- */
.quote{background:var(--surface)}
.quote__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,4vw,56px);align-items:start}
.quote__list{list-style:none;margin-top:20px;display:grid;gap:14px}
.quote__list li{display:flex;gap:12px;font-size:var(--fs-16)}
.quote__list svg{flex:none;width:22px;height:22px;stroke:var(--oxblood);fill:none;stroke-width:2}
.form{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:clamp(22px,3vw,32px);box-shadow:var(--shadow);border-top:4px solid var(--oxblood)}
.form .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field{margin-bottom:15px}
.field label{display:block;font-size:var(--fs-14);font-weight:600;margin-bottom:6px;color:var(--ink)}
.field .req{color:var(--oxblood)}
.field input,.field select,.field textarea{width:100%;min-height:48px;padding:12px 14px;
  border:1px solid #d9cfca;border-radius:var(--radius-sm);font:inherit;font-size:var(--fs-16);
  background:#fff;color:var(--text);transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--oxblood);
  box-shadow:0 0 0 3px rgba(122,20,48,.14)}
.form__hint{font-size:var(--fs-12);color:var(--muted);margin-top:10px;text-align:center}
.contact__btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.quote__list a{color:var(--oxblood);font-weight:600}

/* ---------- sub-hero (interior pages) ---------- */
.subhero{position:relative;background:linear-gradient(160deg,#2a1218 0%,#141013 60%,#0f0c0e 100%);color:#fff;overflow:hidden}
.subhero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(900px 420px at 85% 8%,rgba(122,20,48,.42),transparent 60%)}
.subhero .container{position:relative;padding-block:clamp(54px,9vw,92px)}
.subhero .eyebrow{color:#fff}
.subhero h1{font-size:clamp(2rem,5vw,3.3rem);text-transform:uppercase;color:#fff;margin:.45em 0 .4em;max-width:20ch}
.subhero p{color:#e7dce0;font-size:var(--fs-18);max-width:62ch}
.subhero__actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px}

/* ---------- services page: detailed cards ---------- */
.sd-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,2.5vw,28px)}
.sd-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;box-shadow:var(--shadow-sm);scroll-margin-top:100px;
  transition:transform .24s var(--ease-out),box-shadow .24s}
.sd-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.sd-card__media,.sd-card__media img,.sd-card__ph{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.sd-card__body{padding:24px 24px 26px;display:flex;flex-direction:column;gap:10px;flex:1}
.sd-card__body h2{font-size:var(--fs-21);text-transform:none}
.sd-card__body p{color:var(--muted);font-size:var(--fs-14);flex:1}
.sd-card__cta{margin-top:6px;display:inline-flex;align-items:center;gap:6px;font-family:"Montserrat",sans-serif;
  font-weight:700;font-size:var(--fs-12);text-transform:uppercase;letter-spacing:.04em;color:var(--oxblood)}
.sd-card__cta svg{width:16px;height:16px;transition:transform var(--t-fast)}
.sd-card:hover .sd-card__cta svg{transform:translateX(3px)}
@media(max-width:760px){.sd-grid{grid-template-columns:1fr}}

/* ---------- gallery + lightbox ---------- */
.gallery-grid{column-count:3;column-gap:16px}
.g-item{break-inside:avoid;margin:0 0 16px;border-radius:var(--radius);overflow:hidden;cursor:zoom-in;
  box-shadow:var(--shadow-sm)}
.g-item img{width:100%;height:auto;display:block;transition:transform .45s var(--ease-out)}
.g-item:hover img{transform:scale(1.05)}
@media(max-width:900px){.gallery-grid{column-count:2}}
@media(max-width:560px){.gallery-grid{column-count:1}}
.lb{position:fixed;inset:0;z-index:1000;background:rgba(12,8,9,.93);display:flex;align-items:center;
  justify-content:center;opacity:0;pointer-events:none;transition:opacity .25s var(--ease-out)}
.lb.open{opacity:1;pointer-events:auto}
.lb img{max-width:92vw;max-height:86vh;border-radius:8px;box-shadow:0 24px 70px rgba(0,0,0,.6)}
.lb button{position:absolute;background:rgba(255,255,255,.1);border:0;color:#fff;cursor:pointer;
  width:50px;height:50px;border-radius:50%;font-size:30px;line-height:1;display:flex;align-items:center;
  justify-content:center;transition:background var(--t-fast)}
.lb button:hover{background:var(--oxblood)}
.lb__close{top:20px;right:20px}
.lb__prev{left:16px;top:50%;transform:translateY(-50%)}
.lb__next{right:16px;top:50%;transform:translateY(-50%)}
@media(max-width:560px){.lb__prev{left:8px}.lb__next{right:8px}}

/* ---------- thank-you modal ---------- */
.modal{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;
  padding:24px;background:rgba(12,8,9,.6);backdrop-filter:blur(3px);opacity:0;pointer-events:none;
  transition:opacity .22s var(--ease-out)}
.modal[hidden]{display:none}
.modal.open{opacity:1;pointer-events:auto}
.modal__card{position:relative;background:#fff;border-radius:var(--radius);max-width:440px;width:100%;
  padding:40px 32px 34px;text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.4);
  transform:translateY(14px) scale(.97);transition:transform .26s var(--ease-out)}
.modal.open .modal__card{transform:none}
.modal__card h2{font-size:clamp(1.5rem,3vw,1.9rem);margin:0 0 .35em}
.modal__card p{color:var(--muted);font-size:var(--fs-16);margin:0 0 22px}
.modal__check{display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;
  border-radius:50%;background:var(--oxblood);margin:0 auto 18px}
.modal__check svg{width:34px;height:34px;fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.modal__close{position:absolute;top:12px;right:14px;background:none;border:0;cursor:pointer;
  font-size:28px;line-height:1;color:var(--muted);width:38px;height:38px;border-radius:50%;transition:color var(--t-fast),background var(--t-fast)}
.modal__close:hover{color:var(--ink);background:var(--surface)}
.modal__actions{display:flex;flex-direction:column;gap:10px;align-items:stretch}
.modal__actions .btn{justify-content:center}
.modal__actions [hidden]{display:none}
.btn.is-loading{opacity:.7;pointer-events:none}

/* ---------- service-area & city cards ---------- */
.area-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.area-card{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:24px;box-shadow:var(--shadow-sm);transition:transform .24s var(--ease-out),box-shadow .24s,border-color .24s}
.area-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--oxblood)}
.area-card h2{font-size:var(--fs-21);text-transform:none;margin-bottom:6px}
.area-card p{color:var(--muted);font-size:var(--fs-14)}
.area-card__link{margin-top:14px;display:inline-flex;align-items:center;gap:6px;color:var(--oxblood);
  font-family:"Montserrat",sans-serif;font-weight:700;font-size:var(--fs-12);text-transform:uppercase;letter-spacing:.04em}
.area-card__link svg{width:15px;height:15px;transition:transform var(--t-fast)}
.area-card:hover .area-card__link svg{transform:translateX(3px)}
.area-card--mini{padding:18px 22px}
.area-card--mini h2{margin:0;font-size:var(--fs-18)}
@media(max-width:760px){.area-cards{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.area-cards{grid-template-columns:1fr}}

/* ---------- FAQ ---------- */
.faq{background:var(--bg)}
.faq__list{max-width:840px;margin:0 auto;display:grid;gap:12px}
.faq__item{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:border-color var(--t)}
.faq__item[open]{border-color:var(--oxblood)}
.faq__item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:18px;
  padding:20px 22px;font-family:"Montserrat",sans-serif;font-weight:700;font-size:var(--fs-18);color:var(--ink);transition:color var(--t-fast)}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary:hover,.faq__item[open] summary{color:var(--oxblood)}
.faq__icon{flex:none;width:22px;height:22px;position:relative}
.faq__icon::before,.faq__icon::after{content:"";position:absolute;background:var(--oxblood);border-radius:2px}
.faq__icon::before{top:9.5px;left:2px;right:2px;height:3px}
.faq__icon::after{left:9.5px;top:2px;bottom:2px;width:3px;transition:transform .25s var(--ease-out)}
.faq__item[open] .faq__icon::after{transform:scaleY(0)}
.faq__a{padding:0 22px 20px}
.faq__a p{color:var(--muted);font-size:var(--fs-16);line-height:1.65;max-width:72ch}

/* ---------- legal pages ---------- */
.legalhead{background:linear-gradient(160deg,#2a1218,#141013);color:#fff;padding-block:clamp(46px,7vw,72px)}
.legalhead .eyebrow{color:#fff}
.legalhead h1{color:#fff;text-transform:uppercase;font-size:clamp(1.8rem,4vw,2.6rem);margin:.45em 0 .25em}
.legalhead p{color:#cbbfc3;font-size:var(--fs-14)}
.legal{max-width:820px}
.legal h2{font-size:var(--fs-21);color:var(--ink);margin:1.7em 0 .5em;text-transform:none}
.legal h2:first-child{margin-top:0}
.legal p{color:var(--text);line-height:1.75;margin-bottom:1em}
.legal a{color:var(--oxblood);font-weight:600}

/* ---------- footer ---------- */
.footer{background:#100b0d;color:#cabfc3}
.footer .container{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.1fr;gap:40px;padding-block:clamp(48px,6vw,72px) 28px}
.footer h4{color:#fff;font-family:"Montserrat",sans-serif;font-weight:700;font-size:var(--fs-14);
  letter-spacing:.1em;text-transform:uppercase;margin-bottom:16px}
.footer a,.footer p{color:#a89ca0;font-size:var(--fs-14);margin-bottom:9px;transition:color var(--t-fast)}
.footer a:hover{color:#fff}
.footer .f-brand img{height:64px;width:auto;margin-bottom:14px}
.footer .f-list{display:grid}
.footer__bottom{border-top:1px solid #2c2125}
.footer__bottom .container{display:flex;justify-content:space-between;align-items:center;gap:12px 20px;padding-block:18px;
  font-size:var(--fs-12);color:#7d7176;flex-wrap:wrap}
.footer__legal{display:flex;gap:16px;flex-wrap:wrap}
.footer__legal a{color:#a89ca0;margin:0;font-size:var(--fs-12)}
.footer__legal a:hover{color:#fff}

/* ---------- scroll reveal ---------- */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out)}
.reveal.in{opacity:1;transform:none}
[data-stagger]>*{opacity:0;transform:translateY(22px);transition:opacity .55s var(--ease-out),transform .55s var(--ease-out)}
[data-stagger].in>*{opacity:1;transform:none;transition-delay:calc(var(--i,0)*60ms)}

/* hero load animation */
@keyframes heroFade{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@keyframes vanIn{from{opacity:0;transform:translateX(70px)}to{opacity:1;transform:none}}
@keyframes statRise{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
.hero__eyebrow,.hero h1,.hero p.lead,.hero__actions,.hero__rating{animation:heroFade .6s var(--ease-out) both}
.hero h1{animation-delay:.08s}.hero p.lead{animation-delay:.16s}
.hero__actions{animation-delay:.24s}.hero__rating{animation-delay:.32s}
.hero__van img{animation:vanIn .9s var(--ease-out) both .2s}
.stat{animation:statRise .6s var(--ease-out) both}
.stat:nth-child(1){animation-delay:.40s}.stat:nth-child(2){animation-delay:.50s}
.stat:nth-child(3){animation-delay:.60s}.stat:nth-child(4){animation-delay:.70s}

/* ---------- responsive ---------- */
@media(max-width:1000px){
  .hero .container{grid-template-columns:1fr;text-align:center;min-height:0;
    padding-bottom:clamp(120px,22vw,170px)}
  .hero h1{max-width:none;margin-inline:auto}.hero p.lead{margin-inline:auto}
  .hero__actions,.hero__rating{justify-content:center}
  .hero__van{order:-1;max-width:480px;margin-inline:auto}
  .stats .container{grid-template-columns:1fr 1fr}
  .why__grid{grid-template-columns:1fr}
  .quote__grid{grid-template-columns:1fr}
  .read .container,.map .container{grid-template-columns:1fr}
  .read__media{max-width:560px;margin-inline:auto}
  .treview__track{grid-auto-columns:100%}
  .footer .container{grid-template-columns:1fr 1fr;gap:32px}
}
@media(max-width:760px){
  .deck,.area-grid{grid-template-columns:1fr 1fr}
  .nav-links,.nav-cta{display:none}
  /* keep the Write a Review CTA on mobile; hide the rest of the utility right side */
  .utility .u-right>a[href^="mailto"],.utility .u-right>span{display:none}
  .utility .u-left{gap:10px}
  .nav-toggle{display:inline-flex}
  .header[data-open] .nav-links{display:flex;position:absolute;top:80px;left:0;right:0;flex-direction:column;
    align-items:stretch;gap:0;background:var(--ink);padding:8px 0;border-top:1px solid var(--line-dark);
    box-shadow:0 12px 24px rgba(0,0,0,.4)}
  .header[data-open] .nav-links a{padding:14px clamp(20px,5vw,44px)}
}
@media(max-width:480px){
  .deck,.area-grid,.stats .container,.form .row{grid-template-columns:1fr}
  .footer .container{grid-template-columns:1fr}
  .footer__bottom .container{flex-direction:column;text-align:center}
}
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .reveal,[data-stagger]>*,.stat{opacity:1!important;transform:none!important}
}
