/* ============================================================================
   Prestige Mobile Paintworks — shared stylesheet for the paid-search
   landing pages.

   Everything above "LANDING COMPONENTS" mirrors index.html so the landing
   pages sit inside the same design system (same tokens, same nav, same
   footer, same buttons). Everything below it is new: the landing pages share
   the homepage's colours and typography but deliberately do NOT share its
   layout, so an ad visitor never lands on something that reads as a
   duplicate of the homepage.
   ========================================================================== */

:root{
  --ink:#101314;
  --ink-soft:#1a1e20;
  --ink-lift:#22262a;
  --paper:#f5f2ec;
  --paper-dim:#e7e1d5;
  --oxblood:#8c1f2f;
  --oxblood-bright:#b23a4e;
  --pewter:#b7bcc2;
  --graphite:#4b4f54;
  --whatsapp:#25d366;
  --whatsapp-dark:#1da851;
  --header-h:44px;
  --nav-h:76px;
  --hair:rgba(183,188,194,0.15);
  --hair-strong:rgba(183,188,194,0.28);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{
  font-family:'Big Shoulders Display',sans-serif;
  text-transform:uppercase;
  letter-spacing:0.01em;
  margin:0;
  line-height:0.95;
}
p{margin:0;}
a{color:inherit;text-decoration:none;}
img,svg{display:block;max-width:100%;}
ul{margin:0;padding:0;list-style:none;}
.mono{font-family:'Space Mono',monospace;}
.wrap{max-width:1140px;margin:0 auto;padding:0 24px;}
section{scroll-margin-top:calc(var(--header-h) + var(--nav-h) + 16px);}
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* ---------- WhatsApp top banner ---------- */
.wa-banner{
  position:sticky;top:0;z-index:60;
  height:var(--header-h);
  background:var(--whatsapp);
  color:#08210f;
}
.wa-banner a{
  display:flex;align-items:center;justify-content:center;gap:8px;
  height:100%;width:100%;
  font-weight:700;font-size:13.5px;letter-spacing:0.02em;
}
.wa-banner svg{width:16px;height:16px;flex:none;}
.wa-banner:hover{background:var(--whatsapp-dark);}
.wa-banner span.num{font-family:'Space Mono',monospace;font-weight:700;}

/* ---------- Nav ---------- */
header.site-nav{
  position:sticky;top:var(--header-h);z-index:55;
  height:var(--nav-h);
  background:var(--ink);
  border-bottom:1px solid var(--hair);
}
.nav-row{
  height:100%;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.logo{display:flex;flex-direction:column;line-height:1;color:var(--paper);}
.logo .name{
  font-family:'Big Shoulders Display',sans-serif;
  font-weight:800;font-size:22px;letter-spacing:0.01em;text-transform:uppercase;
}
.logo .tag{
  font-family:'Space Mono',monospace;
  font-size:9.5px;letter-spacing:0.14em;color:var(--pewter);
  text-transform:uppercase;margin-top:3px;
}
.logo .name .accent{color:var(--oxblood-bright);}
.nav-links{display:flex;align-items:center;gap:28px;}
.nav-links a{
  color:var(--pewter);font-size:14px;font-weight:500;
  white-space:nowrap;
  transition:color .15s ease;
}
/* Six items is all the header holds. Between the 980px cut-off and the point
 * the wrap stops growing, tighten the gap so nothing wraps onto a second line
 * and blows the fixed nav height. */
@media (max-width:1120px){
  .nav-links{gap:16px;}
}
.nav-links a:hover{color:var(--paper);}

/* nav-dropdown:start — generated from tools/site-nav.mjs, do not edit by hand */
/* Services dropdown. The item is full header height so the panel hangs off the
 * header's bottom edge with no un-hoverable gap between the two. */
.nav-item{position:relative;height:100%;display:flex;align-items:center;}
.nav-trigger{
  display:inline-flex;align-items:center;gap:6px;
  margin:0;padding:0;border:0;background:none;cursor:pointer;
  font-family:inherit;font-size:14px;font-weight:500;
  color:var(--pewter);
  transition:color .15s ease;
}
.nav-item:hover .nav-trigger,
.nav-item.is-open .nav-trigger,
.nav-trigger:focus-visible{color:var(--paper);}
.nav-caret{width:12px;height:12px;flex:none;transition:transform .15s ease;}
.nav-item:hover .nav-caret,
.nav-item.is-open .nav-caret{transform:rotate(180deg);}
.nav-menu{
  position:absolute;top:100%;left:-16px;z-index:60;
  min-width:220px;
  display:flex;flex-direction:column;
  padding:8px 0;
  background:var(--ink-soft,#1a1e20);
  border:1px solid var(--hair-strong,rgba(183,188,194,0.28));
  border-top:0;
  box-shadow:0 20px 44px rgba(0,0,0,0.45);
  opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .15s ease,transform .15s ease,visibility .15s ease;
}
.nav-item:hover .nav-menu,
.nav-item.is-open .nav-menu,
.nav-item:not(.js-menu):focus-within .nav-menu{
  opacity:1;visibility:visible;transform:none;
}
.nav-menu a{
  padding:10px 18px;
  font-size:13.5px;line-height:1.35;white-space:nowrap;
}
.nav-menu a:hover{background:var(--ink-lift,#22262a);color:var(--paper);}
/* nav-dropdown:end */

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 22px;
  font-family:'Inter',sans-serif;font-weight:700;font-size:14px;
  border-radius:3px;
  cursor:pointer;border:1px solid transparent;
  transition:transform .15s ease, background .15s ease, border-color .15s ease;
  white-space:nowrap;
}
.btn:active{transform:translateY(1px);}
.btn:focus-visible{outline:2px solid var(--oxblood-bright);outline-offset:2px;}
.btn-primary{background:var(--oxblood);color:#fbeceb;}
.btn-primary:hover{background:var(--oxblood-bright);}
.btn-ghost{background:transparent;color:var(--paper);border-color:rgba(245,242,236,0.3);}
.btn-ghost:hover{border-color:var(--paper);}
.btn-wa{background:var(--whatsapp);color:#08210f;}
.btn-wa:hover{background:var(--whatsapp-dark);}
.btn-sm{padding:9px 16px;font-size:13px;}
.btn-block{width:100%;}
.btn svg{width:16px;height:16px;flex:none;}

/* ============================================================================
   LANDING COMPONENTS — new to these pages
   ========================================================================== */

/* ---------- Breadcrumb ---------- */
.crumbs{
  background:var(--ink);
  border-bottom:1px solid var(--hair);
  padding:12px 0;
}
.crumbs ol{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  margin:0;padding:0;list-style:none;
  font-family:'Space Mono',monospace;
  font-size:11px;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--pewter);
}
.crumbs a{color:var(--pewter);border-bottom:1px solid transparent;}
.crumbs a:hover{color:var(--paper);border-bottom-color:var(--oxblood-bright);}
.crumbs li[aria-current]{color:var(--paper);}
.crumbs .sep{color:var(--graphite);}

/* ---------- Hero: asymmetric split, form on the right ---------- */
.lp-hero{
  position:relative;
  background:var(--ink);
  color:var(--paper);
  padding:60px 0 72px;
  overflow:hidden;
}
/* atmosphere: off-centre oxblood bloom + fine diagonal tooling lines */
.lp-hero::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(120% 90% at 78% 8%, rgba(140,31,47,0.34), transparent 60%),
    radial-gradient(70% 60% at 4% 96%, rgba(183,188,194,0.09), transparent 70%);
  pointer-events:none;
}
.lp-hero::after{
  content:"";position:absolute;inset:0;
  background-image:repeating-linear-gradient(
    115deg,
    rgba(245,242,236,0.035) 0 1px,
    transparent 1px 9px
  );
  pointer-events:none;
}
.lp-hero .wrap{
  position:relative;z-index:2;
  display:grid;grid-template-columns:1.06fr 0.94fr;gap:52px;align-items:start;
}
.eyebrow-chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 12px;
  border:1px solid var(--hair-strong);
  border-radius:3px;
  background:rgba(16,19,20,0.5);
  font-family:'Space Mono',monospace;
  font-size:11px;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--pewter);
  margin-bottom:20px;
}
.eyebrow-chip .dot{
  width:6px;height:6px;border-radius:50%;background:var(--whatsapp);flex:none;
  box-shadow:0 0 0 0 rgba(37,211,102,.6);
  animation:pulse 2.4s infinite;
}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(37,211,102,.55);}
  70%{box-shadow:0 0 0 7px rgba(37,211,102,0);}
  100%{box-shadow:0 0 0 0 rgba(37,211,102,0);}
}
.lp-hero h1{
  font-size:clamp(36px,4.9vw,58px);
  font-weight:800;color:var(--paper);
}
.lp-hero h1 .accent{color:var(--oxblood-bright);}
.lp-hero .sub{
  margin-top:20px;
  font-size:16.5px;line-height:1.62;color:var(--pewter);
  max-width:50ch;
}
.lp-hero .sub strong{color:var(--paper);font-weight:600;}

