/* LPI ui-2026.css: Waves 1-2 structure + Grok face-lift loop 6 (enrich.css flattened in, 2026-09-29, no @import chain) */
/* ============================================================
   LPI Grok enrichment layer — 2026-09-29
   Award-grade polish ON TOP of Waves 1–2. CSS only.
   Palette: navy #062b58 + amber #ffbe01. Both themes finished.
   ============================================================ */

/* ---------- Design tokens (enrichment-only; do not clash) ---------- */
:root {
  --lpi-navy: #062b58;
  --lpi-navy-deep: #041f42;
  --lpi-navy-mid: #0a3d7a;
  --lpi-amber: #ffbe01;
  --lpi-amber-soft: rgba(255, 190, 1, 0.14);
  --lpi-sea: #19c3c9;
  --lpi-grain: url("assets/grok/noise.svg");
  --lpi-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --lpi-lift: 0 10px 28px -14px rgba(6, 43, 88, 0.28),
              0 2px 6px rgba(6, 43, 88, 0.06);
  --lpi-lift-dark: 0 14px 36px -16px rgba(0, 0, 0, 0.55),
                   0 1px 0 rgba(255, 255, 255, 0.04) inset;
  --lpi-hairline: color-mix(in srgb, var(--color-border) 85%, var(--color-primary) 15%);
  /* Loop 2 · site-wide radius / chrome language */
  --lpi-radius-xs: 10px;
  --lpi-radius-sm: 12px;
  --lpi-radius-md: 14px;
  --lpi-radius-lg: 18px;
  --lpi-radius-xl: 22px;
  --lpi-radius-pill: 999px;
  --lpi-chrome: 1px solid var(--lpi-hairline);
  --lpi-inset: inset 0 1px 0 rgba(255, 255, 255, 0.05);
  --lpi-amber-tally: linear-gradient(90deg, var(--lpi-amber), rgba(255, 190, 1, 0.08));
}


html[data-theme="dark"] {
  --lpi-lift: var(--lpi-lift-dark);
  --lpi-hairline: color-mix(in srgb, var(--color-border) 70%, #5b9bd5 30%);
}

/* ---------- Global: print-quality grain (very low opacity) ---------- */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 9998;
  pointer-events: none;
  opacity: 0.035;
  background-image: var(--lpi-grain);
  background-size: 160px 160px;
  mix-blend-mode: overlay;
}
html[data-theme="light"] body::before { opacity: 0.028; mix-blend-mode: multiply; }
@media (prefers-reduced-motion: reduce) {
  body::before { opacity: 0.02; }
}

/* ---------- Focus rings sitewide (amber signal, never colour alone) ---------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
.btn:focus-visible,
.theme-toggle:focus-visible,
.hamburger:focus-visible,
.area-tag:focus-visible,
.faq-index a:focus-visible,
.lpi-router__opt input:focus-visible + span,
.nav-mega__panel a:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 2px;
}

/* ---------- Header: quieter, more confident ---------- */
.header--scrolled {
  background: color-mix(in srgb, var(--color-bg) 92%, var(--lpi-navy) 8%);
  box-shadow: 0 1px 0 var(--lpi-hairline), 0 8px 24px -18px rgba(6, 43, 88, 0.35);
}
html[data-theme="dark"] .header--scrolled {
  background: color-mix(in srgb, var(--color-bg) 88%, #000 12%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06), 0 12px 28px -18px rgba(0, 0, 0, 0.6);
}
.header__nav a {
  letter-spacing: 0.03em;
  font-weight: 600;
}
.header__nav .header__call {
  letter-spacing: 0.02em;
  box-shadow: 0 8px 22px -10px rgba(255, 190, 1, 0.65),
              inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
.header__nav .header__call:hover {
  box-shadow: 0 12px 28px -10px rgba(255, 190, 1, 0.8),
              inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
.header__nav .header__call:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px rgba(255, 190, 1, 0.35);
}

/* Mega panel polish */
@media (min-width: 769px) {
  .nav-mega__panel {
    border-radius: 18px;
    border-color: var(--lpi-hairline);
    box-shadow: var(--lpi-lift), 0 0 0 1px rgba(255, 190, 1, 0.06);
    padding: 1.15rem 1.25rem;
  }
  .header__nav .nav-mega__panel a {
    transition: background var(--transition-interactive), transform var(--transition-interactive);
  }
  .header__nav .nav-mega__panel a:hover {
    transform: translateX(2px);
  }
}

/* ---------- Hero: dossier as premium certificate panel ---------- */
.hero--dossier {
  /* deepen the quiet navy; keep existing bloom */
}
.hero__kicker {
  letter-spacing: 0.22em;
  color: rgba(255, 255, 255, 0.78);
}
.hero__kicker::before {
  height: 2px;
  width: 44px;
  border-radius: 2px;
}
.hero h1 {
  letter-spacing: -0.022em;
  text-wrap: balance;
}
.hero h1 .hero__accent {
  text-shadow: 0 0 48px rgba(255, 190, 1, 0.34), 0 1px 0 rgba(0, 0, 0, 0.2);
}
.hero .answer-block {
  border-image: linear-gradient(180deg, var(--lpi-amber) 0%, rgba(255, 190, 1, 0.12) 100%) 1;
  padding-left: 1.35rem;
  line-height: 1.65;
}

@media (min-width: 1024px) {
  .hero__dossier {
    background:
      linear-gradient(165deg, rgba(255, 255, 255, 0.06) 0%, transparent 42%),
      linear-gradient(180deg, var(--lpi-navy-mid) 0%, var(--lpi-navy) 55%, var(--lpi-navy-deep) 100%);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 22px;
    box-shadow:
      0 36px 70px -32px rgba(0, 0, 0, 0.72),
      0 1px 0 rgba(255, 255, 255, 0.1) inset,
      0 -1px 0 rgba(0, 0, 0, 0.25) inset;
    padding: clamp(1.6rem, 2.5vw, 2.4rem);
  }
  .hero__dossier::before {
    width: 64px;
    height: 3px;
    background: linear-gradient(90deg, var(--lpi-amber), rgba(255, 190, 1, 0.1));
  }
  /* Certificate corner ornaments (glyphs only) */
  .hero__dossier::after {
    content: "";
    position: absolute;
    right: 1.1rem;
    bottom: 1.1rem;
    width: 36px;
    height: 36px;
    background: url("assets/grok/corner.svg") no-repeat center / contain;
    opacity: 0.55;
    transform: rotate(180deg);
    pointer-events: none;
  }
  .hero__dossier .hero__fact {
    border-bottom-color: rgba(255, 255, 255, 0.11);
    padding: 0.95rem 0;
  }
  .hero__dossier .hero__fact dt {
    letter-spacing: 0.16em;
    font-size: 68%;
  }
  .hero__dossier .hero__fact-num {
    letter-spacing: -0.015em;
  }
  .hero__dossier .hero__ctas .btn--primary {
    box-shadow: 0 10px 26px -10px rgba(255, 190, 1, 0.7),
                inset 0 1px 0 rgba(255, 255, 255, 0.35);
  }
  .hero__dossier .hero__ctas .btn--outline {
    border-color: rgba(255, 255, 255, 0.42);
    background: rgba(255, 255, 255, 0.03);
  }
  .hero__dossier .hero__ctas .btn--outline:hover {
    border-color: rgba(255, 255, 255, 0.7);
  }
  .hero--dossier:has(.hero__dossier) .hero__plate {
    opacity: 0.5;
  }
}

/* Mobile dossier card — same certificate treatment */
@media (max-width: 1023.98px) {
  .hero__dossier {
    margin-top: 1.5rem;
    padding: 1.35rem 1.25rem 1.4rem;
    background:
      linear-gradient(165deg, rgba(255, 255, 255, 0.05) 0%, transparent 40%),
      linear-gradient(180deg, var(--lpi-navy-mid) 0%, var(--lpi-navy-deep) 100%);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 18px;
    box-shadow: 0 24px 48px -28px rgba(0, 0, 0, 0.65),
                inset 0 1px 0 rgba(255, 255, 255, 0.08);
    position: relative;
  }
  .hero__dossier::before {
    content: "";
    position: absolute;
    left: 1.25rem;
    top: 0;
    width: 48px;
    height: 3px;
    background: linear-gradient(90deg, var(--lpi-amber), rgba(255, 190, 1, 0.12));
    border-radius: 0 0 3px 3px;
  }
}

/* ---------- Buttons: calmer press, amber as signal ---------- */
.btn {
  letter-spacing: 0.015em;
  border-radius: 999px;
  transition: transform var(--transition-interactive),
              box-shadow var(--transition-interactive),
              background var(--transition-interactive),
              border-color var(--transition-interactive),
              color var(--transition-interactive);
}
.btn--primary {
  color: var(--lpi-navy) !important;
  font-weight: 700;
  box-shadow: 0 8px 22px -10px rgba(255, 190, 1, 0.55),
              inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
.btn--primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px -12px rgba(255, 190, 1, 0.7),
              inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
.btn--dark {
  border-radius: 999px;
}
.btn--outline,
.btn--accent-outline {
  border-radius: 999px;
}
@media (prefers-reduced-motion: reduce) {
  .btn:hover { transform: none; }
}

/* ---------- Section cadence + typography rhythm ---------- */
.section-padding {
  padding-block: clamp(3.25rem, 7vw, 6.5rem);
}
.section-label {
  letter-spacing: 0.18em;
  font-weight: 700;
  font-size: 72%;
  color: color-mix(in srgb, var(--color-text-muted) 70%, var(--lpi-amber) 30%);
}
.section-label::before {
  /* existing accent bar often present; reinforce color */
}
.section-title {
  letter-spacing: -0.02em;
  text-wrap: balance;
  line-height: 1.12;
}
.section-desc {
  line-height: 1.65;
  max-width: 62ch;
  text-wrap: pretty;
}
.section--alt {
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-surface-2) 88%, var(--lpi-navy) 12%) 0%,
      var(--color-surface-2) 100%
    );
}
html[data-theme="dark"] .section--alt {
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-surface-2) 92%, #000 8%) 0%,
      var(--color-surface-2) 100%
    );
}

/* ---------- Trust strip + trust bar ---------- */
.lpi-trust-strip,
.lpi-tldr-band .lpi-trust-strip {
  border: 1px solid var(--lpi-hairline);
  border-radius: 16px;
  background:
    linear-gradient(135deg, rgba(255, 190, 1, 0.06), transparent 40%),
    var(--color-surface);
  box-shadow: var(--shadow-sm);
  padding: 1rem 1.25rem;
}
html[data-theme="dark"] .lpi-tldr-band .lpi-trust-strip {
  background:
    linear-gradient(135deg, rgba(255, 190, 1, 0.07), transparent 42%),
    var(--color-surface);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
.trust-item {
  border-radius: 16px;
  border-color: var(--lpi-hairline);
  transition: transform var(--transition-interactive), box-shadow var(--transition-interactive),
              border-color var(--transition-interactive);
}
.trust-item:hover {
  transform: translateY(-3px);
  box-shadow: var(--lpi-lift);
  border-color: color-mix(in srgb, var(--color-accent) 35%, var(--color-border));
}
.trust-item__icon {
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
}
@media (prefers-reduced-motion: reduce) {
  .trust-item:hover { transform: none; }
}

/* ---------- Intent router ---------- */
.lpi-router {
  padding-block: clamp(2.75rem, 5.5vw, 4.5rem);
  position: relative;
}
.lpi-router::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: min(120px, 30vw);
  height: 2px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, transparent, var(--lpi-amber), transparent);
  border-radius: 2px;
  opacity: 0.7;
}
.lpi-router__q {
  letter-spacing: -0.015em;
  margin-bottom: 1.35rem;
}
.lpi-router__opt span {
  border-radius: 999px;
  padding: 0.75rem 1.25rem;
  box-shadow: var(--shadow-sm);
  transition: border-color var(--transition-interactive),
              background var(--transition-interactive),
              transform var(--transition-interactive),
              box-shadow var(--transition-interactive);
}
.lpi-router__opt span:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--color-accent) 40%, var(--color-border));
}
.lpi-router__opt input:checked + span {
  border-color: var(--lpi-amber);
  background: color-mix(in srgb, var(--lpi-amber) 14%, var(--color-surface));
  box-shadow: 0 8px 20px -12px rgba(255, 190, 1, 0.55);
}
.lpi-router__a {
  border-radius: 14px;
  border-color: var(--lpi-hairline);
  box-shadow: var(--shadow-sm);
  line-height: 1.55;
}
@media (prefers-reduced-motion: reduce) {
  .lpi-router__opt span:hover { transform: none; }
}

/* ---------- Service / feature / prose cards ---------- */
.service-card,
.feature-card,
.prose-card,
.features-grid > article,
.features-grid > .card,
.prose-card-grid > *,
.services-grid > *,
.card {
  border-radius: 18px;
  border-color: var(--lpi-hairline);
  transition: transform var(--transition-interactive),
              box-shadow var(--transition-interactive),
              border-color var(--transition-interactive);
}
.service-card:hover,
.feature-card:hover,
.prose-card:hover,
.prose-card-grid > *:hover,
.services-grid > *:hover {
  transform: translateY(-4px);
  box-shadow: var(--lpi-lift);
  border-color: color-mix(in srgb, var(--color-accent) 28%, var(--color-border));
}
@media (prefers-reduced-motion: reduce) {
  .service-card:hover,
  .feature-card:hover,
  .prose-card:hover,
  .prose-card-grid > *:hover,
  .services-grid > *:hover,
  .trust-item:hover { transform: none; }
}

/* Home services grid cards — common class patterns on LPI */
#services .card,
#services article,
.services .card,
.lpi-services .card {
  background: var(--color-surface);
  border: 1px solid var(--lpi-hairline);
  border-radius: 18px;
  box-shadow: var(--shadow-sm);
}
html[data-theme="dark"] #services .card,
html[data-theme="dark"] #services article {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

/* ---------- Why-choose ledger polish ---------- */
#why-us .why__grid {
  border-top-color: var(--lpi-hairline);
}
#why-us .why-card {
  border-bottom-color: var(--lpi-hairline);
  transition: background var(--transition-interactive);
  padding-inline: 0.35rem;
}
#why-us .why-card:hover {
  background: color-mix(in srgb, var(--color-accent) 5%, transparent);
}
#why-us .why-card h3::before {
  width: 0.5rem;
  height: 0.5rem;
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--lpi-amber) 22%, transparent);
}
#why-us .why-card p {
  line-height: 1.6;
}

/* ---------- Testimonials ---------- */
.testimonials,
#testimonials {
  position: relative;
}
.testimonials .section-title {
  letter-spacing: -0.02em;
}
.testimonial-card,
.testimonials__track article,
.review-card,
[data-reviews-track] > * {
  border-radius: 18px;
  border: 1px solid var(--lpi-hairline);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
}
html[data-theme="dark"] .testimonial-card,
html[data-theme="dark"] [data-reviews-track] > * {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), var(--shadow-sm);
}

/* ---------- Location / Google Maps cards ---------- */
.location-card {
  border-radius: 18px;
  border: 1px solid var(--lpi-hairline);
  overflow: hidden;
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition-interactive), box-shadow var(--transition-interactive);
}
.location-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--lpi-lift);
}
.location-card__map {
  border-bottom: 1px solid var(--lpi-hairline);
}
.location-card__body {
  padding: 1.1rem 1.2rem 1.25rem;
}
.location-card__label {
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 68%;
  font-weight: 700;
  color: var(--color-text-muted);
}
.location-card__links a {
  border-radius: 999px;
}
@media (prefers-reduced-motion: reduce) {
  .location-card:hover { transform: none; }
}

/* ---------- Suburb chips / area tags ---------- */
.area-tag,
.suburb-chip,
.chips a {
  border-radius: 999px;
  transition: background var(--transition-interactive),
              color var(--transition-interactive),
              transform var(--transition-interactive),
              box-shadow var(--transition-interactive);
}
.area-tag:hover,
.suburb-chip:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 14px -8px rgba(6, 43, 88, 0.35);
}
.area-tag--hub {
  border: 1px solid color-mix(in srgb, var(--lpi-amber) 45%, var(--color-border));
}
@media (prefers-reduced-motion: reduce) {
  .area-tag:hover, .suburb-chip:hover { transform: none; }
}

/* ---------- Long prose panels (suburb pages) ---------- */
.prose-panel,
.lpi__post-body .answer-block,
.lpi-tldr,
.answer-block {
  border-radius: 14px;
}
.lpi__post-body .answer-block,
.lpi-tldr {
  border: 1px solid var(--lpi-hairline);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--lpi-amber) 8%, transparent), transparent 50%),
    var(--color-surface);
  box-shadow: var(--shadow-sm);
  padding: 1.15rem 1.35rem;
  line-height: 1.65;
}
html[data-theme="dark"] .lpi__post-body .answer-block,
html[data-theme="dark"] .lpi-tldr {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

/* Prose card grids on suburb pages */
.prose-card-grid > * {
  background: var(--color-surface);
  border: 1px solid var(--lpi-hairline);
  border-radius: 16px;
  padding: 1.25rem 1.35rem;
  box-shadow: var(--shadow-sm);
}
html[data-theme="dark"] .prose-card-grid > * {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

/* ---------- FAQ accordion + sticky index ---------- */
.faq-item,
.faq__list details,
details.faq-item {
  border: 1px solid var(--lpi-hairline);
  border-radius: 14px;
  background: var(--color-surface);
  margin-bottom: 0.65rem;
  overflow: clip;
  transition: border-color var(--transition-interactive), box-shadow var(--transition-interactive);
}
.faq-item[open],
details.faq-item[open] {
  border-color: color-mix(in srgb, var(--color-accent) 35%, var(--color-border));
  box-shadow: var(--shadow-sm);
}
.faq-item__question,
.faq-item summary,
details.faq-item > summary {
  padding: 1rem 1.15rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  cursor: pointer;
  list-style: none;
}
.faq-item__answer,
.faq-item .faq-item__answer {
  padding: 0 1.15rem 1.15rem;
  line-height: 1.65;
  color: var(--color-text-muted);
}
@media (min-width: 1100px) {
  .lpi__post-body > .faq-index {
    border-radius: 16px;
    border-color: var(--lpi-hairline);
    box-shadow: var(--shadow-sm);
    background:
      linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 6%, var(--color-surface)), var(--color-surface));
  }
  .faq-index a {
    border-radius: 10px;
    transition: background var(--transition-interactive), transform var(--transition-interactive);
  }
  .faq-index a:hover {
    transform: translateX(2px);
  }
  .faq-index a::before {
    font-variant-numeric: tabular-nums;
    font-weight: 800;
    letter-spacing: 0.04em;
  }
}

/* ---------- Cost page table ---------- */
.lpi-inout {
  border-radius: 16px;
  border-color: var(--lpi-hairline);
  box-shadow: var(--shadow-md);
  overflow: hidden;
}
.lpi-inout thead th {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-navy) 10%, var(--color-surface)), var(--color-surface));
  letter-spacing: -0.01em;
  padding: 0.95rem 1.1rem;
}
html[data-theme="dark"] .lpi-inout thead th {
  background:
    linear-gradient(180deg, color-mix(in srgb, #5b9bd5 12%, var(--color-surface)), var(--color-surface));
}
.lpi-inout th,
.lpi-inout td {
  padding: 0.9rem 1.1rem;
  line-height: 1.45;
}
.lpi-inout tbody tr:hover td {
  background: color-mix(in srgb, var(--color-accent) 5%, transparent);
}
.lpi-inout .in::before {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-success) 20%, transparent);
}
.lpi-inout .out::before {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-text-muted) 18%, transparent);
}

