.resources-hub {
  --resources-blue: #326d94;
  --resources-copy: #5f6e78;
  --resources-rule: rgba(79, 120, 146, .2);
  color: var(--resources-copy);
  font-family: var(--font-primary);
}

.resources-hub__section {
  padding-block: clamp(3.5rem, 7vw, 6.5rem);
}

.resources-hub__eyebrow {
  color: #65839a;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .14em;
  margin-bottom: .75rem;
  text-transform: uppercase;
}

.resources-hub__title {
  color: var(--resources-blue);
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 2.5vw, 2.25rem);
  font-weight: 600;
  line-height: 1.2;
  margin: 0 0 1.25rem;
}

.resources-categories__intro {
  color: var(--resources-copy);
  font-size: clamp(1rem, 1.2vw, 1.125rem);
  line-height: 1.7;
  margin-bottom: clamp(1.75rem, 3vw, 2.5rem);
  max-width: 70ch;
}

.resources-categories__intro p { margin: 0; }

.resources-categories__grid {
  display: grid;
  gap: clamp(1rem, 1.7vw, 1.5rem);
  grid-auto-rows: minmax(0, auto);
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

.resources-category {
  min-width: 0;
  position: relative;
  transition: border-color 200ms ease, transform 200ms ease;
}

.resources-category--1 {
  background: #f0f6f9;
  border-radius: .75rem;
  grid-column: 1 / 9;
  grid-row: 1 / span 2;
}

.resources-category--2,
.resources-category--3 {
  border-bottom: 1px solid var(--resources-rule);
  grid-column: 9 / 13;
  min-height: 13rem;
}

.resources-category--2 { grid-row: 1; }
.resources-category--3 { grid-row: 2; }

.resources-category--4,
.resources-category--5 {
  background: #ffffff;
  border: 1px solid var(--resources-rule);
  border-radius: .75rem;
  grid-row: 3;
  min-height: 17rem;
}

.resources-category--4 { grid-column: 1 / 7; }
.resources-category--5 { grid-column: 7 / 13; }

.resources-category__link {
  color: inherit;
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: inherit;
  padding: clamp(1.5rem, 3vw, 2.5rem);
  position: relative;
  text-decoration: none;
  z-index: 1;
}

.resources-category__link h3 {
  color: var(--resources-blue);
  font-family: var(--font-display);
  font-size: clamp(1.2rem, 1.65vw, 1.55rem);
  font-weight: 600;
  line-height: 1.3;
  margin: 0 2rem .75rem 0;
}

.resources-category__link p {
  font-size: 1.3rem;
  line-height: 1.65;
  margin: 0;
  max-width: 56ch;
}

.resources-category__cta {
  align-items: center;
  border-bottom: 1px solid var(--resources-rule);
  color: var(--resources-blue);
  display: inline-flex;
  gap: .75rem;
  margin-top: auto;
  padding: 1.5rem 0 .45rem;
  width: fit-content;
}

.resources-category__arrow {
  font-size: 1.25rem;
  line-height: 1;
  transition: transform 200ms ease;
}

.resources-category__visual {
  bottom: 1.5rem;
  pointer-events: none;
  position: absolute;
  right: 1.5rem;
  top: 1.5rem;
  width: 42%;
  z-index: 0;
}

.resources-category__visual img {
  display: block;
  height: 100%;
  max-width: 100%;
  object-fit: contain;
  object-position: right center;
  width: 100%;
}

.resources-category--has-visual .resources-category__link { padding-right: 42%; }
.resources-category--1 .resources-category__visual { width: 48%; }
.resources-category--1 .resources-category__link { padding-right: 46%; }
.resources-category--2.resources-category--has-visual .resources-category__link,
.resources-category--3.resources-category--has-visual .resources-category__link { padding: 1.5rem 40% 1.5rem 0; }
.resources-category--2 .resources-category__visual,
.resources-category--3 .resources-category__visual { bottom: 1rem; right: 0; top: 1rem; width: 34%; }
.resources-category--4.resources-category--has-visual .resources-category__link,
.resources-category--5.resources-category--has-visual .resources-category__link { padding-right: 42%; }

.resources-category__link:hover .resources-category__arrow,
.resources-category__link:focus-visible .resources-category__arrow { transform: translateX(3px); }

.resources-category:hover,
.resources-category:focus-within { transform: translateY(-2px); }

.resources-category--1:hover,
.resources-category--1:focus-within,
.resources-category--4:hover,
.resources-category--4:focus-within,
.resources-category--5:hover,
.resources-category--5:focus-within { border-color: rgba(79, 120, 146, .45); }

.resources-band {
  background-color: #f0f6f9;
  isolation: isolate;
  overflow: visible;
  position: relative;
}

.resources-band::before {
  background: inherit;
  content: "";
  inset: 0 auto 0 50%;
  position: absolute;
  transform: translateX(-50%);
  width: 100vw;
  z-index: -1;
}

.resources-featured__grid {
  align-items: stretch;
  display: grid;
  gap: clamp(2rem, 4vw, 4rem);
  grid-template-columns: minmax(0, 1.3fr) minmax(16rem, 1fr);
}

.resources-featured__lead {
  align-items: start;
  display: grid;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  grid-template-columns: minmax(0, 1fr);
  min-width: 0;
}

.resources-publication__image-link {
  display: block;
  min-width: 0;
  overflow: hidden;
}

.resources-publication__image {
  aspect-ratio: 4 / 3;
  display: block;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.resources-publication__labels {
  color: #65839a;
  display: flex;
  flex-wrap: wrap;
  font-size: .75rem;
  font-weight: 700;
  gap: .4rem .8rem;
  letter-spacing: .08em;
  margin-bottom: .75rem;
  text-transform: uppercase;
}

.resources-publication__copy h3,
.resources-featured__item h3,
.resources-latest__item h3 {
  color: var(--resources-blue);
  font-family: var(--font-display);
  font-size: clamp(1.1rem, 1.5vw, 1.4rem);
  font-weight: 600;
  line-height: 1.35;
  margin: 0 0 .75rem;
}

.resources-publication__copy h3 a,
.resources-featured__item h3 a,
.resources-latest__item h3 a {
  color: inherit;
  text-decoration: none;
  transition: color 200ms ease;
}

.resources-publication__copy h3 a:hover,
.resources-featured__item h3 a:hover,
.resources-latest__item h3 a:hover { color: var(--color-links-hover); }

.resources-publication__copy p,
.resources-latest__item p {
  font-size: 1rem;
  line-height: 1.7;
  margin: 0 0 1rem;
}

.resources-publication__copy time,
.resources-featured__item time,
.resources-latest__item time {
  color: #65839a;
  display: inline-block;
  font-size: .875rem;
  margin-top: .25rem;
}

.resources-featured__supporting {
  display: flex;
  flex-direction: column;
}

.resources-featured__item {
  border-top: 1px solid var(--resources-rule);
  padding: 1.25rem 0;
}

.resources-featured__item:first-child { padding-top: 0; }
.resources-featured__item:last-child { padding-bottom: 0; }
.resources-featured__item h3 { margin-bottom: .4rem; }

.resources-latest__grid {
  display: grid;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.resources-latest__item { min-width: 0; }
.resources-latest__item .resources-publication__image-link { margin-bottom: 1.25rem; }
.resources-latest__item .resources-publication__image { aspect-ratio: 16 / 10; }

.resources-latest__item h3 { font-size: clamp(1.05rem, 1.4vw, 1.25rem); }

@media (max-width: 991.98px) {
  .resources-categories__grid { grid-auto-rows: minmax(0, auto); }
  .resources-category--1 { grid-column: 1 / 8; }
  .resources-category--2,
  .resources-category--3 { grid-column: 8 / 13; }
  .resources-category--4 { grid-column: 1 / 7; }
  .resources-category--5 { grid-column: 7 / 13; }
  .resources-featured__grid { grid-template-columns: minmax(0, 1.1fr) minmax(15rem, .9fr); }
  .resources-featured__lead { grid-template-columns: 1fr; }
}

@media (max-width: 767.98px) {
  .resources-hub__section { padding-block: 3rem; }
  .resources-categories__grid,
  .resources-featured__grid,
  .resources-latest__grid { grid-template-columns: minmax(0, 1fr); }
  .resources-categories__grid { grid-auto-rows: auto; }
  .resources-category--1,
  .resources-category--2,
  .resources-category--3,
  .resources-category--4,
  .resources-category--5 {
    grid-column: 1;
    grid-row: auto;
  }
  .resources-category--2,
  .resources-category--3,
  .resources-category--4,
  .resources-category--5 { min-height: 0; }
  .resources-category__link { padding: 1.5rem; }
  .resources-category--has-visual .resources-category__link { min-height: 13rem; padding-right: 34%; }
  .resources-category--1 .resources-category__link { padding-right: 34%; }
  .resources-category__visual { bottom: 1rem; height: 6rem; right: 1rem; top: auto; width: 28%; }
  .resources-category--1 .resources-category__visual { width: 34%; }
  .resources-category--2.resources-category--has-visual .resources-category__link,
  .resources-category--3.resources-category--has-visual .resources-category__link { padding: 1.5rem 34% 1.5rem 1.5rem; }
  .resources-category--2 .resources-category__visual,
  .resources-category--3 .resources-category__visual { bottom: 1rem; right: 1rem; top: auto; width: 28%; }
  .resources-featured__grid { gap: 2rem; }
  .resources-featured__lead { grid-template-columns: minmax(0, 1fr); }
  .resources-featured__lead .resources-publication__image-link { max-width: 34rem; }
  .resources-latest__grid { gap: 2.25rem; }
  .resources-latest__item { border-top: 1px solid var(--resources-rule); padding-top: 1.5rem; }
  .resources-latest__item:first-child { border-top: 0; padding-top: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .resources-category,
  .resources-category__arrow,
  .resources-publication__copy h3 a,
  .resources-featured__item h3 a,
  .resources-latest__item h3 a { transition: none; }
}