/* ============================================================
   ASG Local SEO Pages — v3.0.0
   Design system: All Season Gutters (allseasongutters.com)
   Scope: everything lives under .asg-lsp
   Breakdance-safe rules honored throughout:
     - overflow-x: clip (never hidden) on the page wrapper
     - no position: sticky
     - no min() width functions
     - icons via CSS mask data URIs (no inline SVG, no emoji)
   ============================================================ */

/* ── Full-bleed breakout (production-proven v2.5.4 technique) ──
   The plugin renders inside Breakdance's centered post-content column.
   left: 50% + margin-left: -50vw breaks .asg-lsp out to the full
   viewport while the parent column stays centered — do NOT zero the
   wrapper's auto margins; the breakout math depends on them.
   clip (never hidden) everywhere; no min() in layout-critical rules. */

body.asg-lsp-page,
body.single-asg_local_service,
body.single-asg_city_hub {
  background: #ffffff;
  overflow-x: clip;
}

/* Remove only the vertical gap above/below the content column.
   Horizontal auto-centering must survive. */
body.asg-lsp-page #content,
body.asg-lsp-page main,
body.asg-lsp-page article,
body.asg-lsp-page .entry-content,
body.asg-lsp-page .post-content,
body.asg-lsp-page .page-content,
body.asg-lsp-page .bde-post-content {
  padding-top: 0;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
}

body.asg-lsp-page .asg-lsp,
body.single-asg_local_service .asg-lsp,
body.single-asg_city_hub .asg-lsp {
  position: relative;
  left: 50%;
  width: 100vw;
  max-width: 100vw;
  margin-left: -50vw;
  margin-right: 0;
}

/* ── Nav bar treatment: hero underlay (nav does not move) ──
   The nav bar keeps its exact position in flow. The hero is pulled up
   underneath it by the nav band's measured height (assets/asg-header-offset.js
   sets --asg-header-pullup from the real rendered header) so the hero's
   dark image becomes the nav bar's background and its top edge meets the
   teal contact strip. The nav band goes transparent, menu links go white
   over the hero. If the script can't find the header, the variable stays
   0 and the page renders in normal flow. */

body.asg-lsp-page .bde-header-builder,
body.single-asg_local_service .bde-header-builder,
body.single-asg_city_hub .bde-header-builder,
body.asg-lsp-page header.site-header,
body.single-asg_local_service header.site-header,
body.single-asg_city_hub header.site-header,
body.asg-lsp-page .bde-header-builder .bde-section,
body.single-asg_local_service .bde-header-builder .bde-section,
body.single-asg_city_hub .bde-header-builder .bde-section {
  background: transparent !important;
  background-color: transparent !important;
}

/* Nav paints above the pulled-up hero */
body.asg-lsp-page .bde-header-builder,
body.single-asg_local_service .bde-header-builder,
body.single-asg_city_hub .bde-header-builder {
  position: relative;
  z-index: 90;
}

/* Menu links white over the dark hero (html prefix out-ranks leftovers) */
html body.asg-lsp-page .bde-header-builder .breakdance-menu-link,
html body.single-asg_local_service .bde-header-builder .breakdance-menu-link,
html body.single-asg_city_hub .bde-header-builder .breakdance-menu-link,
html body.asg-lsp-page .breakdance-menu-link,
html body.single-asg_local_service .breakdance-menu-link,
html body.single-asg_city_hub .breakdance-menu-link {
  color: #ffffff !important;
}

/* Hero rises under the nav by the measured band height */
body.asg-lsp-page .asg-lsp,
body.single-asg_local_service .asg-lsp,
body.single-asg_city_hub .asg-lsp {
  margin-top: calc(-1 * var(--asg-header-pullup, 0px));
}

/* Hero content clears the overlaid nav band */
body.asg-lsp-page .asg-lsp-hero,
body.single-asg_local_service .asg-lsp-hero,
body.single-asg_city_hub .asg-lsp-hero {
  padding-top: calc(var(--asg-header-pullup, 0px) + clamp(4rem, 7vw, 6rem));
}

.asg-lsp {
  /* ── Design tokens ── */
  --asg-orange: #ff654f;
  --asg-orange-hover: #ed563f;
  --asg-black: #151515;
  --asg-body: #2d2d2d;
  --asg-muted: #686868;
  --asg-teal: #3f8f8a;
  --asg-teal-dark: #2f7470;
  --asg-navy: #122840;
  --asg-stat-blue: #7ec8f4;
  --asg-soft: #f7f8f7;
  --asg-white: #ffffff;
  --asg-border: #e9e9e9;
  --asg-radius: 1.25rem;
  --asg-shadow: 0 0.85rem 2.25rem rgba(0, 0, 0, 0.055);
  --asg-font-display: "Syne", "Plus Jakarta Sans", system-ui, sans-serif;
  --asg-font-body: "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;

  font-family: var(--asg-font-body);
  color: var(--asg-body);
  background: var(--asg-white);
  overflow-x: clip; /* clip, never hidden — protects the Breakdance sticky header stacking context */
  display: block;
  width: 100%;
  line-height: 1.65;
  font-size: 1rem;
  -webkit-font-smoothing: antialiased;
}

