/* ─────────────────────────────────────────────────────────────────────
   Charles Brown Paving & Excavating
   Design System — Direction A·B: "33 Years on the Job"
   Yellow + black industrial backbone, brake-red heritage stamp,
   Fraunces italic for warmth. Less blocky than A, more grounded than B.
   Class prefix: cb-*
   ───────────────────────────────────────────────────────────────────── */

:root{
  /* ── Palette — R4 "Asphalt Mellow"
        Pulled saturation way down. Muted dijon instead of safety
        yellow, rust instead of cone orange, deeper warm neutrals.
        Nothing should "pop" — the page should feel like a worn-in
        leather work jacket, not a hi-vis vest.                    ── */
  --cb-ink:           #14130F;  /* warm near-black */
  --cb-ink-soft:      #1E1C18;
  --cb-ink-2:         #25221D;  /* warm charcoal for dark sections */
  --cb-text:          #2A2620;  /* off-black body text */
  --cb-yellow:        #B68B2A;  /* muted dijon — was #FFC700 */
  --cb-yellow-dk:     #8E6B1E;
  --cb-yellow-soft:   #D4B872;  /* low-contrast accent on dark */
  --cb-orange:        #9C4A22;  /* deep rust — was #E55B13 */
  --cb-orange-dk:     #743716;
  --cb-red:           #6E2E22;  /* deeper brake-red */
  --cb-red-dk:        #4C1F17;
  --cb-gray:          #6B665D;  /* warm concrete */
  --cb-gray-light:    #BBB5A8;
  --cb-cream:         #E8DECA;  /* warmer, deeper than R3's #F4EFE3 */
  --cb-cream-deep:    #D8CCB3;  /* layered surfaces */
  --cb-paper:         #EFE7D4;  /* light surface (cards) — used inside .cb-card etc. */
  --cb-bg:            #1A1814;  /* DEFAULT page background — warm near-black */
  --cb-bg-2:          #211E18;  /* subtle dark variation for visual rhythm */
  --cb-bg-3:          #16140F;  /* deepest dark for high-emphasis sections */
  --cb-bg-card:       #2A2620;  /* dark card surface (for testimonials etc.) */
  --cb-text-dark:     #2A2620;  /* dark text — used INSIDE light cards */
  --cb-text-cream:    #E8DECA;  /* default text on dark page */
  --cb-text-mute:     #A89E89;  /* muted secondary text on dark */
  --cb-line:          #2A2620;
  --cb-line-light:    #C9C0AB;
  --cb-line-dark:     #34302A;
  --cb-white:         #F6F0DE;  /* warm off-white instead of pure white */

  /* ── Type ── */
  --cb-head:    'Oswald', 'Barlow Condensed', Impact, sans-serif;
  --cb-body:    'Barlow', 'Segoe UI', system-ui, sans-serif;
  --cb-accent:  'Fraunces', Georgia, serif;   /* heritage warmth */
  --cb-mono:    ui-monospace, 'SFMono-Regular', Menlo, monospace;

  /* ── Sizing ── */
  --cb-radius:    8px;    /* SOFTENED from A's 4px */
  --cb-radius-sm: 4px;
  --cb-radius-lg: 12px;
  --cb-ease:      cubic-bezier(.4,0,.2,1);

  /* Spacing */
  --cb-stack-1: 6px;  --cb-stack-2: 12px;  --cb-stack-3: 18px;
  --cb-stack-4: 28px; --cb-stack-5: 44px;  --cb-stack-6: 72px;

  /* Shadows */
  --cb-shadow-sm: 0 4px 12px rgba(15,15,15,.08);
  --cb-shadow-md: 0 8px 24px rgba(15,15,15,.12);
  --cb-shadow-lg: 0 16px 40px rgba(15,15,15,.18);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{
  font-family:var(--cb-body);
  background:var(--cb-bg);
  color:var(--cb-text-cream);
  line-height:1.6;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none;transition:color .15s var(--cb-ease)}
button{font:inherit;cursor:pointer;background:none;border:0}
ul,ol{list-style:none}
::selection{background:var(--cb-yellow);color:var(--cb-ink)}

.cb-shell{max-width:1240px;margin:0 auto;padding:0 24px}

/* ─────────────────────────────────────────────────────────────────────
   TYPOGRAPHY SCALE
   ───────────────────────────────────────────────────────────────────── */
.cb-display{
  font-family:var(--cb-head);
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:-.005em;
  line-height:1;
  color:var(--cb-text-cream);
}
.cb-display-xxl{font-size:clamp(2.75rem, 7vw, 6rem); font-weight:700}
.cb-display-xl{font-size:clamp(2.2rem, 5vw, 4.2rem); font-weight:600}
.cb-display-lg{font-size:clamp(1.8rem, 3.6vw, 2.8rem); font-weight:600}
.cb-display-md{font-size:clamp(1.4rem, 2.4vw, 1.9rem); font-weight:600}

.cb-h2{
  font-family:var(--cb-head);
  font-weight:600;
  font-size:clamp(1.65rem, 2.8vw, 2.25rem);
  line-height:1.1;
  letter-spacing:-.005em;
  text-transform:uppercase;
  color:var(--cb-text-cream);
}
.cb-h3{
  font-family:var(--cb-head);
  font-weight:500;
  font-size:clamp(1.2rem, 1.9vw, 1.5rem);
  line-height:1.2;
  letter-spacing:.005em;
  text-transform:uppercase;
  color:var(--cb-text-cream);
}
.cb-eyebrow{
  font-family:var(--cb-head);
  font-weight:600;
  font-size:.78rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--cb-yellow-soft);
  display:inline-block;
  margin-bottom:var(--cb-stack-2);
}
.cb-accent{
  font-family:var(--cb-accent);
  font-style:italic;
  font-weight:500;
  letter-spacing:.005em;
}
.cb-lede{
  font-size:1.08rem;
  line-height:1.65;
  color:var(--cb-text-mute);
  max-width:60ch;
}
.cb-body-lg{font-size:1.06rem;line-height:1.7}
.cb-body{font-size:1rem;line-height:1.65}
.cb-body-sm{font-size:.92rem;line-height:1.55}
.cb-tag{
  font-family:var(--cb-mono);
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--cb-gray);
}

.cb-on-dark{color:var(--cb-white) !important}
.cb-on-dark.cb-eyebrow{color:var(--cb-yellow) !important}

/* ─────────────────────────────────────────────────────────────────────
   EST. 1993 — Heritage Stamp (new signature element)
   ───────────────────────────────────────────────────────────────────── */
.cb-stamp{
  display:inline-block;
  font-family:var(--cb-accent);
  font-style:italic;
  font-weight:600;
  color:var(--cb-red);
  border:3px solid var(--cb-red);
  padding:8px 18px 6px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:.86rem;
  line-height:1;
  transform:rotate(-4deg);
  background:transparent;
  position:relative;
  white-space:nowrap;
}
.cb-stamp::before{
  /* subtle ink-press fade — mottle the background */
  content:"";
  position:absolute;
  inset:-4px;
  border:1px solid rgba(160,58,43,.35);
  pointer-events:none;
}
.cb-stamp-lg{padding:14px 26px 12px;font-size:1.05rem;letter-spacing:.16em}
.cb-stamp-cream{background:var(--cb-cream)}

/* ─────────────────────────────────────────────────────────────────────
   BUTTONS — softer corners (8px), less aggressive padding
   ───────────────────────────────────────────────────────────────────── */
.cb-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:13px 26px;
  border-radius:var(--cb-radius);
  font-family:var(--cb-head);
  font-size:.92rem;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  border:2px solid transparent;
  cursor:pointer;
  transition:transform .15s var(--cb-ease), background-color .18s ease,
             color .15s ease, border-color .15s ease, box-shadow .2s ease;
  text-decoration:none;
  white-space:nowrap;
}
.cb-btn:hover{transform:translateY(-2px)}
.cb-btn-yellow{background:var(--cb-yellow);color:var(--cb-ink);border-color:var(--cb-yellow)}
.cb-btn-yellow:hover{background:var(--cb-yellow-dk);border-color:var(--cb-yellow-dk);
                     box-shadow:var(--cb-shadow-md)}
.cb-btn-orange{background:var(--cb-orange);color:var(--cb-white);border-color:var(--cb-orange)}
.cb-btn-orange:hover{background:var(--cb-orange-dk);border-color:var(--cb-orange-dk);
                     box-shadow:var(--cb-shadow-md)}
.cb-btn-ink{background:var(--cb-ink);color:var(--cb-white);border-color:var(--cb-ink)}
.cb-btn-ink:hover{background:var(--cb-orange);border-color:var(--cb-orange);box-shadow:var(--cb-shadow-md)}
/* On dark page default — cream stroke + cream text so it reads on dark surfaces.
   The email-CTA override below re-paints this for its lighter context. */
.cb-btn-outline{background:transparent;color:var(--cb-text-cream);border-color:var(--cb-text-cream)}
.cb-btn-outline:hover{background:var(--cb-text-cream);color:var(--cb-ink)}
.cb-btn-outline-yellow{background:transparent;color:var(--cb-yellow);border-color:var(--cb-yellow)}
.cb-btn-outline-yellow:hover{background:var(--cb-yellow);color:var(--cb-ink)}

.cb-btn-lg{padding:16px 32px;font-size:1rem}
.cb-btn-sm{padding:9px 18px;font-size:.78rem}

/* ─────────────────────────────────────────────────────────────────────
   CARDS — soft hover, 8px radius, 2px yellow top accent (softened from 4px)
   ───────────────────────────────────────────────────────────────────── */
.cb-card{
  background:var(--cb-white);
  border:1px solid var(--cb-line-light);
  border-top:2px solid var(--cb-yellow);
  border-radius:var(--cb-radius);
  padding:28px 28px;
  overflow:hidden;
  position:relative;       /* anchor for the stretched-link overlay */
  transition:transform .25s var(--cb-ease), box-shadow .25s var(--cb-ease),
             border-color .2s;
}
/* Stretched-link pattern: the existing cb-svc-more <a> grows an invisible
   ::after that covers the whole card, so any tap on the card navigates
   to the link's href. No HTML changes required. */
.cb-card a.cb-svc-more::after{
  content:"";position:absolute;inset:0;z-index:1;
}
.cb-card:has(a.cb-svc-more){cursor:pointer}
.cb-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--cb-shadow-md);
  border-color:rgba(255,199,0,.4);
}
.cb-card-dark{
  background:var(--cb-ink);
  color:var(--cb-white);
  border-color:var(--cb-line);
  border-top:2px solid var(--cb-yellow);
}
.cb-card-dark .cb-h3{color:var(--cb-white)}
.cb-card-orange{border-top-color:var(--cb-orange)}
.cb-card-red{border-top-color:var(--cb-red)}
.cb-card-flat{
  background:var(--cb-cream-deep);
  border:1px solid var(--cb-line-light);
  border-radius:var(--cb-radius);
  padding:26px 28px;
}

/* ─────────────────────────────────────────────────────────────────────
   STAT BLOCK — Oswald 700 numbers + Fraunces italic accents
   No more Bebas Neue. Less blocky.
   ───────────────────────────────────────────────────────────────────── */
