/* ========== CNB Renovation — Design Tokens (FINAL_CONCEPT v1.0) ========== */
:root {
  /* Color palette */
  --paper:        #F6F3EE;
  --ink:          #1A1A1A;
  --terracotta:   #B23A1B;
  --terracotta-hover: #8B2812;
  --permit-blue:  #1F3A5F;
  --check-green:  #0E7A3C;
  --muted-rule:   #D9D2C5;

  /* Typography (self-hosted WOFF2 — load via @font-face below) */
  --font-heading: 'Fraunces', Georgia, serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;
  --font-mono:    'Space Mono', 'SF Mono', Menlo, monospace;

  /* Type scale */
  --fs-h1: clamp(2.5rem, 5vw, 4rem);
  --fs-h2: clamp(1.75rem, 3.5vw, 2.75rem);
  --fs-h3: 1.5rem;
  --fs-body: 1.0625rem; /* 17px */
  --fs-caption: 0.875rem;

  /* Spacing scale (8px base) */
  --space-1: .25rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem;
  --space-6: 1.5rem; --space-8: 2rem; --space-12: 3rem; --space-16: 4rem; --space-24: 6rem;

  /* Radii */
  --r-sm: 4px; --r-md: 8px; --r-lg: 16px;

  /* Container */
  --container-max: 1280px;
  --container-pad: 1.5rem;
}

/* Reset + base */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img, video, picture, svg { max-width: 100%; height: auto; display: block; }

h1, h2, h3, h4 {
  font-family: var(--font-heading);
  font-weight: 500;
  line-height: 1.15;
  margin: 0 0 var(--space-4);
  letter-spacing: -0.01em;
}
h1 { font-size: var(--fs-h1); font-weight: 400; }
h2 { font-size: var(--fs-h2); }

a { color: var(--terracotta); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--terracotta-hover); }

.container { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--container-pad); }

.skip-link { position: absolute; left: -9999px; }
.skip-link:focus { left: var(--space-4); top: var(--space-4); background: var(--ink); color: var(--paper); padding: var(--space-2) var(--space-4); border-radius: var(--r-md); z-index: 9999; }

/* Header */
.site-header { background: var(--paper); border-bottom: 1px solid var(--muted-rule); padding: var(--space-3) 0; position: sticky; top: 0; z-index: 50; }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: var(--space-6); }
.site-logo { color: var(--ink); text-decoration: none; font-family: var(--font-heading); font-size: 1.25rem; }
.site-logo strong { color: var(--terracotta); }
.primary-nav ul { display: flex; gap: var(--space-6); list-style: none; padding: 0; margin: 0; }
.primary-nav a { color: var(--ink); text-decoration: none; font-size: 0.9375rem; }
.primary-nav a:hover { color: var(--terracotta); }
.header-cta { background: var(--terracotta); color: var(--paper); padding: var(--space-2) var(--space-4); border-radius: var(--r-md); text-decoration: none; font-family: var(--font-mono); font-size: 0.875rem; }

/* Footer */
.site-footer { background: var(--ink); color: var(--paper); padding: var(--space-12) 0; margin-top: var(--space-24); }
.site-footer a { color: var(--paper); }

/* Sticky mobile CTA — hidden on desktop */
.sticky-cta { display: none; }
@media (max-width: 768px) {
  .sticky-cta {
    display: flex;
    position: fixed;
    bottom: 0; left: 0; right: 0;
    padding: var(--space-2) var(--space-2) calc(var(--space-2) + env(safe-area-inset-bottom));
    background: var(--paper);
    border-top: 1px solid var(--muted-rule);
    box-shadow: 0 -2px 8px rgba(0,0,0,.04);
    z-index: 60;
    gap: var(--space-2);
  }
  .sticky-cta .cta-btn { flex: 1; padding: var(--space-3); text-align: center; text-decoration: none; border-radius: var(--r-md); font-size: 0.875rem; font-weight: 500; }
  .cta-call { background: var(--terracotta); color: var(--paper); }
  .cta-wa { background: var(--check-green); color: var(--paper); }
  .cta-quote { background: var(--paper); color: var(--permit-blue); border: 1px solid var(--permit-blue); }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}