/* ── Layout primitives ── */

.asg-lsp .asg-lsp-wrap {
  max-width: 1200px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: clamp(1rem, 4vw, 2.5rem);
  padding-right: clamp(1rem, 4vw, 2.5rem);
  box-sizing: border-box;
}

.asg-lsp *,
.asg-lsp *::before,
.asg-lsp *::after { box-sizing: border-box; }

.asg-lsp .asg-lsp-section {
  padding-top: clamp(3rem, 7vw, 5.5rem);
  padding-bottom: clamp(3rem, 7vw, 5.5rem);
  background: var(--asg-white);
}

.asg-lsp .asg-lsp-section--soft { background: var(--asg-soft); }

/* ── Typography ── */

.asg-lsp h1,
.asg-lsp h2 {
  font-family: var(--asg-font-display);
  font-weight: 950;
  letter-spacing: -0.06em;
  line-height: 1.02;
  color: var(--asg-black);
  margin: 0 0 1rem;
}

.asg-lsp h1 { font-size: clamp(2.2rem, 4.9vw, 4.2rem); }
.asg-lsp h2 { font-size: clamp(1.9rem, 3.6vw, 3.1rem); }

.asg-lsp h3 {
  font-family: var(--asg-font-body);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: var(--asg-black);
  font-size: clamp(1.1rem, 1.6vw, 1.3rem);
  margin: 0 0 0.6rem;
}

.asg-lsp p { margin: 0 0 1rem; color: var(--asg-body); }
.asg-lsp p:last-child { margin-bottom: 0; }

.asg-lsp a { color: var(--asg-teal-dark); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.asg-lsp a:hover { color: var(--asg-orange-hover); }

.asg-lsp :is(a, summary, button):focus-visible {
  outline: 3px solid var(--asg-teal);
  outline-offset: 3px;
  border-radius: 6px;
}

/* Kicker: orange bar + teal-dark label */
.asg-lsp .asg-lsp-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-weight: 800;
  font-size: 0.82rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--asg-teal-dark);
  margin-bottom: 0.9rem;
}

.asg-lsp .asg-lsp-kicker::before {
  content: "";
  width: 2rem;
  height: 4px;
  border-radius: 999px;
  background: var(--asg-orange);
  flex: none;
}

