/* ==========================================================================
   Phoenix Affordable Moving — shared stylesheet (Direction B)
   One file for all 23 pages. No framework, no jQuery.
   ========================================================================== */

:root{
  --bg:#FFFFFF; --bg2:#F3F7F3; --ink:#111A15;
  --text:#13211A; --muted:#59695F;
  --green:#0A7A3A; --green-dk:#08652F; --green-soft:#E4F1E9; --green-lite:#4FD98A;
  --rule:rgba(19,33,26,.14); --rule-firm:rgba(19,33,26,.26);
  --mono:ui-monospace,"Cascadia Mono","Segoe UI Mono",Menlo,Consolas,monospace;
  --sans:"Segoe UI",-apple-system,BlinkMacSystemFont,system-ui,"Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;text-wrap:balance}
.shell{max-width:1180px;margin:0 auto;padding:0 28px}
:focus-visible{outline:2px solid var(--green);outline-offset:3px}

.label{font-family:var(--mono);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted)}
.btn{display:inline-block;text-align:center;font-size:14px;font-weight:650;
  padding:12px 18px;border-radius:7px;background:var(--green);color:#fff;
  white-space:nowrap;border:none;cursor:pointer;font-family:var(--sans)}
.btn:hover{background:var(--green-dk)}
.btn.ghost{background:transparent;color:var(--text);border:1.5px solid var(--rule-firm)}
.btn.onDark{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.55)}
.btn.onDark:hover{background:rgba(255,255,255,.12)}
.btn.block{display:block;width:100%}

/* ---------- header ---------- */
header{border-bottom:1px solid var(--rule);position:sticky;top:0;background:var(--bg);z-index:20}
/* Same trap as .pageheadWrap: this element also carries .shell, and the .shell
   rule inside the mobile media query sets the `padding` SHORTHAND later in this
   file. A shorthand beats an earlier longhand, so at <=960px the header padding
   collapsed to zero and the logo sat flush against the top of a 34px bar.
   Two-class selector wins independently of source order. */
header .nav{display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding-top:20px;padding-bottom:20px}
header .nav .logo img{width:152px}
.nav nav{display:flex;gap:22px;font-size:14px;color:var(--muted)}
.nav nav a.on{color:var(--text);font-weight:600}
.nav nav a:hover{color:var(--green)}
.navcta{display:flex;align-items:center;gap:14px}
.tel{font-family:var(--mono);font-size:16px;font-weight:700;letter-spacing:-.01em}
.burger{display:none;flex-direction:column;gap:4px;background:none;border:none;padding:8px;
  cursor:pointer}
.burger i{display:block;width:22px;height:2px;background:var(--text);border-radius:1px}
/* mobile drawer */
.drawer{display:none;border-top:1px solid var(--rule);background:var(--bg);padding:8px 0 14px}
.drawer.open{display:block}
.drawer a{display:block;padding:12px 28px;font-size:15px;font-weight:600;
  border-bottom:1px solid var(--rule)}
.drawer a:last-child{border-bottom:none}

/* ---------- home hero ---------- */
.hero{position:relative;isolation:isolate;min-height:560px;display:flex;align-items:center}
.hero>img{position:absolute;inset:0;z-index:0;width:100%;height:100%;
  object-fit:cover;object-position:center 44%}
.hero::after{content:"";position:absolute;inset:0;z-index:1;background:
  linear-gradient(180deg,rgba(9,15,11,.62) 0%,rgba(9,15,11,.52) 42%,rgba(9,15,11,.78) 100%)}
