.bbd-featured-content-grid {
  .text-block h2 {
    text-decoration: underline;
    text-decoration-color: rgba(0, 0, 0, 0.15);
    text-decoration-thickness: 1px;
    text-underline-offset: 0;

    @media screen and (width > 990px) {
      font-size: var(--font-size--6xl);
    }
  }
}

.bbd-featured-content-grid__header {
  grid-column: 1 / 10;
}

.bbd-featured-content-grid__group {
  grid-column: 1 / -1;
  margin-block-start: 2.5rem;

  &.bbd-featured-content-grid__group--first {
    grid-column-end: 8;
  }

  &.bbd-featured-content-grid__group--second {
    grid-column-start: 4;
  }

  &.bbd-featured-content-grid__group--third {
    grid-column-end: 10;
  }
}

@media screen and (width > 750px) {
  .bbd-featured-content-grid__group {
    &.bbd-featured-content-grid__group--first {
      grid-column-end: span 6;
    }

    &.bbd-featured-content-grid__group--second {
      grid-column-start: 7;
      margin-block-start: 5rem;
    }

    &.bbd-featured-content-grid__group--third {
      grid-column-end: span 10;
    }
  }
}

@media screen and (width > 990px) {
  .bbd-featured-content-grid__header {
    grid-row: 1 / 2;
    grid-column: 1 / span 4;
  }

  .bbd-featured-content-grid__group {
    margin-block-start: 0;

    &.bbd-featured-content-grid__group--first {
      margin-block-start: 5rem;
      grid-row: 2 / 3;
      grid-column: 1 / span 3;
    }

    &.bbd-featured-content-grid__group--second {
      grid-row: 2 / 3;
      grid-column: 4 / span 3;
      margin-block-start: 10rem;
    }

    &.bbd-featured-content-grid__group--third {
      grid-row: 1 / 3;
      grid-column: 7 / -1;
    }
  }
}

@media screen and (width > 1400px) {
  .bbd-featured-content-grid__group {
    &.bbd-featured-content-grid__group--first {
      margin-block-start: 8rem;
    }

    &.bbd-featured-content-grid__group--second {
      margin-block-start: 16rem;
    }
  }
}
