/**
 * acf-intro-split — interface.pen (50/50 copy + square image + gradient divider).
 */

.acf-intro-split.alignfull,
.acf-intro-split.alignwide {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

.acf-intro-split {
  position: relative;
  overflow: hidden;
  /* Full section padding on all sides. Bottom padding used to be 0 and
   * only restored by the --has-divider modifier, which left divider-less
   * blocks flush against the next section. */
  padding: var(--block-pad-block) var(--block-pad-inline);
  font-family: var(--font-family-base);
  color: var(--color-brand-slate);
  background-color: var(--color-light);
}

/* Optional #F8F9F9 section background (token: --color-brand-shape). */
.acf-intro-split.acf-intro-split--shape-bg {
  background-color: var(--color-brand-shape);
}

.acf-intro-split__container {
  position: relative;
  z-index: 1;
  width: 100%;
}

.acf-intro-split__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--block-gap);
  width: 100%;
  align-items: center;
}

@media (min-width: 1024px) {
  .acf-intro-split__grid {
    /* minmax(0,1fr) — large img width/height attrs must not crush the text column */
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}

.acf-intro-split__content,
.acf-intro-split__media {
  min-width: 0;
  width: 100%;
}

.acf-intro-split__content {
  display: flex;
  flex-direction: column;
  gap: var(--block-content-gap);
}

/* Beat .entry-content h2 reset for brand slate + 48px title from Pencil. */
.acf-intro-split h2.acf-intro-split__title,
.entry-content .acf-intro-split h2.acf-intro-split__title,
.wp-block-post-content .acf-intro-split h2.acf-intro-split__title,
.editor-styles-wrapper .acf-intro-split h2.acf-intro-split__title {
  margin: 0;
  font-family: var(--font-family-base);
  font-size: var(--font-size-3xl);
  font-weight: var(--font-weight-bold);
  font-style: normal;
  line-height: var(--line-height-tight);
  letter-spacing: var(--letter-spacing-tight);
  color: var(--color-brand-slate);
}

.acf-intro-split__text {
  margin: 0;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-light);
  line-height: var(--line-height-normal);
  color: var(--color-brand-slate);
}

/* Two-column body copy — interface.pen trained-standards layout (24px gap). */
.acf-intro-split__text-columns {
  display: flex;
  flex-direction: column;
  gap: var(--block-content-gap);
  width: 100%;
}

@media (min-width: 768px) {
  .acf-intro-split--text-two-columns .acf-intro-split__text-columns {
    flex-direction: row;
    align-items: flex-start;
  }
}

.acf-intro-split__text-columns .acf-intro-split__text,
.acf-intro-split__text-column-two {
  flex: 1 1 0;
  min-width: 0;
  margin: 0;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-light);
  line-height: var(--line-height-normal);
  color: var(--color-brand-slate);
}

.acf-intro-split__text p,
.acf-intro-split__text-column-two p {
  margin: 0 0 1em;
  color: inherit;
}

/* WYSIWYG Bold. Parent copy is weight 300; UA bolder(300) = 400 (same Roman face). */
.acf-intro-split__text strong,
.acf-intro-split__text b,
.acf-intro-split__text-column-two strong,
.acf-intro-split__text-column-two b {
  font-weight: var(--font-weight-bold);
}

.acf-intro-split__text p:last-child,
.acf-intro-split__text-column-two p:last-child {
  margin-bottom: 0;
}

.acf-intro-split__text-column-two ul,
.acf-intro-split__text-column-two ol {
  margin: 0;
  padding: 0;
  list-style: none;
}

.acf-intro-split__text-column-two li {
  position: relative;
  margin: 0;
  padding-left: var(--space-sm);
}

.acf-intro-split__text-column-two li + li {
  margin-top: 0.75rem;
}

.acf-intro-split__text-column-two li::before {
  content: "";
  position: absolute;
  top: 0.55em;
  left: 0;
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 50%;
  background-color: var(--color-brand-slate);
}

.acf-intro-split__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.75rem var(--block-gap);
  width: 100%;
}

@media (min-width: 640px) {
  .acf-intro-split__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.acf-intro-split__list-item {
  position: relative;
  margin: 0;
  padding-left: var(--space-sm);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-light);
  line-height: var(--line-height-normal);
  color: var(--color-brand-slate);
}

.acf-intro-split__list-item::before {
  content: "";
  position: absolute;
  top: 0.55em;
  left: 0;
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 50%;
  background-color: var(--color-brand-slate);
}

.acf-intro-split__actions {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  gap: var(--block-content-gap);
  margin: 0;
}

.acf-intro-split__media {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  min-width: 0;
  max-width: 100%;
}

/* Absolute fill — keeps 1237px manifest width/height attrs out of grid min-content sizing */
.acf-intro-split__media .acf-intro-split__img,
.acf-intro-split__media img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
  object-position: center;
}

/* interface.pen acf-intro-split__divider — 4px brand gradient bar */
.acf-intro-split__divider {
  position: absolute;
  bottom: 0;
  left: 50%;
  z-index: 2;
  width: 100%;
  max-width: var(--container-wide);
  height: var(--divider-height);
  transform: translateX(-50%);
  background: var(--gradient-brand);
}