.asg-lsp .asg-lsp-kicker--ondark { color: #bfe9e5; }
.asg-lsp .asg-lsp-kicker--onnavy { color: var(--asg-stat-blue); }

.asg-lsp .asg-lsp-section-head { max-width: 860px; margin-bottom: clamp(1.75rem, 4vw, 2.75rem); }
.asg-lsp .asg-lsp-section-head p { color: var(--asg-muted); font-size: 1.05rem; }

/* ── Icons (CSS mask data URIs — safe for this stack) ── */

.asg-lsp .asg-lsp-ic {
  display: inline-block;
  width: 1.35rem;
  height: 1.35rem;
  flex: none;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.asg-lsp .asg-lsp-ic--inline { width: 1.05rem; height: 1.05rem; margin-right: 0.45rem; vertical-align: -0.15em; }

.asg-lsp .asg-lsp-ic--phone {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.8 19.8 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.08 4.18 2 2 0 0 1 4.06 2h3a2 2 0 0 1 2 1.72c.12.9.33 1.78.63 2.62a2 2 0 0 1-.45 2.11L8.09 9.6a16 16 0 0 0 6.31 6.31l1.15-1.15a2 2 0 0 1 2.11-.45c.84.3 1.72.51 2.62.63A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.8 19.8 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.08 4.18 2 2 0 0 1 4.06 2h3a2 2 0 0 1 2 1.72c.12.9.33 1.78.63 2.62a2 2 0 0 1-.45 2.11L8.09 9.6a16 16 0 0 0 6.31 6.31l1.15-1.15a2 2 0 0 1 2.11-.45c.84.3 1.72.51 2.62.63A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
}

.asg-lsp .asg-lsp-ic--calendar {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 16H5V10h14zM5 8V6h14v2z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 4h-1V2h-2v2H8V2H6v2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 16H5V10h14zM5 8V6h14v2z'/%3E%3C/svg%3E");
}

.asg-lsp .asg-lsp-ic--bolt {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 2 4.09 12.35a.6.6 0 0 0 .46.99H10l-1 8.66L20.91 11.65a.6.6 0 0 0-.46-.99H14z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 2 4.09 12.35a.6.6 0 0 0 .46.99H10l-1 8.66L20.91 11.65a.6.6 0 0 0-.46-.99H14z'/%3E%3C/svg%3E");
}

.asg-lsp .asg-lsp-ic--clipboard {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2V3a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1zm-2 0h-4v2h4zM8 11h8v2H8zm0 4h8v2H8z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2V3a1 1 0 0 1 1-1h6a1 1 0 0 1 1 1zm-2 0h-4v2h4zM8 11h8v2H8zm0 4h8v2H8z'/%3E%3C/svg%3E");
}

/* ── Buttons: pill-shaped, brand colors, 44px+ touch targets ── */

.asg-lsp .asg-lsp-btns { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.5rem; }

.asg-lsp .asg-lsp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  padding: 0.8rem 1.6rem;
  border-radius: 999px;
  font-weight: 800;
  font-size: 1rem;
  letter-spacing: -0.01em;
  text-decoration: none;
  transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
  border: 2px solid transparent;
  cursor: pointer;
}

.asg-lsp .asg-lsp-btn--orange { background: var(--asg-orange); color: var(--asg-white); }
.asg-lsp .asg-lsp-btn--orange:hover { background: var(--asg-orange-hover); color: var(--asg-white); transform: translateY(-2px); }

.asg-lsp .asg-lsp-btn--dark { background: var(--asg-black); color: var(--asg-white); }
.asg-lsp .asg-lsp-btn--dark:hover { background: var(--asg-navy); color: var(--asg-white); transform: translateY(-2px); }

.asg-lsp .asg-lsp-btn--ghost { background: transparent; color: var(--asg-white); border-color: rgba(255, 255, 255, 0.55); }
.asg-lsp .asg-lsp-btn--ghost:hover { border-color: var(--asg-white); color: var(--asg-white); background: rgba(255, 255, 255, 0.08); }

.asg-lsp .asg-lsp-btn--ghost-dark { background: transparent; color: var(--asg-black); border-color: var(--asg-black); }
.asg-lsp .asg-lsp-btn--ghost-dark:hover { border-color: var(--asg-orange); color: var(--asg-orange-hover); }

/* ── Checklist (mask-icon check bullets) ── */

.asg-lsp .asg-lsp-checklist { list-style: none; margin: 1.25rem 0 0; padding: 0; display: grid; gap: 0.65rem; }

.asg-lsp .asg-lsp-checklist li {
  position: relative;
  padding-left: 1.9rem;
  line-height: 1.5;
  color: var(--asg-body);
}

.asg-lsp .asg-lsp-checklist li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.22em;
  width: 1.15rem;
  height: 1.15rem;
  background-color: var(--asg-teal);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2zm-1.2 14.4-4-4 1.7-1.7 2.3 2.3 5.5-5.5 1.7 1.7z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2zm-1.2 14.4-4-4 1.7-1.7 2.3 2.3 5.5-5.5 1.7 1.7z'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

.asg-lsp .asg-lsp-checklist--ondark li { color: rgba(255, 255, 255, 0.85); }
.asg-lsp .asg-lsp-checklist--ondark li::before { background-color: var(--asg-stat-blue); }

/* ── Hero ── */

.asg-lsp .asg-lsp-hero {
  position: relative;
  isolation: isolate;
  padding-top: clamp(5rem, 12vw, 8.5rem);
  padding-bottom: clamp(3.75rem, 9vw, 6.5rem);
  background-color: var(--asg-navy);
  background-image: linear-gradient(115deg, rgba(10, 20, 32, 0.92) 0%, rgba(18, 40, 64, 0.78) 48%, rgba(18, 40, 64, 0.45) 100%), var(--asg-hero-bg);
  background-size: cover;
  background-position: center;
}

.asg-lsp .asg-lsp-hero__copy { max-width: 780px; }

.asg-lsp .asg-lsp-hero h1 { color: var(--asg-white); }

.asg-lsp .asg-lsp-lead {
  font-size: clamp(1.05rem, 1.6vw, 1.25rem);
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.86);
  max-width: 640px;
}

.asg-lsp .asg-lsp-hero-points {
  list-style: none;
  margin: 1.4rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}

.asg-lsp .asg-lsp-hero-points li {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem 0.5rem 0.85rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.09);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: rgba(255, 255, 255, 0.92);
  font-size: 0.9rem;
  font-weight: 600;
  backdrop-filter: blur(6px);
}

.asg-lsp .asg-lsp-hero-points li::before {
  content: "";
  width: 0.9rem;
  height: 0.9rem;
  flex: none;
  background-color: var(--asg-orange);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

/* ── Instant estimate callout (navy conversion panel) ── */

.asg-lsp .asg-lsp-estimate { padding-top: clamp(2.25rem, 5vw, 4rem); padding-bottom: clamp(2.25rem, 5vw, 4rem); background: var(--asg-white); }

.asg-lsp .asg-lsp-estimate__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  gap: clamp(1.5rem, 3.5vw, 3rem);
  background: var(--asg-navy);
  border-radius: var(--asg-radius);
  padding: clamp(1.5rem, 4vw, 3rem);
  color: var(--asg-white);
  box-shadow: 0 1.4rem 3rem rgba(18, 40, 64, 0.28);
}

