/**
 * Rich text — generic prose block, optional full-width image band.
 *
 * Structural only: section spacing, a max-width container for the prose,
 * and (when field_image is set) an image band that intentionally breaks out
 * to the full width of the component root rather than staying inside the
 * prose container.
 */
.mk3-sdc--rich-text {
  padding-top: clamp(2.5rem, 6vw, 4.5rem);
  padding-bottom: clamp(2.5rem, 6vw, 4.5rem);
}

.mk3-sdc--rich-text .mk3-sdc__inner {
  max-width: 50rem; /* comfortable prose measure */
  margin: 0 auto;
  padding-left: clamp(1.25rem, 4vw, 3rem);
  padding-right: clamp(1.25rem, 4vw, 3rem);
}

/* iframes (map embeds) pasted into html_text: keep them from overflowing
   the prose container on narrow viewports without touching their own
   inline styles. */
.mk3-sdc--rich-text .mk3-sdc__inner iframe {
  max-width: 100%;
}

/* Full-content-width photo band (html/About.html §image band). Centred to the
 * same 80rem measure as every other section's .mk3-*__inner. The Drupal field
 * wrapper around the <img> (`.field.field--name-field-image` / `.field__item`)
 * and the intrinsic `width="…"` on the rendered image are both forced to 100%
 * so the photo actually fills the band instead of sitting at its native size,
 * left-aligned — the bug this rule fixes. */
.mk3-sdc__image-band {
  margin-top: clamp(2rem, 5vw, 3.5rem);
  max-width: 80rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 3rem;
  padding-right: 3rem;
}

.mk3-sdc__image-band .field,
.mk3-sdc__image-band .field__item {
  width: 100%;
}

.mk3-sdc__image-band img {
  display: block;
  width: 100%;
  height: clamp(280px, 40vw, 460px);
  object-fit: cover;
  border-radius: 0 0 22px 22px;
}

@media (max-width: 768px) {
  .mk3-sdc--rich-text .mk3-sdc__inner {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .mk3-sdc__image-band {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }

  .mk3-sdc__image-band img {
    height: clamp(200px, 55vw, 300px);
  }
}

/* "legal-prose" field_css_tag variant — long-form legal pages (Privacy Policy,
 * Terms of Service, Legal Notice) authored as clean semantic HTML in
 * field_html_text with no inline styles. Type scale ported from
 * .mk3-article__body (css/custom.css) but tightened for dense reference text. */
.mk3-sdc--rich-text.legal-prose .mk3-sdc__inner {
  max-width: 46rem;
}
.legal-prose .mk3-sdc__inner h2 {
  font-family: 'Archivo', sans-serif;
  font-weight: 800;
  font-size: 26px;
  letter-spacing: -.02em;
  margin: 40px 0 12px;
}
.legal-prose .mk3-sdc__inner h2:first-child {
  margin-top: 0;
}
.legal-prose .mk3-sdc__inner h3 {
  font-family: 'Archivo', sans-serif;
  font-weight: 700;
  font-size: 19px;
  margin: 26px 0 8px;
}
.legal-prose .mk3-sdc__inner p,
.legal-prose .mk3-sdc__inner li {
  font-size: 16px;
  line-height: 1.75;
  color: #2A2A30;
}
.legal-prose .mk3-sdc__inner p {
  margin: 0 0 18px;
}
.legal-prose .mk3-sdc__inner ul,
.legal-prose .mk3-sdc__inner ol {
  margin: 0 0 18px;
  padding-left: 1.25em;
}
.legal-prose .mk3-sdc__inner li {
  margin-bottom: 8px;
}
.legal-prose .mk3-sdc__inner a {
  color: #FF2D6B;
  font-weight: 700;
}
.legal-prose .mk3-sdc__inner strong {
  font-weight: 700;
  color: #0F0F12;
}
.legal-prose .mk3-sdc__inner .legal-meta {
  font-size: 14px;
  color: #6A6A72;
  margin-bottom: 32px;
}