/* keyline stat row — replaces the homepage's single microcopy line */
.hero-stats{
  margin-top:30px;
  display:grid;grid-template-columns:repeat(3,auto);gap:0;
  justify-content:start;
  border-top:1px solid var(--hair-strong);
  padding-top:20px;
}
.hero-stats div{padding-right:30px;margin-right:30px;border-right:1px solid var(--hair);}
.hero-stats div:last-child{border-right:0;padding-right:0;margin-right:0;}
.hero-stats b{
  display:block;
  font-family:'Big Shoulders Display',sans-serif;
  font-size:27px;font-weight:800;color:var(--paper);line-height:1;
}
.hero-stats span{
  display:block;margin-top:6px;
  font-family:'Space Mono',monospace;
  font-size:10.5px;letter-spacing:0.09em;text-transform:uppercase;color:var(--pewter);
}
.hero-cta-row{margin-top:28px;display:flex;gap:12px;flex-wrap:wrap;}

/* ---------- Estimate form card (in-hero) ---------- */
.estimate-card{
  background:var(--paper);
  color:var(--ink);
  border-radius:8px;
  box-shadow:0 24px 60px rgba(0,0,0,0.42);
  overflow:hidden;
}
.estimate-card .ec-head{
  background:var(--ink-soft);
  color:var(--paper);
  padding:18px 26px;
  border-bottom:2px solid var(--oxblood);
}
.estimate-card .ec-head h2{
  font-size:24px;font-weight:800;color:var(--paper);
}
.estimate-card .ec-head p{
  margin-top:6px;
  font-family:'Space Mono',monospace;
  font-size:10.5px;letter-spacing:0.08em;text-transform:uppercase;color:var(--pewter);
}
.estimate-card form{padding:24px 26px 26px;}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.field{display:flex;flex-direction:column;gap:6px;}
.field.full{grid-column:1 / -1;}
label{
  font-size:11.5px;font-weight:600;letter-spacing:0.04em;text-transform:uppercase;
  color:var(--graphite);
}
label .opt{text-transform:none;font-weight:400;color:var(--pewter);letter-spacing:0;}
input,textarea,select{
  font-family:'Inter',sans-serif;
  font-size:14.5px;
  padding:11px 13px;
  border:1px solid var(--paper-dim);
  border-radius:4px;
  background:#fff;color:var(--ink);
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease;
  width:100%;
}
input:hover,textarea:hover,select:hover{border-color:var(--pewter);}
input:focus,textarea:focus,select:focus{
  border-color:var(--oxblood);
  box-shadow:0 0 0 3px rgba(140,31,47,0.12);
}
input:user-invalid{border-color:var(--oxblood-bright);}
textarea{resize:vertical;min-height:76px;}
.upload-help{font-size:11.5px;line-height:1.45;color:var(--pewter);margin-top:-1px;}
.photo-upload-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;}
.photo-upload{font-size:10px;color:var(--graphite);}
.photo-upload input{margin-top:6px;padding:8px;font-size:11.5px;text-transform:none;letter-spacing:0;}
.photo-upload input::file-selector-button{margin-right:7px;border:0;border-radius:3px;padding:7px 8px;background:var(--paper-dim);color:var(--ink);cursor:pointer;}
.submit-row{margin-top:20px;}
.submit-note{
  display:block;margin-top:12px;
  font-size:11.5px;line-height:1.5;color:var(--graphite);
}
.submit-note a{color:var(--graphite);text-decoration:underline;text-underline-offset:2px;}
.submit-note a:hover{color:var(--ink);}
.form-status{margin-top:10px;font-size:13px;font-weight:600;min-height:1em;}
.ec-or{
  display:flex;align-items:center;gap:12px;
  margin:18px 0 14px;
  font-family:'Space Mono',monospace;
  font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:var(--pewter);
}
.ec-or::before,.ec-or::after{content:"";height:1px;background:var(--paper-dim);flex:1;}