.asg-lsp .asg-lsp-estimate__inner h2 { color: var(--asg-white); font-size: clamp(1.6rem, 2.8vw, 2.4rem); }
.asg-lsp .asg-lsp-estimate__copy p { color: rgba(255, 255, 255, 0.8); }

.asg-lsp .asg-lsp-estimate__actions {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: calc(var(--asg-radius) - 0.35rem);
  padding: clamp(1.15rem, 2.5vw, 1.75rem);
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
}

.asg-lsp .asg-lsp-estimate__primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
  min-height: 3.25rem;
  padding: 0.9rem 1.5rem;
  border-radius: 999px;
  background: var(--asg-orange);
  color: var(--asg-white);
  font-weight: 800;
  font-size: 1.05rem;
  text-decoration: none;
  transition: background-color 0.18s ease, transform 0.18s ease;
}

.asg-lsp .asg-lsp-estimate__primary:hover { background: var(--asg-orange-hover); color: var(--asg-white); transform: translateY(-2px); }

.asg-lsp .asg-lsp-estimate__sub { text-align: center; font-size: 0.85rem; color: rgba(255, 255, 255, 0.62); margin: 0; }

.asg-lsp .asg-lsp-estimate__options { display: grid; gap: 0.6rem; border-top: 1px solid rgba(255, 255, 255, 0.14); padding-top: 0.9rem; }

.asg-lsp .asg-lsp-estimate__option {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  padding: 0.7rem 0.85rem;
  min-height: 3rem;
  border-radius: 0.85rem;
  text-decoration: none;
  color: var(--asg-white);
  background: rgba(255, 255, 255, 0.04);
  transition: background-color 0.18s ease;
}

.asg-lsp .asg-lsp-estimate__option:hover { background: rgba(255, 255, 255, 0.12); color: var(--asg-white); }
.asg-lsp .asg-lsp-estimate__option .asg-lsp-ic { color: var(--asg-stat-blue); }

.asg-lsp .asg-lsp-estimate__option-text { display: flex; flex-direction: column; line-height: 1.3; }
.asg-lsp .asg-lsp-estimate__option-text strong { font-weight: 800; font-size: 0.98rem; }
.asg-lsp .asg-lsp-estimate__option-text span { font-size: 0.83rem; color: rgba(255, 255, 255, 0.62); }

/* ── Direct answer panel ── */

.asg-lsp .asg-lsp-intent { padding-top: clamp(2.5rem, 6vw, 4.5rem); padding-bottom: clamp(2.5rem, 6vw, 4.5rem); background: var(--asg-soft); }

.asg-lsp .asg-lsp-intent__panel {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.65fr);
  gap: clamp(1.25rem, 3vw, 2.25rem);
}

.asg-lsp .asg-lsp-intent__copy,
.asg-lsp .asg-lsp-intent__aside {
  background: var(--asg-navy);
  border-radius: var(--asg-radius);
  padding: clamp(1.5rem, 3.5vw, 2.5rem);
  color: var(--asg-white);
  box-shadow: 0 1.4rem 3rem rgba(18, 40, 64, 0.22);
}

.asg-lsp .asg-lsp-intent__copy h2 { color: var(--asg-white); font-size: clamp(1.6rem, 2.9vw, 2.5rem); }
.asg-lsp .asg-lsp-intent__copy p { color: rgba(255, 255, 255, 0.82); font-size: 1.05rem; line-height: 1.7; }

.asg-lsp .asg-lsp-intent__more { font-size: 0.98rem; color: rgba(255, 255, 255, 0.72); border-top: 1px solid rgba(255, 255, 255, 0.14); padding-top: 1rem; margin-top: 1.1rem; }

.asg-lsp .asg-lsp-intent__more a {
  color: var(--asg-stat-blue);
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 3px;
}

.asg-lsp .asg-lsp-intent__more a:hover { color: var(--asg-white); }

.asg-lsp .asg-lsp-intent__aside { background: var(--asg-white); color: var(--asg-body); border: 1px solid var(--asg-border); box-shadow: var(--asg-shadow); }
.asg-lsp .asg-lsp-intent__aside h3 { color: var(--asg-black); }
.asg-lsp .asg-lsp-intent__aside ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.6rem; }

.asg-lsp .asg-lsp-intent__aside li {
  position: relative;
  padding-left: 1.4rem;
  line-height: 1.5;
  color: var(--asg-body);
}

.asg-lsp .asg-lsp-intent__aside li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.5em;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 999px;
  background: var(--asg-orange);
}

/* ── Notes, mini cards, diagnostics ── */

