.field--name-field-views-selection:has(.view .article-cards) .viewsreference--view-title {
  margin: 30px 0 45px 0;
  color: var(--under-the-elms);
  font-family: var(--text-display);
  font-size: 22px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  text-transform: uppercase;
}

.mod-page-container[style*="background: #00694E;"] .field--name-field-views-selection:has(.view .article-cards) .viewsreference--view-title,
.mod-page-container[style*="background: #024230;"] .field--name-field-views-selection:has(.view .article-cards) .viewsreference--view-title,
.mod-page-container[style*="background: #524D47;"] .field--name-field-views-selection:has(.view .article-cards) .viewsreference--view-title {
  color: var(--white);
}

.modInnerContent[style*="background-color:rgba(0, 105, 78, 1);"] .field--name-field-views-selection:has(.view .article-cards) .viewsreference--view-title,
.modInnerContent[style*="background-color:rgba(2, 66, 48, 1);"] .field--name-field-views-selection:has(.view .article-cards) .viewsreference--view-title,
.modInnerContent[style*="background-color:rgba(82, 77, 71, 1);"] .field--name-field-views-selection:has(.view .article-cards) .viewsreference--view-title {
  color: var(--white);
}

.modInnerContent[style*="background-color:rgba(255, 255, 255, 1);"] .field--name-field-views-selection:has(.view .article-cards) .viewsreference--view-title {
  color: var(--under-the-elms);
}

.field--name-field-views-selection:has(.view .article-cards) .viewsreference--view-title::after {
  content: '';
  display: block;
  height: 5px;
  width: 50px;
  background: var(--marigold);
  margin-top: 10px;
}

.view .article-cards ul {
  display: grid;
  grid-template-columns: 1fr;
  gap: 30px;
  list-style: none;
  padding: 0;
}

@media only screen and (min-width: 992px) {
  .view .article-cards ul {
    grid-template-columns: repeat(3, 1fr);
  }
}

.view .article-cards ul li {
  display: flex;
  margin-bottom: 0;
}

.view .article-cards ul li a:hover img,
.view .article-cards ul li a:focus img {
  transform: scale(1.1);
}

.view .article-cards ul a {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  height: 100%;
}

.view .article-cards ul a:focus {
  outline: none !important;
  border: 2px solid #85b7d1;
}

.view .article-cards ul a .field--name-field-image {
  display: flex;
  overflow: hidden;
}

.view .article-cards ul a img {
  width: 100%;
  max-height: 240px;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  transition: var(--transition-default);
}

.view .article-cards ul .text-content {
  flex: 1;
  padding: 30px;
  transition: var(--transition-default);
  background: var(--light-gray);
}

.view .article-cards ul li a:hover .text-content,
.view .article-cards ul li a:focus .text-content {
  background: var(--under-the-elms);
}

.mod-page-container:not(:is([style=""], [style*="background: #FFFFFF;"])) .view .article-cards ul li a .text-content,
.modInnerContent:is([style*="background-color:rgba(249, 247, 237, 1);"]) .view .article-cards ul li a .text-content {
  background: var(--white);
}

.modInnerContent:not([style=""], [style*="background-color:rgba(255, 255, 255, 1);"]) .view .article-cards ul li a:hover .text-content,
.modInnerContent:not([style=""], [style*="background-color:rgba(255, 255, 255, 1);"]) .view .article-cards ul li a:focus .text-content {
  background: var(--under-the-elms);
}

.mod-page-container[style=""] .view .article-cards ul li a:hover .text-content,
.mod-page-container[style*="background: #FFFFFF;"] .view .article-cards ul li a:hover .text-content,
.mod-page-container[style=""] .view .article-cards ul li a:focus .text-content,
.mod-page-container[style*="background: #FFFFFF;"] .view .article-cards ul li a:focus .text-content,
.modInnerContent[style=""] .view .article-cards ul li a:hover .text-content,
.modInnerContent[style*="background-color:rgba(255, 255, 255, 1);"] .view .article-cards ul li a:focus .text-content,
.modInnerContent[style=""] .view .article-cards ul li a:focus .text-content,
.modInnerContent[style*="background-color:rgba(255, 255, 255, 1);"] .view .article-cards ul li a:focus .text-content {
  background: var(--under-the-elms);
}

.mod-page-container[style*="background: #024230;"] .view .article-cards ul li a:hover .text-content,
.mod-page-container[style*="background: #024230;"] .view .article-cards ul li a:focus .text-content {
  background: var(--cutler);
}

.modInnerContent[style*="background-color:rgba(82, 77, 71, 1);"] .view .article-cards ul li a:hover .text-content,
.modInnerContent[style*="background-color:rgba(82, 77, 71, 1);"] .view .article-cards ul li a:focus .text-content {
  background: var(--under-the-elms);
}

.modInnerContent[style*="background-color:rgba(2, 66, 48, 1);"] .view .article-cards ul li a:hover .text-content,
.modInnerContent[style*="background-color:rgba(2, 66, 48, 1);"] .view .article-cards ul li a:focus .text-content {
  background: var(--cutler);
}

.modInnerContent[style*="background-color:rgba(255, 255, 255, 1);"] .view .article-cards ul li a:hover .text-content,
.modInnerContent[style*="background-color:rgba(255, 255, 255, 1);"] .view .article-cards ul li a:focus .text-content {
  background: var(--under-the-elms);
}

.view .article-cards ul .text-content .field--name-field-publication-date {
  color: var(--middle-gray);
  font-family: var(--text-sans);
  font-size: 12px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  letter-spacing: 0.36px;
  text-transform: uppercase;
  transition: var(--transition-default);
}

.view .article-cards ul li a:hover .text-content .field--name-field-publication-date,
.view .article-cards ul li a:focus .text-content .field--name-field-publication-date {
  color: var(--sycamore);
}

.view .article-cards ul .text-content .article-title {
  color: var(--black);
  font-family: var(--text-serif);
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  transition: var(--transition-default);
}

.view .article-cards ul .text-content .article-abstract {
  color: var(--black);
  font-family: var(--text-sans);
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 27px;
  transition: var(--transition-default);
}

.view .article-cards ul li a:hover .text-content .article-title,
.view .article-cards ul li a:hover .text-content .article-abstract,
.view .article-cards ul li a:focus .text-content .article-title,
.view .article-cards ul li a:focus .text-content .article-abstract {
  color: var(--white);
}