.cb-stat{
  background:var(--cb-ink);
  color:var(--cb-white);
  padding:26px 24px;
  border-left:4px solid var(--cb-yellow);
  border-radius:var(--cb-radius);
  display:flex;
  flex-direction:column;
  gap:6px;
}
.cb-stat strong{
  font-family:var(--cb-head);
  font-size:clamp(2.4rem, 4.5vw, 3.5rem);
  font-weight:700;
  color:var(--cb-yellow);
  line-height:1;
}
.cb-stat strong em{
  font-family:var(--cb-accent);
  font-style:italic;
  font-weight:500;
  font-size:.7em;
  color:var(--cb-yellow);
}
.cb-stat span{
  font-family:var(--cb-head);
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:.78rem;
  font-weight:500;
  color:rgba(255,255,255,.8);
}

/* ─────────────────────────────────────────────────────────────────────
   HAZARD STRIPE — now only an accent, not signature. Default = thin.
   ───────────────────────────────────────────────────────────────────── */
.cb-hazard{
  height:6px;
  background-image:repeating-linear-gradient(
    -45deg,
    var(--cb-yellow) 0,
    var(--cb-yellow) 16px,
    var(--cb-ink) 16px,
    var(--cb-ink) 32px
  );
}
.cb-hazard-md{height:12px}
.cb-hazard-thick{height:18px}

/* ─────────────────────────────────────────────────────────────────────
   DIVIDERS
   ───────────────────────────────────────────────────────────────────── */
.cb-rule{
  height:3px;
  background:var(--cb-yellow);
  width:64px;
  margin:var(--cb-stack-3) 0;
  border-radius:2px;
}
.cb-rule-full{width:100%;height:1px;background:var(--cb-line-light)}
.cb-rule-thick{height:4px;background:var(--cb-ink);border-radius:2px}

/* ─────────────────────────────────────────────────────────────────────
   FORM ELEMENTS — softer focus, no hard offset shadow
   ───────────────────────────────────────────────────────────────────── */
.cb-field{display:block;margin-bottom:14px}
.cb-field label{
  display:block;
  font-family:var(--cb-head);
  font-size:.76rem;
  font-weight:500;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--cb-ink);
  margin-bottom:6px;
}
.cb-field input,
.cb-field textarea,
.cb-field select{
  width:100%;
  padding:13px 14px;
  border:1.5px solid var(--cb-line-light);
  background:var(--cb-white);
  font-family:var(--cb-body);
  font-size:.96rem;
  color:var(--cb-ink);
  border-radius:var(--cb-radius-sm);
  transition:border-color .15s, box-shadow .2s;
}
.cb-field input:focus,
.cb-field textarea:focus,
.cb-field select:focus{
  outline:0;
  border-color:var(--cb-orange);
  box-shadow:0 0 0 3px rgba(229,91,19,.16);
}
.cb-field textarea{resize:vertical;min-height:120px}

/* ─────────────────────────────────────────────────────────────────────
   SURFACES
   ───────────────────────────────────────────────────────────────────── */
/* DARK-MODE SURFACES — page is dark by default. These classes provide subtle
   tonal variation between sections for visual rhythm, not light/dark contrast. */
.cb-surf-cream     {background:var(--cb-bg-2)}   /* slightly lighter dark */
.cb-surf-cream-deep{background:var(--cb-bg-3)}   /* slightly deeper dark   */
.cb-surf-white     {background:var(--cb-bg-2)}
.cb-surf-ink       {background:var(--cb-bg-3);color:var(--cb-text-cream)}
.cb-surf-ink .cb-h2,.cb-surf-ink .cb-h3,.cb-surf-ink .cb-display{color:var(--cb-text-cream)}

/* DARK-MODE CARD RESET — light "island" cards floating on the dark canvas.
   Anything inside a .cb-card / .cb-why-card / .cb-area-card / .cb-quote
   reverts to dark text on cream so the cards read as bright content blocks. */
.cb-card, .cb-why-card, .cb-area-card, .cb-quote{
  color:var(--cb-text-dark);
}
.cb-card .cb-h2, .cb-card .cb-h3, .cb-card .cb-display,
.cb-why-card .cb-h2, .cb-why-card .cb-h3, .cb-why-card .cb-display,
.cb-area-card .cb-h2, .cb-area-card .cb-h3, .cb-area-card .cb-display,
.cb-quote .cb-h2, .cb-quote .cb-h3{
  color:var(--cb-ink);
}
.cb-card .cb-eyebrow,
.cb-why-card .cb-eyebrow,
.cb-area-card .cb-eyebrow{
  color:var(--cb-orange);
}
.cb-card .cb-body,
.cb-why-card .cb-body,
.cb-area-card .cb-body,
.cb-area-list,
.cb-quote .cb-quote-body{
  color:var(--cb-text-dark);
}

/* ─────────────────────────────────────────────────────────────────────
   STYLEGUIDE-ONLY HELPERS (removed once homepage replaces preview)
   ───────────────────────────────────────────────────────────────────── */
.sg-section{padding:56px 0;border-bottom:1px solid var(--cb-line-light)}
.sg-section-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  margin-bottom:32px;
  padding-bottom:14px;
  border-bottom:2px solid var(--cb-yellow);
}
.sg-section-head h2{font-family:var(--cb-head);font-weight:600;font-size:1.7rem;text-transform:uppercase}
.sg-section-head .cb-tag{margin-bottom:0}
.sg-swatch{display:flex;flex-direction:column;border-radius:var(--cb-radius);overflow:hidden;border:1px solid var(--cb-line-light)}
.sg-swatch-box{height:110px;position:relative}
.sg-swatch-meta{padding:10px 12px;background:var(--cb-white)}
.sg-swatch-meta strong{font-family:var(--cb-mono);font-size:.84rem;letter-spacing:.04em;display:block;color:var(--cb-ink)}
.sg-swatch-meta span{font-family:var(--cb-mono);font-size:.72rem;color:var(--cb-gray)}
.sg-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.sg-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.sg-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.sg-row{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.sg-row > strong{
  flex:0 0 140px;
  font-family:var(--cb-mono);
  font-size:.78rem;
  letter-spacing:.04em;
  color:var(--cb-gray);
  text-transform:uppercase;
  font-weight:400;
}

@media (max-width:880px){
  .sg-grid-4{grid-template-columns:1fr 1fr}
  .sg-grid-3{grid-template-columns:1fr}
  .sg-grid-2{grid-template-columns:1fr}
  .sg-section-head{flex-direction:column;gap:6px;align-items:flex-start}
}


/* ═══════════════════════════════════════════════════════════════════
   PHASE 5 — HOMEPAGE COMPONENTS
   ═══════════════════════════════════════════════════════════════════ */

/* TOP UTILITY MARQUEE */
.cb-marquee{
  background:var(--cb-ink);color:rgba(255,255,255,.78);padding:8px 0;
  font-family:var(--cb-head);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;
}
.cb-marquee-row{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px 24px}
.cb-marquee-left{display:flex;gap:8px 22px;flex-wrap:wrap}
.cb-marquee-left span{position:relative}
.cb-marquee-left span + span::before{
  content:"";position:absolute;left:-12px;top:50%;transform:translateY(-50%);
  width:2px;height:2px;background:var(--cb-yellow);border-radius:50%;
}
.cb-marquee-phone{display:inline-flex;align-items:center;gap:7px;color:var(--cb-yellow);font-weight:600;letter-spacing:.04em}
.cb-marquee-phone:hover{color:#fff}

/* STICKY HEADER / NAV */
.cb-nav{background:var(--cb-ink);position:sticky;top:0;z-index:90;border-bottom:3px solid var(--cb-yellow)}
.cb-nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;height:78px}
.cb-brand{display:inline-flex;align-items:center;gap:14px;text-decoration:none;flex-shrink:0}
.cb-brand-mark{
  display:inline-flex;align-items:center;justify-content:center;
  width:48px;height:48px;background:var(--cb-yellow);color:var(--cb-ink);
  font-family:var(--cb-head);font-weight:700;font-size:1.3rem;letter-spacing:.04em;
  border-radius:var(--cb-radius-sm);
}
.cb-brand-text{display:flex;flex-direction:column;line-height:1.05}
.cb-brand-top{font-family:var(--cb-head);font-weight:600;font-size:1.05rem;color:#fff;text-transform:uppercase;letter-spacing:.04em}
.cb-brand-sub{font-family:var(--cb-accent);font-style:italic;font-weight:500;font-size:.78rem;color:var(--cb-yellow);letter-spacing:.04em;margin-top:2px}

/* Image-based brand (real CB logo PNG: black panel w/ yellow excavator + wordmark) */
.cb-brand-img{padding:8px 0}
.cb-brand-img img{
  display:block;height:64px;width:auto;
  /* logo is transparent — sits flush against the warm-charcoal nav */
}
.cb-brand-img-foot img{height:64px;margin-bottom:12px;border-radius:6px}

/* ─────────────────────────────────────────────
   FOOTER BRAND — icon mark + text wordmark.
   Replaces the wide PNG-only brand block. Icon
   stays sharp at any size, name uses brand fonts.
   ───────────────────────────────────────────── */
.cb-foot-brand-mark{
  display:inline-flex;align-items:center;gap:16px;
  text-decoration:none;margin-bottom:18px;
}
.cb-foot-icon{
  flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
  width:54px;height:54px;
  background:transparent;border-radius:8px;overflow:hidden;
  /* Drop the drop-shadow too — the favicon tile sits flush against
     the dark footer now that there's no opaque black box behind it. */
}
.cb-foot-icon img{width:100%;height:100%;display:block}
.cb-foot-wordmark{display:flex;flex-direction:column;line-height:1.05}
.cb-foot-wordmark-top{
  font-family:var(--cb-head);font-weight:700;
  font-size:1.18rem;letter-spacing:.04em;
  color:#fff;text-transform:uppercase;
}
.cb-foot-wordmark-sub{
  font-family:var(--cb-accent);font-style:italic;font-weight:500;
  font-size:.86rem;letter-spacing:.03em;
  color:var(--cb-yellow-soft);margin-top:4px;
}

/* ─────────────────────────────────────────────
   BLOG — hub grid + individual post article
   ───────────────────────────────────────────── */
.cb-blog-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:28px;align-items:start;
}
.cb-blog-card{
  background:var(--cb-white);
  border:1px solid var(--cb-line-light);
  border-radius:var(--cb-radius);
  overflow:hidden;
  display:flex;flex-direction:column;
  transition:transform .25s var(--cb-ease),box-shadow .25s var(--cb-ease);
  color:var(--cb-text-dark);
}
.cb-blog-card:hover{transform:translateY(-3px);box-shadow:0 14px 28px -16px rgba(0,0,0,.35)}
.cb-blog-thumb{
  display:block;aspect-ratio:16/10;overflow:hidden;background:var(--cb-cream);
}
.cb-blog-thumb img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .5s var(--cb-ease);
}
.cb-blog-card:hover .cb-blog-thumb img{transform:scale(1.04)}
.cb-blog-card .cb-blog-meta,
.cb-blog-card .cb-blog-title,
.cb-blog-card .cb-blog-excerpt,
.cb-blog-card .cb-svc-more{padding-left:24px;padding-right:24px}
.cb-blog-meta{
  font-family:var(--cb-head);font-weight:500;
  font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--cb-orange);margin-top:22px;
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
}
.cb-blog-dot{opacity:.55}
.cb-blog-title{
  font-family:var(--cb-head);font-weight:600;
  font-size:1.18rem;line-height:1.25;letter-spacing:0;
  margin:10px 0 12px;color:var(--cb-ink);text-transform:none;
}
.cb-blog-title a{color:inherit;text-decoration:none}
.cb-blog-title a:hover{color:var(--cb-orange-dk)}
.cb-blog-excerpt{
  font-family:var(--cb-body);font-size:.98rem;line-height:1.6;
  color:var(--cb-text-dark);margin:0 0 18px;flex-grow:1;
}
.cb-blog-card .cb-svc-more{margin-bottom:24px;display:inline-block}