.asg-lsp .asg-lsp-note {
  background: var(--asg-soft);
  border-left: 4px solid var(--asg-teal);
  border-radius: 0.75rem;
  padding: 1rem 1.25rem;
  margin-bottom: 1rem;
  color: var(--asg-body);
  line-height: 1.6;
}

.asg-lsp .asg-lsp-note--strong { border-left-color: var(--asg-orange); font-weight: 600; color: var(--asg-black); }

.asg-lsp .asg-lsp-diagnostic__grid { display: grid; gap: clamp(1.5rem, 3vw, 2.5rem); }
.asg-lsp .asg-lsp-diagnostic__grid.has-image { grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.75fr); }

.asg-lsp .asg-lsp-mini-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.1rem; margin-top: 1.25rem; }
.asg-lsp .asg-lsp-mini-cards--three { margin-top: 0; }

.asg-lsp .asg-lsp-mini-card {
  background: var(--asg-white);
  border: 1px solid var(--asg-border);
  border-radius: var(--asg-radius);
  padding: 1.35rem;
  box-shadow: var(--asg-shadow);
  transition: transform 0.18s ease, border-color 0.18s ease;
}

.asg-lsp .asg-lsp-mini-card:hover { transform: translateY(-5px); border-color: var(--asg-teal); }
.asg-lsp .asg-lsp-mini-card h3 { font-size: 1.05rem; }
.asg-lsp .asg-lsp-mini-card p { color: var(--asg-muted); font-size: 0.95rem; margin: 0; }

.asg-lsp .asg-lsp-signal-card {
  background: var(--asg-navy);
  color: var(--asg-white);
  border-radius: var(--asg-radius);
  padding: clamp(1.35rem, 2.5vw, 1.75rem);
  box-shadow: 0 1.2rem 2.6rem rgba(18, 40, 64, 0.22);
}

.asg-lsp .asg-lsp-signal-card > span {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--asg-stat-blue);
  margin-bottom: 0.5rem;
}

.asg-lsp .asg-lsp-signal-card h3 { color: var(--asg-white); }
.asg-lsp .asg-lsp-signal-card ul { list-style: none; margin: 0.75rem 0 0; padding: 0; display: grid; gap: 0.55rem; }

.asg-lsp .asg-lsp-signal-card li {
  position: relative;
  padding-left: 1.5rem;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.45;
  font-size: 0.95rem;
}

.asg-lsp .asg-lsp-signal-card li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.28em;
  width: 0.85rem;
  height: 0.85rem;
  background-color: var(--asg-orange);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

.asg-lsp .asg-lsp-diagnostic__aside { display: grid; gap: 1.25rem; align-content: start; }

/* ── Figures: rounded image, caption below (no clipping wrappers) ── */

.asg-lsp .asg-lsp-figure,
.asg-lsp .asg-lsp-story__figure,
.asg-lsp .asg-lsp-colors__image { margin: 0; }

.asg-lsp .asg-lsp-figure img,
.asg-lsp .asg-lsp-story__figure img,
.asg-lsp .asg-lsp-colors__image img,
.asg-lsp .asg-lsp-profiles__image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--asg-radius);
  box-shadow: var(--asg-shadow);
  object-fit: cover;
  object-position: center top;
}

.asg-lsp figcaption {
  margin-top: 0.7rem;
  font-size: 0.88rem;
  line-height: 1.5;
  color: var(--asg-muted);
}

/* ── Method / steps ── */

.asg-lsp .asg-lsp-method__panel { display: grid; gap: 1.5rem; }

.asg-lsp .asg-lsp-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.1rem; counter-reset: asg-step; }

.asg-lsp .asg-lsp-step-card {
  background: var(--asg-white);
  border: 1px solid var(--asg-border);
  border-radius: var(--asg-radius);
  padding: 1.5rem;
  box-shadow: var(--asg-shadow);
  transition: transform 0.18s ease, border-color 0.18s ease;
}

.asg-lsp .asg-lsp-step-card:hover { transform: translateY(-5px); border-color: var(--asg-teal); }

.asg-lsp .asg-lsp-step-card > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 999px;
  background: var(--asg-navy);
  color: var(--asg-stat-blue);
  font-family: var(--asg-font-display);
  font-weight: 800;
  font-size: 1rem;
  margin-bottom: 0.9rem;
}

.asg-lsp .asg-lsp-step-card p { color: var(--asg-muted); font-size: 0.95rem; margin: 0; }

.asg-lsp .asg-lsp-priorities { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.1rem; }

.asg-lsp .asg-lsp-priority-card {
  background: var(--asg-white);
  border: 1px solid var(--asg-border);
  border-radius: var(--asg-radius);
  padding: 1.35rem;
  box-shadow: var(--asg-shadow);
}

.asg-lsp .asg-lsp-priority-card > span {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--asg-orange);
  margin-bottom: 0.5rem;
}

.asg-lsp .asg-lsp-priority-card h3 { font-size: 1.05rem; }
.asg-lsp .asg-lsp-priority-card p { color: var(--asg-muted); font-size: 0.95rem; margin: 0; }

