.post-results-list,
.search-results-list {
  display: grid;
  gap: 3rem;
  list-style: none;
  padding: 0;
}
@media screen and (min-width: 520px) {
  .search-results-list {
    grid-template-columns: repeat(auto-fit, minmax(26rem, 1fr));
  }
}
.post-results-list li,
.search-results-list li a {
  border-radius: 0.25rem;
  overflow: hidden;
  display: grid;
  gap: 2rem;
  /* place-items: center; */
  text-decoration: none;
  padding-bottom: 0rem;
}

.search-results-list .post-news-thumbnail-container img {
  height: 100%;
}
.post-results-list .post-news-thumbnail-container img,
.search-results-list .post-news-thumbnail-container img {
  opacity: 1;
  aspect-ratio: 16/9;
  border-radius: 0.5rem;
  overflow: hidden;
}
.post-results-list .post-news-content > div > p,
.search-results-list .post-news-content > div > p {
  color: var(--primary-blue);
}

.news-post-info {
  text-transform: uppercase;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  row-gap: 0;
  align-items: center;
}

.news-post-info span:nth-child(2) {
  height: 0.25rem;
  width: 0.25rem;
  background: var(--primary-blue);
  border-radius: 50%;
  display: block;
}
/* .post-news-excerpt {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
} */
@media screen and (min-width: 1024px) {
  .post-results-list,
  .search-results-list {
    list-style: none;
    padding: 0;
  }
  .post-results-list li {
    display: grid;
    gap: 2rem;
    padding-bottom: 0;
  }
  /* .search-results-list li a {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    place-items: center;
    border-radius: 0.25rem;
    overflow: hidden;
    padding-bottom: 0rem;
  } */
  .search-results-list li a {
    display: grid;
    grid-template-columns: 8rem 1fr;
    gap: 1.5rem;
    text-decoration: none;
    border-radius: 0.25rem;
    overflow: hidden;
    padding: 1.5rem;
    transition: all 0.2s;
  }
  .search-results-list li a:hover {
    background-color: #fff;
    box-shadow: 0 0 1.5rem rgba(0, 0, 0, 0.25);
    transition: all 0.2s;
  }
  .post-results-list li:first-child .post-news-excerpt {
    color: white;
  }
  .post-results-list li:first-child .post-news-content h2.fs-2 {
    font-size: var(--fs-3);
  }
  .post-results-list li:first-child .post-news-content > div > p {
    color: white;
  }
  .post-results-list li:first-child .news-post-info span:nth-child(2) {
    height: 0.25rem;
    width: 0.25rem;
    background: white;
  }
  .post-results-list li:first-child {
    grid-column-start: 1;
    grid-column-end: 3;
    display: flex;
    color: #fff;
    gap: 0;
    place-items: center;
    justify-content: center;
    width: 100%;
    position: relative;
  }
  .post-results-list.search li:first-child {
    grid-column-start: 1;
    grid-column-end: 2;
  }
  .post-results-list li:first-child .post-news-thumbnail-container {
    width: 100%;
    margin-right: -100%;
  }
  .post-results-list li:first-child:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    /* background-color: rgba(0, 0, 0, 0.5); */
    background: linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.5) 0%,
      rgba(255, 255, 255, 0.5) 100%
    );
  }
  .post-results-list li:first-child .post-news-content {
    width: 100%;
    z-index: 9;
  }
  .post-results-list li:first-child .post-news-content > div * {
    max-width: var(--w-3xs);
  }
  .post-results-list li:first-child .post-news-content > div {
    max-width: var(--content-width);
    margin: 0 auto;
  }
}
@media screen and (min-width: 1280px) {
  .post-results-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    list-style: none;
    padding: 0;
  }
  .post-results-list li {
    border-radius: 0.25rem;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    place-items: center;
  }
  .post-results-list .post-news-thumbnail-container {
    height: 100%;
  }
  .post-results-list .post-news-thumbnail-container img {
    height: 100%;
  }
}

.wp-pagenavi .nextpostslink {
  --padding: 0.5rem 3rem;
  --color: var(--white);
  --hColor: var(--torquise);
  --fColor: var(--torquise);
  --aColor: var(--torquise);
  --background: var(--torquise);
  --hBackground: 0 0;
  --fBackground: 0 0;
  --aBackground: 0 0;
  --border: 2px solid var(--torquise);
  --hBorder: 2px solid var(--torquise);
  --fBorder: 2px solid var(--torquise);
  --aBorder: 2px solid var(--torquise);
}
