/* card grid used on homepage what's in the design system */
.cagov-cluster-3 {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space, 1.5rem);
}
@supports (width: calc(min(376px, 100%))) {
  .cagov-cluster-3 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(calc(min(376px, 100%)), 1fr));
    grid-gap: 1.5rem;
  }
}

.cagov-section-highlight-link {
  text-decoration: none;
  font-weight: 700;
}
.cagov-cluster-3,
.cagov-cluster-big-2 {
  .cagov-stack-card {
    border-radius: 5px;
  }
}
.cagov-stack-card {
  background-color: #f9f9fa;
  .cagov-card-head {
    background: #FFECC1;
    min-height: 176px;
    display: flex;
    align-items: center;
    justify-content: space-around;
    &.cagov-card-head--blue {
      background: #b3c9eb;
    }
  }
  .cagov-card-body {
    padding: 1.5rem;
    p {
      line-height: 2rem;
    }
  }
}

/* grid used on homepage section: Who is using big cards */
.cagov-cluster-big-2 {
  display: flex;
  flex-direction: row;
}
@supports (width: calc(min(576px, 100%))) {
  .cagov-cluster-big-2 {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(calc(min(576px, 100%)), 1fr));
    grid-gap: 1.5rem;
  }
}
.cagov-cluster-big-2 {
  .cagov-stack-card {
    .cagov-card-head {
      padding: 1rem;
      border-radius: 5px 5px 0 0;
      img {
        max-width: 100%;
      }
    }
    .cagov-card-body {
      border-radius: 0 0 5px 5px;
    }
  }
}

/* utility class added for this section */
.cagov-border-link {
  border: solid 1px; /* review for existing styles */
  padding: 1rem;
  display: inline-block;
  text-decoration: none;
  border-radius: 5px;
}