/* ---------- NCR fail tiles ---------- */
.lpi-issue-tiles .feature-list li {
  border-radius: 12px;
  border-color: color-mix(in srgb, var(--color-error, #d64545) 22%, var(--color-border));
  background: color-mix(in srgb, var(--color-error, #d64545) 7%, var(--color-surface));
  transition: transform var(--transition-interactive), box-shadow var(--transition-interactive);
}
.lpi-issue-tiles .feature-list li:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 18px -12px rgba(220, 38, 38, 0.35);
}
.lpi-issue-tiles .feature-list li::before {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-error, #c53030) 22%, transparent);
}
.lpi-issue-tiles .features-grid > *,
.lpi-issue-tiles article {
  border: 1px solid var(--lpi-hairline);
  border-radius: 16px;
  background: var(--color-surface);
  padding: 1.25rem;
  box-shadow: var(--shadow-sm);
}
@media (prefers-reduced-motion: reduce) {
  .lpi-issue-tiles .feature-list li:hover { transform: none; }
}

/* ---------- Contact form ---------- */
.contact-form,
.form-group input,
.form-group select,
.form-group textarea {
  border-radius: 12px;
}
.form-group input,
.form-group select,
.form-group textarea {
  border: 1.5px solid var(--color-border);
  background: var(--color-surface);
  color: var(--color-text);
  padding: 0.85rem 1rem;
  transition: border-color var(--transition-interactive), box-shadow var(--transition-interactive);
}
.form-group input:hover,
.form-group select:hover,
.form-group textarea:hover {
  border-color: color-mix(in srgb, var(--color-primary) 35%, var(--color-border));
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  outline: none;
  border-color: var(--lpi-amber);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--lpi-amber) 22%, transparent);
}
.form-group label {
  font-weight: 700;
  letter-spacing: 0.01em;
  margin-bottom: 0.4rem;
  display: inline-block;
}
.contact-info__item {
  border-radius: 14px;
  border: 1px solid var(--lpi-hairline);
  background: var(--color-surface);
  padding: 1rem 1.1rem;
  transition: border-color var(--transition-interactive), transform var(--transition-interactive);
}
.contact-info__item:hover {
  border-color: color-mix(in srgb, var(--color-accent) 30%, var(--color-border));
  transform: translateY(-1px);
}
.form-submit .btn,
.contact-form .btn {
  min-height: 3rem;
  padding-inline: 1.5rem;
}
@media (prefers-reduced-motion: reduce) {
  .contact-info__item:hover { transform: none; }
}

/* ---------- CTA banner ---------- */
.cta-banner {
  position: relative;
  overflow: hidden;
}
.cta-banner__inner {
  position: relative;
  z-index: 1;
}
.cta-banner::after {
  content: "";
  position: absolute;
  inset: 0;
  background: url("assets/grok/caustic.svg") center / cover no-repeat;
  opacity: 0.22;
  pointer-events: none;
  mix-blend-mode: soft-light;
}
html[data-theme="light"] .cta-banner::after { opacity: 0.18; }

/* ---------- Footer ---------- */
.footer {
  border-top: 1px solid var(--lpi-hairline);
}
.footer__desc {
  line-height: 1.55;
  color: var(--color-text-muted);
}
.footer__links a {
  transition: color var(--transition-interactive), transform var(--transition-interactive);
}
.footer__links a:hover {
  color: var(--color-accent);
}
.footer__social-link {
  border-radius: 12px;
  transition: transform var(--transition-interactive), background var(--transition-interactive);
}
.footer__social-link:hover {
  transform: translateY(-2px);
}
.footer__bottom {
  border-top: 1px solid var(--lpi-hairline);
}
@media (prefers-reduced-motion: reduce) {
  .footer__social-link:hover { transform: none; }
}

/* ---------- About accent + stats ---------- */
.about__accent-bar {
  background: linear-gradient(180deg, var(--lpi-amber), rgba(255, 190, 1, 0.15));
  border-radius: 2px;
}
.about__stats {
  gap: 1rem;
}
.about__stats > * {
  border-radius: 14px;
  border: 1px solid var(--lpi-hairline);
  background: var(--color-surface);
  padding: 1rem 1.1rem;
  box-shadow: var(--shadow-sm);
}

/* ---------- Light theme: equal finish (not an afterthought) ---------- */
html[data-theme="light"] {
  --lpi-lift: 0 12px 32px -14px rgba(6, 43, 88, 0.22),
              0 2px 6px rgba(6, 43, 88, 0.05);
}
html[data-theme="light"] .btn--primary {
  color: var(--lpi-navy) !important;
}
html[data-theme="light"] .section-label {
  color: color-mix(in srgb, #42506a 55%, #062b58 45%);
}
html[data-theme="light"] .hero--dossier {
  /* hero stays dark navy in both themes by design */
}
html[data-theme="light"] .lpi-router__opt span {
  background: #fff;
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.06), 0 4px 12px -8px rgba(6, 43, 88, 0.12);
}
html[data-theme="light"] .faq-item,
html[data-theme="light"] details.faq-item {
  background: #fff;
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.04);
}
html[data-theme="light"] .prose-card-grid > *,
html[data-theme="light"] .location-card,
html[data-theme="light"] .lpi-inout {
  background: #fff;
}

/* ---------- Dark theme: deeper quiet surfaces ---------- */
html[data-theme="dark"] body {
  background-color: #0b1017;
}
html[data-theme="dark"] .section--base {
  background-color: transparent;
}

/* ---------- Sticky mobile call bar (if present) — keep accessible ---------- */
.lpi-callbar a,
.lpi-callbar .btn {
  border-radius: 999px;
}

/* ---------- Selection colour ---------- */
::selection {
  background: color-mix(in srgb, var(--lpi-amber) 45%, var(--lpi-navy));
  color: #fff;
}
html[data-theme="light"] ::selection {
  background: color-mix(in srgb, var(--lpi-amber) 55%, var(--lpi-navy));
  color: var(--lpi-navy);
}

/* ============================================================
   PASS 2 — soft-spot polish (service cards, reviews, contact, chips)
   ============================================================ */

/* Service cards: certificate-grade chrome */
.service-card {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  border: 1px solid var(--lpi-hairline);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition-interactive),
              box-shadow var(--transition-interactive),
              border-color var(--transition-interactive);
}
.service-card__body::before {
  content: "";
  position: absolute;
  left: 1.35rem;
  top: 0;
  width: 48px;
  height: 3px;
  background: linear-gradient(90deg, var(--lpi-amber), rgba(255, 190, 1, 0.1));
  border-radius: 0 0 3px 3px;
  opacity: 0.95;
}
.service-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--lpi-lift);
  border-color: color-mix(in srgb, var(--lpi-amber) 32%, var(--color-border));
}
.service-card__image {
  border-radius: 0;
  transition: transform 420ms var(--lpi-ease);
}
.service-card:hover .service-card__image {
  transform: scale(1.03);
}
.service-card__body {
  position: relative;
  padding: 1.35rem 1.35rem 1.45rem;
}
.service-card__price {
  display: inline-flex;
  align-items: center;
  padding: 0.28rem 0.7rem;
  border-radius: 999px;
  font-weight: 700;
  font-size: 72%;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: color-mix(in srgb, var(--lpi-amber) 18%, var(--color-surface));
  color: color-mix(in srgb, var(--lpi-navy) 70%, var(--color-text));
  border: 1px solid color-mix(in srgb, var(--lpi-amber) 40%, transparent);
}
html[data-theme="dark"] .service-card__price {
  background: rgba(255, 190, 1, 0.12);
  color: var(--lpi-amber);
  border-color: rgba(255, 190, 1, 0.28);
}
.service-card h3 {
  letter-spacing: -0.015em;
  margin-top: 0.65rem;
}
.service-card p {
  line-height: 1.6;
  color: var(--color-text-muted);
}
@media (prefers-reduced-motion: reduce) {
  .service-card:hover { transform: none; }
  .service-card:hover .service-card__image { transform: none; }
}

/* Review cards */
.review-card {
  border-radius: 18px;
  border: 1px solid var(--lpi-hairline);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
  padding: 1.2rem 1.25rem;
}
html[data-theme="dark"] .review-card {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), var(--shadow-sm);
}
.review-card__text {
  line-height: 1.6;
  text-wrap: pretty;
}
.review-card__stars svg {
  fill: var(--lpi-amber);
}

/* Contact form as premium panel */
.contact-form {
  border: 1px solid var(--lpi-hairline);
  border-radius: 20px;
  background:
    linear-gradient(165deg, color-mix(in srgb, var(--lpi-amber) 5%, transparent), transparent 40%),
    var(--color-surface);
  box-shadow: var(--lpi-lift);
  padding: clamp(1.25rem, 2.5vw, 2rem);
}
html[data-theme="dark"] .contact-form {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), var(--lpi-lift-dark);
}
.contact-info__icon {
  border-radius: 12px;
  background: color-mix(in srgb, var(--lpi-amber) 12%, var(--color-surface-2));
  color: var(--color-primary);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
}
html[data-theme="dark"] .contact-info__icon {
  background: rgba(255, 190, 1, 0.1);
  color: var(--lpi-amber);
}
.form-group label {
  font-size: 72%;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.contact-form .btn--dark,
.form-submit .btn--dark,
.contact-form button[type="submit"] {
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: 0.02em;
  box-shadow: 0 10px 24px -12px rgba(6, 43, 88, 0.55);
}
html[data-theme="dark"] .contact-form .btn--dark,
html[data-theme="dark"] .form-submit .btn--dark {
  box-shadow: 0 10px 28px -12px rgba(42, 90, 150, 0.55);
}

/* Router: tighter chip rhythm on narrow screens */
@media (max-width: 520px) {
  .lpi-router__opts {
    flex-direction: column;
    align-items: stretch;
    max-width: 22rem;
    margin-inline: auto;
  }
  .lpi-router__opt span {
    width: 100%;
    justify-content: flex-start;
  }
}

/* Suburb / area tags on service pages */
.area-tags,
.suburb-list,
.areas-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.area-tag {
  padding: 0.45rem 0.9rem;
  border: 1px solid var(--lpi-hairline);
  background: var(--color-surface);
  color: var(--color-text);
  font-weight: 600;
  font-size: var(--text-sm);
}
.area-tag:hover {
  border-color: color-mix(in srgb, var(--lpi-amber) 40%, var(--color-border));
  background: color-mix(in srgb, var(--lpi-amber) 10%, var(--color-surface));
}

/* Locations section */
.locations__grid .location-card {
  border-radius: 18px;
}
.location-card__rating {
  color: var(--lpi-amber);
  font-weight: 700;
}

/* FAQ open state — amber signal + left tally */
.faq-item[open] > summary,
details.faq-item[open] > summary {
  color: var(--color-text);
}
.faq-item[open],
details.faq-item[open] {
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--lpi-amber) 10%, transparent) 0 3px, var(--color-surface) 3px);
}

/* Section header rhythm */
.section-header {
  margin-bottom: clamp(1.75rem, 3.5vw, 2.75rem);
}
.section-header .section-desc {
  margin-inline: auto;
}

/* Sticky call bar polish */
.lpi-callbar {
  border-top: 1px solid color-mix(in srgb, var(--lpi-amber) 25%, transparent);
  box-shadow: 0 -12px 32px -18px rgba(0, 0, 0, 0.45);
}
.lpi-callbar .btn,
.lpi-callbar a.btn {
  box-shadow: 0 8px 20px -10px rgba(255, 190, 1, 0.6),
              inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

/* Header logo subtle lift */
.header__logo {
  transition: transform var(--transition-interactive);
}
.header a:hover .header__logo {
  transform: translateY(-1px);
}

/* Prose cards on suburb: amber tally mark before h3 */
.prose-card-grid h3 {
  letter-spacing: -0.015em;
}
.prose-card-grid > * {
  position: relative;
}
.prose-card-grid > *::before {
  content: "";
  position: absolute;
  left: 1.35rem;
  top: 0;
  width: 36px;
  height: 2px;
  background: linear-gradient(90deg, var(--lpi-amber), transparent);
  border-radius: 2px;
}


/* ============================================================
   PASS 3 — final micro-polish toward 9.5
   ============================================================ */

/* Trust strip: quieter certificate band */
.lpi-tldr-band {
  padding-block: clamp(1.25rem, 3vw, 2rem);
}
.lpi-trust-strip__verify {
  color: var(--lpi-amber);
  font-weight: 700;
  text-underline-offset: 0.18em;
}
.lpi-trust-strip__lic strong {
  color: var(--lpi-amber);
}

/* Contact submit: keep AA navy, amber signal on hover/focus */
.contact-form .btn--dark:hover,
.form-submit .btn--dark:hover,
.contact-form button[type="submit"]:hover {
  box-shadow: 0 12px 28px -12px rgba(255, 190, 1, 0.35),
              0 10px 24px -12px rgba(6, 43, 88, 0.5);
}
.contact-form .btn--dark:focus-visible,
.form-submit .btn--dark:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 3px;
}

/* Trust-item icons: amber signal consistently */
.trust-item__icon {
  background: color-mix(in srgb, var(--lpi-amber) 16%, var(--color-surface));
  color: color-mix(in srgb, var(--lpi-navy) 80%, var(--color-accent));
}
html[data-theme="dark"] .trust-item__icon {
  background: rgba(255, 190, 1, 0.12);
  color: var(--lpi-amber);
}

/* FAQ index active-feeling hover already set; tighten letter-spacing */
.faq-index p {
  letter-spacing: 0.16em;
}

/* Map finder input comfort */
.sa #sub {
  border-radius: 14px;
}

/* Ensure outline buttons on dark hero stay crisp */
.hero .btn--outline:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 3px;
}

/* Light theme surface elevation consistency */
html[data-theme="light"] .service-card,
html[data-theme="light"] .review-card,
html[data-theme="light"] .location-card,
html[data-theme="light"] .contact-form,
html[data-theme="light"] .lpi-inout,
html[data-theme="light"] .faq-item {
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.05),
              0 10px 28px -16px rgba(6, 43, 88, 0.16);
}


/* ============================================================
   LOOP 2 — site-wide consistency + contact/orphan polish
   Same radii, shadow language, hairline, amber signal, hover/focus
   ============================================================ */

/* --- Unify card / panel radii to the token scale --- */
.service-card,
.feature-card,
.prose-card,
.review-card,
.testimonial-card,
[data-reviews-track] > *,
.location-card,
.region-card,
.card,
.contact-form,
.about__stats > *,
.lpi-inout,
.lpi-trust-strip,
.lpi-tldr-band .lpi-trust-strip,
.nav-mega__panel {
  border-radius: var(--lpi-radius-lg);
}
.hero__dossier {
  border-radius: var(--lpi-radius-xl);
}
.faq-item,
details.faq-item,
.faq__list details,
.prose-panel,
.lpi__post-body .answer-block,
.lpi-tldr,
.answer-block,
.contact-info__item,
.lpi-router__a,
.prose-card-grid > * {
  border-radius: var(--lpi-radius-md);
}
.form-group input,
.form-group select,
.form-group textarea,
.sa #sub {
  border-radius: var(--lpi-radius-md);
}
.trust-item__icon,
.contact-info__icon,
.footer__social-link,
.region-card__pin {
  border-radius: var(--lpi-radius-sm);
}
.btn,
.btn--primary,
.btn--dark,
.btn--outline,
.btn--accent-outline,
.header__nav .header__call,
.lpi-router__opt span,
.area-tag,
.suburb-chip,
.chips a,
.location-card__links a,
.lpi-callbar a,
.lpi-callbar .btn,
.service-card__price {
  border-radius: var(--lpi-radius-pill);
}

/* --- Shared card chrome: hairline + lift language --- */
.region-card,
.trust-item,
.location-card,
.review-card,
.service-card,
.prose-card-grid > *,
.contact-info__item,
.lpi-inout,
.faq-item,
details.faq-item {
  border: var(--lpi-chrome);
}

/* --- Orphan: region-card → enrich system --- */
.region-card {
  position: relative;
  overflow: hidden;
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition-interactive),
              box-shadow var(--transition-interactive),
              border-color var(--transition-interactive);
}
.region-card::before {
  content: "";
  position: absolute;
  left: 1.35rem;
  top: 0;
  width: 40px;
  height: 3px;
  background: var(--lpi-amber-tally);
  border-radius: 0 0 3px 3px;
  pointer-events: none;
}
html[data-theme="dark"] .region-card {
  box-shadow: var(--lpi-inset), var(--shadow-sm);
}
.region-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--lpi-lift);
  border-color: color-mix(in srgb, var(--lpi-amber) 32%, var(--color-border));
}
.region-card__pin {
  background: color-mix(in srgb, var(--lpi-amber) 16%, var(--color-surface));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
}
html[data-theme="dark"] .region-card__pin {
  background: rgba(255, 190, 1, 0.12);
}
.region-card__title {
  letter-spacing: -0.015em;
}
.region-card__lede {
  line-height: 1.55;
  color: var(--color-text-muted);
}
.region-card__cta {
  font-weight: 700;
  text-underline-offset: 0.18em;
  text-decoration-thickness: 1px;
  text-decoration-color: color-mix(in srgb, var(--lpi-amber) 55%, transparent);
}
.region-card__cta:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 3px;
  border-radius: 4px;
}
.region-card__more-summary {
  border-radius: var(--lpi-radius-xs);
}
.region-card__more-summary:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  .region-card:hover { transform: none; }
}

/* --- Trust bar / trust items: equal elevation both themes --- */
.trust-bar__grid {
  gap: clamp(0.85rem, 2vw, 1.25rem);
}
.trust-item {
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
  padding: 1.1rem 1.15rem;
}
html[data-theme="dark"] .trust-item {
  box-shadow: var(--lpi-inset);
}
html[data-theme="light"] .trust-item {
  background: #fff;
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.05),
              0 10px 28px -16px rgba(6, 43, 88, 0.14);
}
.trust-item h2,
.trust-item h3 {
  letter-spacing: -0.012em;
  line-height: 1.25;
}
.trust-item p {
  line-height: 1.55;
  color: var(--color-text-muted);
}

/* --- Contact form: close the dark 9.4 gap + light catch-up --- */
.contact-form {
  position: relative;
  overflow: hidden;
  border-radius: var(--lpi-radius-lg);
  border: var(--lpi-chrome);
}
.contact-form::before {
  content: "";
  position: absolute;
  left: 1.5rem;
  top: 0;
  width: 48px;
  height: 3px;
  background: var(--lpi-amber-tally);
  border-radius: 0 0 3px 3px;
  pointer-events: none;
}
html[data-theme="light"] .contact-form {
  background:
    linear-gradient(165deg, color-mix(in srgb, var(--lpi-amber) 7%, transparent), transparent 42%),
    #fff;
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.05),
              0 14px 36px -18px rgba(6, 43, 88, 0.2);
}
html[data-theme="dark"] .contact-form {
  background:
    linear-gradient(165deg, rgba(255, 190, 1, 0.06), transparent 42%),
    var(--color-surface);
  box-shadow: var(--lpi-inset), var(--lpi-lift-dark);
}

/* Inputs: match panel chrome, never sit flatter than the card */
.form-group input,
.form-group select,
.form-group textarea {
  border-radius: var(--lpi-radius-md);
  border: 1.5px solid var(--lpi-hairline);
  background: color-mix(in srgb, var(--color-surface) 88%, var(--color-surface-2) 12%);
  min-height: 2.85rem;
  font-size: 1rem;
  line-height: 1.4;
}
html[data-theme="light"] .form-group input,
html[data-theme="light"] .form-group select,
html[data-theme="light"] .form-group textarea {
  background: #f7f9fc;
  border-color: color-mix(in srgb, var(--color-border) 80%, var(--lpi-navy) 20%);
}
html[data-theme="dark"] .form-group input,
html[data-theme="dark"] .form-group select,
html[data-theme="dark"] .form-group textarea {
  background: color-mix(in srgb, var(--color-surface) 70%, #000 30%);
  border-color: color-mix(in srgb, var(--color-border) 75%, #5b9bd5 25%);
}
.form-group input::placeholder,
.form-group textarea::placeholder {
  color: color-mix(in srgb, var(--color-text-muted) 85%, transparent);
  opacity: 1;
}
.form-group select {
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--color-text-muted) 50%),
    linear-gradient(135deg, var(--color-text-muted) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(50% - 3px),
    calc(100% - 12px) calc(50% - 3px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-right: 2.4rem;
}
html[data-theme="light"] .form-group select {
  background-color: #f7f9fc;
}
html[data-theme="dark"] .form-group select {
  background-color: color-mix(in srgb, var(--color-surface) 70%, #000 30%);
}
.form-group input:hover,
.form-group select:hover,
.form-group textarea:hover {
  border-color: color-mix(in srgb, var(--lpi-amber) 35%, var(--color-border));
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
  outline: none;
  border-color: var(--lpi-amber);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--lpi-amber) 22%, transparent);
}
.form-group label {
  font-size: 70%;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 700;
  color: color-mix(in srgb, var(--color-text-muted) 70%, var(--color-text) 30%);
  margin-bottom: 0.45rem;
}
html[data-theme="light"] .form-group label {
  color: color-mix(in srgb, #42506a 55%, #062b58 45%);
}

/* Contact info cards: same elevation language as the form */
.contact-info {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.contact-info__item {
  border-radius: var(--lpi-radius-md);
  border: var(--lpi-chrome);
  background: var(--color-surface);
  box-shadow: var(--shadow-sm);
  padding: 1.05rem 1.15rem;
  transition: transform var(--transition-interactive),
              box-shadow var(--transition-interactive),
              border-color var(--transition-interactive);
}
html[data-theme="dark"] .contact-info__item {
  box-shadow: var(--lpi-inset);
}
html[data-theme="light"] .contact-info__item {
  background: #fff;
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.05),
              0 8px 22px -14px rgba(6, 43, 88, 0.14);
}
.contact-info__item:hover {
  transform: translateY(-2px);
  box-shadow: var(--lpi-lift);
  border-color: color-mix(in srgb, var(--lpi-amber) 30%, var(--color-border));
}
.contact-info__icon {
  border-radius: var(--lpi-radius-sm);
  background: color-mix(in srgb, var(--lpi-amber) 14%, var(--color-surface-2));
  color: var(--lpi-navy);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.28);
}
html[data-theme="dark"] .contact-info__icon {
  background: rgba(255, 190, 1, 0.12);
  color: var(--lpi-amber);
}
@media (prefers-reduced-motion: reduce) {
  .contact-info__item:hover { transform: none; }
}

/* Submit: AA navy fill, amber as hover/focus signal (never colour alone) */
.contact-form .btn--dark,
.form-submit .btn--dark,
.contact-form button[type="submit"] {
  border-radius: var(--lpi-radius-pill);
  min-height: 3.1rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  box-shadow: 0 10px 26px -12px rgba(6, 43, 88, 0.55),
              inset 0 1px 0 rgba(255, 255, 255, 0.12);
  transition: transform var(--transition-interactive),
              box-shadow var(--transition-interactive),
              background var(--transition-interactive);
}
.contact-form .btn--dark:hover,
.form-submit .btn--dark:hover,
.contact-form button[type="submit"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px -12px rgba(255, 190, 1, 0.4),
              0 10px 24px -12px rgba(6, 43, 88, 0.45),
              inset 0 1px 0 rgba(255, 255, 255, 0.18);
}
.contact-form .btn--dark:focus-visible,
.form-submit .btn--dark:focus-visible,
.contact-form button[type="submit"]:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 3px;
  box-shadow: 0 0 0 6px color-mix(in srgb, var(--lpi-amber) 28%, transparent);
}
@media (prefers-reduced-motion: reduce) {
  .contact-form .btn--dark:hover,
  .form-submit .btn--dark:hover,
  .contact-form button[type="submit"]:hover { transform: none; }
}

/* --- Outline / accent-outline buttons: same pill + hover language --- */
.btn--outline,
.btn--accent-outline {
  border-width: 1.5px;
  font-weight: 700;
  letter-spacing: 0.015em;
}
.btn--outline:hover,
.btn--accent-outline:hover {
  transform: translateY(-1px);
}
.btn--outline:focus-visible,
.btn--accent-outline:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  .btn--outline:hover,
  .btn--accent-outline:hover { transform: none; }
}