/* ---------- Trust strip ---------- */
.trust-strip{background:var(--ink-soft);border-bottom:1px solid var(--hair);}
.trust-strip ul{
  display:grid;grid-template-columns:repeat(4,1fr);
}
.trust-strip li{
  display:flex;align-items:center;gap:10px;
  padding:18px 22px;
  border-left:1px solid var(--hair);
  font-size:13px;color:var(--pewter);line-height:1.4;
}
.trust-strip li:first-child{border-left:0;padding-left:0;}
/* Three-point variant (the about page) — even columns instead of an empty cell. */
.trust-strip.three ul{grid-template-columns:repeat(3,1fr);}
.trust-strip svg{width:17px;height:17px;color:var(--oxblood-bright);flex:none;}
.trust-strip b{color:var(--paper);font-weight:600;}

/* ---------- Section generics ---------- */
.section{padding:78px 0;}
.section-head{max-width:660px;margin:0 0 40px;}
.section-eyebrow{
  font-family:'Space Mono',monospace;
  font-size:12px;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--oxblood);
  margin-bottom:10px;display:block;
}
.section h2{font-size:clamp(28px,3.4vw,42px);font-weight:700;color:var(--ink);}
.section .lede{margin-top:16px;font-size:16px;line-height:1.65;color:var(--graphite);}
.section .lede + .lede{margin-top:12px;}
.section.on-ink{background:var(--ink);color:var(--paper);}
.section.on-ink h2,.section.on-ink h3{color:var(--paper);}
.section.on-ink .lede{color:var(--pewter);}
.section.on-ink .section-eyebrow{color:var(--oxblood-bright);}
.section.on-dim{background:var(--paper-dim);}