/* ============ Self-hosted fonts ============ */
@font-face {
  font-family: 'Fraunces';
  src: url('../fonts/Fraunces-400.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Fraunces';
  src: url('../fonts/Fraunces-500.woff2') format('woff2');
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}
@font-face {
  font-family: 'Inter';
  src: url('../fonts/Inter-400.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('../fonts/Inter-500.woff2') format('woff2');
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: 'Space Mono';
  src: url('../fonts/SpaceMono-400.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}

/* ============ Sections ============ */
.section { padding: var(--space-16) 0; }
.section--paper { background: var(--paper); }
.section--ink { background: var(--ink); color: var(--paper); }
.section--blue { background: var(--permit-blue); color: var(--paper); }
.section__eyebrow { font-family: var(--font-body); font-size: var(--fs-caption); text-transform: uppercase; letter-spacing: .1em; color: var(--terracotta); margin-bottom: var(--space-3); }

/* ============ Hero Split ============ */
.hero-split {
    display: grid;
    grid-template-columns: 58fr 42fr;
    gap: var(--space-8);
    align-items: center;
    padding: var(--space-12) 0;
}
.hero-split__photo {
    position: relative;
    aspect-ratio: 4/3;
    background: var(--muted-rule);
    border-radius: var(--r-lg);
    overflow: hidden;
}
.hero-split__photo img { width:100%; height:100%; object-fit: cover; }
.hero-split__caption {
    position: absolute; bottom: var(--space-4); left: var(--space-4);
    background: rgba(26,26,26,.85); color: var(--paper);
    padding: var(--space-3) var(--space-4); border-radius: var(--r-md);
    font-family: var(--font-mono); font-size: .8125rem; line-height: 1.4;
}
.hero-split__content h1 { font-family: var(--font-heading); font-weight: 400; font-size: clamp(2rem, 4.5vw, 3.5rem); }
.hero-split__sub { font-size: 1.1875rem; color: #4a4a4a; margin: var(--space-4) 0 var(--space-6); }
.hero-split__ctas { display: flex; gap: var(--space-4); flex-wrap: wrap; }
.btn { padding: var(--space-3) var(--space-6); border-radius: var(--r-md); text-decoration: none; font-weight: 500; transition: all .15s; }
.btn--primary { background: var(--terracotta); color: var(--paper); }
.btn--primary:hover { background: var(--terracotta-hover); }
.btn--secondary { background: transparent; color: var(--ink); border: 1px solid var(--ink); }
.btn--secondary:hover { background: var(--ink); color: var(--paper); }

@media (max-width: 768px) {
    .hero-split { grid-template-columns: 1fr; }
}

/* ============ Trust Band ============ */
.trust-band {
    background: var(--permit-blue); color: var(--paper);
    padding: var(--space-4) 0;
}
.trust-band__inner {
    display: flex; justify-content: space-around; align-items: center;
    gap: var(--space-6); flex-wrap: wrap;
    font-family: var(--font-mono); font-size: .875rem;
}
.trust-band__item strong { color: var(--paper); font-family: var(--font-body); font-weight: 500; }

/* ============ Service Grid 2x2 ============ */
.service-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-6);
}
.service-card {
    background: #fff; border: 1px solid var(--muted-rule); border-radius: var(--r-lg);
    padding: var(--space-8); transition: transform .25s ease, box-shadow .25s ease;
    text-decoration: none; color: var(--ink); display: block;
}
.service-card:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,0,0,.08); border-color: var(--terracotta); }
.service-card h3 { font-family: var(--font-heading); font-weight: 500; font-size: 1.5rem; margin-bottom: var(--space-2); }
.service-card p { color: #5a5a5a; font-size: .9375rem; }
.service-card__cta { color: var(--terracotta); font-weight: 500; margin-top: var(--space-4); display: inline-block; }
@media (max-width: 640px) { .service-grid { grid-template-columns: 1fr; } }

/* ============ Counter band ============ */
.counter-band { background: var(--paper); padding: var(--space-12) 0; border-top: 1px solid var(--muted-rule); border-bottom: 1px solid var(--muted-rule); }
.counter-band__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6); text-align: center; }
.counter-band__num { font-family: var(--font-mono); font-size: clamp(2rem, 4vw, 3.25rem); color: var(--terracotta); font-weight: 500; line-height: 1; }
.counter-band__label { font-size: .875rem; color: #5a5a5a; margin-top: var(--space-2); text-transform: uppercase; letter-spacing: .05em; }
@media (max-width: 640px) { .counter-band__grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-4); } }