/* --- FAQ: open chrome matches card lift --- */
.faq-item,
details.faq-item,
.faq__list details {
  border-radius: var(--lpi-radius-md);
  box-shadow: var(--shadow-sm);
}
html[data-theme="dark"] .faq-item,
html[data-theme="dark"] details.faq-item {
  box-shadow: var(--lpi-inset);
}
html[data-theme="light"] .faq-item,
html[data-theme="light"] details.faq-item {
  background: #fff;
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.04),
              0 8px 22px -16px rgba(6, 43, 88, 0.12);
}
.faq-item[open],
details.faq-item[open] {
  box-shadow: var(--lpi-lift);
  border-color: color-mix(in srgb, var(--lpi-amber) 38%, var(--color-border));
}
.faq-item__question,
.faq-item summary,
details.faq-item > summary {
  border-radius: inherit;
}

/* --- Router chips: match button pill chrome --- */
.lpi-router__opt span {
  border: 1.5px solid var(--lpi-hairline);
  font-weight: 600;
  letter-spacing: 0.01em;
}
html[data-theme="light"] .lpi-router__opt span {
  background: #fff;
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.05),
              0 6px 16px -10px rgba(6, 43, 88, 0.12);
}
html[data-theme="dark"] .lpi-router__opt span {
  background: var(--color-surface);
  box-shadow: var(--lpi-inset);
}
.lpi-router__opt input:checked + span {
  border-color: var(--lpi-amber);
  background: color-mix(in srgb, var(--lpi-amber) 16%, var(--color-surface));
  box-shadow: 0 8px 22px -12px rgba(255, 190, 1, 0.55),
              inset 0 1px 0 rgba(255, 255, 255, 0.2);
  font-weight: 700;
}
.lpi-router__a {
  border: var(--lpi-chrome);
  box-shadow: var(--shadow-sm);
}
html[data-theme="dark"] .lpi-router__a {
  box-shadow: var(--lpi-inset);
}

/* --- Tables: same panel chrome as cards --- */
.lpi-inout {
  border: var(--lpi-chrome);
  border-radius: var(--lpi-radius-lg);
  box-shadow: var(--lpi-lift);
}
html[data-theme="light"] .lpi-inout {
  background: #fff;
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.05),
              0 12px 32px -16px rgba(6, 43, 88, 0.18);
}
html[data-theme="dark"] .lpi-inout {
  box-shadow: var(--lpi-inset), var(--lpi-lift-dark);
}

/* --- CTA banner buttons: pill + amber primary match header call --- */
.cta-banner__buttons .btn--primary {
  box-shadow: 0 10px 26px -10px rgba(255, 190, 1, 0.65),
              inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
.cta-banner__buttons .btn--outline {
  border-color: rgba(255, 255, 255, 0.45);
}
.cta-banner__buttons .btn--outline:hover {
  border-color: rgba(255, 255, 255, 0.75);
  background: rgba(255, 255, 255, 0.06);
}

/* --- Footer: hairline rhythm + link hover --- */
.footer__grid {
  gap: clamp(1.5rem, 3vw, 2.5rem);
}
.footer__links a {
  border-radius: 4px;
}
.footer__links a:hover {
  color: var(--lpi-amber);
}
.footer__links a:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 3px;
}
.footer__social-link {
  border: 1px solid var(--lpi-hairline);
  background: color-mix(in srgb, var(--color-surface) 80%, transparent);
}
.footer__social-link:hover {
  border-color: color-mix(in srgb, var(--lpi-amber) 40%, var(--color-border));
  background: color-mix(in srgb, var(--lpi-amber) 10%, var(--color-surface));
}
.footer__social-link:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 3px;
}

/* --- Header nav hover underline consistency --- */
.header__nav > a:not(.header__call) {
  position: relative;
}
.header__nav > a:not(.header__call):hover {
  color: var(--color-text);
}
.theme-toggle,
.hamburger {
  border-radius: var(--lpi-radius-sm);
}
.theme-toggle:focus-visible,
.hamburger:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 3px;
}

/* --- Breadcrumb + byline (suburb/council pages) --- */
.breadcrumb,
nav[aria-label="Breadcrumb"],
.lpi-breadcrumb {
  letter-spacing: 0.01em;
}
.breadcrumb a,
nav[aria-label="Breadcrumb"] a,
.lpi-breadcrumb a {
  border-radius: 4px;
  text-underline-offset: 0.15em;
}
.breadcrumb a:focus-visible,
nav[aria-label="Breadcrumb"] a:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 2px;
}
.byline {
  border-radius: 0 var(--lpi-radius-md) var(--lpi-radius-md) 0;
  background: color-mix(in srgb, var(--lpi-amber) 5%, transparent);
  padding-block: 0.85rem;
  padding-right: 1rem;
}

/* --- Lens success modal: match form chrome --- */
.lens-success__card {
  border-radius: var(--lpi-radius-lg);
  border: var(--lpi-chrome);
  background: var(--color-surface);
  box-shadow: var(--lpi-lift);
  padding: 1.75rem 1.5rem;
}
html[data-theme="dark"] .lens-success__card {
  box-shadow: var(--lpi-inset), var(--lpi-lift-dark);
}
.lens-success__close {
  border-radius: var(--lpi-radius-pill);
  font-weight: 700;
}
.lens-success__close:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 3px;
}

/* --- Suburb prose cards: radius + lift equal to services --- */
.prose-card-grid > * {
  border-radius: var(--lpi-radius-lg);
  border: var(--lpi-chrome);
}
html[data-theme="light"] .prose-card-grid > *,
html[data-theme="light"] .region-card,
html[data-theme="light"] .location-card,
html[data-theme="light"] .review-card,
html[data-theme="light"] .service-card {
  background: #fff;
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.05),
              0 10px 28px -16px rgba(6, 43, 88, 0.16);
}

/* --- NCR issue tiles: align radius --- */
.lpi-issue-tiles .features-grid > *,
.lpi-issue-tiles article {
  border-radius: var(--lpi-radius-lg);
  border: var(--lpi-chrome);
}
.lpi-issue-tiles .feature-list li {
  border-radius: var(--lpi-radius-md);
}

/* --- Mega panel radius token --- */
@media (min-width: 769px) {
  .nav-mega__panel {
    border-radius: var(--lpi-radius-lg);
    border: var(--lpi-chrome);
  }
}

/* --- Service card tally uses token --- */
.service-card__body::before,
.prose-card-grid > *::before {
  background: var(--lpi-amber-tally);
}

/* --- Light theme section-alt equal finish --- */
html[data-theme="light"] .section--alt {
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--color-surface-2) 70%, #e8eef8 30%) 0%,
      var(--color-surface-2) 100%
    );
}

/* --- Spacing rhythm: section headers --- */
.section-header .section-label {
  margin-bottom: 0.65rem;
}
.section-header .section-title {
  margin-bottom: 0.85rem;
}


/* ============================================================
   LOOP 2b — residual consistency fixups
   ============================================================ */

/* Trust items: join the 18px card scale (base was 16) */
.trust-item,
.trust-bar .trust-item {
  border-radius: var(--lpi-radius-lg);
}

/* Contact inputs: force enrich chrome past base style.css */
.contact-form .form-group input,
.contact-form .form-group select,
.contact-form .form-group textarea {
  border-radius: var(--lpi-radius-md);
  border-width: 1.5px;
  border-style: solid;
  border-color: var(--lpi-hairline);
}
html[data-theme="dark"] .contact-form .form-group input,
html[data-theme="dark"] .contact-form .form-group select,
html[data-theme="dark"] .contact-form .form-group textarea {
  background-color: color-mix(in srgb, var(--color-surface) 70%, #000 30%);
  border-color: color-mix(in srgb, var(--color-border) 75%, #5b9bd5 25%);
}
html[data-theme="light"] .contact-form .form-group input,
html[data-theme="light"] .contact-form .form-group select,
html[data-theme="light"] .contact-form .form-group textarea {
  background-color: #f7f9fc;
  border-color: color-mix(in srgb, var(--color-border) 80%, var(--lpi-navy) 20%);
}
.contact-form .form-group input:focus,
.contact-form .form-group select:focus,
.contact-form .form-group textarea:focus {
  border-color: var(--lpi-amber);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--lpi-amber) 22%, transparent);
}

/* FAQ items keep a solid surface (open gradient sits on top) */
.faq__list .faq-item,
.faq__list details.faq-item,
details.faq-item {
  background-color: var(--color-surface);
}
html[data-theme="light"] .faq__list .faq-item,
html[data-theme="light"] details.faq-item {
  background-color: #fff;
}

/* Region-card tags: chips already pill; keep hover amber signal */
.region-card__tags .area-tag {
  border-radius: var(--lpi-radius-pill);
}

/* Ensure location + review cards share 18px */
.location-card,
.locations__grid .location-card,
.review-card {
  border-radius: var(--lpi-radius-lg);
}

/* Header call button: keep pill + inset highlight language */
.header__nav .header__call {
  border-radius: var(--lpi-radius-pill);
}


/* ============================================================
   LOOP 3 — cascade lock + light elevation parity + micro polish
   Target: overall ≥9.5 both themes. Prefer refine over new assets.
   ============================================================ */

/* --- Tokens: border-width lock + shared light lift --- */
:root {
  --lpi-bw: 1px;
  --lpi-bw-strong: 1.5px;
  --lpi-lift-light: 0 1px 2px rgba(6, 43, 88, 0.055),
                    0 12px 32px -16px rgba(6, 43, 88, 0.18);
  --lpi-lift-light-sm: 0 1px 2px rgba(6, 43, 88, 0.045),
                       0 8px 22px -14px rgba(6, 43, 88, 0.14);
  --lpi-press: cubic-bezier(0.2, 0.8, 0.2, 1);
}

/* Force hairline chrome past base `border: 1px solid var(--color-border)`
   by setting width/style/color as separate longhands (cascade-safe). */
.service-card,
.feature-card,
.prose-card,
.prose-card-grid > *,
.features-grid > article,
.features-grid > .card,
.services-grid > *,
#services .card,
#services article,
.card,
.region-card,
.trust-item,
.location-card,
.review-card,
.testimonial-card,
[data-reviews-track] > *,
.contact-form,
.contact-info__item,
.lpi-inout,
.faq-item,
details.faq-item,
.faq__list details,
.lpi-router__a,
.lpi-tldr,
.lpi__post-body .answer-block,
.answer-block,
.lens-success__card,
.lpi-issue-tiles .features-grid > *,
.lpi-issue-tiles article,
.lpi-trust-strip,
.nav-mega__panel {
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
}

/* Compact chips / tags share the same width language */
.area-tag,
.suburb-chip,
.chips a,
.location-card__links a,
.region-card__tags .area-tag,
.footer__social-link {
  border-width: var(--lpi-bw);
  border-style: solid;
}

/* Inputs / outline buttons keep the slightly stronger stroke */
.form-group input,
.form-group select,
.form-group textarea,
.contact-form .form-group input,
.contact-form .form-group select,
.contact-form .form-group textarea,
.btn--outline,
.btn--accent-outline,
.lpi-router__opt span {
  border-width: var(--lpi-bw-strong);
  border-style: solid;
}

/* --- Light theme: one elevation language across orphans --- */
html[data-theme="light"] .service-card,
html[data-theme="light"] .feature-card,
html[data-theme="light"] .prose-card,
html[data-theme="light"] .prose-card-grid > *,
html[data-theme="light"] .features-grid > .card,
html[data-theme="light"] #services .card,
html[data-theme="light"] #services article,
html[data-theme="light"] .card,
html[data-theme="light"] .region-card,
html[data-theme="light"] .trust-item,
html[data-theme="light"] .location-card,
html[data-theme="light"] .review-card,
html[data-theme="light"] .testimonial-card,
html[data-theme="light"] .contact-form,
html[data-theme="light"] .lpi-inout,
html[data-theme="light"] .lens-success__card,
html[data-theme="light"] .lpi-issue-tiles .features-grid > *,
html[data-theme="light"] .lpi-issue-tiles article {
  background: #fff;
  box-shadow: var(--lpi-lift-light);
}

html[data-theme="light"] .faq-item,
html[data-theme="light"] details.faq-item,
html[data-theme="light"] .faq__list details,
html[data-theme="light"] .contact-info__item,
html[data-theme="light"] .lpi-router__a,
html[data-theme="light"] .lpi-tldr,
html[data-theme="light"] .answer-block,
html[data-theme="light"] .lpi__post-body .answer-block {
  background: #fff;
  box-shadow: var(--lpi-lift-light-sm);
}

/* Dark: shared inset + quiet depth (parity with light lift) */
html[data-theme="dark"] .region-card,
html[data-theme="dark"] .faq-item,
html[data-theme="dark"] details.faq-item,
html[data-theme="dark"] .location-card,
html[data-theme="dark"] .review-card,
html[data-theme="dark"] .service-card,
html[data-theme="dark"] .prose-card-grid > *,
html[data-theme="dark"] .contact-info__item,
html[data-theme="dark"] .trust-item {
  box-shadow: var(--lpi-inset), 0 8px 22px -16px rgba(0, 0, 0, 0.45);
}

/* --- Region cards: light catch-up (was 9.3) --- */
.region-card {
  border-radius: var(--lpi-radius-lg);
}
html[data-theme="light"] .region-card {
  box-shadow: var(--lpi-lift-light);
}
.region-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--lpi-lift);
  border-color: color-mix(in srgb, var(--lpi-amber) 34%, var(--color-border));
}
html[data-theme="light"] .region-card:hover {
  box-shadow: 0 2px 4px rgba(6, 43, 88, 0.06),
              0 18px 40px -18px rgba(6, 43, 88, 0.24);
}
.region-card__tags .area-tag,
.region-card__tags .suburb-chip {
  border-color: var(--lpi-hairline);
  background: color-mix(in srgb, var(--color-surface) 92%, var(--color-surface-2) 8%);
  transition: border-color var(--transition-interactive),
              background var(--transition-interactive),
              transform var(--transition-interactive);
}
html[data-theme="light"] .region-card__tags .area-tag {
  background: #fff;
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.04);
}
.region-card__tags .area-tag:hover {
  border-color: color-mix(in srgb, var(--lpi-amber) 42%, var(--color-border));
  background: color-mix(in srgb, var(--lpi-amber) 10%, var(--color-surface));
  transform: translateY(-1px);
}
.region-card:active {
  transform: translateY(-1px);
}

/* --- FAQ: chrome, open state, sticky index, summary hover --- */
.faq-item,
details.faq-item,
.faq__list details {
  border-radius: var(--lpi-radius-md);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  transition: border-color var(--transition-interactive),
              box-shadow var(--transition-interactive),
              background var(--transition-interactive);
}
.faq-item__question,
.faq-item summary,
details.faq-item > summary {
  transition: background var(--transition-interactive), color var(--transition-interactive);
}
.faq-item summary:hover,
.faq-item__question:hover,
details.faq-item > summary:hover {
  background: color-mix(in srgb, var(--lpi-amber) 6%, transparent);
}
.faq-item[open],
details.faq-item[open] {
  border-color: color-mix(in srgb, var(--lpi-amber) 42%, var(--color-border));
  border-left-width: 3px;
  border-left-color: var(--lpi-amber);
  box-shadow: var(--lpi-lift);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 7%, transparent), transparent 48%),
    var(--color-surface);
}
html[data-theme="light"] .faq-item[open],
html[data-theme="light"] details.faq-item[open] {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 8%, transparent), transparent 48%),
    #fff;
  box-shadow: var(--lpi-lift-light);
}
.faq__list {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}
@media (min-width: 1100px) {
  .lpi__post-body > .faq-index {
    border-width: var(--lpi-bw);
    border-style: solid;
    border-color: var(--lpi-hairline);
    border-radius: var(--lpi-radius-lg);
    box-shadow: var(--lpi-lift-light-sm);
  }
  html[data-theme="dark"] .lpi__post-body > .faq-index {
    box-shadow: var(--lpi-inset), 0 10px 28px -18px rgba(0, 0, 0, 0.5);
  }
  html[data-theme="light"] .lpi__post-body > .faq-index {
    background:
      linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 7%, #fff), #fff);
    box-shadow: var(--lpi-lift-light);
  }
  .faq-index a:focus-visible {
    outline: 3px solid var(--lpi-amber);
    outline-offset: 2px;
  }
}

/* --- Cost / comparison tables --- */
.lpi-inout {
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  border-radius: var(--lpi-radius-lg);
  overflow: hidden;
}
html[data-theme="light"] .lpi-inout {
  box-shadow: var(--lpi-lift-light);
}
html[data-theme="dark"] .lpi-inout {
  box-shadow: var(--lpi-inset), var(--lpi-lift-dark);
}
.lpi-inout thead th {
  border-bottom: var(--lpi-bw) solid var(--lpi-hairline);
}
.lpi-inout tbody tr + tr td {
  border-top: var(--lpi-bw) solid color-mix(in srgb, var(--lpi-hairline) 70%, transparent);
}
.lpi-inout tbody tr:hover td {
  background: color-mix(in srgb, var(--lpi-amber) 6%, transparent);
}

/* --- Sticky header micro polish --- */
.header {
  transition: background var(--transition-interactive),
              box-shadow var(--transition-interactive),
              border-color var(--transition-interactive);
}
.header--scrolled {
  border-bottom: var(--lpi-bw) solid var(--lpi-hairline);
  backdrop-filter: none; /* keep perf rule: no large-area blur */
}
html[data-theme="light"] .header--scrolled {
  background: color-mix(in srgb, #fff 94%, var(--lpi-navy) 6%);
  box-shadow: 0 1px 0 var(--lpi-hairline),
              0 10px 28px -20px rgba(6, 43, 88, 0.28);
}
html[data-theme="dark"] .header--scrolled {
  background: color-mix(in srgb, var(--color-bg) 90%, #000 10%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.07),
              0 14px 32px -20px rgba(0, 0, 0, 0.65);
}
.header__nav > a:not(.header__call)::after {
  height: 2px;
  border-radius: 2px;
  background: var(--lpi-amber);
}
.header__nav .header__call:active {
  transform: translateY(0);
  filter: brightness(0.97);
}
.theme-toggle:hover,
.hamburger:hover {
  background: color-mix(in srgb, var(--lpi-amber) 10%, transparent);
}

/* --- Hover / focus / press consistency (transform only) --- */
.btn:active,
.btn--primary:active,
.btn--dark:active,
.btn--outline:active,
.btn--accent-outline:active,
.header__nav .header__call:active,
.lpi-router__opt span:active,
.service-card:active,
.location-card:active,
.review-card:active,
.prose-card-grid > *:active {
  transform: translateY(0);
}
.btn--primary:hover,
.cta-banner__buttons .btn--primary:hover,
.hero__ctas .btn--primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px -10px rgba(255, 190, 1, 0.75),
              inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
.service-card:hover,
.location-card:hover,
.review-card:hover,
.prose-card-grid > *:hover,
.features-grid > .card:hover {
  border-color: color-mix(in srgb, var(--lpi-amber) 32%, var(--color-border));
}
.area-tag:focus-visible,
.suburb-chip:focus-visible,
.chips a:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 2px;
}

/* --- Section rhythm --- */
.section-padding {
  padding-block: clamp(3.25rem, 7vw, 5.75rem);
}
.section-header {
  margin-bottom: clamp(1.5rem, 3vw, 2.25rem);
}
.section-header .section-label {
  letter-spacing: 0.18em;
}
.section-header .section-title {
  letter-spacing: -0.02em;
  text-wrap: balance;
}

/* --- Footer polish --- */
.footer {
  border-top: var(--lpi-bw) solid var(--lpi-hairline);
}
.footer__bottom {
  border-top: var(--lpi-bw) solid var(--lpi-hairline);
  padding-top: 1.15rem;
  margin-top: 0.35rem;
}
.footer__links a {
  transition: color var(--transition-interactive),
              text-decoration-color var(--transition-interactive);
  text-underline-offset: 0.18em;
}
.footer__links a:hover {
  color: var(--lpi-amber);
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--lpi-amber) 55%, transparent);
}
.footer__social-link {
  border-color: var(--lpi-hairline);
  transition: transform var(--transition-interactive),
              border-color var(--transition-interactive),
              background var(--transition-interactive),
              box-shadow var(--transition-interactive);
}
.footer__social-link:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--lpi-amber) 42%, var(--color-border));
  box-shadow: 0 8px 18px -12px rgba(255, 190, 1, 0.45);
}
.footer__social-link:active {
  transform: translateY(0);
}

/* --- Mobile 390 gutters: match header one-gutter edge (≥18px) --- */
@media (max-width: 420px) {
  .container,
  .section-padding > .container,
  .cta-banner > .container,
  .footer .container {
    padding-inline: max(1.125rem, env(safe-area-inset-left, 0px) + 0.85rem);
  }
  .header__inner {
    padding-inline: max(1.125rem, env(safe-area-inset-left, 0px) + 0.85rem);
  }
  .hero--dossier .hero__content {
    padding-inline: max(1.125rem, env(safe-area-inset-left, 0px) + 0.85rem);
  }
  .region-grid,
  .services-grid,
  .locations__grid,
  .trust-bar__grid {
    gap: 0.85rem;
  }
  .faq-item__question,
  .faq-item summary,
  details.faq-item > summary {
    padding: 0.95rem 1rem;
  }
  .faq-item__answer,
  .faq-item .faq-item__answer {
    padding: 0 1rem 1rem;
  }
  .contact-form {
    padding-inline: 1.05rem;
  }
}

/* --- Suburb / prose cards: tally + chrome lock --- */
.prose-card-grid > * {
  position: relative;
  overflow: hidden;
}
.prose-card-grid > *::before {
  width: 40px;
  height: 3px;
  border-radius: 0 0 3px 3px;
}
html[data-theme="light"] .prose-card-grid > *:hover {
  box-shadow: 0 2px 4px rgba(6, 43, 88, 0.06),
              0 18px 40px -18px rgba(6, 43, 88, 0.24);
}

/* Suburb chips (service / council pages) */
.suburb-chip,
.chips a,
.area-tag {
  border-color: var(--lpi-hairline);
  transition: border-color var(--transition-interactive),
              background var(--transition-interactive),
              transform var(--transition-interactive),
              box-shadow var(--transition-interactive);
}
.suburb-chip:hover,
.chips a:hover,
.area-tag:hover {
  border-color: color-mix(in srgb, var(--lpi-amber) 40%, var(--color-border));
  transform: translateY(-1px);
}