/* ---------- What we fix: ledger list, not icon cards ---------- */
.fix-ledger{
  display:grid;grid-template-columns:1fr 1fr;
  gap:0 44px;
}
.fix-ledger li{
  display:grid;grid-template-columns:auto 1fr;gap:14px;
  padding:18px 0;
  border-bottom:1px solid var(--paper-dim);
}
.fix-ledger .tick{
  width:22px;height:22px;border-radius:50%;
  background:var(--oxblood);color:var(--paper);
  display:flex;align-items:center;justify-content:center;flex:none;margin-top:2px;
}
.fix-ledger .tick svg{width:12px;height:12px;}
.fix-ledger h3{
  font-family:'Inter',sans-serif;text-transform:none;letter-spacing:0;
  font-size:16px;font-weight:700;color:var(--ink);line-height:1.3;
}
.fix-ledger p{margin-top:6px;font-size:13.5px;line-height:1.55;color:var(--graphite);}
.on-ink .fix-ledger li{border-bottom-color:var(--hair);}
.on-ink .fix-ledger h3{color:var(--paper);}
.on-ink .fix-ledger p{color:var(--pewter);}

.scope-note{
  margin-top:30px;
  display:flex;align-items:flex-start;gap:11px;
  font-size:13.5px;line-height:1.55;color:var(--graphite);
  padding:15px 18px;
  border:1px dashed var(--pewter);
  border-radius:4px;
  background:#fff;
}
.scope-note svg{width:16px;height:16px;color:var(--oxblood);flex:none;margin-top:2px;}
.scope-note b{color:var(--ink);}

/* yes / no capability columns */
.col-head{
  font-family:'Space Mono',monospace;text-transform:uppercase;
  font-size:11px;letter-spacing:0.12em;color:var(--pewter);
  margin-bottom:16px;
}
.col-head.yes{color:var(--whatsapp);}
.fix-ledger .item-title{
  font-size:15.5px;font-weight:600;line-height:1.35;color:var(--ink);
}
.on-ink .fix-ledger .item-title{color:var(--paper);}
.on-ink .fix-ledger .item-title.muted{color:var(--pewter);}

/* ---------- Comparison table ---------- */
.compare{
  margin-top:8px;
  border:1px solid var(--hair-strong);
  border-radius:6px;
  overflow:hidden;
  background:rgba(245,242,236,0.03);
}
.compare table{width:100%;border-collapse:collapse;}
.compare caption{
  text-align:left;padding:16px 20px;
  font-family:'Space Mono',monospace;
  font-size:10.5px;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--pewter);
  border-bottom:1px solid var(--hair);
}
.compare th,.compare td{
  padding:15px 20px;
  text-align:left;
  font-size:14px;line-height:1.5;
  border-top:1px solid var(--hair);
  vertical-align:top;
}
.compare thead th{
  border-top:0;
  font-family:'Space Mono',monospace;
  font-size:10.5px;letter-spacing:0.09em;text-transform:uppercase;
  color:var(--pewter);font-weight:400;
}
.compare thead th.us{color:var(--oxblood-bright);}
.compare tbody th{
  font-family:'Inter',sans-serif;font-weight:600;color:var(--paper);
  width:26%;
}
.compare td{color:var(--pewter);}
.compare td.us{color:var(--paper);background:rgba(140,31,47,0.16);}

/* ---------- Process timeline ---------- */
.timeline{
  display:grid;grid-template-columns:repeat(4,1fr);gap:26px;
  position:relative;
}
.timeline::before{
  content:"";position:absolute;left:0;right:0;top:11px;height:1px;
  background:var(--paper-dim);
}
.on-ink .timeline::before{background:var(--hair-strong);}
.tl-step{position:relative;padding-top:38px;}
.tl-step .node{
  position:absolute;top:4px;left:0;
  width:15px;height:15px;border-radius:50%;
  background:var(--paper);border:2px solid var(--oxblood);
}
.on-ink .tl-step .node{background:var(--ink);border-color:var(--oxblood-bright);}
.tl-step .num{
  font-family:'Space Mono',monospace;font-size:12px;color:var(--oxblood);
  display:block;margin-bottom:8px;letter-spacing:0.08em;
}
.on-ink .tl-step .num{color:var(--oxblood-bright);}
.tl-step h3{
  font-family:'Inter',sans-serif;text-transform:none;letter-spacing:0;
  font-size:16px;font-weight:700;line-height:1.3;
}
.tl-step p{margin-top:7px;font-size:13.5px;line-height:1.55;color:var(--graphite);}
.on-ink .tl-step p{color:var(--pewter);}

