/* ==========================================================================
   Page bodies (Phase 5): aligns the body sections below the hero with the
   approved Design System. Layout/presentation only; no wording changes.
   Scoped to <body class="cp-body"> so only opted-in pages are affected.
   Uses Design System tokens (--bc-*) from component-library.css.
   ========================================================================== */

/* ---------- Section rhythm: 48px mobile / 72px tablet / 96px desktop ---------- */
.cp-body .bc-prose,
.cp-body .bc-grid,
.cp-body .bc-faq,
.cp-body .bc-gallery,
.cp-body .bc-formband,
.cp-body .bc-video,
.cp-body .bc-map {
  padding-block: var(--bc-space-7);
}

/* ---------- Headings: sentence-case rendering, Design System sizes ---------- */
.cp-body .bc-prose :is(h2, h3, h4),
.cp-body .bc-grid__head :is(h2, h3, h4),
.cp-body .bc-faq :is(h2, h3, h4),
.cp-body .bc-formband__title,
.cp-body .bc-gallery :is(h2, h3, h4) {
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.15;
}
.cp-body .bc-prose h2,
.cp-body .bc-grid__head h2,
.cp-body .bc-faq h2,
.cp-body .bc-formband__title { font-size: var(--bc-text-2xl); }
.cp-body .bc-prose h3,
.cp-body .bc-grid__head h3,
.cp-body .bc-faq h3 { font-size: var(--bc-text-xl); font-weight: 600; line-height: 1.2; }
.cp-body .bc-prose h4 { font-size: var(--bc-text-lg); font-weight: 600; line-height: 1.25; }

