.related-article-section__container {
  @apply flex w-full flex-col;
  @apply xl:mx-auto xl:max-w-[72.5rem];
}

.related-article-section__container article {
  @apply relative;
}

.related-article-section__container .text-box {
  @apply flex flex-col gap-6 xl:gap-2.5;
}

.related-article-section__container h3 {
  @apply max-w-[350px];
}

.related-article-section__container article > a {
  @apply absolute top-0 left-0 h-full w-full;
  @apply xl:hidden;
}

.related-article-section__container > h4 {
  @apply mb-1 text-center text-primary-cool-75;
  @apply xl:mb-5 xl:text-left;
}

.related-article-section__content-wrapper {
  @apply mt-10 flex flex-col gap-10;
  @apply xl:mt-7;
}

.related-article-section__content-wrapper--hr {
  @apply block h-2 w-full bg-basic-greyscale-40;
  @apply xl:rounded-full;
}

.related-article-section__article {
  @apply flex max-w-[400px] flex-col gap-4 px-3;
  @apply mx-auto xl:mx-0 xl:max-w-full xl:flex-row xl:gap-5 xl:px-0;
}

.related-article-section__article--img {
  @apply h-[170px] w-[350px] rounded-xl object-cover;
  @apply xl:h-[100px] xl:w-[150px];
}

.related-article-section__article--link {
  @apply z-10 w-[280px] self-center;
  @apply xl:mt-auto xl:self-start;
}