/*
  local-service-migrated — full-width WordPress editor body under the hero.
  Hidden in PHP when post_content is empty. Restores list and paragraph
  styles that the service-page base reset removes.
*/

.local-service-migrated {
  position: relative;
  isolation: isolate;
  overflow-x: clip;
  overflow-y: visible;
  background-color: var(--color-bg);
  color: var(--color-text);
  border-block-end: 1px solid var(--color-divider);
}

/* ---------- Decorative sparkle watermark (Figma intro band 371:74) ---------- */

.local-service-migrated__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  opacity: 0.5;
  pointer-events: none;
}

.local-service-migrated__bg-img {
  position: absolute;
  max-width: none;
  object-fit: cover;
  inline-size: 411.13%;
  block-size: 100%;
  inset-block-start: 0;
  inset-inline-start: -64.68%;
}

.local-service-migrated__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: var(--local-service-intro-stack-gap); /* 32px — breadcrumb → migrated body */
  box-sizing: border-box;
  inline-size: 100%;
  max-inline-size: var(--header-frame-max);
  margin-inline: auto;
  padding-block: var(--local-service-migrated-pad-y-mobile);
  padding-inline: var(--space-md);
}

/* ---------- Breadcrumb (Home → location → Services → current) ---------- */

.local-service-migrated__breadcrumb {
  inline-size: 100%;
}

.local-service-migrated__breadcrumb-list {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--font-body-alt);
  font-weight: var(--fw-regular);
  font-size: var(--fs-local-service-intro-breadcrumb-mobile);
  line-height: var(--lh-local-service-intro-breadcrumb);
  letter-spacing: var(--ls-local-service-intro);
  color: var(--color-text-muted, #a1a1a1);
}

.local-service-migrated__breadcrumb-item {
  display: inline-flex;
  align-items: baseline;
}

.local-service-migrated__breadcrumb-item + .local-service-migrated__breadcrumb-item::before {
  content: "→";
  margin-inline: 0.35em;
  color: inherit;
}

.local-service-migrated__breadcrumb-link {
  color: inherit;
  text-decoration: none;
}

.local-service-migrated__breadcrumb-link:hover {
  text-decoration: underline;
}

.local-service-migrated__breadcrumb-link:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

.local-service-migrated__breadcrumb-current {
  color: inherit;
}

.local-service-migrated__body {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  /* Figma local-service-template-service-copy — major blocks */
  gap: var(--local-service-copy-stack-gap); /* 32px */
  inline-size: 100%;
}

/* Estimate quote card — end of sparkle band, above section divider */
.local-service-migrated__estimate {
  inline-size: 100%;
}

/* 60px from editor content → quote (inner flex gap is 32px) */
.local-service-migrated__body + .local-service-migrated__estimate {
  margin-block-start: calc(var(--local-service-copy-row-gap) - var(--local-service-intro-stack-gap));
}

.local-service-migrated__estimate .local-service-template-service-intro__quote--in-migrated {
  margin-inline: auto;
}

/*
  Block editor columns mirror the service-copy band (Figma 371:912 / 371:1306).
  Column innards use title → body/list spacing from the same tokens.
*/
.shine-zee-local-service-page .local-service-migrated__body .wp-block-columns {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--local-service-copy-row-gap); /* 60px — image ↔ copy column */
  inline-size: 100%;
}

.shine-zee-local-service-page .local-service-migrated__body .wp-block-column {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--local-service-copy-text-gap-mobile); /* 24px — e.g. H2 → list */
  flex: 1;
  min-inline-size: 0;
  inline-size: 100%;
}

.shine-zee-local-service-page .local-service-migrated__body > * {
  max-inline-size: 100%;
}

.shine-zee-local-service-page .local-service-migrated__body h1,
.shine-zee-local-service-page .local-service-migrated__body h2 {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--fs-local-service-migrated-title-mobile);
  font-weight: var(--fw-black);
  line-height: var(--lh-local-service-migrated-title-mobile);
  letter-spacing: var(--ls-local-service-migrated);
  color: var(--color-text);
}

.shine-zee-local-service-page .local-service-migrated__body h3,
.shine-zee-local-service-page .local-service-migrated__body h4,
.shine-zee-local-service-page .local-service-migrated__body h5,
.shine-zee-local-service-page .local-service-migrated__body h6 {
  margin: 0;
  font-family: var(--font-heading);
  font-size: var(--fs-local-service-migrated-heading-mobile);
  font-weight: var(--fw-bold);
  line-height: 1.2;
  letter-spacing: var(--ls-local-service-migrated);
  color: var(--color-text);
}

.shine-zee-local-service-page .local-service-migrated__body p,
.shine-zee-local-service-page .local-service-migrated__body li {
  margin: 0;
  font-family: var(--font-body-alt);
  font-size: var(--fs-local-service-migrated-body-mobile);
  font-weight: var(--fw-regular);
  line-height: var(--lh-local-service-migrated-body);
  letter-spacing: var(--ls-local-service-migrated);
  color: var(--color-text);
}

.shine-zee-local-service-page .local-service-migrated__body ul:not(.service-hub-v3__track),
.shine-zee-local-service-page .local-service-migrated__body ol {
  margin: 0;
  padding-inline-start: 1.5rem;
  list-style-position: outside;
}

.shine-zee-local-service-page .local-service-migrated__body li + li {
  margin-block-start: var(--local-service-copy-step-gap); /* 16px between items */
}

/* Headings → next block when not inside a flex column wrapper */
.shine-zee-local-service-page .local-service-migrated__body :is(h1, h2, h3, h4, h5, h6) + :is(p, ul, ol, figure, .wp-block-image) {
  margin-block-start: var(--local-service-copy-text-gap-mobile);
}