/* ---------- Two-column feature block (copy + panel) ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start;}
.split.narrow-right{grid-template-columns:1.15fr 0.85fr;}

.panel-art{
  position:relative;
  aspect-ratio:4/3;
  border:1px solid var(--hair-strong);
  border-radius:6px;
  background:linear-gradient(155deg,#181c1e,#0c0e0f);
  overflow:hidden;
}
.panel-art .card-label{
  position:absolute;top:15px;left:15px;z-index:4;
  font-family:'Space Mono',monospace;
  font-size:10px;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--pewter);
}
.panel-art .card-label b{color:var(--paper);display:block;font-size:11px;margin-top:2px;}
.panel-art svg{width:100%;height:100%;}
.panel-art .ba-tag{
  position:absolute;bottom:14px;z-index:4;
  font-family:'Space Mono',monospace;
  font-size:9.5px;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--pewter);
}
.panel-art .ba-tag.before{left:15px;}
.panel-art .ba-tag.after{right:15px;color:var(--paper);}

/* ---------- Price factors ---------- */
.factors{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--paper-dim);border:1px solid var(--paper-dim);}
.factor{background:var(--paper);padding:26px 24px;}
.factor .fnum{
  font-family:'Space Mono',monospace;font-size:11px;letter-spacing:0.1em;
  color:var(--oxblood);display:block;margin-bottom:14px;
}
.factor h3{
  font-family:'Inter',sans-serif;text-transform:none;letter-spacing:0;
  font-size:15.5px;font-weight:700;color:var(--ink);line-height:1.3;
}
.factor p{margin-top:7px;font-size:13.5px;line-height:1.55;color:var(--graphite);}

/* ---------- Local panel (town pages) ---------- */
.local-facts{
  display:grid;grid-template-columns:repeat(2,1fr);gap:1px;
  background:var(--hair-strong);border:1px solid var(--hair-strong);border-radius:6px;
  overflow:hidden;
}
.local-fact{background:var(--ink);padding:22px 24px;}
.local-fact .lf-key{
  font-family:'Space Mono',monospace;
  font-size:10px;letter-spacing:0.11em;text-transform:uppercase;
  color:var(--oxblood-bright);display:block;margin-bottom:9px;
}
.local-fact .lf-val{font-size:14.5px;line-height:1.55;color:var(--paper);}
.local-fact .lf-val.mono{font-size:14px;letter-spacing:0.02em;}