/* ============ Atlas Map ============ */
.atlas-map { position: relative; }
.atlas-map__embed { width: 100%; height: min(720px, 70vh); border-radius: var(--r-lg); background: var(--muted-rule); overflow: hidden; }
.atlas-map__filters { display: flex; gap: var(--space-3); flex-wrap: wrap; margin-bottom: var(--space-6); }
.atlas-chip { background: #fff; border: 1px solid var(--muted-rule); padding: var(--space-2) var(--space-4); border-radius: 999px; cursor: pointer; font-size: .875rem; }
.atlas-chip[aria-pressed="true"] { background: var(--terracotta); color: var(--paper); border-color: var(--terracotta); }

/* ============ Gallery masonry ============ */
.gallery-masonry { column-count: 4; column-gap: var(--space-4); }
@media (max-width: 1024px) { .gallery-masonry { column-count: 3; } }
@media (max-width: 768px) { .gallery-masonry { column-count: 2; } }
@media (max-width: 480px) { .gallery-masonry { column-count: 1; } }
.gallery-item { break-inside: avoid; margin-bottom: var(--space-4); border-radius: var(--r-md); overflow: hidden; position: relative; }
.gallery-item img { width: 100%; display: block; transition: transform .4s ease; }
.gallery-item:hover img { transform: scale(1.04); }
.gallery-item__caption { position: absolute; bottom: 0; left: 0; right: 0; padding: var(--space-3); background: linear-gradient(to top, rgba(26,26,26,.9), transparent); color: var(--paper); font-family: var(--font-mono); font-size: .75rem; opacity: 0; transition: opacity .25s; }
.gallery-item:hover .gallery-item__caption { opacity: 1; }

/* ============ Process steps ============ */
.process-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-8); }
.process-step__num { font-family: var(--font-mono); font-size: 1.25rem; color: var(--terracotta); margin-bottom: var(--space-2); }
.process-step h3 { font-family: var(--font-heading); font-weight: 500; font-size: 1.25rem; margin-bottom: var(--space-2); }
@media (max-width: 768px) { .process-steps { grid-template-columns: 1fr 1fr; gap: var(--space-6); } }

/* ============ FAQ accordion ============ */
.faq-list details { border-top: 1px solid var(--muted-rule); padding: var(--space-4) 0; }
.faq-list details:last-child { border-bottom: 1px solid var(--muted-rule); }
.faq-list summary { font-family: var(--font-heading); font-weight: 500; font-size: 1.125rem; cursor: pointer; list-style: none; padding-right: var(--space-6); position: relative; }
.faq-list summary::after { content: '+'; position: absolute; right: 0; top: 0; color: var(--terracotta); font-size: 1.5rem; line-height: 1; }
.faq-list details[open] summary::after { content: '−'; }
.faq-list details p { padding-top: var(--space-3); color: #4a4a4a; }
/* ============ Gallery editorial v2 (2026-05-19 rebuild) ============ */
.gallery-editorial {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
}
@media (max-width: 1024px) { .gallery-editorial { grid-template-columns: repeat(2, 1fr); gap: var(--space-5); } }
@media (max-width: 540px)  { .gallery-editorial { grid-template-columns: 1fr; gap: var(--space-4); } }

.gallery-tile {
    position: relative;
    overflow: hidden;
    border-radius: var(--r-md);
    aspect-ratio: 4/3;
    background: var(--muted-rule);
    display: block;
    box-shadow: 0 6px 20px rgba(26,26,26,.06);
    transition: transform .4s cubic-bezier(.4,0,.2,1), box-shadow .4s;
    text-decoration: none;
}
.gallery-tile[data-aspect="3/4"] { aspect-ratio: 3/4; }
.gallery-tile img {
    width: 100%; height: 100%; object-fit: cover;
    display: block;
    transition: transform .6s cubic-bezier(.22,1,.36,1);
}
.gallery-tile:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 32px rgba(26,26,26,.16);
}
.gallery-tile:hover img { transform: scale(1.04); }

