/**
 * Blog teaser list (paragraph)
 */

.article-list {
  position: relative;
  overflow-x: clip;

  background:
    linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 88%),
    url(../../images/section/background_plantes.webp) -71.594px 0 / 164.091% 100% no-repeat;

  padding-bottom: 71px;

}
.article-list::before {
  content: "";
  position: absolute;
  z-index: 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url(../../images/section/plantes.svg);

  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;

  position: absolute;
  right: 50%;
  transform: translateX(50%);
  top: -120px;

  width: 290px;
  height: 210px;
}
.article-list__articles {
  overflow: visible;
}
.article-list .grid-row {
  height: 100%;
}

.article-list__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 48px;

  height: 100%;
}


.article-list__title {
  font-size: var(--heading-size-l);
  line-height: 130%; /* 39px */
  color: var(--color-white);
}

h2.article-list__title  {
  margin: 0;
}

.article-list__text {
  color : var(--color-white);
  max-width: 292px;
  margin: 0 auto;
}

.article-list__text p {
  margin: 0;
}

.article-list__content {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 24px;

  padding: 80px 0 48px;
}

.article-list__link {
  text-align: center;
}

.article-list__link .cta {
  font-family: var(--font-condensed);
  font-weight: var(--fw-medium);
  font-size: 18px;
}

@media all and (min-width:450px) {
  .article-list {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
}

@media all and (min-width: 1000px) {
  .article-list {
    background: linear-gradient(112deg, #000 32.46%, rgba(0, 0, 0, 0.00) 99.54%),
              url(../../images/section/background_plantes.webp) 50% / cover no-repeat;
  }

  .article-list__content {
    padding-bottom: 0;
  }

  .article-list__text {
    max-width: 100%;
  }
}


@media all and (min-width: 1300px) {
  .article-list {
    height: 898px;
    padding: 0;
  }

  .article-list__content {
    padding: 0;
  }

  .article-list::before {
    top: -128px;
    width: 478px;
    height: 206px;
}
}

/**
 * Special code for taxo pages
 */

.need-taxo__footer .article-list {
  margin-top: 5rem;
}
@media all and (min-width: 1300px){
  .need-taxo__footer .article-list {
    margin-top: 10rem;
  }
}
.need-taxo__footer .article-list + div {
  overflow: hidden;
}