/* --- CTA banner: quieter wash + button press --- */
.cta-banner__buttons .btn:active {
  transform: translateY(0);
}

/* --- Trust strip equal finish --- */
html[data-theme="light"] .lpi-trust-strip {
  background:
    linear-gradient(165deg, color-mix(in srgb, var(--lpi-amber) 6%, transparent), transparent 50%),
    #fff;
  box-shadow: var(--lpi-lift-light-sm);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
}

/* --- Reduced motion: kill Loop 3 lifts --- */
@media (prefers-reduced-motion: reduce) {
  .region-card:hover,
  .region-card:active,
  .region-card__tags .area-tag:hover,
  .service-card:hover,
  .service-card:active,
  .location-card:hover,
  .location-card:active,
  .review-card:hover,
  .review-card:active,
  .prose-card-grid > *:hover,
  .prose-card-grid > *:active,
  .features-grid > .card:hover,
  .btn--primary:hover,
  .cta-banner__buttons .btn--primary:hover,
  .hero__ctas .btn--primary:hover,
  .footer__social-link:hover,
  .suburb-chip:hover,
  .chips a:hover,
  .area-tag:hover {
    transform: none;
  }
}


/* ============================================================
   LOOP 3b — light elevation catch-up (FAQ closed + cost table)
   ============================================================ */
html[data-theme="light"] .faq-item:not([open]),
html[data-theme="light"] details.faq-item:not([open]),
html[data-theme="light"] .faq__list details:not([open]) {
  background: #fff;
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.05),
              0 10px 26px -16px rgba(6, 43, 88, 0.16);
}
html[data-theme="light"] .lpi-inout,
html[data-theme="light"] .lpi-inout.table,
html[data-theme="light"] table.lpi-inout {
  background: #fff;
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.055),
              0 16px 40px -18px rgba(6, 43, 88, 0.22);
}
html[data-theme="light"] .region-card {
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.055),
              0 14px 36px -16px rgba(6, 43, 88, 0.2);
}
html[data-theme="light"] .sa .mapcard,
html[data-theme="light"] .sa .finder,
html[data-theme="light"] .sa .area {
  /* reinforce via enrich when map CSS order varies */
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.055),
              0 14px 36px -16px rgba(6, 43, 88, 0.2);
}

/* ============================================================
   LOOP 4 — full-site 9.8 bar (service / money / blog / legal / home)
   One chrome vocabulary: radii tokens, hairlines, lifts, amber signal.
   ============================================================ */

/* --- Shared post / article chrome (services, legal, about, blog) --- */
.hentry,
.lpi__shell {
  isolation: isolate;
}
.lpi__post-body {
  --lpi-prose-measure: 68ch;
}
.lpi__post-body > .lpi-tldr,
.lpi__post-body > .lpi-trust-strip,
.lpi__post-body > .prose-panel {
  margin-inline: auto;
}
.lpi__post-body > *:where(h2, h3) {
  letter-spacing: -0.018em;
  text-wrap: balance;
}
.lpi__post-body > *:where(p, ul, ol) {
  line-height: 1.7;
}
.lpi__post-body a:not(.btn):not(.blog-cta-phone):not(.lpi-callbar__btn) {
  text-underline-offset: 0.18em;
  text-decoration-thickness: from-font;
  transition: color var(--transition-interactive),
              text-decoration-color var(--transition-interactive);
}
.lpi__post-body a:not(.btn):not(.blog-cta-phone):hover {
  color: color-mix(in srgb, var(--color-primary) 70%, var(--lpi-amber) 30%);
  text-decoration-color: color-mix(in srgb, var(--lpi-amber) 55%, transparent);
}
.lpi__post-body a:not(.btn):focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 2px;
  border-radius: 4px;
}

/* Byline / post meta */
.byline,
.lpi-byline,
.blog-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.85rem;
  padding: 0.55rem 0.85rem;
  border-radius: var(--lpi-radius-md);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 6%, transparent), transparent 70%),
    color-mix(in srgb, var(--color-surface) 92%, var(--lpi-navy) 8%);
  font-size: 92%;
  letter-spacing: 0.01em;
}
html[data-theme="light"] .byline,
html[data-theme="light"] .lpi-byline,
html[data-theme="light"] .blog-meta {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 7%, #fff), #fff);
  box-shadow: var(--lpi-lift-light-sm);
}
html[data-theme="dark"] .byline,
html[data-theme="dark"] .lpi-byline,
html[data-theme="dark"] .blog-meta {
  box-shadow: var(--lpi-inset);
}
.blog-meta-item {
  color: var(--color-text-muted);
}
.blog-meta-item + .blog-meta-item::before {
  content: "·";
  margin-right: 0.85rem;
  color: color-mix(in srgb, var(--lpi-amber) 70%, var(--color-text-muted));
  font-weight: 700;
}
.blog-category-tag,
.blog-card .blog-category-tag {
  display: inline-flex;
  align-items: center;
  padding: 0.22rem 0.7rem;
  border-radius: var(--lpi-radius-pill);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: color-mix(in srgb, var(--lpi-amber) 38%, var(--color-border));
  background: color-mix(in srgb, var(--lpi-amber) 12%, transparent);
  color: var(--color-text);
  font-size: 78%;
  font-weight: 650;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* Legal / long-form post body (privacy, terms, about prose) */
body.flat-sections .lpi__post-body .section--base .container,
.lpi__post-body .section--base .container {
  max-width: 52rem;
}
.lpi__post-body .section--base h2 {
  position: relative;
  padding-bottom: 0.55rem;
  margin-top: 2.1rem;
}
.lpi__post-body .section--base h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 2.4rem;
  height: 3px;
  border-radius: 2px;
  background: var(--lpi-amber-tally);
}
.lpi__post-body .section--base p,
.lpi__post-body .section--base li {
  line-height: 1.72;
  color: color-mix(in srgb, var(--color-text) 94%, var(--color-text-muted));
}

/* --- Process steps (Form 23 / service flows) --- */
.process-steps {
  display: grid;
  gap: 0.9rem;
  grid-template-columns: 1fr;
  counter-reset: lpi-step;
}
@media (min-width: 720px) {
  .process-steps {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.05rem;
  }
}
.process-step {
  position: relative;
  padding: 1.15rem 1.2rem 1.2rem;
  border-radius: var(--lpi-radius-lg);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  background:
    linear-gradient(165deg, color-mix(in srgb, var(--lpi-amber) 7%, transparent), transparent 42%),
    var(--color-surface);
  box-shadow: var(--lpi-lift);
  overflow: hidden;
  transition: transform var(--transition-interactive),
              border-color var(--transition-interactive),
              box-shadow var(--transition-interactive);
}
html[data-theme="light"] .process-step {
  background:
    linear-gradient(165deg, color-mix(in srgb, var(--lpi-amber) 8%, #fff), #fff);
  box-shadow: var(--lpi-lift-light);
}
.process-step::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--lpi-amber-tally);
}
.process-step:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--lpi-amber) 36%, var(--color-border));
}
.process-step h3 {
  letter-spacing: -0.015em;
  margin-top: 0.15rem;
}
.process-step p {
  margin-bottom: 0;
  line-height: 1.6;
  color: var(--color-text-muted);
}

/* --- Feature lists (service bullets) --- */
.feature-list {
  list-style: none;
  padding-left: 0;
  margin: 0.35rem 0 0;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.feature-list > li {
  position: relative;
  padding: 0.7rem 0.9rem 0.7rem 2.35rem;
  border-radius: var(--lpi-radius-md);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  background: color-mix(in srgb, var(--color-surface) 88%, var(--lpi-navy) 12%);
  line-height: 1.55;
  transition: border-color var(--transition-interactive),
              background var(--transition-interactive),
              transform var(--transition-interactive);
}
html[data-theme="light"] .feature-list > li {
  background: #fff;
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.04),
              0 8px 20px -16px rgba(6, 43, 88, 0.14);
}
.feature-list > li::before {
  content: "";
  position: absolute;
  left: 0.85rem;
  top: 1.05rem;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 2px;
  background: var(--lpi-amber);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--lpi-amber) 22%, transparent);
  transform: rotate(45deg);
}
.feature-list > li:hover {
  border-color: color-mix(in srgb, var(--lpi-amber) 34%, var(--color-border));
  transform: translateY(-1px);
}
/* Keep NCR fail tiles' own error language */
.lpi-issue-tiles .feature-list > li::before {
  background: var(--color-error, #c53030);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-error, #c53030) 22%, transparent);
  transform: none;
  border-radius: 50%;
}

/* --- Features grid (service prose columns + cards) --- */
.features-grid {
  gap: 1.15rem;
}
.features-grid > :not(.card):not(article) {
  border-radius: var(--lpi-radius-lg);
}
.features-grid > .card,
.features-grid > article,
.lpi__post-body .card {
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  border-radius: var(--lpi-radius-lg);
  box-shadow: var(--lpi-lift);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 5%, transparent), transparent 36%),
    var(--color-surface);
  transition: transform var(--transition-interactive),
              border-color var(--transition-interactive),
              box-shadow var(--transition-interactive);
}
html[data-theme="light"] .features-grid > .card,
html[data-theme="light"] .features-grid > article,
html[data-theme="light"] .lpi__post-body .card {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 6%, #fff), #fff);
  box-shadow: var(--lpi-lift-light);
}
.features-grid > .card:hover,
.lpi__post-body .card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--lpi-amber) 32%, var(--color-border));
}

/* --- lpi-figure (callout panels on service pages) --- */
.lpi-figure {
  position: relative;
  margin: 1.75rem auto;
  max-width: 52rem;
  padding: 1.35rem 1.4rem 1.4rem;
  border-radius: var(--lpi-radius-lg);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--lpi-navy) 8%, transparent), transparent 55%),
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 7%, transparent), transparent 40%),
    var(--color-surface);
  box-shadow: var(--lpi-lift);
  overflow: hidden;
}
html[data-theme="light"] .lpi-figure {
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--lpi-navy) 4%, #fff), #fff 50%),
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 8%, #fff), #fff);
  box-shadow: var(--lpi-lift-light);
}
.lpi-figure::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: var(--lpi-amber-tally);
}
.lpi-figure h3 {
  letter-spacing: -0.016em;
  margin-top: 0;
}
.lpi-figure p:last-child {
  margin-bottom: 0;
}

/* --- Mid-page service CTA (lpi-cta) + fee disclaimer --- */
.lpi-cta,
.lpi-inline-cta,
.blog-cta {
  position: relative;
  margin: 1.85rem auto;
  max-width: 52rem;
  padding: 1.35rem 1.45rem;
  border-radius: var(--lpi-radius-xl);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: color-mix(in srgb, var(--lpi-amber) 42%, var(--color-border));
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--lpi-amber) 14%, transparent), transparent 48%),
    linear-gradient(20deg, color-mix(in srgb, var(--lpi-navy) 55%, transparent), transparent 60%),
    var(--color-surface);
  box-shadow: var(--lpi-lift), 0 0 0 1px color-mix(in srgb, var(--lpi-amber) 12%, transparent);
  text-align: center;
  overflow: hidden;
}
html[data-theme="light"] .lpi-cta,
html[data-theme="light"] .lpi-inline-cta,
html[data-theme="light"] .blog-cta {
  background:
    linear-gradient(160deg, color-mix(in srgb, var(--lpi-amber) 16%, #fff), #fff 55%),
    #fff;
  box-shadow: var(--lpi-lift-light), 0 0 0 1px color-mix(in srgb, var(--lpi-amber) 18%, transparent);
}
.lpi-cta::after,
.blog-cta::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.07;
  background-image: url("assets/grok/caustic.svg");
  background-size: cover;
  background-position: center;
  mix-blend-mode: soft-light;
}
.lpi-cta a,
.blog-cta a,
.blog-cta-phone {
  font-weight: 650;
}
.lpi-cta a:focus-visible,
.blog-cta a:focus-visible,
.blog-cta-phone:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 3px;
  border-radius: var(--lpi-radius-pill);
}
.blog-cta-phone {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin-top: 0.35rem;
  padding: 0.7rem 1.25rem;
  border-radius: var(--lpi-radius-pill);
  background: var(--lpi-amber);
  color: var(--lpi-navy) !important;
  text-decoration: none !important;
  box-shadow: 0 10px 24px -12px rgba(255, 190, 1, 0.7),
              inset 0 1px 0 rgba(255, 255, 255, 0.4);
  transition: transform var(--transition-interactive),
              box-shadow var(--transition-interactive);
}
.blog-cta-phone:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px -12px rgba(255, 190, 1, 0.85),
              inset 0 1px 0 rgba(255, 255, 255, 0.45);
}
.blog-cta-phone:active {
  transform: translateY(0);
}

.lpi-fee-disclaimer {
  position: relative;
  padding: 0.85rem 1.1rem !important;
  border-radius: var(--lpi-radius-md);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  background: color-mix(in srgb, var(--color-surface) 90%, var(--lpi-navy) 10%);
  box-shadow: var(--lpi-inset);
}
html[data-theme="light"] .lpi-fee-disclaimer {
  background: color-mix(in srgb, #fff 94%, var(--lpi-navy) 6%);
  box-shadow: 0 1px 2px rgba(6, 43, 88, 0.04);
}
.lpi-fee-disclaimer p {
  margin: 0;
}

/* --- About: lead + why grid --- */
.lpi-about-lead {
  display: grid;
  gap: 1.1rem;
  padding: 1.35rem 1.4rem;
  border-radius: var(--lpi-radius-xl);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  background:
    linear-gradient(155deg, color-mix(in srgb, var(--lpi-amber) 8%, transparent), transparent 45%),
    var(--color-surface);
  box-shadow: var(--lpi-lift);
}
html[data-theme="light"] .lpi-about-lead {
  background:
    linear-gradient(155deg, color-mix(in srgb, var(--lpi-amber) 9%, #fff), #fff);
  box-shadow: var(--lpi-lift-light);
}
.lpi-about-lead p:last-child {
  margin-bottom: 0;
}
.lpi-why-grid {
  display: grid;
  gap: 0.95rem;
  grid-template-columns: 1fr;
}
@media (min-width: 700px) {
  .lpi-why-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1100px) {
  .lpi-why-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
.lpi-why-grid .why-card,
.why-card {
  position: relative;
  padding: 1.2rem 1.2rem 1.25rem;
  border-radius: var(--lpi-radius-lg);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  background: var(--color-surface);
  box-shadow: var(--lpi-lift);
  overflow: hidden;
  transition: transform var(--transition-interactive),
              border-color var(--transition-interactive),
              box-shadow var(--transition-interactive);
}
html[data-theme="light"] .lpi-why-grid .why-card,
html[data-theme="light"] .why-card {
  background: #fff;
  box-shadow: var(--lpi-lift-light);
}
.lpi-why-grid .why-card::before,
.why-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 40px;
  height: 3px;
  border-radius: 0 0 3px 3px;
  background: var(--lpi-amber-tally);
}
.lpi-why-grid .why-card:hover,
.why-card:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--lpi-amber) 34%, var(--color-border));
}
.why-card__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  margin-bottom: 0.65rem;
  border-radius: var(--lpi-radius-sm);
  background: color-mix(in srgb, var(--lpi-amber) 16%, transparent);
  color: var(--lpi-amber);
  border: var(--lpi-bw) solid color-mix(in srgb, var(--lpi-amber) 28%, transparent);
}
.why-card__icon svg {
  width: 1.25rem;
  height: 1.25rem;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.8;
}
.why-card h3 {
  letter-spacing: -0.015em;
  margin: 0 0 0.4rem;
}
.why-card p {
  margin: 0;
  line-height: 1.6;
  color: var(--color-text-muted);
}

/* --- Prose panel elevation lock (service / suburb / council) --- */
.prose-panel {
  position: relative;
  padding: 1.35rem 1.4rem;
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  border-radius: var(--lpi-radius-lg);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 5%, transparent), transparent 40%),
    var(--color-surface);
  box-shadow: var(--lpi-lift);
}
html[data-theme="light"] .prose-panel {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 6%, #fff), #fff);
  box-shadow: var(--lpi-lift-light);
}
.prose-panel > p:last-child {
  margin-bottom: 0;
}

/* --- Money / cost: trust + table chrome deepen --- */
.lpi-inout caption {
  caption-side: top;
  text-align: left;
  padding: 0.85rem 1.1rem 0.65rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  background: color-mix(in srgb, var(--lpi-amber) 10%, var(--color-surface));
  border-bottom: var(--lpi-bw) solid var(--lpi-hairline);
}
html[data-theme="light"] .lpi-inout caption {
  background: color-mix(in srgb, var(--lpi-amber) 12%, #fff);
}
.lpi-inout thead th {
  background: color-mix(in srgb, var(--lpi-navy) 8%, var(--color-surface));
  font-weight: 700;
  letter-spacing: 0.02em;
}
html[data-theme="light"] .lpi-inout thead th {
  background: color-mix(in srgb, var(--lpi-navy) 5%, #fff);
}
.lpi-inout td,
.lpi-inout th {
  padding: 0.85rem 1.05rem;
}
.lpi-inout .in,
.lpi-inout td.in {
  color: color-mix(in srgb, var(--color-text) 92%, #1a7f4a);
}
.cta-section .btn,
.cta-banner__buttons .btn {
  border-radius: var(--lpi-radius-pill);
}

/* --- Sticky callbar: theme-equal finish --- */
.lpi-callbar {
  border-top-width: var(--lpi-bw);
  border-top-style: solid;
  border-top-color: color-mix(in srgb, var(--lpi-amber) 35%, var(--color-border));
  background: color-mix(in srgb, var(--color-bg) 92%, var(--lpi-navy) 8%);
  backdrop-filter: none;
}
html[data-theme="light"] .lpi-callbar {
  background: color-mix(in srgb, #fff 94%, var(--lpi-navy) 6%);
  box-shadow: 0 -8px 28px -18px rgba(6, 43, 88, 0.28);
}
html[data-theme="dark"] .lpi-callbar {
  box-shadow: 0 -12px 32px -18px rgba(0, 0, 0, 0.55);
}
.lpi-callbar__btn {
  border-radius: var(--lpi-radius-pill) !important;
  box-shadow: 0 8px 20px -10px rgba(255, 190, 1, 0.65),
              inset 0 1px 0 rgba(255, 255, 255, 0.35);
  transition: transform var(--transition-interactive),
              box-shadow var(--transition-interactive),
              filter var(--transition-interactive);
}
.lpi-callbar__btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 26px -10px rgba(255, 190, 1, 0.8),
              inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
.lpi-callbar__btn:active {
  transform: translateY(0);
}
.lpi-callbar__btn:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px rgba(255, 190, 1, 0.35);
}

/* ============================================================
   BLOG — listing + single (matches site chrome; loads with ui-2026)
   ============================================================ */
.blog-hero,
.blog-hero--split {
  position: relative;
  overflow: hidden;
}
.blog-hero-inner {
  position: relative;
  z-index: 1;
}
.blog-hero-title,
.blog-hero .blog-hero-title {
  letter-spacing: -0.025em;
  text-wrap: balance;
}
.blog-hero-sub {
  line-height: 1.65;
  max-width: 42rem;
}
.blog-hero__plate {
  border-radius: var(--lpi-radius-xl);
  overflow: hidden;
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  box-shadow: var(--lpi-lift);
}
html[data-theme="light"] .blog-hero__plate {
  box-shadow: var(--lpi-lift-light);
}
.blog-back-link,
.blog-breadcrumb a {
  border-radius: var(--lpi-radius-pill);
  transition: color var(--transition-interactive),
              background var(--transition-interactive);
}
.blog-back-link:hover,
.blog-breadcrumb a:hover {
  color: var(--lpi-amber);
}
.blog-back-link:focus-visible,
.blog-breadcrumb a:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 2px;
}
.blog-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.55rem;
  font-size: 90%;
  color: var(--color-text-muted);
}

/* Blog index cards */
.blog-index,
.blog-main {
  gap: 1.15rem;
}
.blog-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 1.25rem 1.3rem 1.3rem;
  border-radius: var(--lpi-radius-lg);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 6%, transparent), transparent 40%),
    var(--color-surface);
  box-shadow: var(--lpi-lift);
  overflow: hidden;
  transition: transform var(--transition-interactive),
              border-color var(--transition-interactive),
              box-shadow var(--transition-interactive);
}
html[data-theme="light"] .blog-card {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 7%, #fff), #fff);
  box-shadow: var(--lpi-lift-light);
}
.blog-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 44px;
  height: 3px;
  border-radius: 0 0 3px 3px;
  background: var(--lpi-amber-tally);
}
.blog-card:hover {
  transform: translateY(-3px);
  border-color: color-mix(in srgb, var(--lpi-amber) 36%, var(--color-border));
}
.blog-card:active {
  transform: translateY(0);
}
.blog-card-title {
  letter-spacing: -0.02em;
  text-wrap: balance;
  margin: 0.15rem 0 0;
}
.blog-card-title a {
  color: inherit;
  text-decoration: none;
  transition: color var(--transition-interactive);
}
.blog-card-title a:hover {
  color: color-mix(in srgb, var(--color-primary) 75%, var(--lpi-amber) 25%);
}
.blog-card-title a:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 3px;
  border-radius: 4px;
}
.blog-card-excerpt {
  margin: 0;
  line-height: 1.65;
  color: var(--color-text-muted);
}
.blog-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 0.75rem;
  margin-top: auto;
  padding-top: 0.55rem;
  font-size: 88%;
  color: var(--color-text-muted);
  border-top: var(--lpi-bw) solid color-mix(in srgb, var(--lpi-hairline) 80%, transparent);
}