.gallery-tile__caption {
    position: absolute; bottom: 0; left: 0; right: 0;
    padding: var(--space-4);
    background: linear-gradient(to top, rgba(26,26,26,.85) 0%, rgba(26,26,26,0) 100%);
    color: var(--paper);
    display: flex; flex-direction: column; gap: 2px;
    opacity: 0; transform: translateY(6px);
    transition: opacity .25s ease, transform .25s ease;
    pointer-events: none;
}
.gallery-tile:hover .gallery-tile__caption,
.gallery-tile:focus-visible .gallery-tile__caption {
    opacity: 1; transform: translateY(0);
}
.gallery-tile__cat {
    font-family: var(--font-mono);
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: rgba(246,243,238,.7);
}
.gallery-tile__label {
    font-family: var(--font-heading);
    font-weight: 500;
    font-size: 1rem;
    color: var(--paper);
    line-height: 1.3;
}

/* Filter chips v2 */
.gallery-filters { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.gallery-chip {
    background: #fff;
    border: 1px solid var(--muted-rule);
    padding: var(--space-2) var(--space-4);
    border-radius: 999px;
    cursor: pointer;
    font-size: .875rem;
    font-family: var(--font-body);
    color: var(--ink);
    display: inline-flex; align-items: center; gap: var(--space-2);
    transition: background .2s, color .2s, border-color .2s;
}
.gallery-chip:hover { border-color: var(--ink); }
.gallery-chip.is-active {
    background: var(--terracotta);
    color: var(--paper);
    border-color: var(--terracotta);
}
.gallery-chip .chip-count {
    font-family: var(--font-mono);
    font-size: .75rem;
    background: rgba(0,0,0,.08);
    padding: 2px 6px;
    border-radius: 999px;
}
.gallery-chip.is-active .chip-count {
    background: rgba(255,255,255,.18);
    color: var(--paper);
}

/* On mobile the tile caption is always visible (no hover) */
@media (hover: none) {
    .gallery-tile__caption { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .gallery-tile, .gallery-tile img { transition: none !important; }
}

/* ============ Map fallback overlay (P0 #4) ============ */
.atlas-map__fallback {
    width: 100%;
    height: min(560px, 60vh);
    border-radius: var(--r-lg);
    background: linear-gradient(135deg, #1F3A5F 0%, #15294A 100%) center/cover;
    display: flex; align-items: center; justify-content: center;
    color: var(--paper);
    position: relative;
    overflow: hidden;
}
.atlas-map__fallback::before {
    /* Subtle GTA outline SVG as background watermark */
    content: ''; position: absolute; inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 600' fill='none' opacity='.15'%3E%3Cpath d='M120 280 L180 220 L240 250 L300 200 L400 180 L500 200 L600 240 L680 290 L660 380 L580 440 L460 460 L340 440 L240 420 L160 380 Z' stroke='%23F6F3EE' stroke-width='2'/%3E%3Ccircle cx='400' cy='320' r='8' fill='%23B23A1B'/%3E%3Ccircle cx='280' cy='350' r='6' fill='%23B23A1B'/%3E%3Ccircle cx='500' cy='280' r='6' fill='%23B23A1B'/%3E%3Ccircle cx='220' cy='280' r='5' fill='%23B23A1B'/%3E%3Ccircle cx='580' cy='350' r='5' fill='%23B23A1B'/%3E%3C/svg%3E");
    background-size: cover; background-position: center;
}
.atlas-map__fallback-content {
    position: relative; z-index: 1;
    text-align: center; padding: var(--space-8);
    max-width: 520px;
}
.atlas-map__fallback h3 {
    color: var(--paper);
    font-family: var(--font-heading);
    font-size: 1.75rem;
    margin-bottom: var(--space-3);
}
.atlas-map__fallback p {
    color: rgba(246,243,238,.85);
    margin-bottom: var(--space-5);
}
.atlas-map__fallback .btn {
    background: var(--paper);
    color: var(--ink);
    border: none;
}
.atlas-map__fallback .btn:hover { background: rgba(246,243,238,.92); }

/* ============ Service hero photo (P0 #5) ============ */
.service-hero {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: var(--space-8);
    align-items: center;
    padding: var(--space-8) 0;
}
.service-hero__media {
    aspect-ratio: 4/3;
    border-radius: var(--r-lg);
    overflow: hidden;
    background: var(--muted-rule);
    box-shadow: 0 10px 30px rgba(26,26,26,.10);
    position: relative;
}
.service-hero__media img {
    width: 100%; height: 100%; object-fit: cover; display: block;
}
@media (max-width: 768px) {
    .service-hero { grid-template-columns: 1fr; gap: var(--space-6); }
}

/* ============ Sticky mobile CTA bar (P1, prep) ============ */
.sticky-cta-bar {
    position: fixed; bottom: 0; left: 0; right: 0;
    display: none;
    z-index: 200;
    background: var(--paper);
    border-top: 1px solid var(--muted-rule);
    box-shadow: 0 -4px 18px rgba(26,26,26,.10);
    padding: calc(var(--space-3) + env(safe-area-inset-bottom)/2) var(--space-3) calc(var(--space-3) + env(safe-area-inset-bottom));
    gap: var(--space-2);
    transform: translateY(100%);
    transition: transform .35s cubic-bezier(.4,0,.2,1);
}
.sticky-cta-bar.is-visible { transform: translateY(0); }
.sticky-cta-bar a {
    flex: 1;
    text-align: center;
    font-family: var(--font-body);
    font-weight: 500;
    text-decoration: none;
    padding: var(--space-3);
    border-radius: var(--r-md);
    display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
    min-height: 48px;
    font-size: .9375rem;
}
.sticky-cta-bar .cta-call    { background: var(--terracotta); color: var(--paper); }
.sticky-cta-bar .cta-whatsapp{ background: var(--check-green); color: var(--paper); }
.sticky-cta-bar .cta-quote   { background: var(--permit-blue); color: var(--paper); }
.sticky-cta-bar svg { width: 18px; height: 18px; stroke-width: 2.2; }
@media (max-width: 768px) {
    .sticky-cta-bar { display: flex; }
    body { padding-bottom: 88px; }
}
/* ============ Sprint 2 P1 additions (2026-05-19) ============ */

/* Reveal-on-scroll base state */
[data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .7s cubic-bezier(.22,1,.36,1), transform .7s cubic-bezier(.22,1,.36,1); }
[data-reveal].is-revealed { opacity: 1; transform: translateY(0); }

[data-reveal-stagger] { opacity: 0; transform: translateY(20px); transition: opacity .6s cubic-bezier(.22,1,.36,1), transform .6s cubic-bezier(.22,1,.36,1); }
[data-reveal-stagger].is-revealed { opacity: 1; transform: translateY(0); }

@media (prefers-reduced-motion: reduce) {
    [data-reveal], [data-reveal-stagger] { opacity: 1; transform: none; transition: none; }
}

/* ============ Trust bar SVG chips v2 ============ */
.trust-band { background: var(--permit-blue); color: var(--paper); padding: var(--space-4) 0; }
.trust-band__inner {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
    gap: var(--space-5);
    font-family: var(--font-mono); font-size: .8125rem; letter-spacing: .04em;
}
.trust-band__chip {
    display: inline-flex; align-items: center; gap: var(--space-2);
    color: rgba(246,243,238,.92);
}
.trust-band__chip svg { width: 18px; height: 18px; flex-shrink: 0; opacity: .85; }
.trust-band__chip strong { color: var(--paper); font-weight: 600; }
@media (max-width: 768px) {
    .trust-band__inner { gap: var(--space-3); font-size: .75rem; justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; padding-bottom: var(--space-2); }
    .trust-band__chip { flex-shrink: 0; }
}

/* ============ Service grid v2 — photo + icon + chips ============ */
.service-grid--photo {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-6);
}
@media (max-width: 768px) {
    .service-grid--photo { grid-template-columns: 1fr; gap: var(--space-5); }
}
.service-card-v2 {
    display: flex; flex-direction: column;
    background: #fff;
    border-radius: var(--r-lg);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 4px 18px rgba(26,26,26,.06);
    transition: transform .35s cubic-bezier(.4,0,.2,1), box-shadow .35s;
}
.service-card-v2:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 40px rgba(26,26,26,.14);
}
.service-card-v2__media {
    position: relative;
    aspect-ratio: 16/10;
    overflow: hidden;
    background: var(--muted-rule);
}
.service-card-v2__media img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    transition: transform .6s cubic-bezier(.22,1,.36,1);
}
.service-card-v2:hover .service-card-v2__media img { transform: scale(1.06); }