/* Feature card on hub — first post takes full row, larger */
.cb-blog-card-feature{
  grid-column:1 / -1;
  display:grid;grid-template-columns:1fr 1fr;gap:0;
  aspect-ratio:auto;
}
.cb-blog-card-feature .cb-blog-thumb{aspect-ratio:auto;height:100%}
.cb-blog-card-feature > div,
.cb-blog-card-feature .cb-blog-meta,
.cb-blog-card-feature .cb-blog-title,
.cb-blog-card-feature .cb-blog-excerpt,
.cb-blog-card-feature .cb-svc-more{padding-left:36px;padding-right:36px}
.cb-blog-card-feature .cb-blog-meta{margin-top:36px}
.cb-blog-card-feature .cb-blog-title{font-size:1.85rem;line-height:1.15}
.cb-blog-card-feature .cb-blog-excerpt{font-size:1.05rem;margin-bottom:24px}
.cb-blog-card-feature .cb-svc-more{margin-bottom:36px}

/* Article (individual post) layout */
.cb-article-wrap{position:relative}
.cb-article-hero{
  margin:0;padding:0 0 8px;
}
.cb-article-hero img{
  width:100%;max-height:520px;object-fit:cover;border-radius:var(--cb-radius);
  display:block;
}
.cb-article{
  max-width:740px;margin:0 auto;color:var(--cb-text-cream);
}
.cb-article .cb-article-lead{
  font-family:var(--cb-body);font-size:1.18rem;line-height:1.65;
  color:var(--cb-text-cream);margin:0 0 28px;
  border-left:3px solid var(--cb-yellow);padding-left:18px;
}
.cb-article p{
  font-family:var(--cb-body);font-size:1.06rem;line-height:1.75;
  color:var(--cb-text-cream);margin:0 0 20px;
}
.cb-article h2{
  font-family:var(--cb-head);font-weight:600;
  font-size:1.6rem;line-height:1.2;letter-spacing:.005em;
  color:var(--cb-text-cream);
  text-transform:none;margin:44px 0 14px;
}
.cb-article h3{
  font-family:var(--cb-head);font-weight:500;
  font-size:1.25rem;line-height:1.3;
  color:var(--cb-text-cream);
  text-transform:none;margin:32px 0 10px;
}
.cb-article ul.cb-article-list{
  list-style:none;padding:0;margin:0 0 22px;
  display:flex;flex-direction:column;gap:10px;
}
.cb-article-list li{
  position:relative;padding:4px 0 4px 26px;
  font-family:var(--cb-body);font-size:1.04rem;line-height:1.65;
  color:var(--cb-text-cream);
}
.cb-article-list li::before{
  content:"";position:absolute;left:0;top:14px;
  width:12px;height:3px;background:var(--cb-yellow);
}
.cb-article strong{color:#fff}
.cb-article em{font-family:var(--cb-accent);font-style:italic;color:var(--cb-yellow-soft)}
.cb-article a{color:var(--cb-yellow-soft);text-decoration:underline;text-underline-offset:3px}
.cb-article a:hover{color:#fff}
.cb-article-sep{
  border:0;border-top:1px solid var(--cb-line-dark);
  margin:36px 0 24px;
}
.cb-article-sig{
  font-family:var(--cb-accent);font-style:italic;
  color:var(--cb-text-mute);font-size:1.02rem;
}
.cb-blog-author{font-style:normal}
/* Inline review/TODO note inside legal article body — dimmed italic */
.cb-article-note{
  font-family:var(--cb-accent,'Fraunces');font-style:italic;
  font-size:.92rem;color:var(--cb-text-mute);
  background:rgba(182,139,42,.06);
  border-left:3px solid var(--cb-yellow-soft);
  padding:12px 16px;margin:22px 0;
  border-radius:0 4px 4px 0;
}
.cb-article code{
  font-family:var(--cb-mono,monospace);
  font-size:.92em;
  background:rgba(212,184,114,.12);
  border:1px solid var(--cb-line-dark);
  border-radius:3px;padding:1px 6px;
  color:var(--cb-yellow-soft);
}

/* ─────────────────────────────────────────────
   GALLERY PAGE — masonry-style wall + filter chips
   ───────────────────────────────────────────── */
.cb-gallery-filters{
  display:flex;flex-wrap:wrap;gap:10px;
  margin:0 0 32px;justify-content:center;
}
.cb-gallery-filter{
  font-family:var(--cb-head);font-weight:500;font-size:.82rem;
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--cb-text-mute);text-decoration:none;
  padding:9px 18px;border:1px solid var(--cb-line-dark);
  border-radius:999px;transition:all .15s;
}
.cb-gallery-filter:hover{
  color:var(--cb-yellow-soft);border-color:var(--cb-yellow-soft);
}
.cb-gallery-filter-active{
  background:var(--cb-yellow);color:var(--cb-ink);
  border-color:var(--cb-yellow);
}
.cb-gallery-filter-active:hover{
  background:var(--cb-yellow-dk);color:var(--cb-ink);border-color:var(--cb-yellow-dk);
}

.cb-gallery-wall{
  display:grid;grid-template-columns:repeat(3,1fr);
  grid-auto-rows:240px;gap:14px;
}
.cb-gallery-tile{
  position:relative;margin:0;overflow:hidden;
  border-radius:var(--cb-radius);background:var(--cb-cream);
  cursor:pointer;
  transition:transform .3s var(--cb-ease), box-shadow .3s var(--cb-ease);
}
.cb-gallery-tile:hover{transform:translateY(-3px);box-shadow:0 14px 28px -16px rgba(0,0,0,.5)}
.cb-gallery-tile-wide{grid-column:span 2}
.cb-gallery-tile img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .5s var(--cb-ease);
}
.cb-gallery-tile:hover img{transform:scale(1.06)}
.cb-gallery-tile figcaption{
  position:absolute;left:0;right:0;bottom:0;
  padding:18px 18px 14px;
  background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.85) 100%);
  color:#fff;
  display:flex;flex-direction:column;gap:2px;
  transform:translateY(8px);opacity:.92;
  transition:transform .25s, opacity .25s;
}
.cb-gallery-tile:hover figcaption{transform:translateY(0);opacity:1}
.cb-gallery-cat{
  font-family:var(--cb-head);font-weight:600;
  font-size:.95rem;letter-spacing:.04em;
  color:#fff;
}
.cb-gallery-loc{
  font-family:var(--cb-accent);font-style:italic;
  font-size:.82rem;color:var(--cb-yellow-soft);
}

@media (max-width:880px){
  .cb-gallery-wall{grid-template-columns:repeat(2,1fr);grid-auto-rows:200px}
  .cb-gallery-tile-wide{grid-column:span 2}
}
@media (max-width:540px){
  .cb-gallery-wall{grid-template-columns:1fr;grid-auto-rows:220px}
  .cb-gallery-tile-wide{grid-column:span 1}
  .cb-gallery-filters{gap:6px}
  .cb-gallery-filter{padding:7px 12px;font-size:.74rem}
}

/* ─────────────────────────────────────────────
   SITEMAP — sectioned link list on /sitemap.html
   ───────────────────────────────────────────── */
.cb-map-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:36px 56px;
  max-width:1100px;margin-inline:auto;
}
.cb-map-section .cb-h3{
  color:var(--cb-yellow-soft);margin-bottom:14px;
  border-bottom:1px solid var(--cb-line-dark);padding-bottom:10px;
  display:flex;align-items:baseline;justify-content:space-between;gap:14px;
}
.cb-map-count{
  font-family:var(--cb-head);font-weight:500;font-size:.72rem;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--cb-text-mute);
  background:var(--cb-ink-2);
  border:1px solid var(--cb-line-dark);
  border-radius:999px;padding:3px 12px;
  white-space:nowrap;
}
.cb-map-total{
  display:inline-flex;align-items:baseline;gap:14px;
  margin-top:24px;padding:18px 22px;
  background:var(--cb-ink-2);border:1px solid var(--cb-line-dark);
  border-left:4px solid var(--cb-yellow);
  border-radius:8px;
}
.cb-map-total-num{
  font-family:var(--cb-head);font-weight:700;
  font-size:clamp(2rem, 4vw, 3rem);line-height:1;
  color:var(--cb-yellow-soft);
  letter-spacing:-.01em;
}
.cb-map-total-label{
  font-family:var(--cb-body);font-size:1rem;line-height:1.4;
  color:var(--cb-text-cream);
}

/* ─────────────────────────────────────────────
   404 PAGE — large number, friendly explainer, quick links
   ───────────────────────────────────────────── */
.cb-404{
  padding:80px 0 100px;
  background:linear-gradient(180deg,var(--cb-bg) 0%,var(--cb-bg-2) 100%);
  color:var(--cb-text-cream);
}
.cb-404-inner{max-width:760px}
.cb-404-num{
  font-family:var(--cb-head);font-weight:700;
  font-size:clamp(5rem, 14vw, 9rem);line-height:.9;
  color:var(--cb-yellow);
  margin:14px 0 0;letter-spacing:-.02em;
}
.cb-404-links{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;
  margin-top:36px;
}
.cb-404-link{
  display:flex;flex-direction:column;gap:3px;
  background:var(--cb-ink-2);
  border:1px solid var(--cb-line-dark);
  border-left:3px solid var(--cb-yellow);
  border-radius:6px;
  padding:18px 20px;text-decoration:none;
  transition:transform .15s, border-color .15s;
}
.cb-404-link:hover{
  transform:translateY(-2px);
  border-left-color:var(--cb-yellow-soft);
  border-color:var(--cb-yellow-soft);
}
.cb-404-link-label{
  font-family:var(--cb-head);font-weight:600;
  font-size:1.06rem;letter-spacing:.005em;
  color:var(--cb-text-cream);text-transform:none;
}
.cb-404-link-sub{
  font-family:var(--cb-body);font-size:.84rem;
  color:var(--cb-text-mute);
}
.cb-404-call{
  margin-top:48px;padding-top:32px;
  border-top:1px solid var(--cb-line-dark);
  text-align:center;
}

@media (max-width:880px){
  .cb-404-links{grid-template-columns:1fr 1fr}
}
@media (max-width:540px){
  .cb-404-links{grid-template-columns:1fr}
  .cb-404{padding:60px 0 80px}
}

/* ─────────────────────────────────────────────
   FAQ PAGE — categories of expandable Q/A blocks
   ───────────────────────────────────────────── */