/* Single post layout */
.blog-layout,
.blog-article {
  max-width: 52rem;
}
.blog-content.lpi__post-body,
.blog-content {
  line-height: 1.72;
}
.blog-content .lpi-answer-block,
.blog-content .lpi-tldr,
.lpi-answer-block {
  border-radius: var(--lpi-radius-md) !important;
  border-width: var(--lpi-bw) !important;
  border-style: solid !important;
  border-color: var(--lpi-hairline) !important;
  border-left-width: 3px !important;
  border-left-color: var(--lpi-amber) !important;
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 8%, transparent), transparent 55%),
    var(--color-surface) !important;
  box-shadow: var(--lpi-lift);
  padding: 1rem 1.15rem !important;
}
html[data-theme="light"] .blog-content .lpi-answer-block,
html[data-theme="light"] .lpi-answer-block {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 9%, #fff), #fff) !important;
  box-shadow: var(--lpi-lift-light);
}
html[data-theme="dark"] .blog-content .lpi-answer-block,
html[data-theme="dark"] .lpi-answer-block {
  /* override WP inline light-blue wash for dark theme */
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--lpi-amber) 8%, transparent), transparent 55%),
    color-mix(in srgb, var(--color-surface) 92%, var(--lpi-navy) 8%) !important;
  color: var(--color-text) !important;
}

/* Pagination */
.lpi__pagination {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: center;
  margin-top: 1.75rem;
  padding-top: 1.25rem;
  border-top: var(--lpi-bw) solid var(--lpi-hairline);
}
.lpi__pagination a,
.lpi__pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.4rem;
  height: 2.4rem;
  padding: 0 0.7rem;
  border-radius: var(--lpi-radius-pill);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  background: var(--color-surface);
  text-decoration: none;
  font-weight: 600;
  transition: transform var(--transition-interactive),
              border-color var(--transition-interactive),
              background var(--transition-interactive),
              box-shadow var(--transition-interactive);
}
html[data-theme="light"] .lpi__pagination a,
html[data-theme="light"] .lpi__pagination span {
  background: #fff;
  box-shadow: var(--lpi-lift-light-sm);
}
.lpi__pagination a:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--lpi-amber) 40%, var(--color-border));
  background: color-mix(in srgb, var(--lpi-amber) 10%, var(--color-surface));
}
.lpi__pagination a:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 2px;
}
.lpi__pagination .current,
.lpi__pagination span.current,
.lpi__pagination [aria-current="page"] {
  border-color: color-mix(in srgb, var(--lpi-amber) 50%, var(--color-border));
  background: color-mix(in srgb, var(--lpi-amber) 18%, var(--color-surface));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lpi-amber) 35%, transparent);
}

/* ============================================================
   HOME + SITEWIDE — push to 9.8 (micro polish on already-good surfaces)
   ============================================================ */
.hero--dossier .hero__plate,
.hero--dossier .hero__dossier {
  border-radius: var(--lpi-radius-xl);
}
.hero__ctas .btn,
.hero__ctas .btn--primary,
.hero__ctas .btn--outline,
.hero__ctas .btn--accent-outline {
  border-radius: var(--lpi-radius-pill);
  min-height: 3rem;
}
.lpi-router {
  border-radius: var(--lpi-radius-xl);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  box-shadow: var(--lpi-lift);
}
html[data-theme="light"] .lpi-router {
  box-shadow: var(--lpi-lift-light);
}
.lpi-router__opt span {
  border-radius: var(--lpi-radius-pill);
}
.service-card,
.location-card,
.region-card,
.review-card {
  border-radius: var(--lpi-radius-lg);
}
.services__grid .service-card__price,
.service-card__price {
  border-radius: var(--lpi-radius-pill);
  background: color-mix(in srgb, var(--lpi-amber) 16%, transparent);
  border: var(--lpi-bw) solid color-mix(in srgb, var(--lpi-amber) 40%, transparent);
  font-weight: 700;
  letter-spacing: 0.02em;
}
.lpi-trust-strip {
  border-radius: var(--lpi-radius-lg);
}
.cta-banner {
  border-radius: 0;
  position: relative;
  overflow: hidden;
}
.cta-banner__inner {
  position: relative;
  z-index: 1;
}

/* Contact / form parity already strong — lock card radius */
.contact-form,
.lens-success__card {
  border-radius: var(--lpi-radius-xl);
}

/* FAQ index numbers stay amber; sticky polish */
.faq-index {
  border-radius: var(--lpi-radius-lg);
}

/* Suburb chips denser hover */
.suburb-chip:active,
.chips a:active,
.area-tag:active {
  transform: translateY(0);
}

/* Skip-link + selection already ok — reinforce skip */
.skip-link:focus {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 2px;
}

/* --- Reduced motion: Loop 4 lifts --- */
@media (prefers-reduced-motion: reduce) {
  .process-step:hover,
  .feature-list > li:hover,
  .features-grid > .card:hover,
  .lpi__post-body .card:hover,
  .lpi-why-grid .why-card:hover,
  .why-card:hover,
  .blog-card:hover,
  .blog-card:active,
  .blog-cta-phone:hover,
  .blog-cta-phone:active,
  .lpi-callbar__btn:hover,
  .lpi-callbar__btn:active,
  .lpi__pagination a:hover {
    transform: none;
  }
}

/* --- Mobile 390: service/blog gutters --- */
@media (max-width: 420px) {
  .process-step,
  .lpi-figure,
  .lpi-cta,
  .blog-cta,
  .lpi-about-lead,
  .prose-panel,
  .blog-card {
    padding-inline: 1.05rem;
  }
  .feature-list > li {
    padding-left: 2.15rem;
  }
  .lpi-callbar {
    padding-inline: max(1rem, env(safe-area-inset-left, 0px) + 0.75rem);
  }
}

/* ============================================================
   LOOP 4b — 9.8 lock: blog contrast, badge unify, NCR/router
   ============================================================ */

/* Blog hero meta must read on navy plate (both themes) */
.blog-hero .blog-meta,
.blog-hero--split .blog-meta,
.blog-hero-inner .blog-meta {
  background: color-mix(in srgb, #fff 12%, transparent);
  border-color: color-mix(in srgb, var(--lpi-amber) 45%, rgba(255, 255, 255, 0.25));
  color: #fff;
  box-shadow: none;
}
.blog-hero .blog-meta-item,
.blog-hero--split .blog-meta-item {
  color: rgba(255, 255, 255, 0.88);
}
.blog-hero .blog-meta-item + .blog-meta-item::before {
  color: var(--lpi-amber);
}
.blog-hero .blog-category-tag,
.blog-hero--split .blog-category-tag {
  background: color-mix(in srgb, var(--lpi-amber) 22%, transparent);
  border-color: color-mix(in srgb, var(--lpi-amber) 65%, #fff);
  color: #fff;
}

/* Force all category tags onto amber signal (override WP blog.css blues) */
.blog-category-tag,
.blog-card .blog-category-tag,
.blog-meta .blog-category-tag,
.blog-index .blog-category-tag {
  background: color-mix(in srgb, var(--lpi-amber) 14%, transparent) !important;
  border-color: color-mix(in srgb, var(--lpi-amber) 48%, var(--color-border)) !important;
  color: var(--color-text) !important;
}
html[data-theme="light"] .blog-category-tag,
html[data-theme="light"] .blog-card .blog-category-tag {
  background: color-mix(in srgb, var(--lpi-amber) 16%, #fff) !important;
  color: var(--lpi-navy) !important;
}
html[data-theme="dark"] .blog-category-tag,
html[data-theme="dark"] .blog-card .blog-category-tag {
  color: #fff !important;
}

/* Blog card amber tally stronger + hover border */
.blog-card::before {
  width: 52px;
  height: 3px;
}
html[data-theme="light"] .blog-card:hover {
  box-shadow: 0 2px 4px rgba(6, 43, 88, 0.06),
              0 20px 44px -18px rgba(6, 43, 88, 0.26);
}

/* Service-card price / label pills: one amber language */
.service-card__price,
.services__grid .service-card__price {
  display: inline-flex;
  align-items: center;
  padding: 0.28rem 0.75rem;
  border-radius: var(--lpi-radius-pill);
  background: color-mix(in srgb, var(--lpi-amber) 18%, transparent);
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: color-mix(in srgb, var(--lpi-amber) 48%, transparent);
  color: var(--color-text);
  font-weight: 700;
  letter-spacing: 0.03em;
  font-size: 82%;
  text-transform: uppercase;
}
html[data-theme="light"] .service-card__price {
  background: color-mix(in srgb, var(--lpi-amber) 20%, #fff);
  color: var(--lpi-navy);
}

/* NCR issue columns: amber tally + hairline lock */
.lpi-issue-tiles .features-grid > *,
.lpi-issue-tiles article,
.lpi-issue-tiles .card {
  position: relative;
  overflow: hidden;
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  border-radius: var(--lpi-radius-lg);
}
.lpi-issue-tiles .features-grid > *::before,
.lpi-issue-tiles article::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 44px;
  height: 3px;
  border-radius: 0 0 3px 3px;
  background: var(--lpi-amber-tally);
  z-index: 1;
}
html[data-theme="light"] .lpi-issue-tiles .features-grid > *,
html[data-theme="light"] .lpi-issue-tiles article {
  background: #fff;
  box-shadow: var(--lpi-lift-light);
}

/* Router chips: clearer hairline + selected amber */
.lpi-router__opt span {
  border-width: var(--lpi-bw-strong, 1.5px);
  border-style: solid;
  border-color: var(--lpi-hairline);
  background: var(--color-surface);
  box-shadow: var(--lpi-lift-light-sm);
}
html[data-theme="dark"] .lpi-router__opt span {
  box-shadow: var(--lpi-inset);
}
.lpi-router__opt span:hover {
  border-color: color-mix(in srgb, var(--lpi-amber) 42%, var(--color-border));
  background: color-mix(in srgb, var(--lpi-amber) 8%, var(--color-surface));
}
.lpi-router__opt input:checked + span,
.lpi-router__opt input:focus-visible + span {
  border-color: color-mix(in srgb, var(--lpi-amber) 55%, var(--color-border));
  background: color-mix(in srgb, var(--lpi-amber) 14%, var(--color-surface));
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--lpi-amber) 35%, transparent),
              var(--lpi-lift-light-sm);
}

/* Trust strip items on home: equal card chrome */
.trust-bar__grid .trust-item,
.trust-item {
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
  border-radius: var(--lpi-radius-lg);
}
html[data-theme="light"] .trust-item {
  background: #fff;
  box-shadow: var(--lpi-lift-light-sm);
}

/* Contact form submit + inputs already strong — reinforce panel tally */
.contact-form {
  position: relative;
  overflow: hidden;
}
.contact-form::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 56px;
  height: 3px;
  border-radius: 0 0 3px 3px;
  background: var(--lpi-amber-tally);
}

/* Money page prose-panel + table rhythm */
.lpi-inout {
  margin-top: 1.15rem;
}

/* Legal post body: comfortable measure + link amber underline */
body .lpi__post-body .section--base a:not(.btn) {
  text-decoration-color: color-mix(in srgb, var(--lpi-amber) 45%, transparent);
}
body .lpi__post-body .section--base a:not(.btn):hover {
  text-decoration-color: var(--lpi-amber);
}

/* Homepage location cards hairline lock */
.location-card {
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
}

/* FAQ open left tally already set — closed hairline reinforce */
.faq-item,
details.faq-item {
  border-width: var(--lpi-bw);
  border-style: solid;
  border-color: var(--lpi-hairline);
}

@media (prefers-reduced-motion: reduce) {
  .lpi-router__opt span:hover,
  .blog-card:hover {
    transform: none;
  }
}

/* ============================================================
   LOOP 5 — layout / type / spacing discipline (2026-09-29)
   Rhythm + alignment only. No new ornaments. (Nav hide rules removed: the Services nav links are gone from the HTML.)
   ============================================================ */

/* --- Loop 5 rhythm tokens (layout scale only) --- */
:root {
  --lpi-space-1: 0.5rem;     /* 8  · tight related */
  --lpi-space-2: 0.75rem;    /* 12 · chip / meta */
  --lpi-space-3: 1rem;       /* 16 · card internal */
  --lpi-space-4: 1.25rem;    /* 20 · card pad */
  --lpi-space-5: 1.5rem;     /* 24 · grid gap */
  --lpi-space-6: 2rem;       /* 32 · section header → grid */
  --lpi-space-7: 2.75rem;    /* 44 · mid section */
  --lpi-gap-grid: clamp(0.85rem, 1.6vw, 1.35rem);
  --lpi-gap-cards: clamp(1rem, 2vw, 1.5rem);
  --lpi-pad-card: clamp(1.15rem, 2.2vw, 1.65rem);
  --lpi-pad-card-lg: clamp(1.35rem, 2.6vw, 2rem);
  --lpi-section-y: clamp(3rem, 6.5vw, 5.5rem);
  --lpi-measure: 62ch;
  --lpi-lh-body: 1.65;
  --lpi-lh-tight: 1.2;
  --lpi-lh-ui: 1.45;
}

/* --- Section cadence: one vertical rhythm --- */
.section-padding,
main > section.section,
main > .section,
.flat-sections > section {
  padding-block: var(--lpi-section-y);
}
.section-header,
.section__header {
  margin-bottom: clamp(1.35rem, 2.8vw, 2rem);
}
.section-header + .services__grid,
.section-header + .features-grid,
.section-header + .process-steps,
.section-header + .prose-card-grid,
.section-header + .lpi-why-grid,
.section-header + .trust-bar__grid,
.section-header + .locations__grid,
.section-header + .region-grid,
.section__header + .services__grid,
.section__header + .features-grid {
  margin-top: 0;
}
.section-title,
h2.section-title {
  letter-spacing: -0.022em;
  line-height: var(--lpi-lh-tight);
  text-wrap: balance;
  margin-block: 0.15em 0.45em;
}
.section-desc,
.section-header .section-desc {
  line-height: var(--lpi-lh-body);
  max-width: var(--lpi-measure);
  text-wrap: pretty;
  margin-block: 0 0;
}
.section-label {
  letter-spacing: 0.16em;
  margin-bottom: 0.55rem;
}

/* --- Typography: coherent heading / body steps --- */
h1 {
  letter-spacing: -0.025em;
  line-height: 1.08;
  text-wrap: balance;
}
h2 {
  letter-spacing: -0.02em;
  line-height: 1.15;
  text-wrap: balance;
}
h3 {
  letter-spacing: -0.015em;
  line-height: 1.25;
  text-wrap: balance;
}
.answer-block,
.lpi-tldr,
.lpi-answer-block,
.prose-panel p,
.lpi__post-body p,
.about__text p {
  line-height: var(--lpi-lh-body);
  max-width: var(--lpi-measure);
}
.breadcrumb,
.breadcrumbs,
.lpi-byline,
.blog-meta,
.hero__kicker,
.section-label {
  line-height: var(--lpi-lh-ui);
}

/* --- Card grids: shared gap + internal pad + equal edges --- */
.services__grid,
.features-grid,
.process-steps,
.prose-card-grid,
.lpi-why-grid,
.trust-bar__grid,
.locations__grid,
.region-grid,
.reviews__grid,
.testimonials__track {
  gap: var(--lpi-gap-cards);
}
@media (min-width: 720px) {
  .process-steps {
    gap: var(--lpi-gap-grid);
  }
}

/* Unified card internal padding (symmetric) */
.service-card,
.services__grid .service-card,
.services__grid > article,
.services__grid > .card,
.process-step,
.prose-card,
.prose-card-grid > *,
.features-grid > .card,
.features-grid > article,
.region-card,
.review-card,
.location-card__body,
.why-card,
.lpi-why-grid .why-card,
.lpi-figure,
.lpi-about-lead,
.trust-item {
  padding: var(--lpi-pad-card);
  box-sizing: border-box;
}
/* Larger home service cards keep a touch more air */
@media (min-width: 900px) {
  .services__grid .service-card,
  .services__grid > article,
  .services__grid > .card {
    padding: var(--lpi-pad-card-lg);
  }
}

/* Process steps: lock symmetric pad (was 18.4/19.2 asymmetry) */
.process-step {
  padding: 1.15rem 1.2rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}
.process-step h3 {
  margin: 0;
}
.process-step p {
  margin: 0;
  line-height: var(--lpi-lh-body);
}