.service-card-v2__icon {
    position: absolute; top: var(--space-4); left: var(--space-4);
    width: 44px; height: 44px;
    background: var(--terracotta);
    color: var(--paper);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
}
.service-card-v2__icon svg { width: 22px; height: 22px; }

.service-card-v2__body {
    padding: var(--space-6) var(--space-6) var(--space-5);
    display: flex; flex-direction: column; gap: var(--space-3);
}
.service-card-v2__body h3 { font-family: var(--font-heading); font-weight: 500; font-size: 1.5rem; margin: 0; }
.service-card-v2__body p { color: var(--ink-2, #3c3835); font-size: .9375rem; line-height: 1.55; margin: 0; }

.service-card-v2__chips { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-2); }
.service-chip {
    font-family: var(--font-mono); font-size: .6875rem; text-transform: uppercase; letter-spacing: .08em;
    padding: 4px 10px;
    background: var(--paper-2, #efeae0); color: var(--permit-blue);
    border-radius: 999px;
}

.service-card-v2__cta {
    color: var(--terracotta);
    font-weight: 500;
    font-size: .9375rem;
    display: inline-flex; align-items: center; gap: var(--space-2);
    margin-top: var(--space-2);
}
.service-card-v2__cta svg { transition: transform .25s ease; }
.service-card-v2:hover .service-card-v2__cta svg { transform: translateX(4px); }

/* ============ Counter band v2 — bigger numbers + animation ============ */
.counter-band { padding: var(--space-12) 0; background: var(--paper); }
.counter-band__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--space-6);
    text-align: center;
}
@media (max-width: 768px) { .counter-band__grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-8); } }
.counter-band__num {
    font-family: var(--font-heading);
    font-size: clamp(2.5rem, 5vw, 4rem);
    font-weight: 400;
    color: var(--terracotta);
    line-height: 1;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
}
.counter-band__label {
    font-family: var(--font-mono);
    font-size: .6875rem;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--ink-2, #3c3835);
    margin-top: var(--space-3);
}