.cb-faq-cat{margin-bottom:48px}
.cb-faq-cat-title{
  font-size:clamp(1.4rem, 2.4vw, 1.85rem);
  color:var(--cb-yellow-soft);text-transform:none;
  letter-spacing:.005em;margin-bottom:18px;
  border-bottom:1px solid var(--cb-line-dark);padding-bottom:12px;
}
.cb-faq-list{display:flex;flex-direction:column;gap:8px}
.cb-faq-item{
  background:var(--cb-ink-2);
  border:1px solid var(--cb-line-dark);
  border-radius:8px;overflow:hidden;
  transition:border-color .18s ease;
}
.cb-faq-item[open]{border-color:var(--cb-yellow-soft)}
.cb-faq-item summary{
  list-style:none;cursor:pointer;
  padding:18px 22px;
  font-family:var(--cb-head);font-weight:500;
  font-size:1.05rem;line-height:1.35;letter-spacing:.005em;
  color:var(--cb-text-cream);
  display:flex;justify-content:space-between;align-items:flex-start;gap:18px;
  transition:color .15s;
}
.cb-faq-item summary::-webkit-details-marker{display:none}
.cb-faq-item summary::after{
  content:"+";
  flex-shrink:0;font-family:var(--cb-head);font-weight:500;
  font-size:1.5rem;line-height:1;color:var(--cb-yellow);
  width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;
  transition:transform .25s ease;
}
.cb-faq-item[open] summary::after{transform:rotate(45deg)}
.cb-faq-item summary:hover{color:var(--cb-yellow-soft)}
.cb-faq-a{
  padding:0 22px 20px;border-top:1px solid var(--cb-line-dark);
  font-family:var(--cb-body);
}
.cb-faq-a p{
  margin:14px 0 0;font-size:1rem;line-height:1.7;
  color:var(--cb-text-cream);
}
.cb-faq-a a{color:var(--cb-yellow-soft);text-decoration:underline;text-underline-offset:3px}
.cb-faq-a a:hover{color:#fff}

/* Special section: Services × Cities — grid of city cards each
   containing 6 service links. Spans full width inside the sitemap. */
.cb-map-section-cities{grid-column:1 / -1}
.cb-map-section-blurb{
  font-family:var(--cb-body);font-size:.96rem;line-height:1.5;
  color:var(--cb-text-mute);margin:-6px 0 18px;
}
.cb-map-city-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;
}
.cb-map-city-card{
  background:var(--cb-ink-2);
  border:1px solid var(--cb-line-dark);
  border-radius:8px;
  padding:18px 20px 14px;
  transition:transform .18s ease, border-color .18s ease;
}
.cb-map-city-card:hover{
  transform:translateY(-2px);
  border-color:var(--cb-yellow-soft);
}
.cb-map-city-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding-bottom:12px;margin-bottom:8px;
  border-bottom:1px solid var(--cb-line-dark);
}
.cb-map-city-name{
  font-family:var(--cb-head);font-weight:600;
  font-size:1.18rem;letter-spacing:.005em;
  color:var(--cb-yellow-soft);text-decoration:none;
}
.cb-map-city-name:hover{color:var(--cb-yellow);text-decoration:underline}
.cb-map-city-county{
  font-family:var(--cb-head);font-weight:500;font-size:.66rem;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--cb-text-mute);
  background:rgba(212,184,114,.08);
  border:1px solid var(--cb-line-dark);
  border-radius:999px;padding:3px 10px;
  white-space:nowrap;
}
.cb-map-city-svcs{
  list-style:none;padding:0;margin:0;
}
.cb-map-city-svcs li{
  border-bottom:1px dashed rgba(201,192,171,.12);
  padding:8px 0;
}
.cb-map-city-svcs li:last-child{border-bottom:0;padding-bottom:0}
.cb-map-city-svcs a{
  display:block;font-family:var(--cb-body);font-size:.96rem;
  color:var(--cb-text-cream);text-decoration:none;
  padding:2px 0;
}
.cb-map-city-svcs a:hover{color:var(--cb-yellow);text-decoration:none}

@media (max-width:1080px){
  .cb-map-city-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:540px){
  .cb-map-city-grid{grid-template-columns:1fr}
}
.cb-map-list{
  list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:6px;
}
.cb-map-list li{
  display:flex;justify-content:space-between;align-items:baseline;
  gap:18px;padding:6px 0;
  border-bottom:1px solid var(--cb-line-dark);
}
.cb-map-list a{
  font-family:var(--cb-body);font-size:1rem;
  color:var(--cb-text-cream);text-decoration:none;
}
.cb-map-list a:hover{color:var(--cb-yellow);text-decoration:underline}
.cb-map-path{
  font-family:var(--cb-mono,monospace);font-size:.78rem;
  color:var(--cb-text-mute);white-space:nowrap;
}
@media (max-width:880px){
  .cb-map-grid{grid-template-columns:1fr;gap:28px}
  .cb-map-path{display:none}
}

/* ─────────────────────────────────────────────
   ACCESSIBILITY WIDGET — floating button + panel
   ───────────────────────────────────────────── */