/* ── Story (installation editorial / commercial capacity) ── */

.asg-lsp .asg-lsp-story__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: clamp(1.5rem, 4vw, 3.25rem);
  align-items: center;
}

.asg-lsp .asg-lsp-story--reverse .asg-lsp-story__grid > .asg-lsp-story__copy { order: 2; }
.asg-lsp .asg-lsp-story--reverse .asg-lsp-story__grid > .asg-lsp-story__figure { order: 1; }

/* ── Profiles & colors (installation) ── */

.asg-lsp .asg-lsp-profiles__grid,
.asg-lsp .asg-lsp-colors__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: clamp(1.5rem, 4vw, 3.25rem);
  align-items: start;
}

.asg-lsp .asg-lsp-profiles__copy .asg-lsp-mini-cards,
.asg-lsp .asg-lsp-colors__copy .asg-lsp-mini-cards { grid-template-columns: 1fr; }

.asg-lsp .asg-lsp-profiles__note { margin-top: 1.25rem; font-size: 0.95rem; color: var(--asg-muted); }

.asg-lsp .asg-lsp-colors__grid { align-items: center; }
.asg-lsp .asg-lsp-colors__copy .asg-lsp-btn { margin-top: 1.25rem; }

/* ── Maintenance strip (commercial cleaning) ── */

.asg-lsp .asg-lsp-maintenance { background: var(--asg-white); }

/* ── Split editorial (field notes / local proof / hub local) — no sticky ── */

.asg-lsp .asg-lsp-split {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: start;
}

.asg-lsp .asg-lsp-split__lede {
  background: var(--asg-white);
  border: 1px solid var(--asg-border);
  border-radius: var(--asg-radius);
  padding: clamp(1.5rem, 3.5vw, 2.5rem);
  box-shadow: var(--asg-shadow);
}

.asg-lsp .asg-lsp-split__lede p { color: var(--asg-muted); }

.asg-lsp .asg-lsp-proof-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem; }

.asg-lsp .asg-lsp-proof-card {
  background: var(--asg-white);
  border: 1px solid var(--asg-border);
  border-radius: var(--asg-radius);
  padding: 1.35rem;
  box-shadow: var(--asg-shadow);
  transition: transform 0.18s ease, border-color 0.18s ease;
}

.asg-lsp .asg-lsp-proof-card:hover { transform: translateY(-5px); border-color: var(--asg-teal); }
.asg-lsp .asg-lsp-proof-card--wide { grid-column: 1 / -1; }

.asg-lsp .asg-lsp-proof-card__label {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--asg-teal-dark);
  margin-bottom: 0.5rem;
}

.asg-lsp .asg-lsp-proof-card p { color: var(--asg-body); font-size: 0.95rem; line-height: 1.6; margin: 0; }

/* ── Hub service menu cards (dark hover per brand card style) ── */

.asg-lsp .asg-lsp-service-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.1rem; }

.asg-lsp .asg-lsp-service-card {
  display: block;
  background: var(--asg-white);
  border: 1px solid var(--asg-border);
  border-radius: var(--asg-radius);
  padding: 1.5rem;
  box-shadow: var(--asg-shadow);
  text-decoration: none;
  transition: transform 0.18s ease, border-color 0.18s ease;
}

.asg-lsp .asg-lsp-service-card:hover { transform: translateY(-5px); border-color: var(--asg-teal); }

.asg-lsp .asg-lsp-service-card > span {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--asg-orange);
  margin-bottom: 0.5rem;
}

.asg-lsp .asg-lsp-service-card h3 { color: var(--asg-black); }
.asg-lsp .asg-lsp-service-card p { color: var(--asg-muted); font-size: 0.95rem; margin: 0; }

/* ── Internal link cards ── */

.asg-lsp .asg-lsp-related-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.1rem; }

.asg-lsp .asg-lsp-related-card {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  background: var(--asg-white);
  border: 1px solid var(--asg-border);
  border-radius: var(--asg-radius);
  padding: 1.35rem;
  box-shadow: var(--asg-shadow);
  text-decoration: none;
  transition: transform 0.18s ease, border-color 0.18s ease;
}

.asg-lsp .asg-lsp-related-card:hover { transform: translateY(-5px); border-color: var(--asg-teal); }

.asg-lsp .asg-lsp-related-card > span {
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--asg-teal-dark);
}

.asg-lsp .asg-lsp-related-card > strong { color: var(--asg-black); font-size: 1.05rem; font-weight: 800; letter-spacing: -0.02em; line-height: 1.3; }
.asg-lsp .asg-lsp-related-card > em { font-style: normal; color: var(--asg-muted); font-size: 0.9rem; line-height: 1.5; }

