.featured-content {
  --bg-color: var(--color-white);
  background-color: var(--bg-color);
  margin-top: var(--spacing-y);
  margin-bottom: var(--spacing-y);
}

.featured-content--white.featured-content--remove-decorative-image .featured-content__container {
  padding-top: 0;
  padding-bottom: 0;
}

.featured-content--gray {
  --bg-color: var(--color-gray);
}

.featured-content--yellow {
  --bg-color: var(--color-yellow);
}

.featured-content__container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-top: var(--container-padding-y);
  padding-bottom: var(--container-padding-y);
  min-height: auto;
}

@media (min-width: 768px) {
  .featured-content--one-column .featured-content__container,
  .featured-content--one-column-reverse .featured-content__container {
    min-height: 450px;
  }
}

.featured-content__grid {
  display: flex;
  flex-direction: column; /* default mobile stacking */
  justify-content: flex-start;
  gap: 1rem;
}

@media (min-width: 768px) {
  .featured-content__grid {
    gap: 4rem;
  }
}

/* Text alignment for one-column variants */
.featured-content__grid--one-column,
.featured-content__grid--one-column-reverse {
  text-align: center;
}

/* Reverse column order for one-column */
.featured-content__grid--one-column-reverse {
  flex-direction: column-reverse;
}

/* Responsive behavior for two-column layout */
.featured-content__grid--two-column,
.featured-content__grid--two-column-reverse {
  text-align: left;
}

/* Apply horizontal layout only on medium+ screens */
@media (min-width: 768px) {
  .featured-content__grid--two-column {
    flex-direction: row;
  }

  .featured-content__grid--two-column-reverse {
    flex-direction: row-reverse;
  }
}

.featured-content__grid-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex: 1;
}

.featured-content__title {
  font-size: 2.5rem;
  line-height: 1.2;
  font-weight: bold;
  color: var(--color-dark-blue);
}

.featured-content__grid-item--media .field--type-entity-reference {
  margin: 0;
}

.featured-content__grid-item--media .field--name-field-media-oembed-video {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
}

.featured-content__grid-item--media .field--name-field-media-oembed-video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}