.cb-a11y-btn{
  position:fixed;left:18px;bottom:18px;z-index:140;
  width:48px;height:48px;border-radius:50%;border:0;
  background:var(--cb-yellow);color:var(--cb-ink);
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  box-shadow:0 6px 18px rgba(0,0,0,.35);
  transition:transform .18s ease, background .18s ease;
}
.cb-a11y-btn:hover{transform:translateY(-2px);background:var(--cb-yellow-dk)}
.cb-a11y-btn:focus-visible{outline:3px solid var(--cb-yellow-soft);outline-offset:3px}
.cb-a11y-panel{
  position:fixed;left:18px;bottom:78px;z-index:141;
  width:300px;max-width:calc(100vw - 36px);
  background:var(--cb-ink-2);color:var(--cb-text-cream);
  border:1px solid var(--cb-line-dark);border-radius:10px;
  box-shadow:0 18px 40px rgba(0,0,0,.5);
  font-family:var(--cb-body);
}
.cb-a11y-panel[hidden]{display:none}
.cb-a11y-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 18px 12px;border-bottom:1px solid var(--cb-line-dark);
}
.cb-a11y-head h2{
  font-family:var(--cb-head);font-weight:600;font-size:1rem;
  letter-spacing:.08em;text-transform:uppercase;
  color:var(--cb-yellow-soft);margin:0;
}
.cb-a11y-close{
  background:none;border:0;color:var(--cb-text-cream);
  font-size:1.6rem;line-height:1;cursor:pointer;padding:0 4px;
}
.cb-a11y-close:hover{color:var(--cb-yellow)}
.cb-a11y-body{padding:14px 18px 18px;display:flex;flex-direction:column;gap:14px}
.cb-a11y-group{display:flex;flex-direction:column;gap:8px}
.cb-a11y-label{
  font-family:var(--cb-head);font-weight:500;font-size:.76rem;
  letter-spacing:.14em;text-transform:uppercase;
  color:var(--cb-text-mute);margin:0;
}
.cb-a11y-text-row{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.cb-a11y-tbtn{
  background:transparent;color:var(--cb-text-cream);
  border:1px solid var(--cb-line-dark);border-radius:6px;
  padding:8px 4px;cursor:pointer;font-family:var(--cb-head);
  font-weight:500;font-size:.92rem;transition:all .15s;
}
.cb-a11y-tbtn sup{font-size:.65em;margin-left:1px}
.cb-a11y-tbtn:hover{border-color:var(--cb-yellow-soft);color:var(--cb-yellow-soft)}
.cb-a11y-tbtn.active{
  background:var(--cb-yellow);color:var(--cb-ink);border-color:var(--cb-yellow);
}
.cb-a11y-toggle{
  display:flex;align-items:center;gap:10px;cursor:pointer;
  font-size:.94rem;color:var(--cb-text-cream);
  padding:6px 0;
}
.cb-a11y-toggle input{position:absolute;opacity:0;pointer-events:none}
.cb-a11y-toggle-track{
  position:relative;display:inline-block;flex-shrink:0;
  width:38px;height:22px;background:var(--cb-line-dark);border-radius:11px;
  transition:background .2s;
}
.cb-a11y-toggle-track::after{
  content:"";position:absolute;left:2px;top:2px;
  width:18px;height:18px;border-radius:50%;background:var(--cb-text-mute);
  transition:transform .2s, background .2s;
}
.cb-a11y-toggle input:checked + .cb-a11y-toggle-track{background:var(--cb-yellow)}
.cb-a11y-toggle input:checked + .cb-a11y-toggle-track::after{
  transform:translateX(16px);background:var(--cb-ink);
}
.cb-a11y-toggle input:focus-visible + .cb-a11y-toggle-track{
  outline:2px solid var(--cb-yellow-soft);outline-offset:2px;
}
.cb-a11y-reset{
  margin-top:4px;background:transparent;color:var(--cb-yellow-soft);
  border:1px solid var(--cb-line-dark);border-radius:6px;
  padding:9px;cursor:pointer;font-family:var(--cb-head);
  font-weight:500;font-size:.82rem;letter-spacing:.08em;
  text-transform:uppercase;transition:all .15s;
}
.cb-a11y-reset:hover{background:var(--cb-yellow);color:var(--cb-ink);border-color:var(--cb-yellow)}
.cb-a11y-foot{
  margin:8px 0 0;font-size:.78rem;color:var(--cb-text-mute);line-height:1.5;
}
.cb-a11y-foot a{color:var(--cb-yellow-soft);text-decoration:underline}

/* ─── Effects triggered by accessibility widget classes on <html> ────── */
html.cb-a11y-text-s  body{font-size:.92rem}
html.cb-a11y-text-l  body{font-size:1.15rem}
html.cb-a11y-text-xl body{font-size:1.32rem}

html.cb-a11y-contrast body{background:#000 !important;color:#fff !important}
html.cb-a11y-contrast .cb-section, html.cb-a11y-contrast .cb-page-hero,
html.cb-a11y-contrast .cb-hero, html.cb-a11y-contrast .cb-foot,
html.cb-a11y-contrast .cb-cta-band, html.cb-a11y-contrast .cb-trust,
html.cb-a11y-contrast .cb-surf-cream, html.cb-a11y-contrast .cb-surf-cream-deep,
html.cb-a11y-contrast .cb-surf-ink{background:#000 !important}
html.cb-a11y-contrast .cb-h2, html.cb-a11y-contrast .cb-h3,
html.cb-a11y-contrast .cb-display, html.cb-a11y-contrast h1, html.cb-a11y-contrast h2, html.cb-a11y-contrast h3,
html.cb-a11y-contrast .cb-body, html.cb-a11y-contrast .cb-body-lg,
html.cb-a11y-contrast .cb-lede, html.cb-a11y-contrast p, html.cb-a11y-contrast li{color:#fff !important}
html.cb-a11y-contrast .cb-eyebrow{color:#ffea00 !important}
html.cb-a11y-contrast a{color:#ffea00 !important;text-decoration:underline !important}
html.cb-a11y-contrast .cb-card, html.cb-a11y-contrast .cb-why-card,
html.cb-a11y-contrast .cb-area-card, html.cb-a11y-contrast .cb-quote,
html.cb-a11y-contrast .cb-contact-form-wrap, html.cb-a11y-contrast .cb-contact-info{
  background:#000 !important;border:2px solid #fff !important;color:#fff !important;
}
html.cb-a11y-contrast .cb-card *, html.cb-a11y-contrast .cb-why-card *,
html.cb-a11y-contrast .cb-area-card *, html.cb-a11y-contrast .cb-quote *,
html.cb-a11y-contrast .cb-contact-form-wrap *, html.cb-a11y-contrast .cb-contact-info *{
  color:#fff !important;
}

html.cb-a11y-links a:not(.cb-btn):not(.cb-brand):not(.cb-cta-phone):not(.cb-foot-phone){
  text-decoration:underline !important;font-weight:600 !important;
}

html.cb-a11y-motion *, html.cb-a11y-motion *::before, html.cb-a11y-motion *::after{
  animation-duration:0.001ms !important;transition-duration:0.001ms !important;
  scroll-behavior:auto !important;
}

/* ─────────────────────────────────────────────
   COOKIE BANNER — slides up from bottom on first visit
   ───────────────────────────────────────────── */
.cb-cookie-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:130;
  background:var(--cb-ink-2);color:var(--cb-text-cream);
  border-top:2px solid var(--cb-yellow);
  transform:translateY(100%);transition:transform .35s var(--cb-ease);
  box-shadow:0 -8px 24px rgba(0,0,0,.4);
}
.cb-cookie-bar.show{transform:translateY(0)}
.cb-cookie-inner{
  max-width:1280px;margin:0 auto;padding:14px 24px;
  display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
}
.cb-cookie-msg{
  font-family:var(--cb-body);font-size:.92rem;line-height:1.55;
  color:var(--cb-text-cream);margin:0;flex:1 1 360px;
}
.cb-cookie-msg a{color:var(--cb-yellow-soft);text-decoration:underline}
.cb-cookie-actions{display:flex;align-items:center;gap:14px;flex-shrink:0}
.cb-cookie-link{
  font-family:var(--cb-head);font-weight:500;font-size:.82rem;
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--cb-text-mute);text-decoration:none;
}
.cb-cookie-link:hover{color:var(--cb-yellow-soft)}
.cb-cookie-ok{padding:9px 22px}
@media (max-width:540px){
  .cb-cookie-inner{flex-direction:column;align-items:flex-start;padding:12px 18px}
  .cb-cookie-actions{width:100%;justify-content:space-between}
  .cb-a11y-btn{left:auto;right:18px;bottom:70px}
  .cb-a11y-panel{left:auto;right:18px;bottom:128px}
}
.cb-menu{display:flex;align-items:center;gap:24px}
.cb-menu a{
  font-family:var(--cb-head);font-weight:500;font-size:.92rem;
  color:rgba(255,255,255,.85);letter-spacing:.04em;text-transform:uppercase;padding:6px 0;
  border-bottom:2px solid transparent;transition:color .15s,border-color .15s;
}
.cb-menu a:hover,.cb-menu a.cb-menu-active{color:var(--cb-yellow);border-bottom-color:var(--cb-yellow)}
.cb-nav-cta{margin-left:8px}
.cb-burger{display:none;flex-direction:column;gap:5px;background:none;border:0;padding:6px}
.cb-burger span{display:block;width:26px;height:2px;background:var(--cb-yellow);border-radius:2px;transition:transform .25s}
.cb-burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.cb-burger.open span:nth-child(2){opacity:0}
.cb-burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* HERO */
.cb-hero{
  background:linear-gradient(180deg,var(--cb-bg) 0%,var(--cb-bg-2) 100%);
  padding:88px 0 96px;position:relative;overflow:hidden;
  color:var(--cb-text-cream);
}
.cb-hero .cb-lede{color:var(--cb-text-mute)}
.cb-hero .cb-tag{color:var(--cb-text-mute)}
.cb-hero-photo-frame img{
  /* Subtle warm dim — the haul-truck photo is already moody so we just
     pull a little saturation off the highlights to keep it cohesive. */
  filter:saturate(.92) brightness(.96);
}
/* Wide frame variant — the new CB hero photo is dramatic landscape (1500x1000).
   Square frame lets the haul truck show without aggressive top/bottom crop. */
.cb-hero-photo-frame-wide{
  aspect-ratio:1/1;
}
.cb-hero-photo-frame-wide img{object-position:center 55%}
.cb-hero-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:64px;align-items:center}
.cb-hero-text h1{margin-top:14px}
.cb-hero-text h1 .cb-accent{letter-spacing:0}
.cb-hero-btns{display:flex;gap:14px;margin-top:32px;flex-wrap:wrap}
.cb-hero-photo{position:relative}
.cb-hero-photo-frame{
  width:100%;aspect-ratio:4/5;background:var(--cb-cream-deep);
  border-radius:var(--cb-radius);border:1px solid var(--cb-line-light);
  overflow:hidden;display:flex;align-items:center;justify-content:center;
  box-shadow:var(--cb-shadow-md);
}
.cb-stamp-float{position:absolute;top:-16px;right:-12px;transform:rotate(-2deg)}

/* Photo frame img-fit — applies to hero, about, gallery */
.cb-hero-photo-frame img,
.cb-about-photo-frame img,
.cb-gallery-item img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .5s var(--cb-ease);
}
.cb-gallery-item{cursor:pointer}
.cb-gallery-item:hover img{transform:scale(1.04)}

/* Service card thumbnail (top of each cb-card on the homepage) */
.cb-svc-thumb{
  position:relative;width:calc(100% + 56px);margin:-28px -28px 22px;
  aspect-ratio:16/10;overflow:hidden;background:var(--cb-cream-deep);
  border-bottom:3px solid var(--cb-yellow);
}
.cb-card-orange .cb-svc-thumb{border-bottom-color:var(--cb-orange)}
.cb-svc-thumb img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .5s var(--cb-ease);
}
.cb-card:hover .cb-svc-thumb img{transform:scale(1.04)}

/* PHOTO PLACEHOLDERS */
.cb-photo-placeholder{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:36px 28px;width:100%;height:100%;color:var(--cb-gray);
  background-image:repeating-linear-gradient(-45deg,var(--cb-cream-deep) 0,var(--cb-cream-deep) 14px,var(--cb-cream) 14px,var(--cb-cream) 28px);
}
.cb-photo-label{
  display:block;font-family:var(--cb-head);font-weight:600;
  text-transform:uppercase;letter-spacing:.18em;font-size:.78rem;
  color:var(--cb-ink);margin-bottom:8px;
}
.cb-photo-hint{display:block;font-family:var(--cb-body);font-size:.86rem;line-height:1.5;max-width:32ch}
.cb-photo-placeholder-sm{padding:18px 14px}
.cb-photo-placeholder-sm .cb-photo-hint{font-size:.78rem}

/* TRUST STRIP */
.cb-trust{
  background:var(--cb-ink-2);color:var(--cb-cream);padding:14px 0;
  border-top:1px solid rgba(0,0,0,.3);border-bottom:1px solid rgba(0,0,0,.3);
}
.cb-trust-row strong{color:var(--cb-yellow-soft)!important}
.cb-trust-row span + span::before{background:var(--cb-yellow-soft)!important;opacity:.55}
.cb-trust-row{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px 30px;
  font-family:var(--cb-head);font-weight:500;font-size:.86rem;letter-spacing:.04em;text-transform:uppercase;
}
.cb-trust-row strong{font-weight:700;color:var(--cb-ink)}
.cb-trust-row span{position:relative}
.cb-trust-row span + span::before{
  content:"";position:absolute;left:-16px;top:50%;transform:translateY(-50%);
  width:3px;height:3px;background:var(--cb-ink);border-radius:50%;
}

/* SECTION FRAMEWORK */
.cb-section{padding:88px 0}
.cb-section-head{max-width:760px;margin-bottom:56px}
.cb-section-head .cb-h2{margin-bottom:14px}

/* Stats */
.cb-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}

/* Services 3-col grid */
.cb-svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.cb-svc-more{
  display:inline-flex;align-items:center;gap:6px;color:var(--cb-orange);
  font-weight:600;font-family:var(--cb-head);text-transform:uppercase;
  font-size:.8rem;letter-spacing:.12em;transition:gap .2s ease,color .15s;
}
.cb-svc-more:hover{gap:12px;color:var(--cb-orange-dk)}
.cb-card-dark .cb-svc-more{color:var(--cb-yellow)}
.cb-card-dark .cb-svc-more:hover{color:#fff}

/* About */
.cb-about-grid{display:grid;grid-template-columns:.85fr 1fr;gap:64px;align-items:center}
.cb-about-photo{position:relative}
.cb-about-photo-frame{
  width:100%;aspect-ratio:5/6;background:var(--cb-cream);
  border-radius:var(--cb-radius);border:1px solid var(--cb-line-light);
  overflow:hidden;box-shadow:var(--cb-shadow-md);
}
.cb-about-stamp{position:absolute;bottom:-18px;right:-12px;transform:rotate(3deg)}
.cb-about-text{padding:8px 0}
.cb-about-bullets{list-style:none;padding:0;margin:24px 0 24px;display:flex;flex-direction:column;gap:10px}
.cb-about-bullets li{position:relative;padding:6px 0 6px 28px;font-family:var(--cb-body);font-size:1rem;line-height:1.6;color:var(--cb-text-cream)}
.cb-about-bullets li::before{content:"";position:absolute;left:0;top:18px;width:14px;height:3px;background:var(--cb-yellow)}

/* Why choose us */
.cb-why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.cb-why-card{
  background:var(--cb-cream);border:1px solid var(--cb-line-light);
  border-radius:var(--cb-radius);padding:30px 26px;position:relative;
  transition:transform .25s var(--cb-ease),box-shadow .25s var(--cb-ease);
}
.cb-why-card:hover{transform:translateY(-3px);box-shadow:var(--cb-shadow-md)}
.cb-why-num{
  display:inline-block;font-family:var(--cb-head);font-weight:700;
  font-size:.78rem;letter-spacing:.18em;color:var(--cb-orange);
  background:rgba(229,91,19,.1);padding:4px 10px;border-radius:999px;margin-bottom:14px;
}
/* Replaces .cb-why-num — a quiet horizontal accent bar, no number */
.cb-why-bar{
  display:block;width:32px;height:3px;background:var(--cb-yellow);
  margin-bottom:18px;opacity:.85;
}
.cb-why-card .cb-h3{margin-bottom:12px}

/* Service area */
.cb-areas-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.cb-area-card{
  background:var(--cb-white);border:1px solid var(--cb-line-light);
  border-radius:var(--cb-radius);padding:36px 32px;
  transition:transform .25s var(--cb-ease),box-shadow .25s var(--cb-ease);
}
.cb-area-card:hover{transform:translateY(-2px);box-shadow:var(--cb-shadow-md)}
.cb-area-list{
  list-style:none;padding:0;margin:22px 0 0;
  display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px 14px;
  font-family:var(--cb-body);font-size:.96rem;color:var(--cb-text);
}
.cb-area-list li{position:relative;padding-left:14px}
.cb-area-list li::before{content:"";position:absolute;left:0;top:11px;width:6px;height:6px;background:var(--cb-yellow)}

/* Gallery */
.cb-gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.cb-gallery-item{
  aspect-ratio:4/3;background:var(--cb-cream);border-radius:var(--cb-radius);
  overflow:hidden;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--cb-line-light);
}

