/* ============================================================
   THE FOOTHILLS CONCRETE COMPANY — shared stylesheet
   Type: Oswald (display/UI) · Lora (prose) · Source Sans 3 (forms)
   Color tokens follow the kit's role-based system.
   ============================================================ */

/* ── WEBFONTS (self-hosted, latin subset, variable) ──
   Served from /css/fonts/ so the existing /css/* immutable
   cache rule in _headers covers them without editing that file.
   Filenames carry the Google Fonts version — bump the name, not
   a query string, if a face is ever re-pulled. */
@font-face{
  font-family:'Oswald';font-style:normal;font-weight:400 700;font-display:swap;
  src:url('/css/fonts/oswald-latin-v57.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;
}
@font-face{
  font-family:'Lora';font-style:normal;font-weight:400 600;font-display:swap;
  src:url('/css/fonts/lora-latin-v37.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;
}
@font-face{
  font-family:'Lora';font-style:italic;font-weight:400;font-display:swap;
  src:url('/css/fonts/lora-italic-latin-v37.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;
}
@font-face{
  font-family:'Source Sans 3';font-style:normal;font-weight:400 600;font-display:swap;
  src:url('/css/fonts/source-sans-3-latin-v19.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;
}

/* ── METRIC-MATCHED FALLBACKS ──
   These are the CLS fix. Each one takes a font already on the
   device and stretches it so its advance widths, ascent and
   descent match the webfont exactly. When the real face swaps
   in there is nothing left to reflow.
   size-adjust = avg advance width (webfont ÷ base font);
   ascent/descent overrides are the webfont's own metrics
   divided by that size-adjust. Measured from the actual font
   files, not estimated. Base fonts: Arial for Oswald and
   Source Sans 3, Times New Roman for Lora. */
@font-face{
  font-family:'Oswald Fallback';font-style:normal;font-weight:400 500;
  src:local('Arial'),local('Helvetica'),local('Liberation Sans');
  size-adjust:79.77%;ascent-override:149.55%;descent-override:36.23%;line-gap-override:0%;
}
@font-face{
  font-family:'Oswald Fallback';font-style:normal;font-weight:700;
  src:local('Arial Bold'),local('Arial-BoldMT'),local('Helvetica Bold'),local('Liberation Sans Bold');
  size-adjust:84.05%;ascent-override:141.93%;descent-override:34.38%;line-gap-override:0%;
}
@font-face{
  font-family:'Lora Fallback';font-style:normal;font-weight:400;
  src:local('Times New Roman'),local('TimesNewRomanPSMT'),local('Liberation Serif');
  size-adjust:111.61%;ascent-override:90.14%;descent-override:24.55%;line-gap-override:0%;
}
@font-face{
  font-family:'Lora Fallback';font-style:normal;font-weight:600;
  src:local('Times New Roman Bold'),local('TimesNewRomanPS-BoldMT'),local('Liberation Serif Bold');
  size-adjust:107.33%;ascent-override:93.73%;descent-override:25.53%;line-gap-override:0%;
}
@font-face{
  font-family:'Lora Fallback';font-style:italic;font-weight:400;
  src:local('Times New Roman Italic'),local('TimesNewRomanPS-ItalicMT'),local('Liberation Serif Italic');
  size-adjust:109.97%;ascent-override:91.48%;descent-override:24.92%;line-gap-override:0%;
}
@font-face{
  font-family:'Source Sans 3 Fallback';font-style:normal;font-weight:400;
  src:local('Arial'),local('Helvetica'),local('Liberation Sans');
  size-adjust:91.82%;ascent-override:111.52%;descent-override:43.56%;line-gap-override:0%;
}
@font-face{
  font-family:'Source Sans 3 Fallback';font-style:normal;font-weight:600;
  src:local('Arial Bold'),local('Arial-BoldMT'),local('Helvetica Bold'),local('Liberation Sans Bold');
  size-adjust:89.13%;ascent-override:114.89%;descent-override:44.88%;line-gap-override:0%;
}

*{box-sizing:border-box;margin:0;padding:0}

/* Skip link — first focusable element, visible only on focus (a11y: bypass blocks) */
.skip-link{position:absolute;left:-9999px;top:0;z-index:999;background:#fff;color:#0d1f35;padding:12px 20px;font-family:var(--font-disp);font-weight:700;text-decoration:none}
.skip-link:focus{left:0}
:root{
  --navy:#0d1f35;        /* primary dark — nav, footer, dark sections */
  --navy-mid:#122844;    /* slightly lighter dark — anchor strip, hovers */
  --blue:#1a3f6f;        /* primary accent — buttons, CTAs, eyebrows */
  --blue-light:#1e5491;  /* hover/border accent */
  --tan:#9aa3ab;         /* secondary accent — concrete gray (stars, financing, trim) */
  --tan-light:#bcc4cc;   /* light accent — light concrete gray (eyebrows on dark, hovers) */
  --silver:#e8edf5;
  --cream:#f5f2ec;       /* warm neutral — alt sections */
  --text:#1a1e25;
  --muted:#5a6070;
  --white:#fff;
  --border:#ddd8ce;
  --font-disp:'Oswald','Oswald Fallback',Arial,sans-serif;
  --font-serif:'Lora','Lora Fallback','Times New Roman',serif;
  --font-sans:'Source Sans 3','Source Sans 3 Fallback',Arial,sans-serif;
}
body{font-family:var(--font-sans);color:var(--text);background:#fff !important;padding-bottom:74px;width:100%;max-width:100%;overflow-x:hidden;line-height:1.5}
img{max-width:100%;height:auto;display:block}
html{scroll-behavior:smooth}
a{color:var(--blue)}

/* ── MARQUEE TOP BAR ── */
.top-bar{background:var(--tan);padding:0;overflow:hidden;display:block;white-space:nowrap;border-bottom:1px solid rgba(13,31,53,.15)}
.marquee-track{display:inline-flex;align-items:center;white-space:nowrap;will-change:transform;animation:marquee-scroll 34s linear infinite}
.top-bar:hover .marquee-track{animation-play-state:paused}
.marquee-track .mq-item{font-family:var(--font-disp);font-size:13px;font-weight:700;color:var(--navy);letter-spacing:1.2px;text-transform:uppercase;padding:9px 0;display:inline-flex;align-items:center}
.marquee-track .mq-sep{color:var(--navy);opacity:.45;padding:0 22px;font-size:11px}
@keyframes marquee-scroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none;justify-content:center;width:100%;white-space:normal;flex-wrap:wrap}}

/* ── NAV ── */
nav{background:var(--navy);padding:0 48px;display:flex;align-items:center;justify-content:space-between;height:74px;border-bottom:3px solid var(--blue);position:sticky;top:0;z-index:100}
.logo-wrap{display:flex;align-items:center;gap:12px;height:100%;overflow:hidden;text-decoration:none}
.logo-text{display:flex;flex-direction:column;justify-content:center;font-family:var(--font-disp);color:#fff;text-transform:uppercase;line-height:1;white-space:nowrap}
.logo-text-top{font-size:15px;font-weight:400;letter-spacing:.3em;color:rgba(255,255,255,.82);margin-bottom:5px}
.logo-text-main{font-size:26px;font-weight:700;letter-spacing:.02em}
.nav-links{display:flex;gap:0}
.nav-links a{font-family:var(--font-disp);font-size:13px;font-weight:500;color:rgba(255,255,255,.78);text-decoration:none;padding:0 13px;height:74px;display:flex;align-items:center;letter-spacing:.5px;text-transform:uppercase;border-bottom:3px solid transparent;transition:color .2s,border-color .2s}
.nav-links a:hover{color:#fff;border-bottom-color:var(--blue-light)}
.nav-dropdown{position:relative;height:74px;display:flex;align-items:center}
.nav-dropdown>a{cursor:pointer}
.nav-dropdown>a::after{content:'▾';margin-left:6px;font-size:10px;opacity:.7}
.dropdown-menu{display:none;position:absolute;top:74px;left:0;background:var(--navy);border-top:3px solid var(--blue);min-width:260px;padding:10px 0;box-shadow:0 8px 24px rgba(0,0,0,.35);z-index:200}
.nav-dropdown:hover .dropdown-menu,.nav-dropdown:focus-within .dropdown-menu{display:block}
.dropdown-menu a{display:block !important;height:auto !important;padding:10px 20px !important;font-family:var(--font-disp);font-size:12px;font-weight:500;color:rgba(255,255,255,.75) !important;letter-spacing:.5px;text-transform:uppercase;border-bottom:none !important;border-left:3px solid transparent !important;transition:all .2s}
.dropdown-menu a:hover{color:#fff !important;background:var(--navy-mid);border-left-color:var(--tan) !important}
.dropdown-heading{font-family:var(--font-disp);font-size:10px;font-weight:700;color:var(--tan-light);letter-spacing:2px;text-transform:uppercase;padding:10px 20px 6px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:4px}
.dropdown-heading:not(:first-child){margin-top:8px}
.nav-right{display:flex;align-items:center;gap:10px}
.nav-phone{font-family:var(--font-disp);font-size:16px;font-weight:700;color:var(--tan-light);border:2px solid var(--tan);padding:6px 16px;border-radius:4px;text-decoration:none}
.nav-cta{font-family:var(--font-disp);font-size:13px;font-weight:700;background:var(--blue);color:#fff;padding:9px 18px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px;text-decoration:none}
.mobile-nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:8px;flex-direction:column;gap:5px}
.mobile-nav-toggle span{display:block;width:22px;height:2px;background:#fff}
.mobile-nav-open{display:none;position:fixed;top:74px;left:0;right:0;background:var(--navy);border-top:2px solid var(--blue);padding:12px 20px;z-index:99;flex-direction:column;max-height:calc(100vh - 74px);overflow-y:auto}
.mobile-nav-open a{font-family:var(--font-disp);font-size:16px;color:rgba(255,255,255,.85);text-decoration:none;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.07);text-transform:uppercase;letter-spacing:.5px;display:block}
.mobile-nav-open.active{display:flex}
.mobile-nav-open .mob-group-label{font-family:var(--font-disp);font-size:11px;font-weight:700;color:var(--tan-light);letter-spacing:1.5px;text-transform:uppercase;padding:14px 0 4px;border-bottom:none !important}
.mobile-nav-open .mob-sub{font-size:14px !important;padding:10px 0 10px 18px !important;color:rgba(255,255,255,.65) !important;border-bottom:1px solid rgba(255,255,255,.05) !important}

/* ── ANCHOR STRIP ── */
.anchor-strip{background:var(--navy-mid);border-bottom:1px solid rgba(255,255,255,.08);padding:0 48px;display:flex;gap:0;overflow-x:auto}
.anchor-strip a{font-family:var(--font-disp);font-size:12px;font-weight:500;color:rgba(255,255,255,.6);text-decoration:none;padding:10px 16px;white-space:nowrap;letter-spacing:.5px;text-transform:uppercase;border-bottom:2px solid transparent;transition:color .2s,border-color .2s}
.anchor-strip a:hover{color:#fff;border-bottom-color:var(--tan)}

/* ── HERO (split) ── */
.hero{background:linear-gradient(150deg,#060f1c 0%,var(--navy) 45%,#0d1f35 80%,#1a1508 100%);padding:0;position:relative;overflow:hidden;display:grid;grid-template-columns:1fr 1fr;align-items:stretch;gap:0}
.hero-copy{padding:64px 48px;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:1}
.hero-media{position:relative;min-height:460px;overflow:hidden}
.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.hero-media::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,31,53,.55) 0%,rgba(13,31,53,.12) 30%,rgba(13,31,53,0) 60%)}
.hero::before{content:'';position:absolute;right:-60px;top:-80px;width:500px;height:500px;border-radius:50%;background:rgba(26,63,111,.08);z-index:0}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(196,168,130,.15);border:1px solid rgba(196,168,130,.5);border-radius:3px;padding:5px 14px;margin-bottom:16px;align-self:flex-start}
.hb-dot{width:8px;height:8px;border-radius:50%;background:var(--blue-light);flex-shrink:0}
.hb-text{font-family:var(--font-disp);font-size:11px;font-weight:700;color:var(--tan-light);letter-spacing:2px;text-transform:uppercase}
.hero h1{font-family:var(--font-disp);font-size:50px;font-weight:700;color:#fff;line-height:1.0;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:14px}
.hero h1 em{color:var(--tan-light);font-style:normal;display:block}
.hero-sub{font-family:var(--font-serif);font-size:17px;color:rgba(255,255,255,.8);line-height:1.75;margin-bottom:22px}
.trust-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px}
.tbadge{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:4px;padding:6px 12px}
.tbadge span{font-size:12px;color:#fff;font-weight:600}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
.btn-primary{font-family:var(--font-disp);font-size:15px;font-weight:700;background:var(--blue);color:#fff;padding:14px 28px;border-radius:4px;text-transform:uppercase;letter-spacing:.5px;display:inline-block;border:2px solid var(--blue-light);text-decoration:none}
.btn-primary:hover{background:var(--blue-light)}
.btn-outline{font-family:var(--font-disp);font-size:15px;font-weight:500;background:transparent;color:#fff;padding:14px 26px;border:2px solid rgba(255,255,255,.3);border-radius:4px;display:inline-block;text-decoration:none}
.btn-outline:hover{border-color:#fff}

/* ── PAGE HEADER (inner pages) ── */
.page-header{background:linear-gradient(150deg,#060f1c 0%,var(--navy) 50%,#0d1f35 100%);padding:54px 48px;position:relative;overflow:hidden}
.page-header::before{content:'';position:absolute;right:-60px;top:-80px;width:420px;height:420px;border-radius:50%;background:rgba(26,63,111,.10)}
.ph-kicker{font-family:var(--font-disp);font-size:12px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--tan-light);margin-bottom:10px;position:relative}
.ph-title{font-family:var(--font-disp);font-size:44px;font-weight:700;color:#fff;line-height:1.04;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px;position:relative}
.ph-sub{font-family:var(--font-serif);font-size:16px;color:rgba(255,255,255,.8);line-height:1.7;max-width:680px;position:relative}
.breadcrumbs{margin-top:16px;font-family:var(--font-disp);font-size:12px;letter-spacing:.5px;text-transform:uppercase;position:relative}
.breadcrumbs a{color:rgba(255,255,255,.6);text-decoration:none}
.breadcrumbs a:hover{color:#fff}
.breadcrumbs span{color:rgba(255,255,255,.3);padding:0 8px}

/* ── PROOF BAR ── */
.proof-bar{background:var(--navy);border-top:3px solid var(--tan);border-bottom:1px solid rgba(255,255,255,.06);padding:18px 48px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.ps{text-align:center;flex-shrink:0}
.ps-num{font-family:var(--font-disp);font-size:30px;font-weight:700;color:var(--tan-light);display:block;line-height:1}
.ps-label{font-size:11px;color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:1px;margin-top:3px}
.pdiv{width:1px;height:44px;background:rgba(255,255,255,.1);flex-shrink:0}
.pq{flex:1}
.pq-stars{color:var(--tan);font-size:14px;letter-spacing:2px;margin-bottom:3px}
.pq-text{font-family:var(--font-serif);font-size:13px;color:rgba(255,255,255,.78);line-height:1.55;font-style:italic}
.pq-name{font-family:var(--font-disp);font-size:11px;color:var(--tan-light);letter-spacing:.5px;margin-top:5px;text-transform:uppercase}
.pb-logos{display:flex;gap:10px;flex-shrink:0;align-items:center}
.pb-logo{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:4px;padding:6px 12px;font-family:var(--font-disp);font-size:11px;color:rgba(255,255,255,.55);font-weight:700;letter-spacing:.5px}

/* ── LEAD CAPTURE / ESTIMATE SECTION ── */
.estimate-section{background:var(--cream);padding:64px 48px}
.estimate-wrap{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start;max-width:1180px;margin:0 auto}
.est-kicker{font-family:var(--font-disp);font-size:12px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--blue);margin-bottom:14px}
.est-head{font-family:var(--font-disp);font-size:40px;font-weight:700;color:var(--navy);line-height:1.04;text-transform:uppercase;letter-spacing:1px;margin-bottom:18px}
.est-lead{font-family:var(--font-serif);font-size:16px;color:var(--text);line-height:1.7;margin-bottom:24px}
.est-list{list-style:none;padding:0;margin:0 0 26px}
.est-list li{display:flex;align-items:flex-start;gap:12px;font-family:var(--font-sans);font-size:15px;color:var(--text);line-height:1.4;padding:8px 0}
.est-check{flex-shrink:0;width:26px;height:26px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;margin-top:1px}
.est-check svg{width:14px;height:14px;fill:#fff}
.est-call{display:flex;align-items:center;gap:16px;background:var(--navy);border-radius:6px;padding:18px 22px}
.est-call-icon{flex-shrink:0;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center}
.est-call-icon svg{width:22px;height:22px;fill:#fff}
.est-call-label{font-family:var(--font-disp);font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--tan-light);margin-bottom:2px}
.est-call-num{font-family:var(--font-disp);font-size:26px;font-weight:700;color:#fff;text-decoration:none;letter-spacing:.5px;line-height:1}
.est-form-card{background:#fff;border-radius:8px;padding:30px;box-shadow:0 10px 40px rgba(13,31,53,.10);border:1px solid var(--border)}
.hf-title{font-family:var(--font-disp);font-size:18px;font-weight:700;color:var(--navy);margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px}
.hf-sub{font-family:var(--font-serif);font-size:13px;color:var(--muted);margin-bottom:18px;font-style:italic}

/* ── LEAD FORM (wizard) ── */
._gotcha{position:absolute;left:-9999px;top:-9999px;width:1px;height:1px;opacity:0}
.lead-form{margin:0;padding:0}
.lead-form label{display:block;margin-bottom:10px;font-family:var(--font-sans);font-size:11px;font-weight:600;color:var(--navy);text-transform:uppercase;letter-spacing:.5px}
.lead-form label input,.lead-form label textarea,.lead-form label select{width:100%;background:#f4f6f2;border:1.5px solid var(--border);border-radius:4px;padding:10px 14px;font-size:13px;color:var(--text);font-family:var(--font-sans);margin-top:5px;text-transform:none;letter-spacing:0;font-weight:400;box-sizing:border-box}
.lead-form label input:focus,.lead-form label textarea:focus,.lead-form label select:focus{outline:none;border-color:var(--blue);background:#fff}
.lead-form label textarea{resize:vertical;min-height:64px}
.lead-form label select{appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path fill='%231a3f6f' d='M5 6L0 0h10z'/></svg>");background-repeat:no-repeat;background-position:right 14px center;padding-right:32px}
.form-progress{margin-bottom:14px}
.form-progress-label{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
.form-progress-label>span:first-child{font-family:var(--font-disp);font-size:10px;font-weight:700;color:var(--navy);letter-spacing:1px;text-transform:uppercase}
.form-progress-hint{font-family:var(--font-serif);font-size:11px;color:var(--muted);font-style:italic}
.form-progress-bar{height:3px;background:var(--border);border-radius:2px;overflow:hidden}
.form-progress-fill{height:100%;background:var(--blue);width:50%;transition:width .3s ease}
.form-step[hidden]{display:none}
.form-step{display:block}
.form-step-actions{display:flex;gap:10px;margin-top:6px}
.next-btn,.submit-btn{font-family:var(--font-disp);font-size:14px;font-weight:700;background:var(--blue);color:#fff;border:none;border-radius:4px;padding:12px 20px;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;width:100%;margin-top:4px}
.next-btn:hover,.submit-btn:hover{background:var(--navy)}
.back-btn{font-family:var(--font-disp);font-size:14px;font-weight:600;background:transparent;color:var(--navy);border:1.5px solid var(--border);border-radius:4px;padding:11px 16px;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;flex-shrink:0}
.back-btn:hover{border-color:var(--navy);background:#f4f6f2}
.submit-btn{flex:1}
.price-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:14px 0 6px}
.price-table{width:100%;border-collapse:collapse;font-family:var(--font-sans);font-size:14px;min-width:560px}
.price-table th{background:var(--navy);color:#fff;font-family:var(--font-disp);font-size:11px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;text-align:left;padding:10px 12px}
.price-table td{border-bottom:1px solid var(--border);padding:10px 12px;vertical-align:top;color:var(--text)}
.price-table tr:nth-child(even) td{background:#faf9f6}
.price-table td a{color:var(--blue);font-weight:600;text-decoration:none}
.price-table td a:hover{text-decoration:underline}
.blog-related{list-style:none;margin:10px 0 0;padding:0;border-left:3px solid var(--blue);padding-left:16px}
.blog-related li{margin-bottom:7px;font-family:var(--font-serif);font-size:15px}
.blog-related a{color:var(--blue);text-decoration:none;font-weight:600}
.blog-related a:hover{text-decoration:underline}
.hc-note{font-family:var(--font-serif);font-size:11px;color:var(--muted);text-align:center;margin-top:8px;font-style:italic}
.hc-error{margin-top:10px;padding:9px 11px;background:#fee;border:1px solid #f99;border-radius:4px;color:#900;font-size:12px;font-family:var(--font-sans)}

/* ── SECTIONS ── */
.section{padding:72px 48px;background:#fff !important}
.section-alt{padding:72px 48px;background:var(--cream) !important}
.section-navy{padding:72px 48px;background:var(--navy)}
.section-silver{padding:72px 48px;background:var(--silver)}
.sec-kicker{font-family:var(--font-disp);font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--blue);margin-bottom:8px}
.sec-kicker-lite{font-family:var(--font-disp);font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--tan-light);margin-bottom:8px}
.sec-title{font-family:var(--font-disp);font-size:40px;font-weight:700;color:var(--navy);line-height:1.05;margin-bottom:12px}
.sec-title-w{font-family:var(--font-disp);font-size:40px;font-weight:700;color:#fff;line-height:1.05;margin-bottom:12px}
.sec-sub{font-family:var(--font-serif);font-size:16px;color:var(--muted);line-height:1.75;max-width:640px;margin-bottom:48px}
.sec-sub-w{font-family:var(--font-serif);font-size:16px;color:rgba(255,255,255,.7);line-height:1.75;max-width:640px;margin-bottom:48px}

/* ── SERVICES GRID ── */
.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.svc-card{border:1px solid var(--border);background:#fff;padding:0;overflow:hidden;position:relative;transition:box-shadow .2s}
.svc-card:hover{box-shadow:0 4px 20px rgba(26,63,111,.14);z-index:1}
.svc-img{width:100%;height:170px;object-fit:cover;display:block}
.svc-body{padding:22px}
.svc-icon{width:42px;height:42px;background:var(--navy);border-radius:5px;display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.svc-icon svg{width:22px;height:22px;fill:#fff}
.svc-card h3{font-family:var(--font-disp);font-size:17px;font-weight:700;color:var(--navy);margin-bottom:8px;text-transform:uppercase;letter-spacing:.3px;line-height:1.2}
.svc-card p{font-size:13px;color:var(--muted);line-height:1.65;margin-bottom:12px}
.svc-bullets{list-style:none;padding:0;margin-bottom:14px}
.svc-bullets li{font-size:12px;color:var(--text);padding:3px 0;padding-left:14px;position:relative;line-height:1.4}
.svc-bullets li::before{content:'';position:absolute;left:0;top:9px;width:5px;height:5px;border-radius:50%;background:var(--blue)}
.svc-price{font-family:var(--font-disp);font-size:11px;font-weight:700;color:var(--blue);text-transform:uppercase;letter-spacing:.5px;padding:4px 10px;background:rgba(26,63,111,.08);border-radius:3px;display:inline-block;margin-bottom:12px}
.svc-link{font-family:var(--font-disp);font-size:12px;font-weight:700;color:var(--blue);text-transform:uppercase;letter-spacing:.5px;text-decoration:none}
.svc-link:hover{color:var(--navy)}

/* ── ABOUT ── */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.about-main-img{width:100%;height:340px;object-fit:cover;border-radius:8px;display:block;margin-bottom:12px}
.about-creds-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cred-badge{background:#fff;border:1.5px solid var(--border);border-radius:6px;padding:14px;text-align:center}
.cred-badge-icon{font-size:24px;display:block;margin-bottom:6px}
.cred-badge-name{font-family:var(--font-disp);font-size:12px;font-weight:700;color:var(--navy);text-transform:uppercase;letter-spacing:.5px;line-height:1.3}
.owner-block{display:flex;align-items:center;gap:14px;background:#fff;border:1.5px solid var(--border);border-radius:8px;padding:16px;margin-bottom:22px}
.owner-avatar{width:68px;height:68px;border-radius:50%;border:3px solid var(--blue);display:flex;align-items:center;justify-content:center;font-family:var(--font-disp);font-size:20px;font-weight:700;color:var(--tan-light);flex-shrink:0;background:var(--navy)}
.owner-name{font-family:var(--font-disp);font-size:20px;font-weight:700;color:var(--navy)}
.owner-title{font-size:13px;color:var(--muted);margin-top:2px}
.owner-since{font-size:12px;color:var(--blue);font-weight:600;margin-top:3px}
.about-body{font-family:var(--font-serif);font-size:15px;color:var(--muted);line-height:1.8;margin-bottom:18px}
.cred-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:16px}
.cred-item{background:var(--cream);border:1px solid var(--border);border-left:3px solid var(--blue);border-radius:0 5px 5px 0;padding:10px 12px}
.cred-label{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:2px}
.cred-val{font-family:var(--font-disp);font-size:13px;font-weight:700;color:var(--navy)}
.stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:22px}
.stat-box{background:var(--navy);border-radius:6px;padding:14px;text-align:center}
.stat-num{font-family:var(--font-disp);font-size:28px;font-weight:700;color:var(--tan-light);display:block;line-height:1}
.stat-label{font-size:11px;color:rgba(255,255,255,.6);text-transform:uppercase;letter-spacing:.5px;margin-top:4px}

/* ── WHY US ── */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px}
.why-item{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:22px;display:flex;align-items:flex-start;gap:14px}
.why-check{width:22px;height:22px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px}
.why-check svg{width:10px;height:10px;fill:#fff}
.why-title{font-family:var(--font-disp);font-size:14px;font-weight:700;color:#fff;margin-bottom:5px;text-transform:uppercase;letter-spacing:.3px}
.why-desc{font-size:13px;color:rgba(255,255,255,.6);line-height:1.55}

/* ── PROCESS ── */
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative}
.process-grid::before{content:'';position:absolute;top:34px;left:12%;right:12%;height:2px;background:rgba(26,63,111,.25)}
.proc-step{text-align:center;padding:0 14px}
.proc-circle{width:68px;height:68px;border-radius:50%;border:2px solid var(--blue);background:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;box-shadow:0 3px 14px rgba(26,63,111,.18);position:relative;z-index:1}
.proc-num{font-family:var(--font-disp);font-size:24px;font-weight:700;color:var(--blue)}
.proc-title{font-family:var(--font-disp);font-size:14px;font-weight:700;color:#fff;margin-bottom:6px;text-transform:uppercase;letter-spacing:.3px}
.proc-desc{font-size:13px;color:rgba(255,255,255,.65);line-height:1.6}

/* ── GALLERY ── */
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.gallery-img{width:100%;height:210px;object-fit:cover;display:block;border-radius:4px;transition:opacity .2s}
.gallery-img:hover{opacity:.88}
/* Tall portrait shots whose subject sits low in the frame: a centred cover-crop
   shows sky/treetops instead of the concrete. Bias the crop downwards. */
.gallery-img.focus-low{object-position:50% 78%}
/* Work blocks inside a service page's main column — fewer, larger tiles than
   the homepage gallery, since the column is ~900px not full width. */
.work-grid{grid-template-columns:repeat(2,1fr);gap:10px;margin:14px 0 26px}
.work-grid .gallery-img{height:240px;border-radius:6px}
@media(max-width:560px){.work-grid{grid-template-columns:1fr}.work-grid .gallery-img{height:220px}}

/* ── REVIEWS ── */
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.rev-card{background:#fff;border:1.5px solid var(--border);border-radius:8px;padding:22px;position:relative}
.rev-mark{font-family:var(--font-serif);font-size:56px;color:var(--silver);position:absolute;top:6px;left:14px;line-height:1}
.rev-stars{color:var(--tan);font-size:14px;letter-spacing:1px;margin-bottom:8px;position:relative;z-index:1}
.rev-text{font-family:var(--font-serif);font-size:14px;color:var(--muted);line-height:1.7;margin-bottom:14px;position:relative;z-index:1}
.rev-bottom{display:flex;align-items:center;gap:8px}
.rev-ava{width:34px;height:34px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;font-family:var(--font-disp);font-size:12px;font-weight:700;color:var(--tan-light);flex-shrink:0}
.rev-name{font-family:var(--font-disp);font-size:12px;font-weight:700;color:var(--navy);text-transform:uppercase;letter-spacing:.5px}
.rev-service{font-size:11px;color:var(--muted)}

/* ── FAQ ── */
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 48px}
.faq-item{border-bottom:1px solid var(--border);padding:18px 0}
.faq-col .faq-item:first-child{border-top:1px solid var(--border)}
.faq-q{font-family:var(--font-disp);font-size:16px;font-weight:700;color:var(--navy);margin-bottom:7px;line-height:1.3}
.faq-a{font-family:var(--font-serif);font-size:14px;color:var(--muted);line-height:1.7}

/* ── SERVICE AREA ── */
.area-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.area-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:7px;padding:18px}
.area-card h3{font-family:var(--font-disp);font-size:14px;font-weight:700;color:var(--tan-light);text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid rgba(196,168,130,.25)}
.area-card ul{list-style:none}
.area-card ul li{font-size:13px;color:rgba(255,255,255,.65);padding:4px 0 4px 12px;min-height:26px;box-sizing:border-box;position:relative;line-height:1.5}
.area-card ul li>strong{display:block}
.area-card ul li::before{content:'';position:absolute;left:0;top:13px;width:4px;height:4px;border-radius:50%;background:rgba(196,168,130,.5)}
.area-intro{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:7px;padding:20px 28px;margin-bottom:24px}
.area-intro p{font-family:var(--font-serif);font-size:15px;color:rgba(255,255,255,.8);line-height:1.75}
.area-intro strong{color:var(--tan-light)}

/* ── FINANCING STRIP ── */
.financing-strip{background:var(--tan);padding:20px 48px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.fs-text{font-family:var(--font-disp);font-size:18px;font-weight:700;color:var(--navy);text-transform:uppercase;letter-spacing:.5px}
.fs-sub{font-family:var(--font-serif);font-size:14px;color:rgba(13,31,53,.8);margin-top:3px}
.fs-btn{font-family:var(--font-disp);font-size:14px;font-weight:700;background:var(--navy);color:#fff;padding:12px 28px;border-radius:4px;text-decoration:none;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}

/* ── CTA BANNER ── */
.cta-banner{background:var(--blue);padding:60px 48px;display:grid;grid-template-columns:1fr auto;gap:48px;align-items:center;position:relative;overflow:hidden}
.cta-banner::before{content:'';position:absolute;right:-60px;top:-60px;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,.06);pointer-events:none}
.cb-title{font-family:var(--font-disp);font-size:40px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:1.5px;line-height:1.05;margin-bottom:12px}
.cb-sub{font-family:var(--font-serif);font-size:16px;color:rgba(255,255,255,.9);line-height:1.7;max-width:560px}
.cb-actions{display:flex;flex-direction:column;gap:12px;align-items:flex-end;flex-shrink:0}
.cb-phone{font-family:var(--font-disp);font-size:34px;font-weight:700;color:#fff;text-align:center;letter-spacing:.5px;text-decoration:none}
.cb-phone-sub{font-size:12px;color:rgba(255,255,255,.7);text-align:center;text-transform:uppercase;letter-spacing:1px;margin-top:2px}
.cb-btn{font-family:var(--font-disp);font-size:15px;font-weight:700;background:#fff;color:var(--blue);padding:14px 32px;border-radius:4px;text-decoration:none;text-transform:uppercase;letter-spacing:.5px;display:block;text-align:center;white-space:nowrap}

/* ── MOBILE STICKY ── */
.mobile-sticky{display:flex;background:var(--blue);border-top:2px solid rgba(255,255,255,.2);padding:10px 14px;align-items:center;justify-content:space-between;gap:10px;position:fixed;bottom:0;left:0;right:0;z-index:90}
.ms-estimate{flex:1;font-family:var(--font-disp);font-size:14px;font-weight:700;background:#fff;color:var(--blue);padding:12px 10px;border-radius:5px;text-transform:uppercase;letter-spacing:.5px;text-decoration:none;text-align:center}
.ms-call{flex:1;font-family:var(--font-disp);font-size:15px;font-weight:700;background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.5);color:#fff;padding:11px 10px;border-radius:5px;letter-spacing:.3px;text-decoration:none;text-align:center;white-space:nowrap;display:flex;align-items:center;justify-content:center;gap:7px}
.ms-call-icon{width:16px;height:16px;fill:#fff;flex-shrink:0}

/* ── FOOTER ── */
footer{background:var(--navy);border-top:3px solid var(--tan);padding:48px 48px 28px}
.footer-logo{display:flex;flex-direction:column;font-family:var(--font-disp);color:#fff;text-transform:uppercase;line-height:1;margin-bottom:16px}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:32px;margin-bottom:36px}
.fg-col h2{font-family:var(--font-disp);font-size:13px;font-weight:700;color:var(--tan-light);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid rgba(196,168,130,.2)}
.fg-col p,.fg-col li{font-size:13px;color:rgba(255,255,255,.5);line-height:2}
.fg-col ul{list-style:none}
.fg-col ul li a{color:rgba(255,255,255,.5);text-decoration:none}
.fg-col ul li a:hover{color:#fff}
.fg-nap{font-size:13px;color:rgba(255,255,255,.55);line-height:2}
.fg-nap strong{color:rgba(255,255,255,.85)}
.fg-nap a{color:rgba(255,255,255,.55);text-decoration:none}
.fg-lic{font-size:11px;color:rgba(255,255,255,.55);line-height:1.7;margin-top:8px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.07);padding-top:18px;display:flex;justify-content:space-between;align-items:center;gap:12px}
.footer-copy{font-size:12px;color:rgba(255,255,255,.55)}
.footer-copy a{color:rgba(255,255,255,.55);text-decoration:underline}

/* ── SERVICE DETAIL PAGE ── */
.svc-detail-grid{display:grid;grid-template-columns:1fr 400px;gap:48px;align-items:start}
.svc-detail-main h2{font-family:var(--font-disp);font-size:30px;font-weight:700;color:var(--navy);text-transform:uppercase;letter-spacing:.5px;margin:32px 0 14px;line-height:1.1}
.svc-detail-main h2:first-child{margin-top:0}
.svc-detail-main h3{font-family:var(--font-disp);font-size:20px;font-weight:700;color:var(--navy);margin:24px 0 10px;text-transform:uppercase;letter-spacing:.3px}
.svc-detail-main p{font-family:var(--font-serif);font-size:15.5px;color:var(--text);line-height:1.8;margin-bottom:16px}
.svc-detail-main ul{margin:0 0 18px 0;padding-left:0;list-style:none}
.svc-detail-main ul li{font-family:var(--font-sans);font-size:15px;color:var(--text);line-height:1.5;padding:6px 0 6px 26px;position:relative}
.svc-detail-main ul li::before{content:'';position:absolute;left:4px;top:13px;width:7px;height:7px;border-radius:50%;background:var(--blue)}
.svc-detail-main ul li strong{color:var(--navy)}
.svc-hero-img{width:100%;height:360px;object-fit:cover;border-radius:8px;margin-bottom:24px}
.svc-sidebar{position:sticky;top:94px}
/* Grid items default to min-width:auto, so a wide child (the price table's
   min-width:560px) pushes the whole column past the viewport and body's
   overflow-x:hidden then CLIPS the text. min-width:0 lets the column shrink
   so .price-table-wrap can scroll the table instead. */
.svc-detail-main,.svc-sidebar{min-width:0}
.svc-sidebar .est-form-card{padding:26px}
.sidebar-trust{background:var(--navy);border-radius:8px;padding:22px;margin-top:18px}
.sidebar-trust h3{font-family:var(--font-disp);font-size:14px;font-weight:700;color:var(--tan-light);text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}
.sidebar-trust ul{list-style:none}
.sidebar-trust ul li{font-size:13px;color:rgba(255,255,255,.75);padding:5px 0 5px 22px;position:relative;line-height:1.5}
.sidebar-trust ul li::before{content:'✓';position:absolute;left:0;color:var(--tan);font-weight:700}

/* ── CONTACT ── */
.contact-quick-row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:40px}
.contact-info-card{background:#fff;border:1.5px solid var(--border);border-top:4px solid var(--blue);border-radius:8px;padding:26px;text-align:center}
.cic-icon{width:54px;height:54px;border-radius:50%;background:var(--navy);display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.cic-icon svg{width:26px;height:26px;fill:#fff}
.cic-label{font-family:var(--font-disp);font-size:12px;font-weight:700;color:var(--blue);text-transform:uppercase;letter-spacing:1px;margin-bottom:6px}
.cic-value{font-family:var(--font-disp);font-size:20px;font-weight:700;color:var(--navy);text-decoration:none;line-height:1.25;display:block}
.cic-sub{font-size:13px;color:var(--muted);margin-top:4px}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}

/* ── GBP MAP ── */
.gbp-map iframe{width:100%;height:360px;max-width:1200px;margin:0 auto;display:block;border:none;border-radius:6px;background:#eee}

/* ── PROSE (privacy) ── */
.prose-wrap{max-width:820px;margin:0 auto}
.prose-wrap h2{font-family:var(--font-disp);font-size:24px;color:var(--navy);text-transform:uppercase;letter-spacing:.5px;margin:28px 0 10px}
.prose-wrap p{font-family:var(--font-serif);font-size:15px;color:var(--text);line-height:1.8;margin-bottom:14px}
.prose-wrap ul{margin:0 0 16px 22px}
.prose-wrap li{font-family:var(--font-serif);font-size:15px;color:var(--text);line-height:1.7;margin-bottom:6px}

/* ── RESPONSIVE ── */
.top-bar,.anchor-strip,.section,.section-navy,.section-alt,.section-silver,.cta-banner,footer,nav,.proof-bar,.page-header,.financing-strip{width:100%;box-sizing:border-box}

@media(max-width:1024px){
  nav,.anchor-strip,.section,.section-navy,.section-alt,.section-silver,.cta-banner,footer,.page-header,.financing-strip{padding-left:32px;padding-right:32px}
  .hero{grid-template-columns:1fr;gap:0}
  .hero-copy{padding:48px 32px}
  .hero-media{min-height:300px;order:-1}
  .estimate-section{padding:52px 32px}
  .estimate-wrap{grid-template-columns:1fr;gap:32px}
  .est-head{font-size:34px}
  .proof-bar{flex-wrap:wrap;gap:12px;padding:16px 32px}
  .pdiv{display:none}
  .services-grid{grid-template-columns:repeat(2,1fr)}
  .about-grid{grid-template-columns:1fr;gap:32px}
  .why-grid{grid-template-columns:1fr 1fr}
  .process-grid::before{display:none}
  .reviews-grid{grid-template-columns:repeat(2,1fr)}
  .faq-grid{grid-template-columns:1fr}
  .area-grid{grid-template-columns:repeat(2,1fr)}
  .cta-banner{grid-template-columns:1fr;gap:24px;text-align:center}
  .cb-actions{align-items:center}
  .cb-sub{max-width:none}
  .footer-grid{grid-template-columns:repeat(2,1fr);gap:24px}
  .gallery-grid{grid-template-columns:repeat(3,1fr)}
  .stat-row{grid-template-columns:repeat(2,1fr)}
  .financing-strip{flex-direction:column;text-align:center}
  .svc-detail-grid{grid-template-columns:1fr;gap:32px}
  .svc-sidebar{position:static}
  .ph-title{font-size:36px}
  .contact-grid{grid-template-columns:1fr;gap:32px}
}
@media(max-width:768px){
  .marquee-track .mq-item{font-size:12px;letter-spacing:1px}
  .marquee-track .mq-sep{padding:0 16px}
  nav{padding:0 20px;height:62px}
  .nav-links,.nav-phone,.nav-right{display:none}
  .dropdown-menu{top:62px}
  .mobile-nav-open{top:62px}
  .mobile-nav-toggle{display:flex}
  .nav-cta{font-size:12px;padding:7px 13px}
  .logo-text-top{font-size:12px;letter-spacing:.24em;margin-bottom:4px}
  .logo-text-main{font-size:19px}
  .hero-copy{padding:36px 20px}
  .hero-media{min-height:230px}
  .estimate-section{padding:40px 20px}
  .est-head{font-size:28px}
  .est-form-card{padding:22px}
  .hero h1{font-size:36px}
  .hero-sub{font-size:14px}
  .hero-ctas{flex-direction:column}
  .hero-ctas a{text-align:center}
  .proof-bar{padding:14px 20px}
  .pq{display:none}
  .section,.section-navy,.section-alt,.section-silver,.page-header{padding:44px 20px}
  .sec-title,.sec-title-w{font-size:30px}
  .ph-title{font-size:30px}
  .services-grid{grid-template-columns:1fr}
  .about-main-img{height:240px}
  .stat-row{grid-template-columns:repeat(2,1fr)}
  .why-grid{grid-template-columns:1fr}
  .process-grid{grid-template-columns:repeat(2,1fr);gap:24px 0}
  .reviews-grid{grid-template-columns:1fr}
  .area-grid{grid-template-columns:1fr}
  .gallery-grid{grid-template-columns:repeat(2,1fr)}
  .cta-banner{padding:36px 20px}
  .cb-title{font-size:28px}
  .cb-phone{font-size:26px}
  footer{padding:36px 20px 90px}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;gap:8px;text-align:center}
  .contact-quick-row{grid-template-columns:1fr}
  body{padding-bottom:0}
}
@media(max-width:480px){
  .hero h1{font-size:30px}
  .sec-title,.sec-title-w,.ph-title{font-size:25px}
  .cb-title{font-size:23px}
  .gallery-grid{grid-template-columns:1fr 1fr}
}

/* ── WIDE LOCATIONS DROPDOWN ── */
.dropdown-menu-wide{min-width:560px;display:none;column-count:2;column-gap:0;padding:14px 0}
.nav-dropdown:hover .dropdown-menu-wide,.nav-dropdown:focus-within .dropdown-menu-wide{display:block}
.dropdown-menu-wide .dropdown-heading{break-inside:avoid;margin-top:0}
.dropdown-menu-wide a{break-inside:avoid}
@media(max-width:768px){.dropdown-menu-wide{min-width:0;column-count:1}}


/* ── BLOG ── */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:24px}
.blog-card{display:block;background:#fff;border:1.5px solid var(--border);border-radius:8px;padding:28px;text-decoration:none;transition:box-shadow .2s,transform .2s;border-top:4px solid var(--blue)}
.blog-card:hover{box-shadow:0 8px 30px rgba(13,31,53,.12);transform:translateY(-2px)}
.blog-card-cat{font-family:var(--font-disp);font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--blue);margin-bottom:10px}
.blog-card-title{font-family:var(--font-disp);font-size:22px;font-weight:700;color:var(--navy);line-height:1.2;margin-bottom:12px}
.blog-card-excerpt{font-family:var(--font-serif);font-size:14px;color:var(--muted);line-height:1.7;margin-bottom:16px}
.blog-card-link{font-family:var(--font-disp);font-size:13px;font-weight:700;color:var(--blue);text-transform:uppercase;letter-spacing:.5px}
.prose-wrap em,.svc-detail-main em{font-style:italic;color:var(--navy)}
.svc-detail-main table{width:100%;border-collapse:collapse;margin:0 0 18px;font-family:var(--font-sans);font-size:14px}

/* ── STICKY CALL BAR — all breakpoints ── */
@media(min-width:769px){
  .mobile-sticky{justify-content:center;gap:14px;padding:11px 24px}
  .ms-estimate,.ms-call{flex:0 0 auto;min-width:215px;font-size:15px;padding:12px 26px}
}
@media(max-width:400px){
  .ms-estimate,.ms-call{font-size:13px;padding:11px 6px}
}


/* ── PRICE TABLE ON PHONES ──
   Four columns cannot be read at 390px, and side-scrolling a table is a
   discoverability problem. Below 640px each row becomes a labelled card:
   the service name is the card header, the rest are label/value pairs fed
   by the data-label attributes on each <td>. */
@media(max-width:640px){
  .price-table-wrap{overflow-x:visible}
  .price-table{min-width:0;font-size:14px}
  .price-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
    overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  .price-table tbody,.price-table tr,.price-table td{display:block;width:100%}
  .price-table tr{border:1px solid var(--border);border-radius:6px;margin-bottom:14px;overflow:hidden}
  /* Specificity note: the base zebra rule ".price-table tr:nth-child(even) td"
     scores (0,2,2) and outranks a plain "td:first-child" (0,2,1), so the navy
     service header silently lost on even rows. Kill the stripe at equal
     specificity (later in source wins), then re-assert the header at (0,2,3). */
  .price-table tr:nth-child(even) td{background:transparent}
  .price-table td{display:flex;justify-content:space-between;align-items:baseline;gap:16px;
    border:0;border-bottom:1px solid var(--border);padding:10px 13px}
  .price-table td:last-child{border-bottom:0;flex-direction:column;align-items:flex-start;gap:4px}
  .price-table td::before{content:attr(data-label);font-family:var(--font-disp);font-size:10px;
    font-weight:700;letter-spacing:.8px;text-transform:uppercase;color:var(--muted);flex:0 0 auto}
  /* first cell is the service name — make it the card header, no label needed */
  .price-table tbody tr td:first-child{background:var(--navy);display:block;padding:11px 13px;
    font-family:var(--font-disp);font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}
  .price-table tbody tr td:first-child::before{display:none}
  .price-table tbody tr td:first-child a{color:#fff;text-decoration:none}
}