.area-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px;}
.area-chip{
  font-family:'Space Mono',monospace;
  font-size:11.5px;letter-spacing:0.03em;
  padding:7px 12px;
  border:1px solid var(--hair-strong);
  border-radius:3px;
  color:var(--pewter);
}
.on-dim .area-chip,.on-paper .area-chip{border-color:var(--pewter);color:var(--ink);background:#fff;}

/* ---------- Town link grid ---------- */
.town-grid{
  display:grid;grid-template-columns:repeat(5,1fr);gap:1px;
  background:var(--paper-dim);border:1px solid var(--paper-dim);
}
.town-link{
  background:var(--paper);
  padding:16px 18px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  font-size:14.5px;font-weight:600;color:var(--ink);
  transition:background .15s ease, color .15s ease;
}
.town-link .arrow{
  font-family:'Space Mono',monospace;font-size:13px;color:var(--pewter);
  transition:transform .15s ease, color .15s ease;
}
.town-link:hover{background:var(--ink);color:var(--paper);}
.town-link:hover .arrow{color:var(--oxblood-bright);transform:translateX(3px);}
.town-link[aria-current]{background:var(--ink);color:var(--paper);}
.town-link[aria-current] .arrow{color:var(--oxblood-bright);}

/* ---------- FAQ accordion ---------- */
.faq-acc{border-top:1px solid var(--pewter);}
.faq-acc details{border-bottom:1px solid var(--pewter);}
.faq-acc summary{
  display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  padding:21px 0;
  cursor:pointer;
  font-size:16.5px;font-weight:700;color:var(--ink);line-height:1.4;
  list-style:none;
}
.faq-acc summary::-webkit-details-marker{display:none;}
.faq-acc summary:hover{color:var(--oxblood);}
.faq-acc summary:focus-visible{outline:2px solid var(--oxblood);outline-offset:3px;}
.faq-acc .plus{
  position:relative;width:16px;height:16px;flex:none;margin-top:5px;
}
.faq-acc .plus::before,.faq-acc .plus::after{
  content:"";position:absolute;background:var(--oxblood);
  transition:transform .2s ease, opacity .2s ease;
}
.faq-acc .plus::before{left:0;top:7.5px;width:16px;height:1.5px;}
.faq-acc .plus::after{left:7.5px;top:0;width:1.5px;height:16px;}
.faq-acc details[open] .plus::after{transform:rotate(90deg);opacity:0;}
.faq-acc .answer{padding:0 44px 24px 0;}
.faq-acc .answer p{font-size:14.5px;line-height:1.68;color:var(--graphite);}
.faq-acc .answer p + p{margin-top:11px;}

/* ---------- Closing CTA band ---------- */
.cta-band{
  background:var(--ink);
  color:var(--paper);
  padding:66px 0;
  position:relative;
  overflow:hidden;
  border-top:1px solid var(--hair);
}
.cta-band::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(80% 120% at 88% 50%, rgba(140,31,47,0.4), transparent 62%);
  pointer-events:none;
}
.cta-band .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.2fr 0.8fr;gap:44px;align-items:center;}
.cta-band h2{font-size:clamp(26px,3.1vw,38px);font-weight:800;color:var(--paper);}
.cta-band p{margin-top:14px;font-size:15.5px;line-height:1.6;color:var(--pewter);max-width:52ch;}
.cta-band .cta-actions{display:flex;flex-direction:column;gap:11px;}
.cta-band .phone-line{
  margin-top:6px;
  font-family:'Space Mono',monospace;
  font-size:12px;letter-spacing:0.07em;color:var(--pewter);text-align:center;
}

/* ---------- Blog ---------- */
/* The hero is the landing-page hero minus the form column, so a post inherits
 * the same bloom, tooling lines and h1 scale as the rest of the site. */
.lp-hero.solo .wrap{grid-template-columns:1fr;}
.lp-hero.solo .sub{max-width:62ch;}
.wrap.narrow{max-width:812px;}

.post-meta{
  margin-top:20px;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  font-family:'Space Mono',monospace;
  font-size:11.5px;letter-spacing:0.09em;text-transform:uppercase;
  color:var(--pewter);
}
.post-meta .sep{color:var(--graphite);}

/* ---------- Blog index: ledger rows, not a card grid ---------- */
/* An ordered list — the global reset only covers ul. */
.post-index{list-style:none;margin:0;padding:0;border-top:1px solid var(--paper-dim);}
.post-index li{border-bottom:1px solid var(--paper-dim);}
.post-row{
  display:grid;grid-template-columns:190px 1fr;gap:30px;
  padding:30px 4px;
  transition:background .15s ease,padding-left .15s ease;
}
.post-row:hover{background:rgba(16,19,20,0.03);}
.post-row:focus-visible{outline:2px solid var(--oxblood);outline-offset:-2px;}
.pr-date{
  display:block;
  font-size:11.5px;letter-spacing:0.09em;text-transform:uppercase;
  color:var(--graphite);
}
.post-tag{
  display:inline-block;margin-top:11px;
  padding:5px 10px;
  border:1px solid var(--pewter);border-radius:3px;
  font-family:'Space Mono',monospace;
  font-size:10px;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--graphite);
}
.pr-main h2{
  font-size:clamp(21px,2.5vw,28px);font-weight:700;
  line-height:1.02;color:var(--ink);
  transition:color .15s ease;
}
.post-row:hover .pr-main h2{color:var(--oxblood);}
.pr-main p{margin-top:11px;font-size:14.5px;line-height:1.62;color:var(--graphite);max-width:64ch;}
.pr-more{
  margin-top:15px;
  display:inline-flex;align-items:center;gap:9px;
  font-family:'Space Mono',monospace;
  font-size:10.5px;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--oxblood);
}
.pr-more .arrow{transition:transform .15s ease;}
.post-row:hover .pr-more .arrow{transform:translateX(4px);}