/* CTA band */
.cb-cta-band{padding:84px 0;text-align:center;position:relative}
.cb-cta-band::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--cb-yellow)}
.cb-cta-phone{
  display:inline-block;font-family:var(--cb-head);font-weight:700;
  font-size:clamp(2rem, 4vw, 3.2rem);color:var(--cb-yellow);
  letter-spacing:.01em;margin:14px 0 26px;
}
.cb-cta-phone:hover{color:#fff}
.cb-cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* Footer */
.cb-foot{background:var(--cb-ink);color:rgba(255,255,255,.75);padding:72px 0 0}
.cb-foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:48px}
.cb-foot-col h4{
  font-family:var(--cb-head);font-weight:600;font-size:.96rem;color:#fff;
  letter-spacing:.06em;text-transform:uppercase;margin-bottom:18px;
}
.cb-foot-col ul{list-style:none;padding:0;margin:0}
.cb-foot-col ul li{margin-bottom:10px;font-size:.94rem;line-height:1.6}
.cb-foot-col ul li a{color:rgba(255,255,255,.75);transition:color .15s}
.cb-foot-col ul li a:hover{color:var(--cb-yellow)}
.cb-foot-brand .cb-brand-mark{background:var(--cb-yellow);color:var(--cb-ink)}
.cb-foot-phone{
  display:inline-block;margin-top:14px;font-family:var(--cb-head);
  font-weight:600;font-size:1.35rem;color:var(--cb-yellow);letter-spacing:.02em;
}
.cb-foot-phone:hover{color:#fff}
.cb-foot-bottom{border-top:1px solid rgba(255,255,255,.1);padding:24px 0;font-size:.84rem;color:rgba(255,255,255,.55)}
.cb-foot-bottom a{color:rgba(255,255,255,.75)}
.cb-foot-bottom a:hover{color:var(--cb-yellow)}
.cb-foot-legal{display:flex;gap:18px;flex-wrap:wrap}
.cb-foot-legal a{position:relative}
.cb-foot-legal a + a::before{
  content:"";position:absolute;left:-10px;top:50%;transform:translateY(-50%);
  width:2px;height:2px;background:var(--cb-gray);border-radius:50%;
}

/* ─────────────────────────────────────────────
   EMAIL QUOTE CTA BAND — yellow horizontal slab
   inspired by CB's "Email Us & Get a Free Quote" pattern
   ───────────────────────────────────────────── */
.cb-email-cta{
  background:var(--cb-ink-2);
  color:var(--cb-cream);
  padding:56px 0;
  border-top:1px solid rgba(255,255,255,.05);
  border-bottom:1px solid rgba(255,255,255,.05);
  position:relative;
}
.cb-email-cta::before{
  content:"";position:absolute;left:0;right:0;top:0;height:4px;
  background:repeating-linear-gradient(135deg,var(--cb-yellow-soft) 0 12px,transparent 12px 24px);
  opacity:.18;
}
.cb-email-cta-row{
  display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:center;
}
.cb-email-cta-text .cb-eyebrow{color:var(--cb-yellow-soft)}
.cb-email-cta-text .cb-h2{color:var(--cb-cream)}
.cb-email-cta-text .cb-body-lg{color:rgba(246,240,222,.78)}
.cb-email-cta-btns{display:flex;flex-direction:column;gap:14px;align-items:stretch}
.cb-email-cta-btns .cb-btn{justify-content:center;text-align:center}
.cb-email-cta-btns .cb-btn-yellow{
  background:var(--cb-yellow);color:var(--cb-ink);
  border:2px solid var(--cb-yellow);
}
.cb-email-cta-btns .cb-btn-yellow:hover{
  background:transparent;color:var(--cb-yellow);
}
.cb-email-cta-btns .cb-btn-outline{
  border-color:var(--cb-cream);color:var(--cb-cream);background:transparent;
}
.cb-email-cta-btns .cb-btn-outline:hover{
  background:var(--cb-cream);color:var(--cb-ink);
}

/* ─────────────────────────────────────────────
   TESTIMONIALS — CB has a "Clients / Testimonials"
   carousel on home. We render a 3-card grid (no JS).
   ───────────────────────────────────────────── */
.cb-quote-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:8px;
}
.cb-quote{
  background:var(--cb-white);
  border:1px solid rgba(15,15,15,.08);
  border-top:3px solid var(--cb-yellow);
  border-radius:10px;
  padding:24px 28px 26px;
  position:relative;
  box-shadow:0 4px 12px rgba(0,0,0,.25);
  transition:transform .18s ease, box-shadow .18s ease;
  display:flex;flex-direction:column;
}
.cb-quote:hover{
  transform:translateY(-3px);
  box-shadow:0 14px 28px -16px rgba(0,0,0,.4);
}
/* Quote mark — now a normal block element sitting at the top of the card,
   not absolutely positioned. Previously it overlapped the body text. */
.cb-quote-mark{
  display:block;
  font-family:var(--cb-accent,'Fraunces');font-style:italic;font-weight:600;
  font-size:3.4rem;line-height:.7;color:var(--cb-orange);
  margin:0 0 4px;letter-spacing:-.02em;
}
.cb-quote-body{
  font-family:var(--cb-body,'Barlow');
  font-size:1.02rem;line-height:1.65;color:var(--cb-text-dark);
  margin:0 0 22px;font-style:italic;
}
.cb-quote-cite{
  display:flex;flex-direction:column;gap:4px;
  border-top:1px solid rgba(15,15,15,.08);
  padding-top:14px;
}
.cb-quote-stars{color:var(--cb-orange);font-size:.92rem;letter-spacing:.1em;margin-bottom:2px}
.cb-quote-name{
  font-family:var(--cb-head,'Oswald');
  font-weight:600;text-transform:uppercase;letter-spacing:.04em;
  font-size:.98rem;color:var(--cb-ink);
}
.cb-quote-loc{
  font-family:var(--cb-body,'Barlow');
  font-size:.84rem;color:var(--cb-ink);opacity:.6;
  letter-spacing:.02em;
}

/* ─────────────────────────────────────────────
   INNER PAGE HERO — smaller than home, breadcrumbs + H1
   Used on About, Services hub, Contact, etc.
   ───────────────────────────────────────────── */
.cb-page-hero{
  background:linear-gradient(180deg,var(--cb-bg) 0%,var(--cb-bg-2) 100%);
  padding:64px 0 56px;
  color:var(--cb-text-cream);
  border-bottom:1px solid var(--cb-line-dark);
}
.cb-crumbs{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--cb-head);font-size:.78rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cb-text-mute);
}
.cb-crumbs a{color:var(--cb-text-mute);text-decoration:none;transition:color .15s}
.cb-crumbs a:hover{color:var(--cb-yellow-soft)}
.cb-crumbs [aria-current="page"]{color:var(--cb-yellow-soft)}

/* 3-col why-grid variant (about page values section) */
.cb-why-grid-3{grid-template-columns:repeat(3,1fr)}

/* Credentials grid (about page) */
.cb-cred-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:22px;
}
.cb-cred-card{padding:32px 28px 28px}
.cb-cred-card em{
  font-family:var(--cb-accent,'Fraunces');font-style:italic;font-weight:500;
  color:var(--cb-orange);
}

/* ─────────────────────────────────────────────
   HISTORY TIMELINE — About-page-only component.
   Vertical stack of year + content, joined by a
   continuous dijon line down the left edge.
   ───────────────────────────────────────────── */
.cb-timeline{
  list-style:none;padding:0;margin:0;
  position:relative;max-width:780px;margin-inline:auto;
}
.cb-timeline::before{
  /* Continuous spine line down the left */
  content:"";position:absolute;
  left:88px;top:8px;bottom:8px;width:2px;
  background:linear-gradient(180deg,
    transparent 0%,
    var(--cb-yellow-soft) 8%,
    var(--cb-yellow-soft) 92%,
    transparent 100%);
  opacity:.4;
}
.cb-tl-item{
  display:grid;grid-template-columns:108px 1fr;
  gap:0;position:relative;
  padding:18px 0;
}
.cb-tl-item + .cb-tl-item{border-top:1px solid var(--cb-line-dark)}
.cb-tl-year{
  font-family:var(--cb-head);font-weight:700;
  font-size:1.4rem;letter-spacing:.04em;
  color:var(--cb-yellow-soft);
  align-self:flex-start;padding-top:4px;
}
.cb-tl-body{position:relative;padding-left:36px}
.cb-tl-body::before{
  /* The bullet dot on the spine */
  content:"";position:absolute;
  left:-16px;top:14px;width:14px;height:14px;border-radius:50%;
  background:var(--cb-yellow);
  border:3px solid var(--cb-bg-3);
  box-shadow:0 0 0 1px var(--cb-yellow-soft);
}
.cb-tl-title{
  font-family:var(--cb-head);font-weight:600;
  font-size:1.15rem;letter-spacing:.005em;
  color:var(--cb-text-cream);
  margin:0 0 8px;text-transform:none;line-height:1.25;
}
.cb-tl-body p{
  color:var(--cb-text-mute);font-size:1rem;line-height:1.6;margin:0;
}
.cb-tl-placeholder .cb-tl-year{opacity:.55}
.cb-tl-placeholder .cb-tl-title{opacity:.7}
.cb-tl-placeholder .cb-tl-body::before{background:var(--cb-gray);box-shadow:0 0 0 1px var(--cb-gray)}

/* ─────────────────────────────────────────────
   "HOW WE ACTUALLY WORK" — three confident pillar
   statements on /about/. No VS framing. Strong
   typographic hierarchy: small dijon tag on the
   left, bold headline + body on the right.
   ───────────────────────────────────────────── */
.cb-pillars-section{padding-bottom:128px}
.cb-pillars{
  max-width:1080px;margin-inline:auto;
  display:flex;flex-direction:column;
}
.cb-pillar{
  display:grid;
  grid-template-columns:260px 1fr;
  gap:56px;
  padding:52px 0;
  border-top:1px solid var(--cb-line-dark);
  align-items:start;
  position:relative;
}
.cb-pillar:last-child{border-bottom:1px solid var(--cb-line-dark)}

/* Hover: very subtle yellow tint at left edge to signal interactivity-feel */
.cb-pillar::before{
  content:"";position:absolute;left:0;top:50%;
  width:0;height:0;background:var(--cb-yellow);
  transition:width .35s var(--cb-ease), height .35s var(--cb-ease), top .35s var(--cb-ease);
}
.cb-pillar:hover::before{
  width:4px;height:60%;top:20%;
}

.cb-pillar-head{
  display:flex;flex-direction:column;gap:18px;
  padding-top:10px;
}
.cb-pillar-rule{
  display:block;width:48px;height:3px;
  background:var(--cb-yellow);
  transform-origin:left center;
  transition:width .35s var(--cb-ease);
}
.cb-pillar:hover .cb-pillar-rule{width:72px}
.cb-pillar-tag{
  font-family:var(--cb-head);font-weight:600;
  font-size:1.35rem;letter-spacing:.005em;
  text-transform:uppercase;
  color:var(--cb-yellow);
  line-height:1.1;
}

.cb-pillar-content{padding-top:4px}
.cb-pillar-title{
  font-family:var(--cb-head);font-weight:600;
  font-size:clamp(1.55rem, 2.6vw, 2.1rem);
  line-height:1.15;letter-spacing:-.005em;
  color:#fff;text-transform:none;
  margin:0 0 18px;max-width:30ch;
}
.cb-pillar-body{
  font-family:var(--cb-body);font-size:1.06rem;line-height:1.75;
  color:var(--cb-text-cream);opacity:.82;
  margin:0;max-width:58ch;
}

@media (max-width:880px){
  .cb-pillars-section{padding-bottom:88px}
  .cb-pillar{
    grid-template-columns:1fr;gap:18px;padding:40px 0;
  }
  .cb-pillar-head{gap:14px;padding-top:0;flex-direction:row;align-items:center}
  .cb-pillar-rule{width:32px;height:2px}
  .cb-pillar:hover .cb-pillar-rule{width:48px}
  .cb-pillar-tag{font-size:1.1rem}
  .cb-pillar-title{font-size:1.4rem}
}

/* ─────────────────────────────────────────────
   CONTACT PAGE — form left, info card right
   ───────────────────────────────────────────── */