/* Why cards: restore intentional horizontal pad (was ~0–4px) */
.lpi-why-grid .why-card,
.why-card {
  padding: var(--lpi-pad-card) !important;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.lpi-why-grid .why-card h3,
.why-card h3 {
  margin: 0;
  line-height: 1.25;
}
.lpi-why-grid .why-card p,
.why-card p {
  margin: 0;
  line-height: var(--lpi-lh-body);
}

/* Prose cards: symmetric pad + title/body rhythm */
.prose-card,
.prose-card-grid > * {
  padding: var(--lpi-pad-card);
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.prose-card h3,
.prose-card-grid > * h3 {
  margin: 0;
  line-height: 1.25;
}
.prose-card p,
.prose-card-grid > * p {
  margin: 0;
  line-height: var(--lpi-lh-body);
}

/* Region / location / trust: equal internal air */
.region-card {
  padding: var(--lpi-pad-card);
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}
.trust-item {
  padding: 1.05rem 1.15rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}
.trust-item__icon {
  margin-bottom: 0.15rem;
}

/* Service card: price / title / body stack */
.service-card,
.services__grid > article,
.services__grid > .card {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}
.service-card h3,
.services__grid > article h3,
.services__grid > .card h3 {
  margin: 0;
  line-height: 1.25;
  letter-spacing: -0.015em;
}
.service-card p,
.services__grid > article p,
.services__grid > .card p {
  margin: 0;
  line-height: var(--lpi-lh-body);
  flex: 1 1 auto;
}
.service-card__price,
.services__grid .service-card__price {
  margin-top: auto;
  align-self: flex-start;
}

/* NCR / feature tile pad lock */
.lpi-issue-tiles .features-grid > *,
.lpi-issue-tiles article,
.lpi-issue-tiles .card {
  padding: var(--lpi-pad-card);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

/* Feature list: consistent row rhythm */
.feature-list {
  gap: 0.6rem;
}
.feature-list > li {
  padding: 0.7rem 0.95rem 0.7rem 2.4rem;
  line-height: 1.55;
}

/* --- FAQ: summary / answer vertical rhythm --- */
.faq-item,
details.faq-item {
  margin: 0;
}
.faq-list,
.faq-accordion,
.faq .faq-list {
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
}
.faq-item__question,
.faq-item summary,
details.faq-item > summary {
  padding: 1rem 1.15rem;
  line-height: 1.35;
  letter-spacing: -0.01em;
}
.faq-item__answer,
.faq-item .faq-item__answer,
details.faq-item .faq-item__answer {
  padding: 0 1.15rem 1.15rem;
  line-height: var(--lpi-lh-body);
  max-width: var(--lpi-measure);
}

/* --- Forms: aligned field stack --- */
.contact-form,
form.contact-form {
  padding: var(--lpi-pad-card-lg);
}
.contact-form .form-group,
.contact-form .field,
.contact-form label + input,
.contact-form label + textarea,
.contact-form label + select {
  margin-top: 0;
}
.contact-form {
  display: flex;
  flex-direction: column;
  gap: 0.95rem;
}
.contact-form label {
  line-height: var(--lpi-lh-ui);
  margin-bottom: 0.3rem;
  display: block;
}
.contact-form input,
.contact-form textarea,
.contact-form select {
  min-height: 2.75rem;
  padding: 0.7rem 0.95rem;
  line-height: var(--lpi-lh-ui);
}
.contact-form textarea {
  min-height: 8rem;
  padding-block: 0.85rem;
}

/* --- Tables: cell rhythm --- */
.lpi-inout,
table.lpi-inout {
  border-spacing: 0;
}
.lpi-inout th,
.lpi-inout td,
table.lpi-inout th,
table.lpi-inout td {
  padding: 0.85rem 1rem;
  line-height: 1.45;
  vertical-align: top;
}
.lpi-inout caption {
  margin-bottom: 0.75rem;
  line-height: var(--lpi-lh-ui);
}

/* --- Hero / dossier: tighten internal stack without redesign --- */
.hero--dossier .hero__lede {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.hero--dossier .hero__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 0.35rem;
}
.hero--dossier .answer-block {
  margin-block: 0;
  padding: 0.95rem 1.1rem;
  line-height: var(--lpi-lh-body);
}
.hero__dossier,
.hero--dossier .hero__dossier {
  padding: var(--lpi-pad-card-lg);
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

/* --- Router chips: even gap --- */
.lpi-router__opts,
.lpi-router__options,
.lpi-router form {
  gap: var(--lpi-gap-grid);
}
.lpi-router {
  padding: clamp(1.75rem, 4vw, 2.75rem) clamp(1.15rem, 3vw, 2rem);
}

/* --- Suburb chips / tags: denser intentional gap --- */
.suburb-chips,
.chips,
.area-tags,
.lpi-area-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.6rem;
}

/* --- Breadcrumb / byline alignment --- */
.breadcrumb,
.breadcrumbs,
nav[aria-label="Breadcrumb"] {
  margin-bottom: 0.85rem;
  line-height: var(--lpi-lh-ui);
  letter-spacing: 0.01em;
}
.lpi-byline,
.blog-meta {
  gap: 0.45rem 0.75rem;
  margin-bottom: 1rem;
}

/* --- CTA banner / mid-page CTAs: balanced pad --- */
.cta-banner__inner,
.lpi-cta,
.blog-cta {
  padding-block: clamp(1.5rem, 3.5vw, 2.35rem);
  padding-inline: clamp(1.15rem, 3vw, 2rem);
}
.lpi-cta,
.blog-cta {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

/* --- Header: after Services removed, keep nav spacing calm --- */
@media (min-width: 1024px) {
  .header__nav {
    gap: clamp(1.1rem, 1.8vw, 1.75rem);
  }
  .header__nav > a {
    letter-spacing: 0.03em;
  }
}

/* --- Mobile ≤420: stack + gutters + full-bleed cards --- */
@media (max-width: 420px) {
  .section-padding,
  main > section.section,
  main > .section {
    padding-block: clamp(2.5rem, 10vw, 3.25rem);
  }
  .services__grid,
  .features-grid,
  .process-steps,
  .prose-card-grid,
  .lpi-why-grid,
  .region-grid,
  .trust-bar__grid {
    gap: 0.85rem;
  }
  .service-card,
  .process-step,
  .prose-card,
  .prose-card-grid > *,
  .region-card,
  .why-card,
  .lpi-why-grid .why-card,
  .features-grid > .card,
  .features-grid > article,
  .lpi-issue-tiles .features-grid > *,
  .lpi-figure,
  .contact-form,
  .lpi-about-lead {
    padding: 1.05rem 1.1rem;
  }
  .faq-item__question,
  details.faq-item > summary {
    padding: 0.9rem 1rem;
  }
  .faq-item__answer,
  details.faq-item .faq-item__answer {
    padding: 0 1rem 1rem;
  }
  .hero--dossier .hero__lede {
    gap: 0.85rem;
  }
  .hero__dossier,
  .hero--dossier .hero__dossier {
    padding: 1.1rem 1.15rem;
  }
  /* Touch targets */
  .btn,
  .header__call,
  .suburb-chip,
  .chips a,
  .area-tag,
  .lpi-router__opt span {
    min-height: 2.75rem;
  }
}

/* --- Tablet 820: keep grids from feeling sparse --- */
@media (min-width: 600px) and (max-width: 899.98px) {
  .services__grid,
  .prose-card-grid,
  .features-grid,
  .region-grid {
    gap: 1.05rem;
  }
}

/* --- Wide 1440: restrain measure, don’t stretch prose --- */
@media (min-width: 1400px) {
  .section-desc,
  .answer-block,
  .prose-panel p,
  .lpi__post-body p,
  .faq-item__answer {
    max-width: var(--lpi-measure);
  }
  .services__grid,
  .prose-card-grid:not(.prose-card-grid--2),
  .features-grid {
    gap: 1.35rem;
  }
}

/* --- Icon wells / list markers share a clear left edge --- */
.trust-item__icon,
.why-card__icon,
.lpi-why-grid .why-card svg,
.process-step__icon {
  flex: none;
}
.feature-list > li::before {
  left: 0.85rem;
}

/* --- Legal / post body: comfortable paragraph rhythm --- */
.lpi__post-body p + p,
.flat-sections p + p,
.about__text p + p {
  margin-top: 0.85em;
}
.lpi__post-body h2 {
  margin-top: 1.75em;
  margin-bottom: 0.55em;
  padding-bottom: 0.35em;
}
.lpi__post-body h3 {
  margin-top: 1.35em;
  margin-bottom: 0.4em;
}

/* --- Sticky callbar clearance: avoid content collision --- */
body:has(.lpi-callbar) main {
  padding-bottom: 0.25rem;
}

/* --- Reduced motion: Loop 5 has no new transforms beyond prior --- */
@media (prefers-reduced-motion: reduce) {
  .service-card:hover,
  .process-step:hover,
  .prose-card:hover,
  .prose-card-grid > *:hover,
  .why-card:hover,
  .region-card:hover,
  .trust-item:hover {
    transform: none;
  }
}

/* ============================================================
   LOOP 5b — symmetric pad lock + contact/areas selectors
   ============================================================ */

/* Process / trust / figure: fully symmetric (kill 1.15/1.2 asymmetry) */
.process-step {
  padding: var(--lpi-pad-card) !important;
}
.trust-item {
  padding: 1.1rem !important;
}
.lpi-figure {
  padding: var(--lpi-pad-card) !important;
}
.feature-list > li {
  padding-top: 0.7rem;
  padding-bottom: 0.7rem;
  padding-right: 0.95rem;
  padding-left: 2.4rem;
}

/* Contact form real selectors (lpi-contact-form / #contact-form) */
form.lpi-contact-form,
#contact-form,
form[name="pool-inspection-form"],
.lpi-contact-form,
.contact-form {
  padding: var(--lpi-pad-card-lg);
  display: flex;
  flex-direction: column;
  gap: 0.95rem;
  box-sizing: border-box;
}
form.lpi-contact-form label,
#contact-form label,
.lpi-contact-form label {
  line-height: var(--lpi-lh-ui);
  margin-bottom: 0.3rem;
  display: block;
}
form.lpi-contact-form input,
form.lpi-contact-form textarea,
form.lpi-contact-form select,
#contact-form input,
#contact-form textarea,
#contact-form select {
  min-height: 2.75rem;
  padding: 0.7rem 0.95rem;
  line-height: var(--lpi-lh-ui);
  box-sizing: border-box;
  width: 100%;
}
form.lpi-contact-form textarea,
#contact-form textarea {
  min-height: 8rem;
  padding-block: 0.85rem;
}

/* Areas map page: finder / area accordion rhythm */
.mapcard {
  padding: 0;
}
.finder {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.areas details.area > summary,
details.area > summary {
  padding: 0.85rem 1rem;
  line-height: 1.35;
  gap: 0.65rem;
}
.areas details.area[open] > summary,
details.area[open] > summary {
  margin-bottom: 0.55rem;
}
.areas .chips,
details.area .chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.55rem;
  padding: 0.15rem 0.25rem 0.85rem;
  margin: 0;
  list-style: none;
}
.areas .grp,
.areas p.grp {
  margin: 1.35rem 0 0.65rem;
  letter-spacing: 0.12em;
  font-size: 72%;
  font-weight: 700;
  text-transform: uppercase;
  line-height: var(--lpi-lh-ui);
}
.areas .grp:first-child {
  margin-top: 0.25rem;
}

/* Features-grid children that aren't cards: don't force pad on wrappers */
.features-grid > .prose-panel,
.features-grid > .lpi-figure,
.features-grid > form,
.features-grid > .faq-index {
  padding: 0;
}

/* Equalize section-header → content gap on service money pages */
.lpi__post-body .section-header,
.lpi__post-body .section__header,
main .section-header {
  margin-bottom: clamp(1.35rem, 2.8vw, 2rem);
}

/* FAQ index sticky column: consistent internal pad */
.faq-index {
  padding: 1.1rem 1.15rem;
}
.faq-index a {
  padding: 0.45rem 0.55rem;
  line-height: var(--lpi-lh-ui);
}

@media (max-width: 420px) {
  form.lpi-contact-form,
  #contact-form,
  .lpi-contact-form,
  .contact-form {
    padding: 1.05rem 1.1rem;
  }
  .areas details.area > summary,
  details.area > summary {
    padding: 0.8rem 0.9rem;
  }
}

/* ============================================================
   LOOP 5c — hero answer-block contrast (light theme regression)
   Prior loop set html[data-theme=light] .answer-block { background:#fff }
   which washed the navy hero plate. Restore transparent + readable type.
   ============================================================ */
html[data-theme="light"] .hero .answer-block,
html[data-theme="light"] .hero--dossier .answer-block,
html[data-theme="light"] .hero--dossier .hero__lede .answer-block {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: rgba(255, 255, 255, 0.92);
  border-color: color-mix(in srgb, var(--lpi-amber) 55%, transparent);
}

/* Loop 5c cont. — light callbar text contrast (≥4.5:1 on pale bar) */
html[data-theme="light"] .lpi-callbar {
  color: var(--lpi-navy);
}
html[data-theme="light"] .lpi-callbar,
html[data-theme="light"] .lpi-callbar p,
html[data-theme="light"] .lpi-callbar span,
html[data-theme="light"] .lpi-callbar .lpi-callbar__text {
  color: var(--lpi-navy);
}
html[data-theme="dark"] .lpi-callbar,
html[data-theme="dark"] .lpi-callbar p,
html[data-theme="dark"] .lpi-callbar span {
  color: rgba(255, 255, 255, 0.92);
}

/* ============================================================
   LOOP 6 — areas vocabulary echoed site-wide (light + refined)
   Source of truth for the strong look remains .sa / lpi-areas.css.
   Elsewhere: same tokens at lower amplitude — belong, don't shout.
   ============================================================ */

:root {
  /* Soft panel wash — whisper only (areas finder/mapcard use stronger local shadow) */
  --lpi-wash-amber: linear-gradient(
    165deg,
    color-mix(in srgb, var(--lpi-amber) 7%, transparent) 0%,
    transparent 42%
  );
  --lpi-wash-sea: linear-gradient(
    180deg,
    color-mix(in srgb, var(--lpi-sea) 5%, transparent) 0%,
    transparent 38%
  );
  --lpi-panel-lift-sm: 0 1px 2px rgba(6, 43, 88, 0.04),
                       0 10px 28px -18px rgba(6, 43, 88, 0.14);
}

html[data-theme="dark"] {
  --lpi-wash-amber: linear-gradient(
    165deg,
    color-mix(in srgb, var(--lpi-amber) 9%, transparent) 0%,
    transparent 44%
  );
  --lpi-wash-sea: linear-gradient(
    180deg,
    color-mix(in srgb, var(--lpi-sea) 6%, transparent) 0%,
    transparent 40%
  );
  --lpi-panel-lift-sm: var(--lpi-inset), 0 12px 28px -20px rgba(0, 0, 0, 0.5);
}

/* --- Chips: match areas .chips chrome (hairline + amber hover), quiet --- */
.area-tag,
.suburb-chip,
.region-card__tags .area-tag,
.area-group__tags .area-tag,
.lpi-service-area .area-tag {
  border-width: 1px;
  border-style: solid;
  border-color: color-mix(in srgb, var(--lpi-hairline) 90%, transparent);
  border-radius: var(--lpi-radius-pill);
  background: color-mix(in srgb, var(--color-surface-2) 55%, var(--color-surface));
  letter-spacing: 0.01em;
  transition: border-color 0.15s, background 0.15s, transform 0.15s, box-shadow 0.15s;
}
.area-tag:hover,
.suburb-chip:hover,
.area-tag:focus-visible,
.suburb-chip:focus-visible {
  border-color: color-mix(in srgb, var(--lpi-amber) 40%, var(--color-border));
  background: color-mix(in srgb, var(--lpi-amber) 10%, var(--color-surface));
  box-shadow: 0 5px 14px -10px rgba(6, 43, 88, 0.35);
  transform: translateY(-1px);
}
.area-tag--hub {
  border-color: color-mix(in srgb, var(--lpi-amber) 42%, var(--color-border));
  background: color-mix(in srgb, var(--lpi-amber) 12%, var(--color-surface));
}
html[data-theme="light"] .area-tag,
html[data-theme="light"] .suburb-chip {
  background: #fff;
  box-shadow: 0 1px 1px rgba(6, 43, 88, 0.03);
}

/* Router chips already strong — only align border longhand to areas chip stroke */
.lpi-router__opt span {
  border-width: 1.5px;
  border-style: solid;
}

/* --- Map-adjacent cards (locations): echo mapcard panel, not map chrome --- */
.location-card {
  border-radius: var(--lpi-radius-xl);
  border-width: 1px;
  border-style: solid;
  border-color: color-mix(in srgb, var(--lpi-hairline) 82%, var(--lpi-navy) 18%);
  background-image: var(--lpi-wash-amber);
  background-color: var(--color-surface);
  box-shadow: var(--lpi-panel-lift-sm);
}
html[data-theme="light"] .location-card {
  background-color: #fff;
}
html[data-theme="dark"] .location-card {
  box-shadow: var(--lpi-inset), 0 14px 32px -22px rgba(0, 0, 0, 0.55);
}
.location-card:hover {
  border-color: color-mix(in srgb, var(--lpi-amber) 28%, var(--color-border));
  transform: translateY(-2px);
}
.location-card__label {
  letter-spacing: 0.14em;
}
.location-card__links a {
  border: 1px solid color-mix(in srgb, var(--lpi-hairline) 85%, transparent);
  padding: 0.35rem 0.85rem;
  font-size: 0.85em;
  font-weight: 600;
}
.location-card__links a:hover,
.location-card__links a:focus-visible {
  border-color: color-mix(in srgb, var(--lpi-amber) 40%, transparent);
  background: color-mix(in srgb, var(--lpi-amber) 10%, var(--color-surface));
}

/* --- Region cards: softer map-adjacent sibling (areas accordion is louder) --- */
.region-card {
  border-radius: var(--lpi-radius-lg);
  border-width: 1px;
  border-style: solid;
  border-color: color-mix(in srgb, var(--lpi-hairline) 85%, var(--lpi-navy) 15%);
  background-image: var(--lpi-wash-amber);
  background-color: var(--color-surface);
}
html[data-theme="light"] .region-card {
  background-color: #fff;
  box-shadow: var(--lpi-panel-lift-sm);
}
.region-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem 0.55rem;
}
.region-card:hover {
  transform: translateY(-2px); /* quieter than prior -4px; areas accordion owns the lift */
}

/* --- Prose / TLDR / contact panels: finder-like soft wash, low opacity --- */
.prose-panel,
.lpi-tldr,
form.lpi-contact-form,
#contact-form,
.contact-form,
.lpi-contact-form {
  background-image: var(--lpi-wash-amber);
}
.prose-panel,
.lpi-tldr {
  border-radius: var(--lpi-radius-lg);
  border-width: 1px;
  border-style: solid;
  border-color: color-mix(in srgb, var(--lpi-hairline) 88%, var(--lpi-navy) 12%);
}
html[data-theme="light"] .prose-panel,
html[data-theme="light"] .lpi-tldr {
  background-color: #fff;
  box-shadow: var(--lpi-panel-lift-sm);
}

/* FAQ sticky index: map-adjacent quiet panel (not open-amber shout) */
.faq-index {
  border-radius: var(--lpi-radius-xl);
  border-width: 1px;
  border-style: solid;
  border-color: color-mix(in srgb, var(--lpi-hairline) 80%, var(--lpi-navy) 20%);
  background-image: var(--lpi-wash-amber);
  background-color: var(--color-surface);
}
html[data-theme="light"] .faq-index {
  background-color: #fff;
  box-shadow: var(--lpi-panel-lift-sm);
}

/* --- Section label register: echo areas eyebrow tracking (bar only in headers) --- */
.section-label,
.hero__eyebrow,
.sa-kicker {
  letter-spacing: 0.14em;
}
/* Quiet amber pip — only beside section headers, never hero, never every label */
.section-header > .section-label::before,
.section__header > .section-label::before {
  content: "";
  display: inline-block;
  width: 1.35rem;
  height: 2px;
  margin-right: 0.55rem;
  vertical-align: 0.15em;
  border-radius: 2px;
  background: color-mix(in srgb, var(--lpi-amber) 88%, var(--lpi-navy));
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--lpi-amber) 12%, transparent);
}

/* --- Locations / service-area bands: whisper sea wash (areas map owns the sea) --- */
.locations,
.lpi-service-area,
section.areas__groups,
.areas__groups {
  background-image: var(--lpi-wash-sea);
}

/* --- Contact info cards: share chip/panel vocabulary lightly --- */
.contact-info__item {
  border-radius: var(--lpi-radius-lg);
  border-width: 1px;
  border-style: solid;
  border-color: var(--lpi-hairline);
  background-image: var(--lpi-wash-amber);
  background-color: var(--color-surface);
}
html[data-theme="light"] .contact-info__item {
  background-color: #fff;
  box-shadow: var(--lpi-panel-lift-sm);
}
.contact-info__icon {
  border-radius: var(--lpi-radius-sm);
  background: color-mix(in srgb, var(--lpi-amber) 14%, var(--color-surface-2));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

/* --- Service cards: keep existing chrome; only soft wash + hairline lock --- */
.service-card {
  background-image: var(--lpi-wash-amber);
  border-color: color-mix(in srgb, var(--lpi-hairline) 88%, var(--lpi-navy) 12%);
}

/* --- Trust strip: quiet amber wash alignment (not new ornament) --- */
.lpi-trust-strip,
.trust-bar {
  border-radius: var(--lpi-radius-xl);
}

/* Reduced motion: kill chip/card micro-lifts from this loop */
@media (prefers-reduced-motion: reduce) {
  .area-tag:hover,
  .suburb-chip:hover,
  .location-card:hover,
  .region-card:hover {
    transform: none;
  }
}

/* ============================================================
   LOOP 6b — REFINEMENT: tone down bolted-on risk
   Quieter amplitude off /areas/; protect hero; no competing bars.
   ============================================================ */

/* Hero stays hero — never inject eyebrow pip on navy plate */
.hero .hero__eyebrow::before,
.hero--dossier .hero__eyebrow::before,
.hero .section-label::before {
  display: none !important;
}

/* Wash even quieter on dense grids so cards don't all glow amber */
.services__grid .service-card,
.features-grid > .service-card,
.features-grid > article {
  background-image: linear-gradient(
    165deg,
    color-mix(in srgb, var(--lpi-amber) 4%, transparent) 0%,
    transparent 36%
  );
}
html[data-theme="dark"] .services__grid .service-card,
html[data-theme="dark"] .features-grid > .service-card,
html[data-theme="dark"] .features-grid > article {
  background-image: linear-gradient(
    165deg,
    color-mix(in srgb, var(--lpi-amber) 5.5%, transparent) 0%,
    transparent 38%
  );
}

/* Locations sea wash: only a top whisper, not a full-section tint */
.locations,
.lpi-service-area {
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--lpi-sea) 3.5%, transparent) 0%,
    transparent 28%
  );
}

/* Contact form: wash only at top edge (finder-like), avoid full-panel amber cast */
form.lpi-contact-form,
#contact-form,
.contact-form,
.lpi-contact-form {
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--lpi-amber) 6%, transparent) 0%,
    transparent 32%
  );
}

/* Prose panels on suburb pages: lighter wash than areas finder */
.prose-panel,
.lpi-tldr {
  background-image: linear-gradient(
    160deg,
    color-mix(in srgb, var(--lpi-amber) 5%, transparent) 0%,
    transparent 40%
  );
}

/* Region card hover stay softer than .sa .area */
.region-card:hover {
  box-shadow: var(--lpi-panel-lift-sm);
  border-color: color-mix(in srgb, var(--lpi-amber) 24%, var(--color-border));
}

/* FAQ open state already has amber tally — don't add wash stacking */
.faq-item[open],
details.faq-item[open] {
  background-image: none;
}

/* Chip default border quieter so hub tags still read as special */
.area-tag:not(.area-tag--hub),
.suburb-chip {
  border-color: color-mix(in srgb, var(--color-border) 92%, var(--lpi-navy) 8%);
}

/* Don't force white chip fill on dark theme */
html[data-theme="dark"] .area-tag,
html[data-theme="dark"] .suburb-chip {
  background: color-mix(in srgb, var(--color-surface-2) 70%, var(--color-surface));
  box-shadow: none;
}

/* ============================================================
   LPI UI rollout 2026-09-29 (owner-ruled, HANDOVER-2026-09-29-ui-rollout.md)
   Loads LAST on every static page. One file = one-line rollback.
   Visual only: no copy, headings or source order change here.
   ============================================================ */

/* ---------- E15 · one gutter: logo, hero text and body content share an edge ---------- */
.header__inner { padding-inline: clamp(var(--space-4), 5vw, var(--space-8)); }
@media (min-width: 769px) {
  .hero--dossier .hero__content {
    margin-left: max(0px, calc((100% - var(--content-wide)) / 2));
    padding-left: clamp(var(--space-4), 5vw, var(--space-8));
  }
}

/* ---------- E04 · desktop header call button (gold fill, navy text) ---------- */
.header__call { display: none; }
@media (min-width: 1024px) {
  .header__nav .header__call {
    display: inline-flex; align-items: center; gap: .45rem;
    padding: .55rem 1rem; border-radius: var(--radius-full);
    background: var(--color-accent); color: var(--lpi-navy) !important;
    font-weight: 700; font-size: var(--text-sm); line-height: 1; white-space: nowrap;
    text-decoration: none; box-shadow: 0 6px 18px -8px rgba(255,190,1,.55);
    transition: transform var(--transition-interactive), box-shadow var(--transition-interactive);
  }
  .header__nav .header__call::after { display: none !important; }
  .header__nav .header__call:hover { transform: translateY(-1px); box-shadow: 0 10px 24px -8px rgba(255,190,1,.7); }
  .header__nav .header__call:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
  .header__nav .header__call svg { width: 16px; height: 16px; flex: none; }
  .header__nav { gap: clamp(var(--space-4), 1.9vw, var(--space-8)); }
}
/* space is short below 1280: the in-page "Locations" anchor goes (Areas + footer still carry it) */
@media (min-width: 1024px) and (max-width: 1279.98px) {
  .header__nav > a[href="/#locations"] { display: none; }
}

/* ---------- E01 · footer stacks: 1 col < 640, 2 cols 640–960 ---------- */
.footer .footer__grid > * { min-width: 0; }
.footer a[href^="mailto:"] { overflow-wrap: anywhere; }
@media (max-width: 639.98px) {
  .footer .footer__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-8); }
}
@media (min-width: 640px) and (max-width: 960px) {
  .footer .footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-10); }
}

/* ---------- E13 · no UA-default link colours: inherit the site's inline-link register ---------- */
.about__text a:not(.btn), .section-desc a:not(.btn), .faq-item__answer a:not(.btn),
.trust-item a:not(.btn), .cta-banner__inner p a:not(.btn), .answer-block a:not(.btn) {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--color-accent) 45%, transparent);
  text-decoration-thickness: 1px;
  text-underline-offset: .15em;
}
.about__text a:not(.btn):hover, .section-desc a:not(.btn):hover, .faq-item__answer a:not(.btn):hover,
.trust-item a:not(.btn):hover, .cta-banner__inner p a:not(.btn):hover { color: var(--color-accent); text-decoration-color: currentColor; }
.section-label a { color: inherit; text-decoration: underline dotted; text-underline-offset: .2em; }
.header__inner > a { color: inherit; }
.faq-item__question a { color: inherit; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--color-accent) 45%, transparent); text-underline-offset: .15em; }

/* ---------- E16 · magnifier back-to-top: clear of the call bar, hidden while the footer is on screen (mobile) ---------- */
@media (max-width: 768px) {
  body:has(.lpi-callbar) .lens-top { bottom: calc(88px + env(safe-area-inset-bottom, 0px)); }
  .lens-top.show.at-foot { opacity: 0; transform: translateY(14px); pointer-events: none; }
}

/* ---------- E08 · no orphan card: a lone last card spans the row ---------- */
@media (min-width: 900px) {
  .prose-card-grid:not(.prose-card-grid--2) > :last-child:nth-child(3n+1) { grid-column: 1 / -1; }
  .prose-card-grid--2 > :last-child:nth-child(2n+1) { grid-column: 1 / -1; }
}