/* ---------- Post body ---------- */
.post-body h2{
  font-size:clamp(23px,2.7vw,31px);font-weight:700;
  line-height:1.03;color:var(--ink);
  margin:40px 0 15px;
}
.post-body > :first-child{margin-top:0;}
.post-body p{font-size:16px;line-height:1.72;color:var(--graphite);}
.post-body p + p{margin-top:15px;}
.post-body .lede{
  font-size:18.5px;line-height:1.62;color:var(--ink);
  padding-bottom:4px;
}
.post-body strong{color:var(--ink);font-weight:600;}
.post-body em{font-style:italic;}
.post-body a{
  color:var(--oxblood);
  text-decoration:underline;text-underline-offset:3px;
}
.post-body a:hover{color:var(--oxblood-bright);}
.post-list{margin-top:17px;display:grid;gap:12px;}
.post-list li{
  position:relative;padding-left:22px;
  font-size:16px;line-height:1.68;color:var(--graphite);
}
/* A rule rather than a bullet — the same keyline language as the rest of the site. */
.post-list li::before{
  content:"";position:absolute;left:0;top:12px;
  width:9px;height:1.5px;background:var(--oxblood);
}
.post-list li strong{color:var(--ink);font-weight:600;}
.post-note{
  margin-top:30px;
  padding:17px 21px;
  background:var(--paper-dim);
  border-left:3px solid var(--oxblood);
  border-radius:0 5px 5px 0;
}
.post-body .post-note{font-size:14.5px;line-height:1.62;color:var(--graphite);}
/* .compare is designed against the ink background, so it gets one here. */
.post-compare{
  margin:28px 0 6px;
  padding:22px;
  background:var(--ink);
  border-radius:6px;
}
.post-compare .compare{margin-top:0;}
.post-back{
  margin-top:44px;padding-top:22px;
  border-top:1px solid var(--paper-dim);
  font-family:'Space Mono',monospace;
  font-size:11px;letter-spacing:0.1em;text-transform:uppercase;
}
.post-back a{color:var(--graphite);}
.post-back a:hover{color:var(--oxblood);}

/* ---------- Footer ---------- */
footer{
  background:var(--ink-soft);
  color:var(--pewter);
  padding:40px 0 28px;
  border-top:1px solid var(--hair);
}
.footer-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;}
.footer-row .logo .name{color:var(--paper);}
.footer-links{display:flex;gap:24px;font-size:13px;flex-wrap:wrap;}
.footer-links a:hover{color:var(--paper);}
.footer-areas{
  margin-top:28px;padding-top:22px;border-top:1px solid rgba(183,188,194,0.12);
}
.footer-areas .fa-title{
  font-family:'Space Mono',monospace;
  font-size:10px;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--graphite);margin-bottom:12px;
}
.footer-areas ul{display:flex;flex-wrap:wrap;gap:7px 16px;font-size:12.5px;}
.footer-areas li,.footer-areas a{color:var(--pewter);}
.footer-areas a:hover{color:var(--paper);text-decoration:underline;text-underline-offset:3px;}
.footer-bottom{
  margin-top:24px;padding-top:20px;border-top:1px solid rgba(183,188,194,0.12);
  font-size:12px;color:var(--pewter);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
}

/* ---------- Mobile sticky action bar ---------- */
.mobile-cta{display:none;}

/* ---------- Page-load reveal ---------- */
@media (prefers-reduced-motion: no-preference){
  .reveal{opacity:0;transform:translateY(14px);animation:reveal .6s cubic-bezier(.2,.7,.3,1) forwards;}
  .reveal-1{animation-delay:.05s;}
  .reveal-2{animation-delay:.14s;}
  .reveal-3{animation-delay:.23s;}
  .reveal-4{animation-delay:.32s;}
  @keyframes reveal{to{opacity:1;transform:none;}}
}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .lp-hero .wrap{grid-template-columns:1fr;gap:36px;}
  .trust-strip ul{grid-template-columns:repeat(2,1fr);}
  .trust-strip li{border-left:0;border-top:1px solid var(--hair);padding-left:0;}
  .trust-strip li:nth-child(-n+2){border-top:0;}
  .trust-strip.three ul{grid-template-columns:1fr;}
  .trust-strip.three li:nth-child(2){border-top:1px solid var(--hair);}
  .nav-links{display:none;}
  .split,.split.narrow-right{grid-template-columns:1fr;gap:36px;}
  .timeline{grid-template-columns:repeat(2,1fr);gap:30px 26px;}
  .factors{grid-template-columns:1fr;}
  .town-grid{grid-template-columns:repeat(3,1fr);}
  .cta-band .wrap{grid-template-columns:1fr;gap:28px;}
  .compare tbody th{width:34%;}
}