.cb-contact-grid{
  display:grid;grid-template-columns:1.4fr 1fr;gap:56px;align-items:flex-start;
}
.cb-contact-form-wrap{
  background:var(--cb-white);
  border:1px solid var(--cb-line-light);
  border-top:3px solid var(--cb-yellow);
  border-radius:var(--cb-radius);
  padding:40px 36px;
  color:var(--cb-text-dark);
}
.cb-contact-form-wrap .cb-h2{color:var(--cb-ink)}
.cb-contact-form-wrap .cb-eyebrow{color:var(--cb-orange)}
.cb-contact-form-wrap .cb-body-lg{color:var(--cb-text-dark)}

/* Form status banners (success / error) */
.cb-form-status{
  padding:14px 18px;border-radius:6px;
  font-family:var(--cb-body);font-size:.96rem;line-height:1.5;
  margin-bottom:24px;
}
.cb-form-status a{color:inherit;font-weight:600;text-decoration:underline}
.cb-form-success{background:rgba(40,120,40,.12);color:#1e5a24;border-left:4px solid #3a8a40}
.cb-form-error  {background:rgba(180,40,40,.12);color:#7e2c20;border-left:4px solid #a03a2b}

/* Form layout */
.cb-form{display:flex;flex-direction:column;gap:18px}
.cb-form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.cb-field{display:flex;flex-direction:column;gap:6px}
.cb-field label{
  font-family:var(--cb-head);font-weight:500;
  font-size:.82rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--cb-ink);
}
.cb-req{color:var(--cb-orange);font-weight:700}
.cb-field input,
.cb-field select,
.cb-field textarea{
  font-family:var(--cb-body);font-size:1rem;line-height:1.5;
  padding:12px 14px;
  background:var(--cb-paper);
  border:1.5px solid var(--cb-line-light);
  border-radius:6px;
  color:var(--cb-text-dark);
  width:100%;
  transition:border-color .15s, box-shadow .15s;
}
.cb-field input:focus,
.cb-field select:focus,
.cb-field textarea:focus{
  outline:none;
  border-color:var(--cb-yellow);
  box-shadow:0 0 0 3px rgba(182,139,42,.18);
}
.cb-field textarea{resize:vertical;min-height:140px}
.cb-field select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--cb-ink) 50%),linear-gradient(135deg,var(--cb-ink) 50%,transparent 50%);background-position:calc(100% - 18px) center,calc(100% - 13px) center;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:36px}
.cb-honeypot{position:absolute;left:-9999px;opacity:0;pointer-events:none}
.cb-form-actions{margin-top:8px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}

/* Contact info card */
.cb-contact-info{
  background:var(--cb-cream);
  border:1px solid var(--cb-line-light);
  border-radius:var(--cb-radius);
  padding:36px 32px;
  color:var(--cb-text-dark);
  position:sticky;top:96px;
}
.cb-contact-info .cb-eyebrow{color:var(--cb-orange)}
.cb-contact-info .cb-h2{color:var(--cb-ink);margin-bottom:24px}
.cb-info-row{
  display:flex;align-items:flex-start;gap:14px;
  padding:16px 0;border-top:1px solid var(--cb-line-light);
}
.cb-info-row:first-of-type{border-top:0;padding-top:0}
.cb-info-icon{
  flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;
  background:var(--cb-yellow);color:var(--cb-ink);
}
.cb-info-label{
  font-family:var(--cb-head);font-weight:500;font-size:.76rem;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--cb-orange);margin:0 0 2px;
}
.cb-info-value{
  font-family:var(--cb-body);font-size:1rem;line-height:1.5;
  color:var(--cb-text-dark);font-weight:500;text-decoration:none;
}
a.cb-info-value:hover{color:var(--cb-orange-dk);text-decoration:underline}

/* Sticky mobile call */
/* Floating phone button — only visible on mobile (set below).
   Round dijon circle at bottom-right with phone icon; AdaWebPro lives
   at bottom-left. Two clean floating buttons, no overlap. */
.cb-sticky-call{
  display:none;
  position:fixed;right:18px;bottom:18px;left:auto;z-index:95;
  width:56px;height:56px;border-radius:50%;
  background:var(--cb-yellow);color:var(--cb-ink);
  align-items:center;justify-content:center;
  font-size:0;line-height:0;padding:0;
  box-shadow:0 6px 20px rgba(0,0,0,.4);
  transition:transform .18s ease, background .15s ease;
}
.cb-sticky-call:hover,.cb-sticky-call:focus-visible{
  transform:translateY(-2px);background:var(--cb-yellow-dk);
  outline:none;
}
.cb-sticky-call:focus-visible{
  box-shadow:0 6px 20px rgba(0,0,0,.4),0 0 0 3px var(--cb-yellow-soft);
}
.cb-sticky-call::before{
  content:"";display:block;width:26px;height:26px;font-size:0;
  background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%2314130F' d='M20 15.5c-1.25 0-2.45-.2-3.57-.57-.35-.11-.74-.03-1.02.25l-2.2 2.2c-2.83-1.44-5.15-3.75-6.59-6.59l2.2-2.21c.28-.27.36-.66.25-1.01-.37-1.12-.57-2.32-.57-3.57 0-.55-.45-1-1-1H4c-.55 0-1 .45-1 1 0 9.39 7.61 17 17 17 .55 0 1-.45 1-1v-3.5c0-.55-.45-1-1-1z'/%3E%3C/svg%3E");
  background-size:contain;background-repeat:no-repeat;background-position:center;
}

/* RESPONSIVE */
@media (max-width:1080px){
  .cb-svc-grid{grid-template-columns:1fr 1fr}
  .cb-why-grid{grid-template-columns:1fr 1fr}
  .cb-why-grid-3{grid-template-columns:1fr 1fr}
  .cb-why-grid-3 > :nth-child(3){grid-column:1 / -1;max-width:560px;margin-inline:auto}
  .cb-cred-grid{grid-template-columns:1fr 1fr}
  .cb-cred-grid > :nth-child(3){grid-column:1 / -1;max-width:560px;margin-inline:auto}
  .cb-quote-grid{grid-template-columns:1fr 1fr}
  .cb-quote-grid > :nth-child(3){grid-column:1 / -1;max-width:560px;margin-inline:auto}
  .cb-blog-grid{grid-template-columns:1fr 1fr}
  .cb-blog-card-feature{grid-template-columns:1fr;grid-column:1 / -1}
  .cb-blog-card-feature .cb-blog-thumb{aspect-ratio:16/10}
}
@media (max-width:880px){
  .cb-menu{display:none}
  .cb-nav-cta{display:none}
  .cb-burger{display:flex}
  .cb-menu.cb-menu-open{
    display:flex;flex-direction:column;position:absolute;
    top:78px;left:0;right:0;background:var(--cb-ink);
    padding:24px;gap:14px;border-bottom:3px solid var(--cb-yellow);align-items:flex-start;
  }
  /* Keep .cb-nav sticky on mobile too — the burger dropdown uses
     position:absolute which anchors to the sticky nav, so it still
     drops cleanly below it. */
  .cb-hero{padding:56px 0 64px}
  .cb-hero-grid{grid-template-columns:1fr;gap:36px}
  /* Mobile hero photo: 4/5 portrait keeps the worker's torso + tools
     in frame instead of cropping to a thin landscape strip. */
  .cb-hero-photo-frame{aspect-ratio:4/5;max-height:540px}
  .cb-hero-photo-frame img{object-position:center 38%}
  .cb-stats-grid{grid-template-columns:1fr 1fr;gap:14px}
  .cb-svc-grid,.cb-why-grid{grid-template-columns:1fr;gap:16px}
  .cb-about-grid{grid-template-columns:1fr;gap:36px}
  .cb-areas-grid{grid-template-columns:1fr;gap:16px}
  .cb-area-list{grid-template-columns:1fr 1fr}
  .cb-gallery-grid{grid-template-columns:1fr 1fr}
  .cb-email-cta-row{grid-template-columns:1fr;gap:28px}
  .cb-quote-grid{grid-template-columns:1fr;gap:20px}
  .cb-quote-grid > :nth-child(3){max-width:none}
  .cb-why-grid-3{grid-template-columns:1fr;gap:16px}
  .cb-why-grid-3 > :nth-child(3){max-width:none}
  .cb-cred-grid{grid-template-columns:1fr;gap:16px}
  .cb-cred-grid > :nth-child(3){max-width:none}
  .cb-page-hero{padding:48px 0 40px}
  .cb-timeline::before{left:8px}
  .cb-tl-item{grid-template-columns:1fr;gap:6px;padding-left:36px}
  .cb-tl-body{padding-left:0}
  .cb-tl-body::before{left:-32px;top:8px}
  .cb-tl-year{padding-top:0;font-size:1.05rem}
  .cb-contact-grid{grid-template-columns:1fr;gap:32px}
  .cb-contact-info{position:static;top:auto}
  .cb-contact-form-wrap{padding:32px 24px}
  .cb-form-row{grid-template-columns:1fr;gap:18px}
  .cb-blog-grid{grid-template-columns:1fr;gap:18px}
  .cb-article{max-width:none}
  .cb-article .cb-article-lead{font-size:1.08rem}
  .cb-article h2{font-size:1.4rem}
  .cb-foot-grid{grid-template-columns:1fr 1fr;gap:32px}
  .cb-section{padding:60px 0}
  .cb-section-head{margin-bottom:36px}
  .cb-sticky-call{display:flex}
  .cb-cta-band{padding:60px 0 84px}
}
@media (max-width:540px){
  .cb-marquee-left span:nth-child(n+3){display:none}
  .cb-trust-row{justify-content:flex-start;gap:8px 24px;font-size:.78rem}
  .cb-foot-grid{grid-template-columns:1fr}
  .cb-area-list{grid-template-columns:1fr 1fr}
  .cb-gallery-grid{grid-template-columns:1fr 1fr}
  .cb-foot-bottom > .cb-shell{flex-direction:column;align-items:flex-start}
}