/* ---------- Buttons: Design System default size (48px, 6px radius) ---------- */
.cp-body main > section:not(.cp-hero) .bc-btn {
  min-height: 48px;
  padding: 0 24px;
  border-radius: var(--bc-radius);
  font-size: var(--bc-text-lg);
  letter-spacing: 0.04em;
  line-height: 1;
}
.cp-body .bc-formband .bc-btn--ghost { border-color: #fff; }

/* ---------- Cards: 10px radius, no movement on hover ---------- */
.cp-body .bc-grid__card { border-radius: var(--bc-radius-lg); }
.cp-body .bc-grid__card:hover { transform: none; }

/* ---------- FAQ: 56px rows, chevron indicator ---------- */
.cp-body .bc-faq__q { min-height: 56px; font-size: var(--bc-text-lg); cursor: pointer; }
.cp-body .bc-faq__q::after {
  content: "";
  width: 10px;
  height: 10px;
  margin-right: 4px;
  border-right: 2px solid var(--bc-accent-dark);
  border-bottom: 2px solid var(--bc-accent-dark);
  transform: rotate(45deg);
  transition: transform 0.2s ease-out;
}
.cp-body .bc-faq__item[open] .bc-faq__q::after { content: ""; transform: rotate(-135deg); }

/* ---------- Images in prose rows ---------- */
.cp-body .bc-prose__img img { width: 100%; height: auto; }

/* ---------- Location pages: the expanding service cards sit inside a grid section ---------- */
.cp-body .bc-grid .cp-services__grid { margin-top: var(--bc-space-6); }

@media (min-width: 640px) {
  .cp-body .bc-prose,
  .cp-body .bc-grid,
  .cp-body .bc-faq,
  .cp-body .bc-gallery,
  .cp-body .bc-formband,
  .cp-body .bc-video,
  .cp-body .bc-map { padding-block: var(--bc-space-8); }
}

@media (min-width: 960px) {
  .cp-body .bc-prose,
  .cp-body .bc-grid,
  .cp-body .bc-faq,
  .cp-body .bc-gallery,
  .cp-body .bc-formband,
  .cp-body .bc-video,
  .cp-body .bc-map { padding-block: var(--bc-space-9); }
  .cp-body .bc-prose h2,
  .cp-body .bc-grid__head h2,
  .cp-body .bc-faq h2,
  .cp-body .bc-formband__title { font-size: var(--bc-text-3xl); }
  .cp-body .bc-prose h3,
  .cp-body .bc-grid__head h3,
  .cp-body .bc-faq h3 { font-size: var(--bc-text-2xl); }
  .cp-body .bc-prose h4 { font-size: var(--bc-text-xl); }
}

@media (prefers-reduced-motion: reduce) {
  .cp-body .bc-faq__q::after { transition: none; }
}

/* ---------- About: Mission / Vision as a two-card pair (same words, side by side) ---------- */
.cp-body .cp-card-title {
  margin: 0 0 var(--bc-space-3);
  font-family: var(--bc-font-display);
  font-weight: 600;
  font-size: var(--bc-text-xl);
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none;
  color: var(--bc-ink);
}
.cp-body .cp-card--prose p:not(.bc-eyebrow) {
  font-size: var(--bc-text-base);
  color: var(--bc-ink);
  margin-bottom: var(--bc-space-4);
}
.cp-body .cp-card--prose > *:last-child { margin-bottom: 0; }
@media (min-width: 960px) {
  .cp-body .cp-card-title { font-size: var(--bc-text-2xl); }
}

/* ---------- Readability: first paragraphs visible, remainder under "Read more" (same words) ---------- */
.cp-body .cp-more { margin: 0 0 var(--bc-space-4); }
.cp-body .cp-more summary {
  display: flex;
  align-items: center;
  gap: var(--bc-space-2);
  min-height: 48px;
  cursor: pointer;
  list-style: none;
  font-weight: 600;
  color: var(--bc-accent-dark);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.cp-body .cp-more summary::-webkit-details-marker { display: none; }
.cp-body .cp-more summary:hover { color: var(--bc-ink); }
.cp-body .bc-prose--dark .cp-more summary { color: var(--bc-accent-on-dark); }
.cp-body .bc-prose--dark .cp-more summary:hover { color: #fff; }
.cp-body .cp-more__chev { flex: none; transition: transform 0.2s ease-out; }
.cp-body .cp-more[open] .cp-more__chev { transform: rotate(180deg); }
.cp-body .cp-more__label--close { display: none; }
.cp-body .cp-more[open] .cp-more__label--open { display: none; }
.cp-body .cp-more[open] .cp-more__label--close { display: inline; }
.cp-body .cp-more__rest { padding-top: var(--bc-space-2); }
.cp-body .cp-more__rest > *:last-child { margin-bottom: 0; }
.cp-body .cp-sr-only {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
@media (prefers-reduced-motion: reduce) { .cp-body .cp-more__chev { transition: none; } }

/* ---------- Bottom enquiry banner (Design System CTA banner): sends visitors back to the hero form ---------- */
.cp-cta { padding-block: var(--bc-space-7); background: var(--bc-primary); color: var(--bc-primary-contrast); }
.cp-cta__inner { display: grid; gap: var(--bc-space-5); align-items: center; }
.cp-cta__title {
  margin: 0 0 var(--bc-space-2);
  font-family: var(--bc-font-display);
  font-weight: 700;
  font-size: var(--bc-text-2xl);
  line-height: 1.15;
  letter-spacing: 0;
  text-transform: none;
  color: var(--bc-primary-contrast);
}
.cp-cta__text p { margin: 0; color: var(--bc-primary-contrast); }
.cp-cta__actions { display: grid; gap: var(--bc-space-3); }
.cp-cta .bc-btn { min-height: 56px; padding: 0 28px; border-radius: var(--bc-radius); font-size: var(--bc-text-lg); letter-spacing: 0.04em; line-height: 1; }
.cp-cta .bc-btn--ghost { border-color: #fff; }
@media (min-width: 640px) {
  .cp-cta { padding-block: var(--bc-space-8); }
  .cp-cta__actions { grid-template-columns: repeat(2, minmax(0, max-content)); }
}
@media (min-width: 960px) {
  .cp-cta { padding-block: var(--bc-space-7); }
  .cp-cta__inner { grid-template-columns: minmax(0, 1fr) auto; gap: var(--bc-space-7); }
  .cp-cta__title { font-size: var(--bc-text-3xl); }
}

/* ---------- Google Map section (Design System: 10px radius, small shadow; fixed height = no layout shift) ---------- */
.cp-body .cp-map { padding-block: var(--bc-space-7); background: var(--bc-paper); }
.cp-map__frame {
  height: 320px;
  overflow: hidden;
  background: var(--bc-paper-alt);
  border-radius: var(--bc-radius-lg);
  box-shadow: var(--bc-shadow-sm);
}
.cp-map__frame iframe { display: block; width: 100%; height: 100%; border: 0; }
@media (min-width: 640px) { .cp-body .cp-map { padding-block: var(--bc-space-8); } .cp-map__frame { height: 380px; } }
@media (min-width: 960px) { .cp-body .cp-map { padding-block: var(--bc-space-9); } .cp-map__frame { height: 450px; } }

/* Single-column content: no empty half beside text */
.bc-prose__body { max-width: none; }
.bc-prose--with-image .bc-prose__grid:not(:has(img)) { grid-template-columns: minmax(0, 1fr); }
.bc-formband__grid:has(> :only-child),
.bc-map__grid:has(> :only-child) { grid-template-columns: minmax(0, 1fr); }
.bc-prose--with-image .bc-prose__grid:has(img[style*="display:none"]):not(:has(img:not([style*="display:none"]))) { grid-template-columns: minmax(0, 1fr); }
.cp-services__grid:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bc-prose__body, .bc-prose__body a { overflow-wrap: anywhere; }
.bc-map__addr, .bc-map__addr a, .bc-map__info a { overflow-wrap: anywhere; }

/* Images sit beside content, never above or below it (galleries and card grids excepted) */
@media (min-width: 961px) {
  .bc-prose__grid:has(> .bc-prose__img),
  .bc-prose__grid.bc-prose--with-image { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; }
}
@media (min-width: 768px) {
  /* trust badge beside the text block, not underneath it */
  .bc-formband__grid > div:has(> div > img[src*="Google-Review-Badges"]),
  .bc-formband > .bc-container:has(> img[src*="Google-Review-Badges"]),
  .bc-prose__body:has(> img[src*="Google-Review-Badges"]) {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--bc-space-6); align-items: center;
  }
  .bc-formband__grid > div:has(> div > img[src*="Google-Review-Badges"]) > *,
  .bc-formband > .bc-container:has(> img[src*="Google-Review-Badges"]) > *,
  .bc-prose__body:has(> img[src*="Google-Review-Badges"]) > * { grid-column: 1; }
  .bc-formband__grid > div > div:has(> img[src*="Google-Review-Badges"]),
  .bc-formband > .bc-container > img[src*="Google-Review-Badges"],
  .bc-prose__body > img[src*="Google-Review-Badges"] { grid-column: 2; grid-row: 1 / span 6; align-self: center; margin: 0 !important; }
}
.bc-formband__title, .bc-formband__lede, .bc-formband a { overflow-wrap: anywhere; }
.bc-formband__grid > *, .bc-map__grid > *, .bc-prose__grid > *, .bc-formband .bc-container > * { min-width: 0; max-width: 100%; }
@media (max-width: 640px) { .bc-grid__list[style*="repeat(4"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }

/* Content with no image beside it is centred */
.cp-centered .bc-container { text-align: center; }
.cp-centered .bc-prose__body { margin-inline: auto; max-width: 80ch; }
.cp-centered .bc-eyebrow, .cp-centered .bc-hero__actions, .cp-centered .bc-formband__actions { justify-content: center; }
.cp-centered :is(ul, ol) { display: inline-block; text-align: left; }
.cp-centered .bc-faq__list, .cp-centered details { text-align: left; }
.cp-centered .bc-prose__grid, .cp-centered .bc-formband__grid, .cp-centered .bc-map__grid { grid-template-columns: minmax(0, 1fr); justify-items: center; }
.cp-centered-head > .bc-container > :is(h2, h3, p, .bc-eyebrow), .cp-centered-head .bc-grid__head { text-align: center; }
.cp-centered-head > .bc-container > .bc-eyebrow, .cp-centered-head .bc-grid__head .bc-eyebrow { justify-content: center; }
.cp-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* Weather widget (weatherwidget.io): the script builds its own frame from the link */
.cp-weather { width: 100%; min-height: 150px; }
.cp-weather a.weatherwidget-io { display: block; }
.bc-video__frame:has(.cp-weather), .bc-video__frame.cp-weather-frame { aspect-ratio: auto; box-shadow: none; }