/* ---------- E07 · /faq/: one reading column + sticky topic index; <details> unchanged ---------- */
.faq-index { display: none; }
@media (min-width: 1100px) {
  .lpi__post-body:has(> .faq-index) {
    display: grid; grid-template-columns: 220px minmax(0, 780px); column-gap: clamp(2rem, 4vw, 4rem);
    justify-content: center; align-items: start; max-width: none;
  }
  .lpi__shell:has(.faq-index), .lpi__shell:has(.faq-index) .hentry { max-width: none; }
  .lpi__post-body:has(> .faq-index) > :not(.faq-index) { grid-column: 2; min-width: 0; max-width: 100%; }
  .lpi__post-body:has(> .faq-index) > section > .container { max-width: 100%; padding-inline: 0; }
  .lpi__post-body > .faq-index {
    display: block; grid-column: 1; grid-row: 1 / span 40; position: sticky; top: 108px; align-self: start;
    padding: 1.25rem 1.25rem 1.1rem; border: 1px solid var(--color-border); border-radius: var(--radius-lg);
    background: var(--color-surface); margin-top: var(--space-10);
  }
  .faq-index p { font: 700 var(--text-xs)/1 var(--font-body); letter-spacing: .14em; text-transform: uppercase; color: var(--color-text-muted); margin: 0 0 .9rem; }
  .faq-index ol { list-style: none; margin: 0; padding: 0; display: grid; gap: .15rem; counter-reset: fi; }
  .faq-index li { counter-increment: fi; }
  .faq-index a { display: flex; gap: .6rem; padding: .5rem .6rem; border-radius: var(--radius-md); color: var(--color-text); text-decoration: none; font-weight: 600; font-size: var(--text-sm); }
  .faq-index a::before { content: counter(fi, decimal-leading-zero); color: var(--color-accent); font-variant-numeric: tabular-nums; }
  .faq-index a:hover, .faq-index a:focus-visible { background: color-mix(in srgb, var(--color-accent) 12%, transparent); }
  .lpi__post-body:has(> .faq-index) .features-grid { grid-template-columns: minmax(0, 1fr) !important; }
  .lpi__post-body:has(> .faq-index) h2[id], .lpi__post-body:has(> .faq-index) [id="faq-more"] { scroll-margin-top: 110px; }
}

/* ============================================================
   WAVE 2 (owner-approved 2026-09-29)
   ============================================================ */

/* ---------- E02 · home hero: 7/5 grid, balanced H1, solid dossier card (no live backdrop-filter) ---------- */
.hero__lede, .hero__dossier { min-width: 0; }
@media (min-width: 1024px) {
  .hero--dossier .hero__content:has(> .hero__lede) {
    display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: clamp(2rem, 4vw, 4.5rem);
    align-items: center; max-width: var(--content-wide); width: 100%;
    margin-inline: auto; padding-inline: clamp(var(--space-4), 5vw, var(--space-8));
    padding-block: clamp(6.5rem, 12vh, 8.5rem) clamp(3rem, 7vh, 5rem);
  }
  .hero--dossier .hero__lede h1 {
    font-size: clamp(2.6rem, 3.6vw, 4.1rem); text-wrap: balance; max-inline-size: 21ch; max-width: 21ch;
    line-height: 1.04; margin-bottom: var(--space-6);
  }
  .hero--dossier .hero__lede h1 br { display: none; }
  .hero--dossier .hero__lede h1 .hero__accent { display: inline; }
  .hero--dossier .hero__lede h1 .hero__accent::before { content: " "; }
  .hero--dossier .hero__lede .answer-block { max-width: 56ch; }
  .hero__dossier {
    position: relative; padding: clamp(1.5rem, 2.4vw, 2.25rem);
    background: linear-gradient(180deg, var(--lpi-navy-mid) 0%, var(--lpi-navy-deep) 100%);
    border: 1px solid rgba(255,255,255,.12); border-radius: 20px;
    box-shadow: 0 30px 60px -30px rgba(0,0,0,.65), inset 0 1px 0 rgba(255,255,255,.08);
  }
  .hero__dossier::before {                      /* index tab, same hairline gold as the kicker */
    content: ""; position: absolute; left: clamp(1.5rem, 2.4vw, 2.25rem); top: 0; width: 56px; height: 3px;
    background: linear-gradient(90deg, var(--color-accent), rgba(255,190,1,.15)); border-radius: 0 0 3px 3px;
  }
  .hero__dossier .hero__facts { display: grid; grid-template-columns: 1fr; gap: 0; margin: 0 0 var(--space-6); }
  .hero__dossier .hero__fact { padding: .9rem 0; border-bottom: 1px solid rgba(255,255,255,.1); background: none; border-radius: 0; }
  .hero__dossier .hero__fact:first-child { padding-top: 0; }
  .hero__dossier .hero__fact dt { color: rgba(255,255,255,.62); }
  .hero__dossier .hero__ctas { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; width: 100%; }
  .hero__dossier .hero__ctas .btn { justify-content: center; width: 100%; white-space: nowrap; padding-inline: 1rem; }
  .hero__dossier .hero__proof { margin-top: var(--space-5); }
  .hero--dossier:has(.hero__dossier) .hero__plate { opacity: .55; }
}
@media (min-width: 1024px) and (max-width: 1279.98px) {
  .hero__dossier .hero__ctas { grid-template-columns: 1fr; }
}

/* ---------- E05 · "Why choose": credential ledger (every heading + word kept; icons retired) ---------- */
#why-us .why__grid {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; max-width: 980px; margin-inline: auto;
  border-top: 1px solid var(--color-border);
}
#why-us .why-card {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: .35rem; padding: 1.35rem 0;
  background: none; border: 0; border-bottom: 1px solid var(--color-border); border-radius: 0; box-shadow: none; text-align: left;
}
#why-us .why-card__icon { display: none; }
#why-us .why-card h3 { margin: 0; font-size: var(--text-base); display: flex; gap: .85rem; align-items: baseline; }
#why-us .why-card h3::before {
  content: ""; flex: none; width: .55rem; height: .55rem; border-radius: 2px; transform: translateY(-.1em) rotate(45deg);
  background: var(--color-accent);
}
#why-us .why-card p { margin: 0; color: var(--color-text-muted); }
#why-us .why-card:hover { transform: none; box-shadow: none; }
@media (min-width: 820px) {
  #why-us .why-card { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: clamp(1.5rem, 4vw, 3.5rem); padding: 1.6rem .25rem; }
}