/* Compact city grid for pillar-page embeds via [asg_related_links service="..."] */
.asg-lsp .asg-lsp-related-grid--cities { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.asg-lsp .asg-lsp-related-grid--cities .asg-lsp-related-card { padding: 1.05rem 1.15rem; }
.asg-lsp .asg-lsp-related-grid--cities .asg-lsp-related-card > strong { font-size: 0.98rem; }

/* Embed variant: shortcode output on regular Breakdance pages —
   blends into the host section, no breakout, no background */
.asg-lsp.asg-lsp--embed {
  background: transparent;
  position: static;
  left: auto;
  width: 100%;
  max-width: 100%;
  margin: 0;
}

/* ── FAQ (native details/summary accordion) ── */

.asg-lsp .asg-lsp-faq { background: var(--asg-soft); }
.asg-lsp .asg-lsp-faq__shell { max-width: 920px; }
.asg-lsp .asg-lsp-faq__header { margin-bottom: 1.75rem; }
.asg-lsp .asg-lsp-faq__header p { color: var(--asg-muted); }

.asg-lsp .asg-lsp-faq__context {
  background: var(--asg-white);
  border: 1px solid var(--asg-border);
  border-left: 4px solid var(--asg-orange);
  border-radius: var(--asg-radius);
  padding: 1.35rem 1.5rem;
  margin-bottom: 1.5rem;
  box-shadow: var(--asg-shadow);
}

.asg-lsp .asg-lsp-faq__context p { color: var(--asg-muted); font-size: 0.98rem; margin: 0; }

.asg-lsp .asg-lsp-faq__items { display: grid; gap: 0.85rem; }

.asg-lsp .asg-lsp-faq__item {
  background: var(--asg-white);
  border: 1px solid var(--asg-border);
  border-radius: var(--asg-radius);
  box-shadow: var(--asg-shadow);
  transition: border-color 0.18s ease;
}

.asg-lsp .asg-lsp-faq__item[open] { border-color: var(--asg-teal); }

.asg-lsp .asg-lsp-faq__item summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  cursor: pointer;
  list-style: none;
  padding: 1.15rem 1.4rem;
  min-height: 3rem;
}

.asg-lsp .asg-lsp-faq__item summary::-webkit-details-marker { display: none; }

.asg-lsp .asg-lsp-faq__item summary h3 {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.4;
  color: var(--asg-black);
}

.asg-lsp .asg-lsp-faq__marker {
  flex: none;
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 999px;
  background: var(--asg-soft);
  position: relative;
  transition: background-color 0.18s ease, transform 0.18s ease;
}

.asg-lsp .asg-lsp-faq__marker::before,
.asg-lsp .asg-lsp-faq__marker::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0.7rem;
  height: 2px;
  background: var(--asg-teal-dark);
  transform: translate(-50%, -50%);
  transition: transform 0.18s ease;
}

.asg-lsp .asg-lsp-faq__marker::after { transform: translate(-50%, -50%) rotate(90deg); }
.asg-lsp .asg-lsp-faq__item[open] .asg-lsp-faq__marker { background: var(--asg-teal); }
.asg-lsp .asg-lsp-faq__item[open] .asg-lsp-faq__marker::before,
.asg-lsp .asg-lsp-faq__item[open] .asg-lsp-faq__marker::after { background: var(--asg-white); }
.asg-lsp .asg-lsp-faq__item[open] .asg-lsp-faq__marker::after { transform: translate(-50%, -50%) rotate(0deg); }

.asg-lsp .asg-lsp-faq__answer { padding: 0 1.4rem 1.25rem; }
.asg-lsp .asg-lsp-faq__answer p { color: var(--asg-muted); line-height: 1.65; margin: 0; }

.asg-lsp .asg-lsp-faq__cta {
  margin-top: 1.75rem;
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(0, 0.7fr);
  gap: 1.5rem;
  align-items: center;
  background: var(--asg-white);
  border: 1px solid var(--asg-border);
  border-radius: var(--asg-radius);
  padding: clamp(1.35rem, 3vw, 2rem);
  box-shadow: var(--asg-shadow);
}

.asg-lsp .asg-lsp-faq__cta p { color: var(--asg-muted); font-size: 0.95rem; margin: 0; }
.asg-lsp .asg-lsp-faq__actions { display: flex; flex-direction: column; gap: 0.7rem; }

/* ── Final CTA (navy block per brand) ── */

.asg-lsp .asg-lsp-cta { padding-top: clamp(3rem, 7vw, 5rem); padding-bottom: clamp(3rem, 7vw, 5.5rem); background: var(--asg-white); }

.asg-lsp .asg-lsp-cta__inner {
  background: var(--asg-navy);
  border-radius: var(--asg-radius);
  padding: clamp(1.75rem, 4.5vw, 3.25rem);
  color: var(--asg-white);
  box-shadow: 0 1.4rem 3rem rgba(18, 40, 64, 0.28);
}