/* ============ Hero — Ken Burns subtle on photo ============ */
.hero-split__photo { position: relative; overflow: hidden; border-radius: var(--r-lg); }
.hero-split__photo img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    animation: kenBurns 18s ease-in-out infinite alternate;
}
@keyframes kenBurns {
    0%   { transform: scale(1.0) translate(0, 0); }
    100% { transform: scale(1.06) translate(-1.5%, -1%); }
}
@media (prefers-reduced-motion: reduce) {
    .hero-split__photo img { animation: none !important; }
}

/* ============ FOOTER 4-col rebuild ============ */
.site-footer {
    background: var(--permit-blue-2, #15294A);
    color: rgba(246,243,238,.85);
    padding: var(--space-12) 0 var(--space-6);
    margin-top: var(--space-16);
}
.footer-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
    gap: var(--space-8);
}
@media (max-width: 980px) { .footer-grid { grid-template-columns: 1fr 1fr; gap: var(--space-8); } }
@media (max-width: 540px) { .footer-grid { grid-template-columns: 1fr; gap: var(--space-7); } }

.footer-brand {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    font-weight: 500;
    color: var(--paper);
    margin-bottom: var(--space-3);
}
.footer-pitch {
    font-size: .9375rem;
    line-height: 1.55;
    color: rgba(246,243,238,.7);
    margin-bottom: var(--space-4);
    max-width: 360px;
}
.footer-cert { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.footer-cert__chip {
    font-family: var(--font-mono);
    font-size: .6875rem;
    text-transform: uppercase;
    letter-spacing: .08em;
    padding: 4px 10px;
    border: 1px solid rgba(246,243,238,.2);
    border-radius: 999px;
    color: rgba(246,243,238,.7);
}

.footer-col h4 {
    font-family: var(--font-mono);
    font-size: .6875rem;
    text-transform: uppercase;
    letter-spacing: .14em;
    font-weight: 500;
    color: rgba(246,243,238,.55);
    margin-bottom: var(--space-3);
}
.footer-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.footer-col ul li { font-size: .9375rem; }
.footer-col ul li a {
    color: rgba(246,243,238,.85);
    text-decoration: none;
    transition: color .2s;
    display: inline-flex; align-items: center; gap: var(--space-2);
}
.footer-col ul li a:hover { color: var(--paper); }

.footer-areas { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); }
.footer-areas li { color: rgba(246,243,238,.7); font-size: .875rem; }