@media (max-width:640px){
  :root{--header-h:40px;--nav-h:64px;}
  .wrap{padding:0 18px;}

  .wa-banner a{font-size:12px;gap:6px;padding:0 10px;}
  .wa-banner .long-copy{display:none;}
  .wa-banner svg{width:14px;height:14px;}

  .logo .name{font-size:16px;}
  .logo .tag{font-size:8.5px;}
  .nav-row{gap:10px;}
  .btn-sm{padding:11px 15px;font-size:12.5px;}

  .crumbs{padding:10px 0;}
  .crumbs ol{font-size:10px;gap:6px;}

  .lp-hero{padding:34px 0 44px;}
  .eyebrow-chip{font-size:10px;padding:6px 10px;margin-bottom:15px;}
  .lp-hero h1{font-size:clamp(29px,8.4vw,37px);}
  .lp-hero .sub{font-size:15px;margin-top:15px;}
  .hero-stats{margin-top:24px;padding-top:16px;grid-template-columns:1fr;gap:14px;}
  .hero-stats div{
    padding:0 0 14px;margin:0;
    border-right:0;border-bottom:1px solid var(--hair);
    display:flex;align-items:baseline;gap:10px;
  }
  .hero-stats div:last-child{border-bottom:0;padding-bottom:0;}
  .hero-stats b{font-size:22px;}
  .hero-stats span{margin-top:0;}
  .hero-cta-row{margin-top:22px;gap:10px;}
  .hero-cta-row .btn{width:100%;}

  .estimate-card{border-radius:6px;}
  .estimate-card .ec-head{padding:16px 18px;}
  .estimate-card .ec-head h2{font-size:21px;}
  .estimate-card form{padding:18px;}
  .form-grid{grid-template-columns:1fr;gap:13px;}
  .photo-upload-grid{grid-template-columns:1fr;}

  .section{padding:48px 0;}
  .section-head{margin-bottom:30px;}
  .section h2{font-size:clamp(25px,7.2vw,33px);}
  .section .lede{font-size:15px;}

  .fix-ledger{grid-template-columns:1fr;gap:0;}
  .scope-note{font-size:13px;padding:13px 15px;}

  .timeline{grid-template-columns:1fr;gap:0;}
  .timeline::before{
    left:7px;right:auto;top:0;bottom:0;width:1px;height:auto;
  }
  .tl-step{padding:0 0 26px 32px;}
  .tl-step:last-child{padding-bottom:0;}
  .tl-step .node{top:3px;}

  .compare caption{padding:14px 16px;}
  .compare th,.compare td{padding:13px 15px;font-size:13.5px;}
  .compare tbody th{width:38%;}
  .compare thead th{font-size:9.5px;}

  .local-facts{grid-template-columns:1fr;}
  .local-fact{padding:18px 20px;}

  .town-grid{grid-template-columns:1fr;}
  .town-link{padding:15px 16px;}

  .faq-acc summary{font-size:15.5px;padding:18px 0;gap:14px;}
  .faq-acc .answer{padding-right:26px;padding-bottom:20px;}
  .faq-acc .answer p{font-size:14px;}

  .cta-band{padding:46px 0;}
  .cta-band .cta-actions .btn{width:100%;}

  .footer-row{flex-direction:column;align-items:flex-start;gap:14px;}
  .footer-links{gap:12px 18px;font-size:12.5px;}
  .footer-bottom{flex-direction:column;gap:6px;}

  .lp-hero.solo .sub{max-width:none;}
  .post-meta{margin-top:16px;font-size:10.5px;}

  .post-row{grid-template-columns:1fr;gap:14px;padding:24px 0;}
  .pr-meta{display:flex;align-items:center;gap:12px;}
  .post-tag{margin-top:0;}
  .pr-main p{font-size:14px;}

  .post-body h2{margin:32px 0 13px;}
  .post-body p,.post-list li{font-size:15.5px;}
  .post-body .lede{font-size:17px;}
  .post-note{padding:15px 17px;}
  .post-compare{padding:0;background:none;}
  .post-compare .compare{background:var(--ink);}
  .post-back{margin-top:34px;}

  /* sticky call/WhatsApp bar — high-intent ad traffic arrives on mobile */
  body{padding-bottom:64px;}
  .mobile-cta{
    display:grid;grid-template-columns:1fr 1fr;gap:1px;
    position:fixed;left:0;right:0;bottom:0;z-index:70;
    background:var(--hair-strong);
    border-top:1px solid var(--hair-strong);
    box-shadow:0 -8px 24px rgba(0,0,0,0.3);
  }
  .mobile-cta a{
    display:flex;align-items:center;justify-content:center;gap:8px;
    padding:17px 10px;
    font-size:14px;font-weight:700;
  }
  .mobile-cta svg{width:17px;height:17px;flex:none;}
  .mobile-cta .m-call{background:var(--oxblood);color:#fbeceb;}
  .mobile-cta .m-wa{background:var(--whatsapp);color:#08210f;}
}

@media (max-width:380px){
  .lp-hero h1{font-size:27px;}
  .logo .name{font-size:14.5px;}
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;}
  html{scroll-behavior:auto;}
}