.shine-zee-local-service-page .local-service-migrated__body .wp-block-column :is(h1, h2, h3, h4, h5, h6) + :is(p, ul, ol, figure, .wp-block-image) {
  margin-block-start: 0;
}

.shine-zee-local-service-page .local-service-migrated__body ul:not(.service-hub-v3__track) {
  list-style-type: disc;
}

/* Editor sometimes reuses service-hub card rows; track slides are not bullet lists */
.shine-zee-local-service-page .local-service-migrated__body ul.service-hub-v3__track {
  padding-inline-start: 0;
  list-style: none;
}

.shine-zee-local-service-page .local-service-migrated__body .service-hub-v3__track > .service-hub-v3__slide {
  list-style: none;
}

.shine-zee-local-service-page .local-service-migrated__body .service-hub-v3__track > .service-hub-v3__slide + .service-hub-v3__slide {
  margin-block-start: 0;
}

.shine-zee-local-service-page .local-service-migrated__body ol {
  list-style-type: decimal;
}

.shine-zee-local-service-page .local-service-migrated__body a {
  color: var(--color-primary);
  text-decoration: underline;
}

.shine-zee-local-service-page .local-service-migrated__body a:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* Gutenberg button blocks in migrated post_content — match intro estimate CTA */
.shine-zee-local-service-page .local-service-migrated__body .wp-block-buttons {
  display: flex;
  justify-content: center;
  inline-size: 100%;
}

.shine-zee-local-service-page .local-service-migrated__body .wp-block-button {
  inline-size: 100%;
  max-inline-size: var(--local-service-intro-quote-cta-w-mobile);
}

.shine-zee-local-service-page .local-service-migrated__body .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-sm);
  box-sizing: border-box;
  inline-size: 100%;
  padding-block: 1.25rem;
  padding-inline: 2.5rem;
  border: none;
  border-radius: var(--radius-pill);
  background-color: var(--color-primary) !important;
  font-family: var(--font-heading);
  font-weight: var(--fw-medium);
  font-size: var(--fs-cta);
  line-height: var(--lh-nav);
  letter-spacing: var(--ls-cta);
  text-decoration: none;
  white-space: nowrap;
  color: var(--color-text-inverse) !important;
  transition: opacity var(--transition-base);
}

.shine-zee-local-service-page .local-service-migrated__body .wp-block-button__link:hover {
  opacity: 0.92;
  color: var(--color-text-inverse);
  text-decoration: none;
}

.shine-zee-local-service-page .local-service-migrated__body .wp-block-button__link:focus-visible {
  outline: 2px solid var(--color-text);
  outline-offset: 3px;
}

.shine-zee-local-service-page .local-service-migrated__body .wp-block-button__link::after {
  content: "";
  display: block;
  flex-shrink: 0;
  inline-size: 14px;
  block-size: 14px;
  background: url("../../images/local-service-template-service-intro/icon-arrow.svg") center / contain no-repeat;
}

.shine-zee-local-service-page .local-service-migrated__body img,
.shine-zee-local-service-page .local-service-migrated__body figure,
.shine-zee-local-service-page .local-service-migrated__body iframe,
.shine-zee-local-service-page .local-service-migrated__body video {
  inline-size: 100%;
  max-width: 100%;
  block-size: auto;
}

.shine-zee-local-service-page .local-service-migrated__body figure {
  margin: 0;
}

@media (min-width: 1024px) {
  .local-service-migrated__bg-img {
    inline-size: 100%;
    block-size: 199.5%;
    inset-block-start: -0.01%;
    inset-inline-start: 0;
  }

  .local-service-migrated__inner {
    max-inline-size: calc(var(--local-service-migrated-content-max) + (var(--header-pad-x) * 2));
    padding-block: var(--local-service-migrated-pad-y);
    padding-inline: var(--header-pad-x);
  }

  .local-service-migrated__breadcrumb-list {
    font-size: var(--fs-local-service-intro-breadcrumb);
  }

  .shine-zee-local-service-page .local-service-migrated__body h1,
  .shine-zee-local-service-page .local-service-migrated__body h2 {
    font-size: var(--fs-local-service-migrated-title);
    line-height: var(--lh-local-service-migrated-title);
  }

  .shine-zee-local-service-page .local-service-migrated__body h3,
  .shine-zee-local-service-page .local-service-migrated__body h4,
  .shine-zee-local-service-page .local-service-migrated__body h5,
  .shine-zee-local-service-page .local-service-migrated__body h6 {
    font-size: var(--fs-local-service-migrated-heading);
  }

  .shine-zee-local-service-page .local-service-migrated__body p,
  .shine-zee-local-service-page .local-service-migrated__body li {
    font-size: var(--fs-local-service-migrated-body);
  }

  .shine-zee-local-service-page .local-service-migrated__body .wp-block-columns {
    flex-direction: row;
  }

  .shine-zee-local-service-page .local-service-migrated__body .wp-block-column {
    gap: var(--local-service-copy-text-gap); /* 32px */
  }

  .shine-zee-local-service-page .local-service-migrated__body :is(h1, h2, h3, h4, h5, h6) + :is(p, ul, ol, figure, .wp-block-image) {
    margin-block-start: var(--local-service-copy-text-gap);
  }

  .shine-zee-local-service-page .local-service-migrated__body .wp-block-column :is(h1, h2, h3, h4, h5, h6) + :is(p, ul, ol, figure, .wp-block-image) {
    margin-block-start: 0;
  }

  .shine-zee-local-service-page .local-service-migrated__body .wp-block-button {
    inline-size: auto;
    max-inline-size: none;
  }

  .shine-zee-local-service-page .local-service-migrated__body .wp-block-button__link {
    inline-size: auto;
  }
}