.footer-contact li.footer-hours {
    color: rgba(246,243,238,.55);
    font-family: var(--font-mono);
    font-size: .8125rem;
    margin-top: var(--space-2);
}

.footer-bottom {
    margin-top: var(--space-8);
    padding-top: var(--space-5);
    border-top: 1px solid rgba(246,243,238,.1);
    display: flex; justify-content: space-between; align-items: center;
    font-size: .8125rem;
    color: rgba(246,243,238,.5);
}
.footer-bottom__legal { display: flex; gap: var(--space-4); }
.footer-bottom__legal a {
    color: rgba(246,243,238,.65);
    text-decoration: none;
}
.footer-bottom__legal a:hover { color: var(--paper); }
@media (max-width: 640px) { .footer-bottom { flex-direction: column; gap: var(--space-3); text-align: center; } }

/* Remove old sticky CTA emoji styles */
.sticky-cta { display: none !important; }

/* ============ Blog index editorial cards ============ */
.blog-index {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
}
@media (max-width: 980px) { .blog-index { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .blog-index { grid-template-columns: 1fr; } }

.blog-card {
    background: #fff;
    border-radius: var(--r-md);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 4px 18px rgba(26,26,26,.05);
    transition: transform .35s, box-shadow .35s;
    display: flex; flex-direction: column;
}
.blog-card:hover { transform: translateY(-4px); box-shadow: 0 14px 32px rgba(26,26,26,.12); }
.blog-card__media {
    aspect-ratio: 4/3;
    background: linear-gradient(135deg, var(--paper-2) 0%, var(--muted-rule) 100%);
    position: relative;
}
.blog-card__cat {
    position: absolute; top: var(--space-3); left: var(--space-3);
    font-family: var(--font-mono); font-size: .6875rem;
    text-transform: uppercase; letter-spacing: .12em;
    padding: 4px 10px;
    background: rgba(246,243,238,.95);
    color: var(--permit-blue);
    border-radius: 999px;
}
.blog-card__body { padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-3); flex: 1; }
.blog-card__body h3 { font-family: var(--font-heading); font-weight: 500; font-size: 1.25rem; margin: 0; line-height: 1.3; }
.blog-card__body p { color: var(--ink-2, #3c3835); font-size: .875rem; line-height: 1.55; margin: 0; }
.blog-card__meta {
    margin-top: auto;
    padding-top: var(--space-3);
    border-top: 1px solid var(--muted-rule);
    font-family: var(--font-mono); font-size: .6875rem; text-transform: uppercase; letter-spacing: .08em;
    color: var(--ink-2, #5a5a5a);
}

/* ============ Article single-post typography ============ */
.single-post .container { max-width: 760px; }
.single-post article > * { max-width: 65ch; margin-left: auto; margin-right: auto; }
.single-post .article-hero {
    max-width: 100%;
    margin-bottom: var(--space-8);
}
.single-post h1 { font-size: clamp(2rem, 4vw, 3rem); margin-bottom: var(--space-4); }
.single-post .article-meta {
    font-family: var(--font-mono); font-size: .75rem; text-transform: uppercase; letter-spacing: .12em;
    color: var(--ink-2, #5a5a5a);
    margin-bottom: var(--space-8);
}
.single-post p.lead { font-size: 1.25rem; line-height: 1.55; color: var(--ink); }
.single-post p { font-size: 1.0625rem; line-height: 1.7; }
.single-post h2 { font-family: var(--font-heading); font-weight: 500; font-size: 1.75rem; margin-top: var(--space-10); margin-bottom: var(--space-4); }
.single-post ol, .single-post ul { padding-left: 1.25em; line-height: 1.7; }
.single-post li { margin-bottom: var(--space-2); }