.heroWrap{position:relative;z-index:2;width:100%;padding:72px 0}
.heroCopy{max-width:40rem}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:#8FE3B0;font-weight:600}
.heroCopy h1{margin:16px 0 0;font-size:clamp(2.1rem,4.6vw,3.5rem);line-height:1.04;
  letter-spacing:-.034em;font-weight:760;color:#fff}
.heroCopy h1 .alt{color:var(--green-lite);display:block}
.heroCopy p{margin:18px 0 0;font-size:17px;line-height:1.55;color:#D3E0D8;max-width:40ch}
.heroBtns{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap;align-items:center}
.heroBtns .btn{font-size:16px;padding:16px 30px}
.rating{display:flex;align-items:center;gap:13px;margin-top:30px;flex-wrap:wrap}
.stars{display:flex;gap:3px}
.stars svg{width:22px;height:22px;fill:var(--green-lite)}
.rating .txt{font-size:15.5px;color:#fff;font-weight:600}
.rating .pending{font-family:var(--mono);font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:#F0C36B;border:1px solid rgba(240,195,107,.5);
  padding:3px 8px;border-radius:3px}
/* No separator glyphs at all. Typed &middot; spans dangle at the END of a wrapped
   line; a ::before separator dangles at the START of the next one. Neither
   survives wrapping, so spacing carries the separation instead. */
.heroTrust{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:26px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.09em;
  text-transform:uppercase;color:#9FBAA9}

/* ---------- interior page hero ---------- */
.pagehead{position:relative;isolation:isolate;background:var(--ink)}
.pagehead>img{position:absolute;inset:0;z-index:0;width:100%;height:100%;
  object-fit:cover;object-position:center 45%;opacity:.42}
.pagehead::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(9,15,11,.72) 0%,rgba(9,15,11,.86) 100%)}
/* Two-class selector on purpose. This element also carries .shell, and the
   .shell rule inside the mobile media query sets the `padding` SHORTHAND later
   in this file — a shorthand beats an earlier longhand regardless of which
   properties it names, so `padding-top` here still lost and the breadcrumb sat
   flush against the sticky header at <=960px. Raising specificity to 0,2,0
   wins independently of source order. */
.pagehead .pageheadWrap{position:relative;z-index:2;padding-top:60px;padding-bottom:52px}
.crumb{font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;
  text-transform:uppercase;color:#8FA697;display:flex;gap:8px;flex-wrap:wrap}
.crumb a:hover{color:var(--green-lite)}
.pagehead h1{margin:14px 0 0;font-size:clamp(1.9rem,4vw,3rem);line-height:1.06;
  letter-spacing:-.032em;font-weight:760;color:#fff}
.pagehead .sub{margin:14px 0 0;font-size:16.5px;line-height:1.55;color:#C6D6CC;max-width:58ch}
.pageheadCta{display:flex;gap:11px;margin-top:26px;flex-wrap:wrap}

/* ---------- article / prose ---------- */
.article{padding:64px 0 72px}
.articleGrid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:52px;align-items:start}
.prose{max-width:70ch;min-width:0}
.prose h2{margin:0 0 18px;font-size:clamp(1.5rem,2.8vw,2.1rem);font-weight:740;
  letter-spacing:-.026em;line-height:1.14}
.prose h3{margin:38px 0 12px;font-size:1.28rem;font-weight:700;letter-spacing:-.018em}
.prose h4{margin:30px 0 10px;font-size:1.06rem;font-weight:700}
.prose p{margin:0 0 17px;font-size:16.5px;line-height:1.72;color:#33443A}
.prose a{color:var(--green);font-weight:600}
.prose a:hover{text-decoration:underline}
.prose strong{color:var(--text);font-weight:700}
.prose ul,.prose ol{margin:0 0 20px;padding-left:22px}
.prose li{margin:8px 0;font-size:16.5px;line-height:1.68;color:#33443A}
.prose hr{border:none;border-top:1px solid var(--rule);margin:34px 0}
.prose img{border-radius:8px;margin:24px 0;border:1px solid var(--rule)}
.prose > :first-child{margin-top:0}
/* first paragraph reads as a standfirst */
.prose > p:first-of-type{font-size:18px;line-height:1.66;color:#2A3B31}

.figrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;
  margin:26px 0}
.figrow img{margin:0;width:100%;height:170px;object-fit:cover}

/* ---------- sidebar ---------- */
.aside{position:sticky;top:88px;display:flex;flex-direction:column;gap:18px}
.asideCard{border:1px solid var(--rule);border-radius:10px;padding:22px;background:var(--bg)}
.asideCard.accent{background:var(--ink);border-color:transparent;color:#D5E3DA}
.asideCard h3{font-size:16px;font-weight:720;letter-spacing:-.014em;margin:0 0 8px}
.asideCard.accent h3{color:#fff}
.asideCard p{margin:0 0 14px;font-size:13.5px;line-height:1.6;color:var(--muted)}
.asideCard.accent p{color:#9FB4A7}
.asideCard .tel{display:block;font-size:22px;font-weight:800;margin-bottom:12px;color:#fff}
.asideList{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.asideList a{display:block;padding:9px 0;font-size:14px;border-bottom:1px solid var(--rule)}
.asideList a:hover{color:var(--green)}
.asideList li:last-child a{border-bottom:none}

/* ---------- generic bands (home) ---------- */
.band{padding:78px 0;border-bottom:1px solid var(--rule)}
.band.alt{background:var(--bg2)}
.band.dark{background:var(--ink);border-bottom:none;color:#DCE7E0}
.band.dark .bandhead h2{color:#fff}
.band.dark .bandhead p{color:#9FB4A7}
.band.dark .label{color:#7BD09A}
.bandhead{max-width:60ch;margin-bottom:40px}
.bandhead h2{margin:10px 0 0;font-size:clamp(1.7rem,3.4vw,2.7rem);
  letter-spacing:-.032em;font-weight:760;line-height:1.08}
.bandhead p{margin:14px 0 0;font-size:16px;color:var(--muted);line-height:1.62}

.svc{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.svcCard{background:var(--bg);border:1px solid var(--rule);border-top:3px solid var(--green);
  border-radius:10px;padding:28px 24px;display:flex;flex-direction:column;gap:13px}
.band.dark .svcCard{background:#18231D;border-color:rgba(255,255,255,.13);
  border-top-color:var(--green-lite)}
.band.dark .svcCard h3{color:#fff}
.band.dark .svcCard p{color:#9FB4A7}
.band.dark .more{color:var(--green-lite)}
/* reassembly_icon_*.png are WHITE line art — no filter on dark, invert on light */
.svcCard img{width:44px;height:44px;object-fit:contain}
.band:not(.dark) .svcCard img{filter:invert(1)}
.svcCard h3{font-size:19px;font-weight:720;letter-spacing:-.018em}
.svcCard p{margin:0;font-size:14px;line-height:1.58;color:var(--muted);flex:1}
.more{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--green);font-weight:600}

.duo{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.duoCard{border:1px solid var(--rule);border-radius:10px;overflow:hidden;
  background:var(--bg);display:flex;flex-direction:column}
.duoCard img{width:100%;height:190px;object-fit:cover}
.duoBody{padding:21px 22px;display:flex;flex-direction:column;gap:10px;flex:1}
.duoBody h3{font-size:17px;font-weight:700;letter-spacing:-.016em}
.duoBody p{margin:0;font-size:13.5px;line-height:1.6;color:var(--muted);flex:1}

.creds{background:var(--ink);color:#CFDDD4;padding:26px 0}
.credsGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.cred b{display:block;font-size:22px;font-weight:740;color:#fff;letter-spacing:-.02em}
.cred span{font-family:var(--mono);font-size:10px;letter-spacing:.13em;
  text-transform:uppercase;color:#8FA697}

.quoteBand{background:var(--bg2);border-bottom:1px solid var(--rule);padding:44px 0}
.quoteGrid{display:grid;grid-template-columns:.85fr 1.15fr;gap:36px;align-items:center}
.quoteGrid h2{font-size:clamp(1.3rem,2.4vw,1.8rem);letter-spacing:-.026em;
  font-weight:700;line-height:1.16}
.quoteGrid .sub{margin:11px 0 0;font-size:14.5px;color:var(--muted);line-height:1.6}
.qcard{background:var(--bg);border:1px solid var(--rule);border-radius:11px;padding:22px;
  box-shadow:0 14px 34px rgba(17,26,21,.10);display:flex;flex-direction:column;gap:12px}
.qcard h2,.qcard h3{font-size:16px;font-weight:690;letter-spacing:-.012em}
.tiny{font-family:var(--mono);font-size:10px;color:var(--muted);letter-spacing:.05em;margin:0}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.field{display:flex;flex-direction:column;gap:5px}
.flabel{font-family:var(--mono);font-size:10px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--muted)}
.field input{border:1.5px solid var(--rule-firm);border-radius:6px;padding:11px;
  font-size:14px;font-family:var(--mono);background:var(--bg);color:var(--text);width:100%}
.field input:focus{border-color:var(--green);outline:none}
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.tile{border:1.5px solid var(--rule-firm);border-radius:6px;padding:10px 4px;font-size:12px;
  font-weight:640;text-align:center;background:none;color:var(--text);cursor:pointer;
  font-family:var(--sans)}
.tile[aria-pressed="true"]{border-color:var(--green);background:var(--green-soft);
  color:var(--green-dk)}

.areas{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.area{font-size:13px;padding:8px 13px;border-radius:20px;background:var(--bg);
  border:1px solid var(--rule)}
.area.key{border-color:var(--green);color:var(--green-dk);font-weight:640}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:36px}
.stat b{display:block;font-family:var(--mono);font-size:26px;letter-spacing:-.025em}

.revHead{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:8px}
.revHead .stars svg{width:26px;height:26px;fill:var(--green)}
.revScore{font-size:26px;font-weight:760;letter-spacing:-.02em}
.revGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:32px}
.revCard{border:1px solid var(--rule);border-radius:10px;padding:22px;background:var(--bg);
  display:flex;min-height:150px}
.revCard .ph{border:1px dashed var(--rule-firm);border-radius:6px;flex:1;display:flex;
  align-items:center;justify-content:center;text-align:center;padding:16px;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);line-height:1.7}

/* ---------- closing CTA ---------- */
.endCta{background:var(--green);color:#fff;padding:56px 0;text-align:center}
.endCta h2{font-size:clamp(1.5rem,3vw,2.2rem);font-weight:780;letter-spacing:-.03em;
  line-height:1.12;max-width:22ch;margin:0 auto}
.endCta p{margin:14px auto 0;max-width:52ch;font-size:16px;color:#D6EFE0;line-height:1.55}
.endCta .btn{background:#fff;color:var(--green);margin-top:26px;font-size:15px;padding:15px 28px}
.endCta .btn:hover{background:#E4F3EA}
.endCta .tel2{display:block;margin-top:16px;font-size:14.5px;color:#C2E6D3;font-weight:600}

/* ---------- footer ---------- */
footer{background:var(--ink);color:#B4C6BA;padding:52px 0 26px}
footer .flogo{width:158px;margin-bottom:16px}
.fgridw{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:30px}
footer h4{margin:0 0 12px;font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:#7BD09A;font-weight:600}
footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
footer li{font-size:13px}
footer li a:hover{color:#fff}
.fbrand{font-size:13px;line-height:1.62;color:#93A89A;max-width:30ch;margin:0}
.fbar{margin-top:30px;padding-top:16px;border-top:1px solid rgba(255,255,255,.12);
  font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;color:#7A8C81;
  display:flex;flex-wrap:wrap;gap:8px 24px}

/* ---------- sticky mobile bar ---------- */
.mobar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--bg);
  border-top:1px solid var(--rule);padding:10px 14px;gap:10px;
  box-shadow:0 -6px 20px rgba(17,26,21,.10)}
.mobar .btn{flex:1;padding:13px 8px;font-size:14px}

/* ---------- responsive ---------- */
@media (max-width:960px){
  .shell{padding:0 20px}
  header .nav{padding-top:16px;padding-bottom:16px}
  header .nav .logo img{width:146px}
  .nav nav,.nav .tel,.nav .btn{display:none}
  .burger{display:flex}
  .hero{min-height:440px}
  .hero::after{background:linear-gradient(180deg,rgba(9,15,11,.58) 0%,
    rgba(9,15,11,.55) 40%,rgba(9,15,11,.82) 100%)}
  .heroWrap{padding:46px 0}
  .heroBtns .btn{flex:1;min-width:150px}
  .articleGrid{grid-template-columns:1fr;gap:38px}
  .aside{position:static}
  .svc,.duo,.revGrid,.quoteGrid{grid-template-columns:1fr}
  .credsGrid,.stats{grid-template-columns:1fr 1fr}
  .fgridw{grid-template-columns:1fr 1fr}
  .band{padding:52px 0}
  .article{padding:44px 0 52px}
  body{padding-bottom:70px}
  .mobar{display:flex}
}
@media (max-width:560px){
  .fgridw{grid-template-columns:1fr}
  /* keep these two-up — one per row turns a compact strip into a whole screen */
  .stats,.credsGrid{grid-template-columns:1fr 1fr}
  .tiles{grid-template-columns:1fr 1fr}
  .prose > p:first-of-type{font-size:17px}
}

/* ---------- testimonials (lifted out of the old jQuery carousel) ---------- */
.quotes{margin-top:46px;padding-top:34px;border-top:1px solid var(--rule)}
.quotes h2{margin:0 0 22px;font-size:1.4rem;font-weight:740;letter-spacing:-.022em}
.quote{margin:0 0 18px;padding:22px 24px;background:var(--bg2);
  border-left:3px solid var(--green);border-radius:0 8px 8px 0}
.quote blockquote{margin:0;font-size:15.5px;line-height:1.66;color:#33443A}
.quote blockquote::before{content:"\201C"}
.quote blockquote::after{content:"\201D"}
.quote figcaption{margin-top:11px;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.11em;text-transform:uppercase;color:var(--muted)}

/* ==========================================================================
   Page sections added in the structure rebuild
   ========================================================================== */

/* ---------- numbered process ---------- */
.process{margin-top:44px;padding-top:34px;border-top:1px solid var(--rule)}
.process h2{margin:0 0 6px;font-size:1.5rem;font-weight:740;letter-spacing:-.024em}
.process .intro{margin:0 0 24px;font-size:15.5px;color:var(--muted);max-width:60ch}
.pstep{display:grid;grid-template-columns:40px 1fr;gap:16px;padding:17px 0;
  border-bottom:1px solid var(--rule)}
.pstep:last-child{border-bottom:none}
.pnum{width:34px;height:34px;border-radius:50%;background:var(--green);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex:none}
.pstep h3{margin:0 0 4px;font-size:16px;font-weight:700;letter-spacing:-.012em}
.pstep p{margin:0;font-size:14.5px;line-height:1.62;color:var(--muted)}

/* ---------- inline FAQs ---------- */
.faqs{margin-top:44px;padding-top:34px;border-top:1px solid var(--rule)}
.faqs h2{margin:0 0 18px;font-size:1.5rem;font-weight:740;letter-spacing:-.024em}
.faqItem{border-bottom:1px solid var(--rule)}
.faqItem:first-of-type{border-top:1px solid var(--rule)}
.faqQ{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;
  font-size:15.5px;font-weight:660;cursor:pointer;list-style:none}
.faqQ::-webkit-details-marker{display:none}
.faqQ .pm{font-family:var(--mono);color:var(--green);font-size:18px;flex:none;
  transition:transform .18s ease}
details[open] .faqQ .pm{transform:rotate(45deg)}
.faqA{padding:0 0 18px;font-size:15px;line-height:1.68;color:var(--muted);max-width:66ch}

/* ---------- where we work ---------- */
.where{margin-top:44px;padding-top:34px;border-top:1px solid var(--rule)}
.where h2{margin:0 0 14px;font-size:1.5rem;font-weight:740;letter-spacing:-.024em}
.where p{margin:0 0 16px;font-size:15.5px;color:var(--muted);max-width:60ch}
.whereGrid{display:flex;flex-wrap:wrap;gap:8px}
.whereGrid a,.whereGrid span{font-size:13.5px;padding:9px 14px;border-radius:20px;
  border:1px solid var(--rule);background:var(--bg)}
/* Every chip here is a city we serve. Whether it is an <a> or a <span> only
   reflects if that city has its own page yet, which must not be readable as
   a service-area limit. Identical styling; links show themselves on hover. */
.whereGrid a{color:var(--text);font-weight:400}
.whereGrid a:hover{border-color:var(--green);color:var(--green);background:var(--green-soft)}
.whereGrid a:focus-visible{border-color:var(--green);color:var(--green)}

/* ---------- what's included ---------- */
.incl{margin-top:44px;padding-top:34px;border-top:1px solid var(--rule)}
.incl h2{margin:0 0 18px;font-size:1.5rem;font-weight:740;letter-spacing:-.024em}
.inclGrid{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.inclCol h3{margin:0 0 10px;font-size:14px;font-weight:700;letter-spacing:.03em}
.inclCol ul{list-style:none;margin:0;padding:0}
.inclCol li{position:relative;padding:7px 0 7px 24px;font-size:14.5px;line-height:1.55;
  color:var(--muted);border-bottom:1px dashed var(--rule)}
.inclCol li:last-child{border-bottom:none}
.inclCol li::before{position:absolute;left:0;top:7px;font-weight:700}
.inclCol.yes li::before{content:"\2713";color:var(--green)}
.inclCol.no li::before{content:"\2013";color:var(--muted)}

/* ---------- why-us cards ---------- */
.whyGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.whyCard{border:1px solid var(--rule);border-top:3px solid var(--green);border-radius:10px;
  padding:24px 22px;background:var(--bg)}
.whyCard h3{margin:0 0 8px;font-size:16.5px;font-weight:720;letter-spacing:-.014em}
.whyCard p{margin:0;font-size:14px;line-height:1.6;color:var(--muted)}

@media (max-width:700px){
  .inclGrid{grid-template-columns:1fr;gap:18px}
  .pstep{grid-template-columns:32px 1fr;gap:12px}
  .pnum{width:30px;height:30px;font-size:13px}
}

/* ---------- in-article figure ---------- */
.figure{margin:30px 0 26px;padding:0}
.figure img{width:100%;height:auto;border-radius:10px;border:1px solid var(--rule);
  display:block;background:var(--bg2)}
.figure figcaption{margin-top:10px;font-family:var(--mono);font-size:11px;
  letter-spacing:.08em;color:var(--muted);line-height:1.55}

/* ---------- service area tiers ---------- */
.areaSub{margin:30px 0 10px;font-size:1.1rem;font-weight:720;letter-spacing:-.014em}
.whereGrid .here{border-color:var(--rule-firm);color:var(--muted);font-weight:640}
.whereGrid.muted a,.whereGrid.muted span{font-size:13px;color:var(--muted);
  background:var(--bg2);border-color:transparent}
.areaNote{margin:14px 0 0;font-size:15px;line-height:1.62;color:var(--muted);max-width:62ch}

/* ---------- contact page ---------- */
.hours{display:flex;flex-direction:column;gap:0;max-width:44ch}
.hrow{display:flex;justify-content:space-between;align-items:baseline;gap:20px;
  padding:12px 0;border-bottom:1px solid var(--rule)}
.hrow:last-child{border-bottom:none}
.hrow span{font-size:15px;color:var(--muted)}
.hrow b{font-family:var(--mono);font-size:15px;font-weight:700;font-variant-numeric:tabular-nums}
.officeGrid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.office{border:1px solid var(--rule);border-left:3px solid var(--green);border-radius:8px;
  padding:20px 22px;background:var(--bg)}
.office h3{margin:0 0 6px;font-size:15px;font-weight:720;letter-spacing:-.012em}
.office p{margin:0;font-size:14.5px;line-height:1.6;color:var(--muted)}
.prose textarea{border:1.5px solid var(--rule-firm);border-radius:6px;padding:11px;
  font-size:14px;font-family:var(--sans);background:var(--bg);color:var(--text);
  width:100%;resize:vertical}
.prose textarea:focus{border-color:var(--green);outline:none}
@media (max-width:700px){ .officeGrid{grid-template-columns:1fr} }

/* ---------- service package cards ---------- */
.pkgGrid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:30px 0}
.pkg{border:1px solid var(--rule);border-top:3px solid var(--green);border-radius:10px;
  padding:22px;background:var(--bg);display:flex;flex-direction:column;gap:9px}
.pkg h3{margin:0;font-size:16.5px;font-weight:720;letter-spacing:-.014em}
.pkg p{margin:0;font-size:14px;line-height:1.58;color:var(--muted);flex:1}
.pkg .more{margin-top:4px}
@media (max-width:700px){ .pkgGrid{grid-template-columns:1fr} }

/* ---------- Google reviews ---------- */
.reviews{margin-top:44px;padding-top:34px;border-top:1px solid var(--rule)}
.reviews h2{margin:0 0 8px;font-size:1.5rem;font-weight:740;letter-spacing:-.024em}
.rintro{margin:0 0 24px;font-size:15.5px;color:var(--muted);max-width:60ch}
.gGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.gcard{margin:0;border:1px solid var(--rule);border-radius:10px;padding:22px;
  background:var(--bg);display:flex;flex-direction:column;gap:12px}
.gcard.featured{border-color:var(--green);border-top:3px solid var(--green);
  grid-column:1/-1;background:var(--green-soft)}
.band.alt .gcard{background:var(--bg)}
.band.alt .gcard.featured{background:var(--bg)}
.ghead{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap}
.gwho{display:flex;flex-direction:column;gap:2px;min-width:0}
.gwho b{font-size:15px;font-weight:700;letter-spacing:-.012em}
.gmeta{font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:var(--muted)}
.gstars{display:flex;gap:2px;flex:none}
.gstars svg{width:16px;height:16px;fill:#E8A33D}
.gcard blockquote{margin:0;font-size:15px;line-height:1.68;color:#33443A}
.gsvc{margin:0;font-family:var(--mono);font-size:10px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted)}
.rnote{margin:18px 0 0;font-family:var(--mono);font-size:10.5px;letter-spacing:.07em;
  color:var(--muted)}
@media (max-width:700px){ .gcard.featured{grid-column:auto} }
/* honeypot — off-screen rather than display:none, which some bots detect */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.formError{margin:0 0 14px;padding:11px 13px;border-radius:7px;font-size:14px;
  background:rgba(200,127,30,.10);border:1px solid rgba(200,127,30,.4);color:#8A5410}