/* lead form status (added) */
.cb-form-status{display:block;padding:14px 18px;border-radius:8px;margin-bottom:18px;font-size:.95rem;line-height:1.5}
.cb-form-status[hidden]{display:none}
.cb-form-status--ok{background:#e7f6ec;border:1px solid #9bd3ad;color:#1e6b3a}
.cb-form-status--err{background:#fcebea;border:1px solid #e3a9a4;color:#8a2a22}


/* ===== legal pages: TOC sidebar (DG-format, CB colors) ===== */
.cb-legal-layout{display:grid;grid-template-columns:260px 1fr;gap:48px;max-width:1180px;margin:0 auto;align-items:start}
.cb-legal-toc{position:sticky;top:96px;align-self:start;background:var(--cb-paper);border-radius:12px;padding:22px 24px;border-left:4px solid var(--cb-yellow)}
.cb-legal-toc h4{margin:0 0 14px;font-size:.78rem;letter-spacing:.13em;text-transform:uppercase;color:var(--cb-text-dark)}
.cb-legal-toc ol{list-style:none;counter-reset:toc;padding:0;margin:0}
.cb-legal-toc li{counter-increment:toc;margin:0 0 9px;padding-left:26px;position:relative;line-height:1.4}
.cb-legal-toc li::before{content:counter(toc);position:absolute;left:0;top:0;color:var(--cb-yellow-dk);font-weight:700;font-size:.85rem}
.cb-legal-toc a{color:var(--cb-text-dark);font-size:.87rem;text-decoration:none}
.cb-legal-toc a:hover{color:var(--cb-orange)}
.cb-legal-layout .cb-article{max-width:820px;margin:0}
.cb-legal-layout .cb-article h2{scroll-margin-top:96px}
.cb-partner-badge{display:flex;align-items:center;gap:16px;padding:24px;background:var(--cb-ink);border-radius:12px;color:#fff;margin:26px 0}
.cb-partner-badge .cb-partner-logo{width:60px;height:60px;border-radius:12px;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;color:var(--cb-yellow-soft);font-weight:800;font-size:1.05rem;flex-shrink:0}
.cb-partner-badge h4{margin:0 0 4px;color:#fff}
.cb-partner-badge p{margin:0;color:rgba(255,255,255,.85);font-size:.92rem;line-height:1.5}
.cb-partner-badge a{color:var(--cb-yellow-soft)}
.cb-foot-yp{text-align:center;padding:16px 24px;background:var(--cb-bg-3,#16140f);color:rgba(255,255,255,.45);font-size:.78rem;letter-spacing:.02em;border-top:1px solid rgba(255,255,255,.06)}
.cb-foot-yp a{color:var(--cb-yellow-soft);text-decoration:none}
@media(max-width:900px){.cb-legal-layout{grid-template-columns:1fr;gap:24px}.cb-legal-toc{position:static}}


/* form labels visible on dark surfaces (cream-deep/ink are actually dark) */
.cb-surf-cream-deep .cb-field label,
.cb-surf-ink .cb-field label,
.cb-cta-band .cb-field label,
#cb-home-estimate .cb-field label{ color: var(--cb-text-cream) !important; }
.cb-surf-cream-deep .cb-form .cb-honeypot,.cb-surf-cream-deep .cb-req{}
/* footer socials + reviews */
.cb-foot-social{display:flex;gap:10px;margin-top:18px}
.cb-foot-social a{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:var(--cb-text-cream);transition:background .15s,color .15s}
.cb-foot-social a:hover{background:var(--cb-yellow);color:var(--cb-ink)}
.cb-foot-social svg{width:18px;height:18px}
.cb-foot-reviews{display:inline-flex;align-items:center;gap:8px;margin-top:16px;color:var(--cb-yellow-soft);font-size:.9rem;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.22);padding-bottom:3px}
.cb-foot-reviews:hover{color:var(--cb-yellow);border-color:var(--cb-yellow)}
.cb-foot-reviews .stars{color:#FBBC05;letter-spacing:1px;font-size:.95rem}


/* ===== exit-intent popup (Charles Brown) ===== */
#cb-exit-overlay{position:fixed;inset:0;background:rgba(20,19,15,.85);backdrop-filter:blur(6px);z-index:99999;display:none;align-items:center;justify-content:center;padding:20px;animation:cbFade .3s ease}
#cb-exit-overlay.show{display:flex}
@keyframes cbFade{from{opacity:0}to{opacity:1}}
#cb-exit-modal{background:#fff;border-radius:14px;max-width:480px;width:100%;padding:36px 32px 28px;text-align:center;position:relative;box-shadow:0 24px 60px rgba(0,0,0,.45);animation:cbPop .35s cubic-bezier(.16,1,.3,1)}
@keyframes cbPop{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}
#cb-exit-modal .close{position:absolute;top:14px;right:14px;background:none;border:none;font-size:22px;color:#8a8275;cursor:pointer;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center}
#cb-exit-modal .close:hover{background:#f1efe9;color:#14130F}
#cb-exit-modal .icon{font-size:46px;margin-bottom:8px;line-height:1}
#cb-exit-modal h3{color:#14130F;font-size:1.5rem;margin-bottom:10px;letter-spacing:.01em;font-family:var(--cb-head,inherit)}
#cb-exit-modal p{color:#5b5648;font-size:1rem;line-height:1.55;margin-bottom:22px}
#cb-exit-modal .btn-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
#cb-exit-modal .btn-cta{display:inline-flex;align-items:center;gap:8px;background:#B68B2A;color:#14130F;font-weight:700;padding:13px 24px;border-radius:8px;text-decoration:none;font-size:1rem;transition:transform .15s,box-shadow .15s}
#cb-exit-modal .btn-cta.alt{background:#9C4A22;color:#fff}
#cb-exit-modal .btn-cta:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.2)}
#cb-exit-modal .btn-skip{background:transparent;border:none;color:#8a8275;font-size:.88rem;text-decoration:underline;cursor:pointer;padding:11px 18px 0}
#cb-exit-modal .trust{font-size:.78rem;color:#8a8275;margin-top:12px;letter-spacing:.03em}


/* ===== homepage world-class additions ===== */
html{scroll-behavior:smooth}
#cb-home-estimate{scroll-margin-top:96px}
.cb-hero-reviews{display:inline-flex;align-items:center;gap:9px;margin-top:18px;color:var(--cb-text-cream);font-size:.96rem;text-decoration:none}
.cb-hero-reviews .cb-hero-stars{color:#FBBC05;letter-spacing:2px;font-size:1.05rem}
.cb-hero-reviews .cb-hr-link{color:var(--cb-yellow-soft);border-bottom:1px solid rgba(212,184,114,.4);padding-bottom:1px;transition:color .15s,border-color .15s}
.cb-hero-reviews:hover .cb-hr-link{color:var(--cb-yellow);border-color:var(--cb-yellow)}
.cb-quote-rating{display:inline-flex;align-items:center;gap:9px;margin-top:12px;color:var(--cb-text-cream);font-size:.96rem;text-decoration:none}
.cb-quote-rating .cb-qr-stars{color:#FBBC05;letter-spacing:2px}
.cb-quote-rating:hover{color:var(--cb-yellow-soft)}
.cb-review-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:36px}


/* ===== nav: services dropdown + blog/faq ===== */
.cb-has-dropdown{position:relative;display:inline-flex;align-items:center}
.cb-dd-toggle{display:inline-flex;align-items:center;gap:7px;cursor:pointer}
.cb-dd-caret{width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-top:-3px;transition:transform .2s;opacity:.85}
.cb-dropdown{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(10px);min-width:236px;background:#1A1814;border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:9px;box-shadow:0 20px 44px rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:opacity .18s,transform .18s,visibility .18s;z-index:300}
.cb-has-dropdown:hover .cb-dropdown,.cb-has-dropdown:focus-within .cb-dropdown{opacity:1;visibility:visible;transform:translateX(-50%) translateY(6px)}
.cb-has-dropdown:hover .cb-dd-caret{transform:rotate(-135deg);margin-top:2px}
.cb-dropdown a{display:block;padding:10px 14px;border-radius:8px;color:var(--cb-text-cream);font-size:.92rem;text-decoration:none;white-space:nowrap;text-transform:none;letter-spacing:.01em;font-weight:500}
.cb-dropdown a:hover{background:rgba(182,139,42,.18);color:var(--cb-yellow-soft)}
.cb-dropdown .cb-dd-all{color:var(--cb-yellow-soft);font-weight:700;border-top:1px solid rgba(255,255,255,.1);margin-top:5px;padding-top:12px}
@media (max-width:880px){
  .cb-has-dropdown{display:block;width:100%}
  .cb-dropdown,.cb-has-dropdown:hover .cb-dropdown,.cb-has-dropdown:focus-within .cb-dropdown{position:static !important;transform:none !important;opacity:1;visibility:visible;box-shadow:none;border:none;background:transparent;padding:2px 0 6px 20px;min-width:0;left:auto !important}
  .cb-dropdown a{padding:9px 0}
  .cb-dd-caret{display:none}
}


/* ===== background hero + quick-form ===== */
.cb-hero-bg{position:relative;background:linear-gradient(100deg, rgba(20,19,15,.94) 0%, rgba(20,19,15,.86) 40%, rgba(20,19,15,.5) 100%), url('/img/cb/driveway-approaches.jpg') center 60% / cover no-repeat}
.cb-hero-formcard{background:#F6F0DE;border-radius:16px;padding:26px 26px 22px;box-shadow:0 24px 60px rgba(0,0,0,.45);max-width:430px;width:100%;justify-self:end}
.cb-hf-eyebrow{color:var(--cb-yellow-dk);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin:0}
.cb-hf-title{color:var(--cb-ink);font-size:1.5rem;margin:5px 0 4px;line-height:1.1}
.cb-hf-sub{color:#6B665D;font-size:.92rem;margin:0 0 18px;line-height:1.45}
.cb-hero-form .cb-field{margin-bottom:12px}
.cb-hero-form .cb-field label{color:var(--cb-ink) !important;font-size:.74rem}
.cb-hero-form input,.cb-hero-form select{width:100%}
.cb-hf-submit{width:100%;margin-top:4px;justify-content:center;text-align:center}
.cb-hf-foot{text-align:center;color:#6B665D;font-size:.82rem;margin:13px 0 0}
.cb-hf-foot a{color:var(--cb-yellow-dk);font-weight:700;text-decoration:none}
@media (max-width:880px){
  .cb-hero-formcard{justify-self:stretch;max-width:none;margin-top:26px}
  .cb-hero-bg{background:linear-gradient(rgba(20,19,15,.9),rgba(20,19,15,.84)),url('/img/cb/driveway-approaches.jpg') center/cover no-repeat}
}

/* mobile menu scroll fix */
@media (max-width:880px){.cb-menu.cb-menu-open{max-height:calc(100vh - 76px);max-height:calc(100dvh - 76px);overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}}

/* horizontal header brand mark */
.cb-nav-brand-mark{display:inline-flex;align-items:center;gap:13px;text-decoration:none;padding:6px 0;flex-shrink:0}
.cb-nav-icon{flex-shrink:0;display:inline-flex;width:46px;height:46px}
.cb-nav-icon img{width:46px;height:46px;object-fit:contain}
.cb-nav-wordmark{display:flex;flex-direction:column;line-height:1.04}
.cb-nav-wordmark-top{font-family:var(--cb-head);font-weight:700;font-size:1.12rem;letter-spacing:.05em;color:#fff;text-transform:uppercase}
.cb-nav-wordmark-sub{font-family:var(--cb-accent);font-style:italic;font-weight:500;font-size:.8rem;letter-spacing:.03em;color:var(--cb-yellow-soft);margin-top:3px}
@media (max-width:880px){.cb-nav-wordmark-top{font-size:1rem}.cb-nav-icon,.cb-nav-icon img{width:40px;height:40px}}

/* hero form tighten (shorter so hero isn't too tall) */
.cb-hero-formcard{padding:18px 22px 14px !important}
.cb-hf-eyebrow{font-size:.68rem}
.cb-hf-title{font-size:1.35rem !important;margin:2px 0 2px !important}
.cb-hf-sub{margin:0 0 10px !important;font-size:.86rem}
.cb-hero-form .cb-field{margin-bottom:7px !important}
.cb-hero-form .cb-field label{margin-bottom:2px !important;font-size:.7rem}
.cb-hero-form input,.cb-hero-form select{padding:9px 12px !important}
.cb-hf-submit{margin-top:5px !important;padding-top:11px;padding-bottom:11px}
.cb-hf-foot{margin-top:9px !important;font-size:.78rem}
/* mobile menu bottom clearance so Contact clears the ADA widget + call button */
@media (max-width:880px){.cb-menu.cb-menu-open{padding-bottom:108px !important}}