/* ---------- E06 · intent router (links only; CSS :has() reveal, no script) ---------- */
.lpi-router { padding-block: clamp(2.5rem, 5vw, 4rem); }
.lpi-router__inner { max-width: 980px; margin-inline: auto; }
.lpi-router__q { font: 800 var(--text-xl)/1.15 var(--font-display); color: var(--color-text); margin: 0 0 1.1rem; text-align: center; }
.lpi-router__opts { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; border: 0; margin: 0; padding: 0; }
.lpi-router__opts legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.lpi-router__opt { position: relative; }
.lpi-router__opt input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.lpi-router__opt span {
  display: inline-flex; align-items: center; gap: .5rem; padding: .7rem 1.15rem; border-radius: var(--radius-full);
  border: 1px solid var(--color-border); background: var(--color-surface); color: var(--color-text); font-weight: 600;
  transition: border-color var(--transition-interactive), background var(--transition-interactive);
}
.lpi-router__opt span::before { content: ""; width: .7rem; height: .7rem; border-radius: 50%; border: 2px solid var(--color-text-muted); flex: none; }
.lpi-router__opt input:checked + span { border-color: var(--color-accent); background: color-mix(in srgb, var(--color-accent) 12%, var(--color-surface)); }
.lpi-router__opt input:checked + span::before { border-color: var(--color-accent); background: var(--color-accent); box-shadow: inset 0 0 0 2px var(--color-surface); }
.lpi-router__opt input:focus-visible + span { outline: 3px solid var(--color-accent); outline-offset: 2px; }
.lpi-router__ans { margin-top: 1rem; }
.lpi-router__a {
  display: none; max-width: 680px; margin: 0 auto; padding: 1rem 1.25rem; border-radius: var(--radius-lg);
  border: 1px solid var(--color-border); background: var(--color-surface); text-align: center; color: var(--color-text-muted);
}
.lpi-router__a a { color: var(--color-text); font-weight: 700; text-decoration: underline; text-decoration-color: var(--color-accent); text-underline-offset: .18em; white-space: nowrap; }
.lpi-router__hint { text-align: center; color: var(--color-text-muted); font-size: var(--text-sm); margin: 0; }
.lpi-router:has(input:checked) .lpi-router__hint { display: none; }
.lpi-router:has(#lr-letter:checked) .lpi-router__a--letter,
.lpi-router:has(#lr-sell:checked) .lpi-router__a--sell,
.lpi-router:has(#lr-fail:checked) .lpi-router__a--fail { display: block; }
@supports not selector(:has(*)) { .lpi-router__a { display: block; margin-bottom: .6rem; } .lpi-router__hint { display: none; } }

/* ---------- E12 · services mega-panel (static links; hover / focus-within reveal) ---------- */
.nav-mega { position: relative; display: inline-flex; align-items: center; }
.nav-mega__panel { display: none; }
@media (min-width: 769px) {
  .nav-mega__panel {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .15rem 1.25rem;
    position: absolute; top: calc(100% + 14px); left: 50%; width: min(560px, 80vw);
    padding: 1.1rem 1.2rem; border-radius: 16px; z-index: 60;
    background: var(--color-surface); border: 1px solid var(--color-border);
    box-shadow: 0 28px 60px -24px rgba(2,21,45,.55);
    opacity: 0; visibility: hidden; transform: translate(-50%, 6px);
    transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
  }
  .nav-mega__panel::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
  .nav-mega:hover .nav-mega__panel, .nav-mega:focus-within .nav-mega__panel {
    opacity: 1; visibility: visible; transform: translate(-50%, 0); transition-delay: 0s;
  }
  .header__nav .nav-mega__panel a {
    display: block; padding: .5rem .6rem; border-radius: var(--radius-md);
    color: var(--color-text) !important; font-size: var(--text-sm); font-weight: 600; line-height: 1.3; text-shadow: none;
  }
  .header__nav .nav-mega__panel a::after { display: none !important; }
  .header__nav .nav-mega__panel a:hover, .header__nav .nav-mega__panel a:focus-visible { background: color-mix(in srgb, var(--color-accent) 14%, transparent); }
  .nav-mega__panel .nav-mega__all { grid-column: 1 / -1; margin-top: .35rem; border-top: 1px solid var(--color-border); padding-top: .6rem; }
  .nav-mega > a::before { content: ""; }
}
@media (prefers-reduced-motion: reduce) { .nav-mega__panel { transition: none; } }

/* ---------- E10 · non-conformance: pass/fail tiles (glyph + words, never colour alone) ---------- */
.lpi-issue-tiles .features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.25rem; }
.lpi-issue-tiles .feature-list { list-style: none; margin: .75rem 0 0; padding: 0; display: grid; gap: .55rem; }
.lpi-issue-tiles .feature-list li {
  position: relative; display: grid; grid-template-columns: auto 1fr; gap: .7rem; align-items: start;
  padding: .75rem .85rem; border-radius: var(--radius-md); border: 1px solid var(--color-border);
  background: color-mix(in srgb, var(--color-error, #d64545) 6%, var(--color-surface));
}
.lpi-issue-tiles .feature-list li::before {
  content: "\2715"; display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%;
  font-size: .8rem; font-weight: 800; color: #fff; background: var(--color-error, #c53030); margin: 0; position: static;
}


/* ---------- E11 · cost page: covered / outside the $250 ---------- */
.lpi-inout { width: 100%; max-width: 820px; margin: 0 auto var(--space-8); border-collapse: separate; border-spacing: 0; border: 1px solid var(--color-border); border-radius: var(--radius-lg); overflow: hidden; background: var(--color-surface); }
.lpi-inout caption { caption-side: top; text-align: left; font: 700 var(--text-sm)/1.2 var(--font-body); letter-spacing: .08em; text-transform: uppercase; color: var(--color-text-muted); padding: 0 0 .7rem; }
.lpi-inout th, .lpi-inout td { padding: .8rem 1rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--color-border); color: var(--color-text); }
.lpi-inout thead th { font: 800 var(--text-base)/1.2 var(--font-display); background: color-mix(in srgb, var(--color-primary) 8%, var(--color-surface)); }
.lpi-inout tr:last-child td { border-bottom: 0; }
.lpi-inout td + td, .lpi-inout th + th { border-left: 1px solid var(--color-border); }
.lpi-inout .in::before, .lpi-inout .out::before { display: inline-grid; place-items: center; width: 1.3rem; height: 1.3rem; border-radius: 50%; margin-right: .55rem; font-size: .72rem; font-weight: 800; }
.lpi-inout .in::before { content: "\2713"; background: var(--color-success, #1f8a4c); color: #fff; }
.lpi-inout .out::before { content: "\2715"; background: var(--color-text-muted); color: var(--color-surface); }
@media (max-width: 560px) { .lpi-inout th, .lpi-inout td { padding: .65rem .7rem; font-size: var(--text-sm); } }

/* ---------- service-area map: site integration (component CSS lives in /assets/lpi-areas.css) ---------- */
.sa { max-width: none; margin: 0; padding: clamp(48px, 6vw, 88px) 0 clamp(28px, 4vw, 40px); background: var(--color-bg); color: var(--color-text); }
.sa, [data-theme="dark"] .sa { --bg: var(--color-bg); --surface: var(--color-surface); --border: var(--color-border); --text: var(--color-text); --muted: var(--color-text-muted); }
.sa .sa-kicker { font: 800 clamp(30px, 4vw, 46px)/1.08 var(--font-display); color: var(--text); margin: 14px 0; letter-spacing: -.01em; max-width: 16ch; }
.sa .grp { margin: 1rem 0 .4rem; }
.lpi-region:not(:has(.lpi-region__map)) { display: block; }
.lpi-region:not(:has(.lpi-region__map)) .lpi-region__text { max-width: 820px; margin-inline: auto; }

/* E01 (acceptance: page width = screen width at 360/390) · home contact block was the second overflow under the footer's */
.contact__grid > *, .contact-info, .contact-info__item, .contact-info__item > * { min-width: 0; }
.contact-info__item { overflow-wrap: anywhere; }
.contact-info img { max-width: 100%; height: auto; }
.contact-form, .form-grid, .form-group { min-width: 0; }
.form-group input, .form-group select, .form-group textarea { max-width: 100%; min-width: 0; box-sizing: border-box; }

/* ---------- Post-audit fixes, re-measured against Grok loop 5 (Claude, 2026-09-29) ----------
   Measured on the loop-5 CSS without fixes: Grok already fixed the light hero answer block (12-14:1), the light call bar
   (12.4:1), the 820px logo gap (76-85px) and the service-card links. Still failing, so re-applied: the footer description
   (1.73:1 muted slate on the navy footer) and the TL;DR inline links (UA blue #0000EE, 22 suburb pages). */
.footer__desc,
html[data-theme="light"] .footer__desc {
  color: rgba(255, 255, 255, 0.72);
}

/* TL;DR inline links: brand colour + underline (never colour alone) instead of the browser default blue. */
.lpi-tldr a:not(.btn) {
  text-decoration: underline;
  text-underline-offset: 2px;
}
html[data-theme="dark"] .lpi-tldr a:not(.btn) { color: var(--lpi-amber); }
html[data-theme="light"] .lpi-tldr a:not(.btn) { color: var(--lpi-navy); }

/* ---------- OWNER 2026-09-29 · footer Services list: every link stays in the HTML, set compact and quiet ----------
   Anchored on the list that carries the "All services" hub link. Smaller type, tighter rows, two columns where
   they fit; colours inherit the footer link colour (measured >= 4.5:1 in both themes). */
.footer .footer__grid > div:has(> .footer__links a[href="/services/"]) .footer__links {
  display: block;
  columns: 2 9.5rem;
  column-gap: 1.5rem;
}
.footer .footer__grid > div:has(> .footer__links a[href="/services/"]) .footer__links li {
  break-inside: avoid;
  margin: 0;
  padding: 0;
}
.footer .footer__grid > div:has(> .footer__links a[href="/services/"]) .footer__links a {
  display: inline-block;
  padding: 0.2rem 0;
  font-size: 0.875rem;
  line-height: 1.4;
}
@media (min-width: 1025px) {
  .footer .footer__grid {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.85fr) minmax(0, 1.1fr) minmax(0, 1.3fr);
  }
}

/* ---------- Loop 6 regression fix (Claude, 2026-09-29) ----------
   The Loop 6 chip wash gave every .area-tag a dark surface in dark theme, but .area-tag--victoria keeps the base
   navy text, so the home "Looking for a pool inspector near me?" H2 measured 1.07:1. Restore Loop 5's amber chip. */
html[data-theme="dark"] .area-tag--victoria,
html[data-theme="dark"] .area-tag--victoria:hover {
  background: var(--lpi-amber, #ffbe01);
  border-color: var(--lpi-amber, #ffbe01);
  color: #0d1b2a;
}

/* Suburb-page hero eyebrow link (pre-existing on live): browser-default blue #0000EE on the navy hero, about 2:1.
   Match the eyebrow text colour; keep the underline so it still reads as a link. */
.hero__eyebrow a:not(.btn) {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: var(--lpi-amber, #ffbe01);
  text-underline-offset: 3px;
}

/* ---------- OWNER review note #12 (2026-09-29): theme toggle on mobile ---------- */
.theme-toggle--mobile { display: none; }
@media (max-width: 768px) {
  .header .theme-toggle--mobile { display: flex; margin-inline-start: auto; margin-inline-end: 8px; }
}

/* =====================================================================
   OWNER DESIGN NOTES 2026-09-29 (Claude premium-design round)
   #1 router · #2a logo plate · #2b button system · #3 why-us grid · #4/#11 CTA card
   #5 stat icons · #6 areas collapse + councils · #7 about chips · #10 contact areas
   Layout/restyle only: every word, heading and link stays in the DOM.
   ===================================================================== */

/* ---------- #2a Logo (THEMELOGO round, owner 2026-09-29 evening): the plate is withdrawn. ----------
   The live logo is a sticker mark (white letters in a heavy navy keyline). It reads on every surface this site has:
   the keyline melts into the navy hero/footer and the dark-theme bars, and gives the letters their edge on the light
   scrolled bar and the light menu. Recolour variants were trialled and rejected (shots-themelogo/rejected-logo-recolour-trial.png).
   Height is fixed and aspect-ratio pinned to the 266x88 artwork so there is no shift while it loads. */
.header__logo,
.footer__logo {
  box-sizing: content-box;
  display: block;
  height: 42px;
  width: auto;
  aspect-ratio: 266 / 88;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.footer__logo { height: 44px; }
@media (max-width: 480px) {
  .header__logo { height: 36px; padding: 0; border-radius: 0; }
}

/* ---------- #2b Premium button system (applied through the existing .btn classes) ---------- */
.btn,
a.btn,
button.btn {
  --btn-h: 3rem;
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  min-height: var(--btn-h);
  padding: 0.7rem 1.45rem;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.01em;
  text-decoration: none;
  white-space: normal;
  text-align: center;
  overflow: hidden;
  transition: transform 180ms var(--lpi-ease), box-shadow 220ms var(--lpi-ease),
              background-color 180ms var(--lpi-ease), border-color 180ms var(--lpi-ease), color 180ms var(--lpi-ease);
}
.btn-lg, .btn.btn-lg { --btn-h: 3.35rem; padding: 0.8rem 1.75rem; font-size: 1.05rem; }
/* sheen: a soft highlight that sweeps on hover (decorative, no text) */
.btn::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, 0.28) 48%, transparent 66%);
  transform: translateX(-120%);
  transition: transform 520ms var(--lpi-ease);
  pointer-events: none;
}
.btn:hover::after { transform: translateX(120%); }
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0) scale(0.985); transition-duration: 60ms; }
.btn:focus-visible {
  outline: 3px solid var(--lpi-amber);
  outline-offset: 3px;
  box-shadow: 0 0 0 6px rgba(6, 43, 88, 0.45);
}
.btn svg { width: 1.1em; height: 1.1em; flex: none; }

/* Primary: amber, navy label (8.4:1) */
.btn--primary,
.btn-primary,
.cta-section p .btn-white:first-child,
.cta-section p .btn-white:only-child {
  background: linear-gradient(180deg, #ffcf3d 0%, #ffbe01 55%, #f5b200 100%) !important;
  color: var(--lpi-navy) !important;
  border: 1px solid #e0a800 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 1px 1px rgba(6, 43, 88, 0.12),
              0 10px 24px -12px rgba(255, 170, 0, 0.75);
}
.btn--primary:hover,
.btn-primary:hover,
.cta-section p .btn-white:first-child:hover,
.cta-section p .btn-white:only-child:hover {
  background: linear-gradient(180deg, #ffd65c 0%, #ffc414 55%, #ffb800 100%) !important;
  color: var(--lpi-navy) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6), 0 2px 3px rgba(6, 43, 88, 0.14),
              0 16px 30px -12px rgba(255, 170, 0, 0.85);
}

/* Solid navy (forms, light surfaces): white label */
.btn--dark {
  background: linear-gradient(180deg, var(--lpi-navy-mid) 0%, var(--lpi-navy) 100%);
  color: #fff;
  border: 1px solid var(--lpi-navy-deep);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 10px 24px -12px rgba(6, 43, 88, 0.6);
}
.btn--dark:hover { background: linear-gradient(180deg, color-mix(in srgb, var(--lpi-navy-mid) 70%, #fff 30%) 0%, var(--lpi-navy-mid) 100%); color: #fff; }
html[data-theme="dark"] .btn--dark {
  background: linear-gradient(180deg, color-mix(in srgb, var(--lpi-navy-mid) 55%, #5b9bd5 45%) 0%, color-mix(in srgb, var(--lpi-navy) 40%, #5b9bd5 60%) 100%);
  border-color: rgba(255, 255, 255, 0.16);
}
html[data-theme="dark"] .btn--dark:hover { background: linear-gradient(180deg, color-mix(in srgb, var(--lpi-navy-mid) 40%, #79b0e2 60%) 0%, color-mix(in srgb, var(--lpi-navy-mid) 55%, #5b9bd5 45%) 100%); }

/* Outline on dark (hero, CTA bands): frosted glass, white label */
.btn--outline,
.cta-section p .btn-white:last-child:not(:only-child) {
  background: rgba(255, 255, 255, 0.06) !important;
  color: #fff !important;
  border: 1.5px solid rgba(255, 255, 255, 0.5) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}
.btn--outline:hover,
.cta-section p .btn-white:last-child:not(:only-child):hover {
  background: rgba(255, 255, 255, 0.16) !important;
  border-color: #fff !important;
  color: #fff !important;
}

/* Amber outline (secondary on dark bands) */
.btn--accent-outline {
  background: rgba(255, 190, 1, 0.06);
  color: var(--lpi-amber);
  border: 1.5px solid var(--lpi-amber);
}
.btn--accent-outline:hover { background: var(--lpi-amber); color: var(--lpi-navy); }
.btn--accent-outline::after { background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, 0.18) 48%, transparent 66%); }

/* CTA band button row: consistent gap, wraps cleanly */
.cta-section p:has(> .btn) { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.75rem; margin-bottom: 0; }
@media (max-width: 560px) {
  .cta-section p:has(> .btn) .btn { flex: 1 1 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .btn, .btn::after { transition: none; }
  .btn:hover { transform: none; }
  .btn:hover::after { transform: translateX(-120%); }
}

/* ---------- #4 / #11 CTA card: tighter, left-aligned, compact ---------- */
.cta-section { padding: clamp(1.4rem, 3.2vw, 2.25rem) clamp(1.15rem, 3.5vw, 2.5rem) !important; }
.cta-section .container {
  display: grid;
  gap: 0.6rem 2rem;
  max-width: 1040px;
  text-align: left;
  padding-inline: 0 !important;
}
.cta-section h2 {
  margin: 0;
  font-size: clamp(1.35rem, 1.1rem + 1.1vw, 1.8rem) !important;
  line-height: 1.15;
  letter-spacing: -0.015em;
  text-align: left;
}
.cta-section h2::after {
  content: "";
  display: block;
  width: 44px;
  height: 3px;
  margin-top: 0.6rem;
  border-radius: 3px;
  background: var(--lpi-amber);
}
.cta-section .container > p:not(:has(.btn)) {
  margin: 0;
  max-width: 60ch;
  font-size: 1rem;
  line-height: 1.55;
  text-align: left;
}
.cta-section .container > p:has(.btn) { justify-content: flex-start; margin-top: 0.35rem; }
@media (min-width: 900px) {
  .cta-section .container:has(> p > .btn) {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }
  .cta-section .container:has(> p > .btn) > h2,
  .cta-section .container:has(> p > .btn) > p:not(:has(.btn)) { grid-column: 1; }
  .cta-section .container:has(> p > .btn) > p:has(.btn) {
    grid-column: 2; grid-row: 1 / span 2; margin: 0; flex-wrap: nowrap;
  }
}

/* ---------- #3 About #why-us: an even 2 + 3 bento, no orphans ---------- */
#why-us .lpi-why-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
}
#why-us .lpi-why-grid .why-card {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  padding: clamp(1.2rem, 2.2vw, 1.6rem) !important;
  border: 1px solid var(--lpi-hairline);
  border-radius: var(--lpi-radius-lg);
  background: var(--color-surface);
  box-shadow: var(--lpi-lift-dark);
}
html[data-theme="light"] #why-us .lpi-why-grid .why-card { background: #fff; box-shadow: var(--lpi-lift); }
#why-us .lpi-why-grid .why-card::before {
  content: ""; position: absolute; top: 0; left: 1.4rem; width: 44px; height: 3px;
  border-radius: 0 0 3px 3px; background: var(--lpi-amber);
}
#why-us .lpi-why-grid .why-card__icon {
  display: inline-flex;
  width: 2.75rem; height: 2.75rem; margin: 0;
  border-radius: 14px;
  color: var(--lpi-amber);
  background: linear-gradient(145deg, var(--lpi-navy-mid), var(--lpi-navy));
  box-shadow: inset 0 0 0 1px rgba(255, 190, 1, 0.3);
}
#why-us .lpi-why-grid .why-card__icon svg { width: 1.35rem; height: 1.35rem; stroke: currentColor; }
#why-us .lpi-why-grid .why-card h3 { display: block; margin: 0; font-size: 1.15rem; line-height: 1.25; }
#why-us .lpi-why-grid .why-card h3::before { content: none; display: none; }
#why-us .lpi-why-grid .why-card p { margin: 0; color: var(--color-text-muted); line-height: 1.6; }
@media (min-width: 700px) {
  #why-us .lpi-why-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #why-us .lpi-why-grid .why-card:last-child { grid-column: 1 / -1; }
}
@media (min-width: 1024px) {
  #why-us .lpi-why-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1.1rem; }
  #why-us .lpi-why-grid .why-card { grid-column: span 2; }
  #why-us .lpi-why-grid .why-card:nth-child(-n+2) { grid-column: span 3; }
  #why-us .lpi-why-grid .why-card:last-child { grid-column: span 2; }
}

/* ---------- #1 Home router: three premium path cards ---------- */
.lpi-router--paths .lpi-router__inner { max-width: 1120px; }
.lpi-router--paths .lpi-router__head { text-align: center; margin-bottom: clamp(1.25rem, 3vw, 2rem); }
.lpi-router--paths .lpi-router__q { margin: 0 0 0.4rem; font-size: clamp(1.5rem, 1.2rem + 1.4vw, 2.1rem); }
.lpi-router--paths .lpi-router__hint { display: block; margin: 0; font-size: 1rem; color: var(--color-text-muted); }
.lpi-router__paths {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: 1rem;
  grid-template-columns: minmax(0, 1fr);
}
@media (min-width: 820px) { .lpi-router__paths { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.15rem; } }
.lpi-path {
  position: relative;
  display: flex; flex-direction: column; gap: 0.55rem;
  padding: 1.35rem 1.35rem 1.2rem;
  border-radius: var(--lpi-radius-lg);
  border: 1px solid var(--lpi-hairline);
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(255, 190, 1, 0.10), transparent 55%),
    var(--color-surface);
  box-shadow: var(--lpi-lift-dark);
  transition: transform 220ms var(--lpi-ease), border-color 220ms var(--lpi-ease), box-shadow 220ms var(--lpi-ease);
}
html[data-theme="light"] .lpi-path {
  background: radial-gradient(120% 90% at 100% 0%, rgba(255, 190, 1, 0.12), transparent 55%), #fff;
  box-shadow: var(--lpi-lift);
}
.lpi-path::before {
  content: ""; position: absolute; left: 1.35rem; top: 0; width: 44px; height: 3px;
  border-radius: 0 0 3px 3px; background: var(--lpi-amber);
}
.lpi-path:hover, .lpi-path:focus-within {
  transform: translateY(-3px);
  border-color: color-mix(in srgb, var(--lpi-amber) 55%, var(--color-border));
  box-shadow: 0 18px 40px -20px rgba(6, 43, 88, 0.55);
}
.lpi-path__icon { width: 56px; height: 56px; margin-bottom: 0.2rem; }
.lpi-path__opt { margin: 0; font: 800 1.2rem/1.25 var(--font-display); color: var(--color-text); letter-spacing: -0.01em; }
.lpi-path__ans { margin: 0; color: var(--color-text-muted); line-height: 1.55; flex: 1; }
.lpi-path__link {
  display: inline-flex; align-items: center; gap: 0.4rem;
  min-height: 44px; margin-top: 0.35rem;
  font-weight: 700; color: var(--color-text);
  text-decoration: underline; text-decoration-color: var(--lpi-amber);
  text-decoration-thickness: 2px; text-underline-offset: 0.28em;
}
html[data-theme="light"] .lpi-path__link { color: var(--lpi-navy); }
.lpi-path__link span { transition: transform 200ms var(--lpi-ease); }
.lpi-path:hover .lpi-path__link span { transform: translateX(4px); }
/* the whole card is the link's hit area; the link text stays the accessible name */
.lpi-path__link::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.lpi-path__link:focus-visible { outline: none; }
.lpi-path:has(.lpi-path__link:focus-visible) { outline: 3px solid var(--lpi-amber); outline-offset: 3px; }
@media (max-width: 819px) {
  .lpi-path { display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 0.9rem; row-gap: 0.35rem; padding: 1.1rem; }
  .lpi-path__icon { width: 48px; height: 48px; grid-row: 1 / span 3; margin: 0; }
}
@media (prefers-reduced-motion: reduce) { .lpi-path, .lpi-path__link span { transition: none; } .lpi-path:hover { transform: none; } }

/* ---------- #5 Home #about: three icon stat cards ---------- */
#about .about__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.85rem; }
#about .about__stats > * {
  display: flex; flex-direction: column; align-items: flex-start; gap: 0.35rem;
  padding: 1rem 1rem 1.05rem;
  border-radius: var(--lpi-radius-lg);
  border: 1px solid var(--lpi-hairline);
  background: radial-gradient(120% 90% at 100% 0%, rgba(255, 190, 1, 0.10), transparent 60%), var(--color-surface);
}
html[data-theme="light"] #about .about__stats > * { background: radial-gradient(120% 90% at 100% 0%, rgba(255, 190, 1, 0.12), transparent 60%), #fff; }
#about .stat__icon { width: 44px; height: 44px; margin-bottom: 0.25rem; }
#about .stat__number { font-size: clamp(1.25rem, 1.05rem + 0.8vw, 1.6rem); line-height: 1.1; }
#about .stat__label { margin: 0; font-size: 0.875rem; line-height: 1.35; }
@media (max-width: 520px) {
  #about .about__stats { grid-template-columns: minmax(0, 1fr); gap: 0.6rem; }
  #about .about__stats > * {
    display: grid; grid-template-columns: 44px minmax(0, 1fr); column-gap: 0.9rem; row-gap: 0.1rem;
    align-items: center; padding: 0.8rem 0.95rem;
  }
  #about .stat__icon { grid-row: 1 / span 2; margin: 0; }
  #about .stat__number { align-self: end; }
  #about .stat__label { align-self: start; }
}

/* ---------- #6 Home #areas: collapsed suburb lists + councils first ---------- */
.region-card__suburbs { margin: 0.35rem 0 0.25rem; border-top: 1px solid var(--lpi-hairline); }
.region-card__suburbs-sum {
  display: flex; align-items: center; justify-content: space-between; gap: 0.75rem;
  min-height: 44px; padding: 0.55rem 0.15rem;
  cursor: pointer; list-style: none;
  font-weight: 700; font-size: 0.95rem; color: var(--color-text);
}
.region-card__suburbs-sum::-webkit-details-marker { display: none; }
.region-card__suburbs-sum::after {
  content: ""; flex: none; width: 0.55rem; height: 0.55rem; margin-right: 0.35rem;
  border-right: 2px solid var(--lpi-amber); border-bottom: 2px solid var(--lpi-amber);
  transform: rotate(45deg) translateY(-2px); transition: transform 200ms var(--lpi-ease);
}
.region-card__suburbs[open] > .region-card__suburbs-sum::after { transform: rotate(-135deg) translateY(-2px); }
.region-card__suburbs-sum:hover { color: color-mix(in srgb, var(--color-text) 75%, var(--lpi-amber) 25%); }
.region-card__suburbs-body { padding: 0.25rem 0 0.5rem; }
.region-card__suburbs-body .region-card__tags { margin: 0; }
.region-card__suburbs-body .region-card__more-toggle,
.region-card__suburbs-body .region-card__more { margin-top: 0.6rem; }
#areas .region-card { gap: 0.5rem; }

.region-guides--councils {
  margin: 0 0 clamp(1.25rem, 3vw, 2rem);
  padding: clamp(1.15rem, 2.5vw, 1.6rem);
  border-radius: var(--lpi-radius-xl);
  border: 1px solid color-mix(in srgb, var(--lpi-amber) 35%, var(--lpi-hairline));
  background: radial-gradient(90% 120% at 100% 0%, rgba(255, 190, 1, 0.10), transparent 55%), var(--color-surface);
  box-shadow: var(--lpi-lift-dark);
}
html[data-theme="light"] .region-guides--councils {
  background: radial-gradient(90% 120% at 100% 0%, rgba(255, 190, 1, 0.12), transparent 55%), #fff;
  box-shadow: var(--lpi-lift);
}
.region-guides--councils .region-guides__title { margin: 0 0 0.35rem; font-size: clamp(1.2rem, 1rem + 0.8vw, 1.45rem); }
.region-guides--councils > p { margin: 0 0 1rem; color: var(--color-text-muted); max-width: 70ch; }
.council-grid.region-card__tags {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
}
@media (min-width: 640px) { .council-grid.region-card__tags { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .council-grid.region-card__tags { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.council-grid .area-tag {
  justify-content: flex-start; width: 100%; min-height: 44px;
  padding: 0.55rem 0.85rem; border-radius: 12px !important;
  text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--lpi-amber) 70%, transparent);
  text-decoration-thickness: 2px; text-underline-offset: 0.25em;
}
.council-grid .area-tag::before {
  content: ""; flex: none; width: 0.45rem; height: 0.45rem; margin-right: 0.55rem; border-radius: 2px;
  background: var(--lpi-amber); transform: rotate(45deg);
}
.region-guides--councils .region-card__more-toggle { margin-top: 0.85rem; }

/* ---------- #7 About service-area chips: two labelled groups ---------- */
.lpi-chipgroups { display: grid; gap: 1rem; margin: 0.75rem 0 1.25rem; }
@media (min-width: 900px) { .lpi-chipgroups { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); } }
.lpi-chipgroup {
  padding: 1rem 1.1rem 1.1rem;
  border-radius: var(--lpi-radius-lg);
  border: 1px solid var(--lpi-hairline);
  background: var(--color-surface);
}
html[data-theme="light"] .lpi-chipgroup { background: #fff; box-shadow: var(--lpi-lift); }
.lpi-chipgroup__label {
  margin: 0 0 0.7rem;
  font-size: 0.8rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--color-text-muted);
}
.lpi-chipgroup .areas__tags { display: flex; flex-wrap: wrap; gap: 0.45rem; margin: 0; }
.lpi-chipgroup .area-tag { display: inline-flex; align-items: center; min-height: 40px; padding: 0.4rem 0.8rem; }
.areas__tags--links .area-tag {
  text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--lpi-amber) 70%, transparent);
  text-decoration-thickness: 2px; text-underline-offset: 0.25em; min-height: 44px;
}

/* ---------- #10 Contact service areas: one compact block ---------- */
.lpi-areablock {
  display: grid; gap: 0;
  border-radius: var(--lpi-radius-lg);
  border: 1px solid var(--lpi-hairline);
  background: var(--color-surface);
  overflow: hidden;
}
html[data-theme="light"] .lpi-areablock { background: #fff; box-shadow: var(--lpi-lift); }
.lpi-areablock > .lpi-areablock__card {
  margin: 0 !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  background: transparent !important; padding: 1rem 1.15rem 1.1rem !important;
}
.lpi-areablock > .lpi-areablock__card + .lpi-areablock__card { border-top: 1px solid var(--lpi-hairline) !important; }
.lpi-areablock__card > p {
  margin: 0 0 0.65rem; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--color-text-muted);
}
.lpi-areablock .feature-list {
  display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.4rem;
  margin: 0; padding: 0; list-style: none;
}
.lpi-areablock .feature-list > li {
  display: flex; align-items: center; min-height: 40px; margin: 0 !important;
  padding: 0.4rem 0.7rem !important;
  border: 1px solid var(--lpi-hairline) !important; border-radius: 10px;
  background: color-mix(in srgb, var(--color-surface-2) 50%, transparent) !important;
  font-size: 0.92rem; line-height: 1.25;
}
.lpi-areablock .feature-list > li::before { display: none !important; }
.lpi-areablock .feature-list > li:has(> a) { padding: 0 !important; }
.lpi-areablock .feature-list > li > a {
  display: flex; align-items: center; width: 100%; min-height: 44px; padding: 0.4rem 0.7rem;
  font-weight: 600; color: var(--color-text);
  text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--lpi-amber) 70%, transparent);
  text-decoration-thickness: 2px; text-underline-offset: 0.22em;
}
html[data-theme="light"] .lpi-areablock .feature-list > li > a { color: var(--lpi-navy); }
.lpi-areablock .feature-list > li:last-child:has(a[href="/areas/"]) {
  grid-column: 1 / -1;
  background: color-mix(in srgb, var(--lpi-amber) 12%, transparent) !important;
  border-color: color-mix(in srgb, var(--lpi-amber) 45%, var(--lpi-hairline)) !important;
}
.lpi-areablock .feature-list > li:last-child:not(:has(a)) { grid-column: 1 / -1; color: var(--color-text-muted); }

/* ---------- design-notes QA pass ---------- */
.lpi-router--paths .lpi-router__hint { text-align: center; max-width: none; margin-inline: auto; padding: 0; }
.lpi-path__link { display: block; justify-content: normal; width: auto; padding-block: 0.55rem; }
.lpi-path__link span { display: inline-block; text-decoration: none; margin-left: 0.2rem; color: var(--lpi-amber); }
html[data-theme="light"] .lpi-path__link span { color: var(--lpi-navy); }
/* "Also serving ..." toggles: amber text failed contrast on light surfaces; navy + amber underline instead */
html[data-theme="light"] .region-card__more-summary {
  color: var(--lpi-navy);
  text-decoration: underline; text-decoration-color: var(--lpi-amber); text-decoration-thickness: 2px; text-underline-offset: 0.25em;
}
.region-card__more-summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; }
/* Amber-outline sits only in the blue .cta-banner: amber label measured 2.9:1 on the light-theme blue.
   White label (4.9:1+) with the amber stroke keeps the amber cue without failing contrast. */
.cta-banner .btn--accent-outline {
  color: #fff !important;
  border-color: var(--lpi-amber) !important;
  background: rgba(4, 29, 61, 0.28) !important;
}
.cta-banner .btn--accent-outline:hover { background: var(--lpi-amber) !important; color: var(--lpi-navy) !important; }

/* =====================================================================
   THEMELOGO round (owner 2026-09-29 evening): logo, social icon, header menu, washed-out controls.
   Colour/size only. Palette navy #062b58 + amber #ffbe01.
   ===================================================================== */

/* Header over the hero: a soft navy scrim behind the bar. The hero photo's highlights sit under the right end of the nav
   (measured: white nav text 4.3:1, theme icon 2.4:1 on the brightest pixels). Not when scrolled, not when the menu is open. */
.header:not(.header--scrolled):not(:has(.hamburger.active)) {
  background-image: linear-gradient(180deg, rgba(3, 22, 46, 0.72) 0%, rgba(3, 22, 46, 0.46) 62%, rgba(3, 22, 46, 0) 100%);
}

/* Header controls: 44px touch targets, visible focus in every state */
.header .theme-toggle,
.header .hamburger {
  min-width: 44px;
  min-height: 44px;
  width: 44px;
  height: 44px;
  border-radius: 12px;
}
.header .theme-toggle:focus-visible,
.header .hamburger:focus-visible,
.header__nav > a:not(.header__call):focus-visible {
  outline: 2px solid #ffbe01;
  outline-offset: 3px;
}
.header .theme-toggle:hover { background: rgba(255, 255, 255, 0.12); }
html[data-theme="light"] .header.header--scrolled .theme-toggle:hover { background: rgba(6, 43, 88, 0.08); }

/* Light theme, scrolled bar: navy text and icons on the light bar (the base ramp uses #0d1b2a; lock it to brand navy) */
html[data-theme="light"] .header.header--scrolled .header__nav > a:not(.header__call),
html[data-theme="light"] .header.header--scrolled .theme-toggle { color: var(--lpi-navy); }
html[data-theme="light"] .header.header--scrolled .hamburger span { background-color: var(--lpi-navy); }

/* Mobile menu open. Light theme: the overlay is light, so the bar's white icons washed out (1.2:1). Navy them. */
html[data-theme="light"] .header:has(.hamburger.active) .theme-toggle { color: var(--lpi-navy); }
html[data-theme="light"] .header:has(.hamburger.active) .hamburger span { background-color: var(--lpi-navy); }
html[data-theme="light"] .header .hamburger.active {
  background: rgba(6, 43, 88, 0.07);
  box-shadow: inset 0 0 0 1px rgba(6, 43, 88, 0.16);
}
html[data-theme="dark"] .header .hamburger.active {
  background: rgba(255, 255, 255, 0.08);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}
html[data-theme="light"] .mobile-nav a { color: var(--lpi-navy); }
.mobile-nav a:focus-visible { outline: 2px solid #ffbe01; outline-offset: 4px; border-radius: 6px; }

/* Footer social (Facebook): the light theme drew a white 80% tile under a white 70% glyph (1.3:1).
   Both themes now sit on a dark footer: a keyline circle with a solid white glyph; hover/focus fill amber with a navy glyph. */
.footer .footer__social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  color: #ffffff;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.42);
  box-shadow: none;
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.18s ease;
}
.footer .footer__social-link svg { width: 20px; height: 20px; fill: currentColor; color: inherit; opacity: 1; }
.footer .footer__social-link:hover,
.footer .footer__social-link:focus-visible {
  background: #ffbe01;
  border-color: #ffbe01;
  color: var(--lpi-navy);
}
.footer .footer__social-link:focus-visible { outline: 2px solid #ffbe01; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .footer .footer__social-link { transition: none; } }

/* Light-theme blue CTA band: body copy and its inline link were rgba-white over the caustic highlights (3.8:1 at the
   brightest). Solid white copy and a quieter caustic layer. */
html[data-theme="light"] .cta-banner p,
html[data-theme="light"] .cta-banner p a:not(.btn) { color: #ffffff; }
html[data-theme="light"] .cta-banner::after { opacity: 0.1; }