.c-notifications-bar {
  background:var(--pine);
  color:var(--white);
}

/* Section 1 */
.c-resources-hero {
  background: var(--powder);
  color: var(--pine);
  padding-block: var(--space-l-xl);
}

.c-resources-hero__heading {
  font-size:var(--step-5);
}
.c-resources-hero__heading span {
    display: block;
    margin-left:1em;
}
.c-resources-hero__sub {
  font-size:var(--step-1);
  font-weight:200;
  margin-block-start:calc( var(--space-s) * -1)
}

/* Section 2 */
.c-resources {
  background: var(--pine);
  padding-block: var(--space-l-2xl) var(--space-m);
}

.c-resources__grid {
  align-items: stretch;
}

.c-resources__card {
  min-width:min(275px, 100%);
  position: relative;
  background: var(--white);
  border-radius: 1em;
  padding: var(--space-l);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  box-shadow: var(--box-shadow);
  xtransition: .5s ease-in-out;
  overflow: hidden;
}

.c-resources__card--calc {
  --border-color:var(--fire);
}
.c-resources__card--dti {
  --border-color:var(--frost);
}
.c-resources__card--app {
  --border-color:var(--medallion);
}
.c-resources__card--map {
  --border-color:var(--corporategreen);
}

.c-resources__card-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  color: inherit;
  flex: 1;
}

.c-resources__img {
  width: 100px;
  height: 100px;
  object-fit: contain;
  margin-inline: auto;
}

.c-resources__title {
  margin-block: var(--space-s) var(--space-xs);
}

.c-resources__body {
  font-size: var(--step--1);
  line-height: 1.6;
  flex: 1;
}

.c-resources__btn {
  margin-block-start: var(--space-m);
  width: 100%;
  z-index: 1;
}

.c-resources__btn svg {
  fill:currentColor;
  width:2em;
  height:2em;
  margin-inline-end:var(--space-3xs);
}

.c-resources__btn + .c-resources__btn {
  margin-block-start:var(--space-xs);
}

/* Careers */
.c-resources-careers {
  margin-block-start:var(--space-l-xl);
  color:var(--white);
}
.c-resources-careers a {
  transition:.5s ease-in-out;
}
@media (hover: hover) {
  .c-resources-careers a:hover {
    color:var(--fire);
  }
}