@charset "UTF-8";
/**
 * Two-column split: text + image. Flippable on desktop; stacks on small viewports.
 * Uses --bfs-* contract tokens from the active theme; STYLE tab via module-surface.css.
 */
@layer m-two-column-image {
  .m-two-column-image {
    --tci-bg: transparent;
    --tci-fg: var(--rd-surface-heading-fg, var(--bfs-color-black, #191919));
    --tci-body-fg: var(--rd-surface-body-fg, var(--bfs-color-black, #191919));
    --tci-gap: clamp(1.5rem, 4vw, 3rem);
    --tci-image-radius: var(--bfs-radius-md, clamp(1rem, 2.4vw, 1.75rem));
    --tci-image-aspect: 4 / 3;
    --tci-content-fr: 6;
    --tci-media-fr: 6;
    --tci-stack-bp: 63.99rem;
    --tci-font-heading: var(--bfs-font-heading, system-ui, sans-serif);
    --tci-font-body: var(--bfs-font-body, system-ui, sans-serif);
    --tci-bg-outer-top: transparent;
    --tci-bg-outer-bottom: transparent;
    --tci-band-py: clamp(1.75rem, 4vw, 3rem);
    --tci-mobile-overhang: clamp(1.25rem, 5vw, 2.5rem);
    /* Top-only breakout: gap between image bottom and band bottom; band bleed hides sub-pixel seam at band/next-section edge. */
    --tci-breakout-img-gap: 2rem;
    --tci-breakout-band-bleed: 2px;
    --tci-media-bg: var(--bfs-color-surface, #f2f2f6);
    --tci-inner-bg-image: none;
    --tci-inner-bg-repeat: no-repeat;
    --tci-inner-bg-size: cover;
    --tci-inner-bg-overlay: rgba(0, 0, 0, 0.4);
    container-name: tci;
    container-type: inline-size;
    background-color: var(--tci-bg);
    background-image: var(--tci-inner-bg-image);
    background-repeat: var(--tci-inner-bg-repeat);
    background-size: var(--tci-inner-bg-size);
    background-position: center;
    color: var(--tci-fg);
    font-family: var(--tci-font-body);
    --rd-surface-body-fallback: var(--tci-body-fg);
  }
  .m-two-column-image__grid {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--tci-gap);
  }
  .m-two-column-image--image-left .m-two-column-image__grid {
    flex-direction: row-reverse;
  }
  [data-rd-module-surface].m-two-column-image .rd-module-surface__inner {
    text-align: initial;
  }
  .m-two-column-image__content {
    flex: var(--tci-content-fr) 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  .m-two-column-image[data-rd-align=center] .m-two-column-image__content {
    align-items: center;
  }
  .m-two-column-image[data-rd-align=right] .m-two-column-image__content {
    align-items: flex-end;
  }
  .m-two-column-image__media {
    flex: var(--tci-media-fr) 1 0;
    min-width: 0;
  }
  .m-two-column-image--split-5-7 {
    --tci-content-fr: 5;
    --tci-media-fr: 7;
  }
  .m-two-column-image--split-4-8 {
    --tci-content-fr: 4;
    --tci-media-fr: 8;
  }
  .m-two-column-image--split-3-9 {
    --tci-content-fr: 3;
    --tci-media-fr: 9;
  }
  .m-two-column-image--split-7-5 {
    --tci-content-fr: 7;
    --tci-media-fr: 5;
  }
  .m-two-column-image--split-8-4 {
    --tci-content-fr: 8;
    --tci-media-fr: 4;
  }
  .m-two-column-image__stack {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    max-width: 38rem;
    width: 100%;
  }
  .m-two-column-image[data-rd-align=left] .m-two-column-image__stack {
    text-align: left;
  }
  .m-two-column-image[data-rd-align=center] .m-two-column-image__stack {
    text-align: center;
  }
  .m-two-column-image[data-rd-align=right] .m-two-column-image__stack {
    text-align: right;
  }
  .m-two-column-image__heading :where(h1, h2, h3, h4, h5, h6) {
    margin: 0;
    font-family: var(--bfs-h3-font-family, var(--tci-font-heading));
    font-size: var(--bfs-h3-font-size, 1.5rem);
    font-weight: var(--bfs-h3-font-weight, 700);
    letter-spacing: var(--bfs-h3-letter-spacing, normal);
    text-transform: var(--bfs-h3-text-transform, none);
    line-height: var(--bfs-h3-line-height, 1.12);
  }
  .m-two-column-image__body {
    line-height: var(--bfs-body-line-height, 1.5);
  }
  .m-two-column-image__body :where(p) {
    margin: 0;
  }
  .m-two-column-image__body :where(p + p) {
    margin-top: 0.75rem;
  }
  .m-two-column-image__body :where(ul, ol) {
    margin: 0.5rem 0 0;
    padding-left: 1.5rem;
    text-align: left;
  }
  .m-two-column-image[data-rd-align=center] .m-two-column-image__body :where(ul, ol),
  .m-two-column-image[data-rd-align=right] .m-two-column-image__body :where(ul, ol) {
    display: inline-block;
    text-align: left;
  }
  .m-two-column-image__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 0.25rem;
  }
  .m-two-column-image[data-rd-align=center] .m-two-column-image__actions {
    justify-content: center;
  }
  .m-two-column-image[data-rd-align=right] .m-two-column-image__actions {
    justify-content: flex-end;
  }
  .m-two-column-image__figure {
    margin: 0;
    border-radius: var(--tci-image-radius);
    overflow: hidden;
    aspect-ratio: var(--tci-image-aspect);
    background-color: color-mix(in srgb, var(--tci-fg) 8%, var(--tci-media-bg));
  }
  .m-two-column-image__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  @media (min-width: 64rem) {
    .m-two-column-image__figure--max-h-d {
      aspect-ratio: unset;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: transparent;
    }
    .m-two-column-image__figure--max-h-d .m-two-column-image__img {
      width: auto;
      height: auto;
      max-width: 100%;
      max-height: var(--tci-image-max-h);
      object-fit: contain;
    }
  }
  .m-two-column-image--image-breakout {
    background-color: transparent !important;
    background-image: none;
    overflow: visible;
    /* Above preceding modules when image overlaps (do not wrap .m-two-column-image__media in [data-reveal]). */
    position: relative;
    z-index: 1;
  }
  .m-two-column-image--image-breakout .m-two-column-image__inner,
  .m-two-column-image--image-breakout .m-two-column-image__grid-stage,
  .m-two-column-image--image-breakout .m-two-column-image__grid {
    overflow: visible;
  }
  .m-two-column-image--image-breakout .m-two-column-image__grid-stage {
    position: relative;
    margin-top: var(--tci-pad-top);
    margin-bottom: var(--tci-pad-bottom);
  }
  .m-two-column-image--image-breakout .m-two-column-image__outer-top,
  .m-two-column-image--image-breakout .m-two-column-image__outer-bottom,
  .m-two-column-image--image-breakout .m-two-column-image__band {
    position: absolute;
    z-index: 0;
    width: 100vw;
    max-width: 100vw;
    left: 50%;
    margin-left: -50vw;
    pointer-events: none;
  }
  .m-two-column-image--image-breakout .m-two-column-image__outer-top {
    top: calc(-1 * var(--tci-pad-top));
    background-color: var(--tci-bg-outer-top, transparent);
  }
  .m-two-column-image--image-breakout .m-two-column-image__outer-bottom {
    bottom: calc(-1 * var(--tci-pad-bottom));
    background-color: var(--tci-bg-outer-bottom, transparent);
  }
  .m-two-column-image--image-breakout .m-two-column-image__band {
    background-color: var(--tci-inner-bg, var(--tci-bg));
    background-image: var(--tci-inner-bg-image, none);
    background-repeat: var(--tci-inner-bg-repeat, no-repeat);
    background-size: var(--tci-inner-bg-size, cover);
    background-position: center;
  }
  /* Inner background image overlay (optional STYLE toggle) — layered background
     avoids ::before stacking contexts that break image-breakout overlap. */
  .m-two-column-image--inner-bg-overlay:not(.m-two-column-image--image-breakout) {
    background-image: linear-gradient(var(--tci-inner-bg-overlay, rgba(0, 0, 0, 0.4)), var(--tci-inner-bg-overlay, rgba(0, 0, 0, 0.4))), var(--tci-inner-bg-image);
  }
  .m-two-column-image--inner-bg-overlay.m-two-column-image--image-breakout .m-two-column-image__band {
    background-image: linear-gradient(var(--tci-inner-bg-overlay, rgba(0, 0, 0, 0.4)), var(--tci-inner-bg-overlay, rgba(0, 0, 0, 0.4))), var(--tci-inner-bg-image, none);
  }
  .m-two-column-image--image-breakout .m-two-column-image__grid {
    position: relative;
    z-index: 1;
    align-items: center;
  }
  .m-two-column-image--image-breakout .m-two-column-image__content {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-self: center;
    padding-block: var(--tci-band-py);
    anchor-name: --tci-band-anchor;
  }
  .m-two-column-image--image-breakout .m-two-column-image__stack {
    position: relative;
    z-index: 1;
    width: 100%;
  }
  .m-two-column-image--image-breakout .m-two-column-image__media {
    position: relative;
    z-index: 1;
    align-self: center;
  }
  .m-two-column-image--image-breakout .m-two-column-image__figure {
    overflow: visible;
    background-color: transparent;
  }
  .m-two-column-image--image-breakout .m-two-column-image__figure--max-h-d,
  .m-two-column-image--image-breakout .m-two-column-image__figure--max-h-m {
    background-color: transparent;
  }
  @media (min-width: 64rem) {
    /* Top-only overlap: image bottom sits inside the band, with a small gap above the band bottom. */
    .m-two-column-image--image-breakout.m-two-column-image--breakout-overlap-top .m-two-column-image__grid {
      align-items: flex-end;
    }
    .m-two-column-image--image-breakout.m-two-column-image--breakout-overlap-top .m-two-column-image__figure {
      margin-bottom: var(--tci-breakout-img-gap);
    }
    .m-two-column-image--image-breakout .m-two-column-image__outer-top {
      position-anchor: --tci-band-anchor;
      bottom: anchor(top);
      height: auto;
    }
    .m-two-column-image--image-breakout .m-two-column-image__outer-bottom {
      position-anchor: --tci-band-anchor;
      top: anchor(bottom);
      height: auto;
    }
    .m-two-column-image--image-breakout .m-two-column-image__band {
      position-anchor: --tci-band-anchor;
      top: anchor(top);
      height: anchor-size(height);
      bottom: auto;
    }
    /* Top-only: stretch inner band (color or bg image) through grid bottom + section padding.
       Extra bleed past the bottom hides the sub-pixel seam where the band meets the next section. */
    .m-two-column-image--image-breakout.m-two-column-image--breakout-overlap-top .m-two-column-image__band {
      top: anchor(top);
      bottom: calc(-1 * var(--tci-pad-bottom) - var(--tci-breakout-band-bleed));
      height: auto;
    }
    .m-two-column-image--image-breakout.m-two-column-image--breakout-overlap-top .m-two-column-image__outer-bottom {
      display: none;
    }
    .m-two-column-image--image-breakout.m-two-column-image--breakout-overlap-top.m-two-column-image--has-inner-bg .m-two-column-image__band {
      background-position: center bottom;
    }
  }
  @supports not (anchor-name: --tci-band-anchor) {
    @media (min-width: 64rem) {
      .m-two-column-image--image-breakout .m-two-column-image__band {
        top: 50%;
        height: auto;
        min-height: calc(2 * var(--tci-band-py) + 10rem);
        transform: translateY(-50%);
      }
      .m-two-column-image--image-breakout.m-two-column-image--breakout-overlap-top .m-two-column-image__band {
        top: auto;
        bottom: calc(-1 * var(--tci-pad-bottom));
        transform: none;
      }
      .m-two-column-image--image-breakout.m-two-column-image--breakout-overlap-top .m-two-column-image__outer-bottom {
        display: none;
      }
    }
  }
  @media (max-width: 63.99rem) {
    .m-two-column-image__grid {
      flex-direction: column;
      align-items: stretch;
    }
    .m-two-column-image--image-left .m-two-column-image__grid {
      flex-direction: column;
    }
    .m-two-column-image__content,
    .m-two-column-image__media {
      flex: none;
      width: 100%;
    }
    .m-two-column-image__stack {
      max-width: none;
      margin-inline: 0;
    }
    .m-two-column-image--m-image-first .m-two-column-image__media {
      order: -1;
    }
    .m-two-column-image--image-breakout .m-two-column-image__content {
      anchor-name: none;
      padding-block: var(--tci-band-py);
      align-self: stretch;
    }
    .m-two-column-image--image-breakout .m-two-column-image__grid {
      align-items: stretch;
      gap: 0;
    }
    .m-two-column-image--image-breakout .m-two-column-image__media {
      align-self: stretch;
    }
    .m-two-column-image--image-breakout .m-two-column-image__outer-top,
    .m-two-column-image--image-breakout .m-two-column-image__outer-bottom {
      bottom: auto;
      height: auto;
    }
    .m-two-column-image--image-breakout.m-two-column-image--m-image-first .m-two-column-image__outer-top {
      display: block;
      height: calc(var(--tci-mobile-overhang) + var(--tci-pad-top));
    }
    .m-two-column-image--image-breakout.m-two-column-image--m-image-first .m-two-column-image__outer-bottom {
      display: none;
    }
    .m-two-column-image--image-breakout:not(.m-two-column-image--m-image-first) .m-two-column-image__outer-top {
      display: none;
    }
    .m-two-column-image--image-breakout:not(.m-two-column-image--m-image-first) .m-two-column-image__outer-bottom {
      display: block;
      top: auto;
      height: calc(var(--tci-mobile-overhang) + var(--tci-pad-bottom));
    }
    .m-two-column-image--image-breakout.m-two-column-image--m-image-first .m-two-column-image__band {
      top: var(--tci-mobile-overhang);
      bottom: 0;
      height: auto;
    }
    .m-two-column-image--image-breakout:not(.m-two-column-image--m-image-first) .m-two-column-image__band {
      top: 0;
      bottom: var(--tci-mobile-overhang);
      height: auto;
    }
    .m-two-column-image--image-breakout.m-two-column-image--m-image-first .m-two-column-image__figure {
      margin-top: calc(-1 * var(--tci-mobile-overhang));
    }
    .m-two-column-image--image-breakout:not(.m-two-column-image--m-image-first) .m-two-column-image__figure {
      margin-bottom: calc(-1 * var(--tci-mobile-overhang));
    }
    .m-two-column-image--m-img-wide .m-two-column-image__figure {
      aspect-ratio: 16/9;
    }
    .m-two-column-image--m-img-standard .m-two-column-image__figure {
      aspect-ratio: 4/3;
    }
    .m-two-column-image--m-img-square .m-two-column-image__figure {
      aspect-ratio: 1/1;
    }
    .m-two-column-image--m-img-tall .m-two-column-image__figure {
      aspect-ratio: 3/4;
    }
    .m-two-column-image__figure--max-h-m {
      aspect-ratio: unset;
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: transparent;
    }
    .m-two-column-image__figure--max-h-m .m-two-column-image__img {
      width: auto;
      height: auto;
      max-width: 100%;
      max-height: var(--tci-image-max-h-m);
      object-fit: contain;
    }
  }
}
[data-rd-module-surface].m-two-column-image--image-breakout {
  --tci-pad-top: var(--rd-surface-pt-m, var(--rd-surface-section-py));
  --tci-pad-bottom: var(--rd-surface-pb-m, var(--rd-surface-section-py));
}

[data-rd-module-surface].m-two-column-image--image-breakout .m-two-column-image__inner.rd-module-surface__inner {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

@media (min-width: 48rem) {
  [data-rd-module-surface].m-two-column-image--image-breakout {
    --tci-pad-top: var(--rd-surface-pt-t, var(--rd-surface-pt-m, var(--rd-surface-section-py)));
    --tci-pad-bottom: var(--rd-surface-pb-t, var(--rd-surface-pb-m, var(--rd-surface-section-py)));
  }
}
@media (min-width: 64rem) {
  [data-rd-module-surface].m-two-column-image--image-breakout {
    --tci-pad-top: var(
      --rd-surface-pt-l,
      var(--rd-surface-pt-t, var(--rd-surface-pt-m, var(--rd-surface-section-py)))
    );
    --tci-pad-bottom: var(
      --rd-surface-pb-l,
      var(--rd-surface-pb-t, var(--rd-surface-pb-m, var(--rd-surface-section-py)))
    );
  }
}
@media (min-width: 80rem) {
  [data-rd-module-surface].m-two-column-image--image-breakout {
    --tci-pad-top: var(
      --rd-surface-pt-d,
      var(--rd-surface-pt-l, var(--rd-surface-pt-t, var(--rd-surface-pt-m, var(--rd-surface-section-py))))
    );
    --tci-pad-bottom: var(
      --rd-surface-pb-d,
      var(--rd-surface-pb-l, var(--rd-surface-pb-t, var(--rd-surface-pb-m, var(--rd-surface-section-py))))
    );
  }
}