.asg-lsp .asg-lsp-cta__inner > div > span {
  display: inline-block;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--asg-stat-blue);
  margin-bottom: 0.6rem;
}

.asg-lsp .asg-lsp-cta__inner h2 { color: var(--asg-white); font-size: clamp(1.7rem, 3.2vw, 2.7rem); }
.asg-lsp .asg-lsp-cta__inner p { color: rgba(255, 255, 255, 0.8); max-width: 640px; }
.asg-lsp .asg-lsp-cta__inner .asg-lsp-btn--dark { background: var(--asg-white); color: var(--asg-navy); }
.asg-lsp .asg-lsp-cta__inner .asg-lsp-btn--dark:hover { background: var(--asg-soft); color: var(--asg-navy); }

/* ── Editor content slot ── */

.asg-lsp .asg-lsp-editor-content { padding-top: clamp(2rem, 5vw, 3.5rem); padding-bottom: clamp(2rem, 5vw, 3.5rem); }
.asg-lsp .asg-lsp-editor-content .asg-lsp-wrap { max-width: 860px; }

/* ══════════════════════════════════════════
   Responsive — Breakdance breakpoints: 1024 tablet, 767 mobile
   ══════════════════════════════════════════ */

@media (max-width: 1024px) {
  .asg-lsp .asg-lsp-estimate__inner,
  .asg-lsp .asg-lsp-intent__panel,
  .asg-lsp .asg-lsp-story__grid,
  .asg-lsp .asg-lsp-profiles__grid,
  .asg-lsp .asg-lsp-colors__grid,
  .asg-lsp .asg-lsp-split,
  .asg-lsp .asg-lsp-diagnostic__grid.has-image { grid-template-columns: 1fr; }

  .asg-lsp .asg-lsp-story--reverse .asg-lsp-story__grid > .asg-lsp-story__copy { order: 1; }
  .asg-lsp .asg-lsp-story--reverse .asg-lsp-story__grid > .asg-lsp-story__figure { order: 2; }

  .asg-lsp .asg-lsp-mini-cards,
  .asg-lsp .asg-lsp-steps,
  .asg-lsp .asg-lsp-priorities,
  .asg-lsp .asg-lsp-service-cards,
  .asg-lsp .asg-lsp-related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .asg-lsp .asg-lsp-diagnostic__aside { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  body.asg-lsp-page .asg-lsp,
  body.single-asg_local_service .asg-lsp,
  body.single-asg_city_hub .asg-lsp {
    width: 100%;
    max-width: 100%;
    left: auto;
    margin-left: 0;
  }

  .asg-lsp h1 { font-size: clamp(2rem, 8.5vw, 2.6rem); }
  .asg-lsp h2 { font-size: clamp(1.65rem, 7vw, 2.1rem); }

  .asg-lsp .asg-lsp-hero { padding-top: clamp(4rem, 16vw, 5.5rem); padding-bottom: clamp(2.75rem, 12vw, 4rem); background-position: center top; }

  .asg-lsp .asg-lsp-mini-cards,
  .asg-lsp .asg-lsp-steps,
  .asg-lsp .asg-lsp-priorities,
  .asg-lsp .asg-lsp-service-cards,
  .asg-lsp .asg-lsp-related-grid,
  .asg-lsp .asg-lsp-proof-grid,
  .asg-lsp .asg-lsp-diagnostic__aside,
  .asg-lsp .asg-lsp-faq__cta { grid-template-columns: 1fr; }

  .asg-lsp .asg-lsp-related-grid--cities { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .asg-lsp .asg-lsp-btns { flex-direction: column; align-items: stretch; }
  .asg-lsp .asg-lsp-btn { width: 100%; }

  .asg-lsp .asg-lsp-hero-points { flex-direction: column; align-items: flex-start; }

  .asg-lsp .asg-lsp-estimate__inner { padding: 1.25rem; }
  .asg-lsp .asg-lsp-cta__inner { padding: 1.5rem 1.25rem; }
  .asg-lsp .asg-lsp-faq__item summary { padding: 1rem 1.1rem; }
  .asg-lsp .asg-lsp-faq__answer { padding: 0 1.1rem 1.1rem; }
}

/* ── Motion preferences ── */

@media (prefers-reduced-motion: reduce) {
  .asg-lsp *,
  .asg-lsp *::before,
  .asg-lsp *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
  .asg-lsp .asg-lsp-mini-card:hover,
  .asg-lsp .asg-lsp-step-card:hover,
  .asg-lsp .asg-lsp-proof-card:hover,
  .asg-lsp .asg-lsp-service-card:hover,
  .asg-lsp .asg-lsp-related-card:hover,
  .asg-lsp .asg-lsp-btn:hover,
  .asg-lsp .asg-lsp-estimate__primary:hover { transform: none; }
}

/* ── Print ── */

@media print {
  .asg-lsp .asg-lsp-estimate,
  .asg-lsp .asg-lsp-cta { display: none; }
}