/* RentGuarantor CSS: resources.css (source: src/assets/scss/_resources.scss) */
.resources {
  padding: var(--spacing-1300) 0;
}
@media (max-width: 991.98px) {
  .resources {
    padding: var(--spacing-1100) 0;
  }
}
@media (max-width: 991.98px) {
  .resources h2 {
    font-size: var(--font-size-l);
    line-height: var(--line-height-l);
    letter-spacing: -0.32px;
  }
}
.resources__lead {
  max-width: 55.4375rem;
}
.resources__card {
  --resources-card-background: var(--surface-general-fifth);
  background-color: var(--resources-card-background);
  padding: var(--spacing-1100) var(--spacing-800);
  transition: background-color 0.3s ease;
  position: relative;
  z-index: 0;
  display: block;
  color: inherit;
  text-decoration: none;
}
.resources__inner {
  min-height: 16.25rem;
  gap: 10px;
}
@media (max-width: 991.98px) {
  .resources__inner {
    min-height: 0;
  }
}
@media (max-width: 991.98px) {
  .resources__inner h3 {
    margin-bottom: 24px !important;
  }
}
.resources__icon {
  width: 6.25rem;
  height: 6.25rem;
  background-color: var(--color-light-blue-200);
  transition: background-color 0.3s ease, transform 0.3s ease;
}
@media (max-width: 991.98px) {
  .resources__icon {
    width: 80px;
    height: 80px;
    margin-bottom: 16px !important;
  }
}
@media (max-width: 991.98px) {
  .resources__icon-html {
    width: 60px;
    height: 60px;
  }
}
.resources__icon-img {
  width: 3.125rem;
  height: 3.125rem;
}
.resources__card--interactive {
  cursor: pointer;
  outline: none;
}
.resources__card--interactive:focus-visible {
  outline: 2px solid var(--button-primary-default);
  outline-offset: 2px;
}
.resources__card--interactive:hover, .resources__card--interactive:focus-visible, .resources__card--interactive:focus-within {
  --resources-card-background: var(--color-light-blue-100);
}
.resources__card--interactive:hover .resources__icon, .resources__card--interactive:focus-visible .resources__icon, .resources__card--interactive:focus-within .resources__icon {
  background-color: var(--color-light-blue-300);
}
.resources__card--interactive:hover .resources__cta, .resources__card--interactive:focus-visible .resources__cta, .resources__card--interactive:focus-within .resources__cta {
  color: var(--text-headings-invert);
  background-color: var(--bs-btn-bg);
  border-color: var(--button-primary-hover);
  scale: 1.05;
}
.resources__card--interactive:hover .resources__cta > span.hover-fill::before, .resources__card--interactive:focus-visible .resources__cta > span.hover-fill::before, .resources__card--interactive:focus-within .resources__cta > span.hover-fill::before {
  top: 60%;
  width: 110%;
  height: 110%;
  opacity: 1;
}