.three-column-cards {
  text-align: center;
  background: #232323;
  padding-top:23px;
  padding-bottom:23px;
}

.eyebrow {
  font-weight: 700;
  margin-bottom: 1rem;
}

.card-grid {
  display: grid;
  gap: clamp(16px, 3.7vw, 56px);
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.three-column-cards .card {
  border:3.5px solid transparent;
  transition: all 0.3s ease;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap:20px;
  background: var(--Silver, #C4C4C4);
  padding: 10px 20px;
  text-align: left;
  border-radius: 5px;
}

.three-column-cards .card-image {
  flex: 0 0 auto;
  max-width: 117px;
  width: 100%;
  height: auto;
}

.three-column-cards .card-text {
  flex: 1 1 auto;
  min-width: 0;
}

.three-column-cards .card-text p {
  max-width:224px;
  line-height:110%;
  color: var(--Text, #232323);
  margin: 0;
  font-family: Poppins, system-ui, sans-serif;
  font-size: 32px;
  word-break: keep-all;
  overflow-wrap: normal;
  white-space: normal;
  font-weight: 800;

  text-align: left;
}


.three-column-cards .card { text-decoration: none; color: inherit; }
.three-column-cards .card:focus { outline: 2px solid currentColor; outline-offset: 2px; }

.three-column-cards .card:hover {
border-radius: 5px;
border: 3.5px solid #232323;
background: #BABABA;
}

@media (min-width:1513px) {
  .card-grid {
    display:flex;
    justify-content: space-between;
  }
}

@media (max-width:1250px) {
  .three-column-cards .card-image {
    max-width:100px;
  }
}

@media (max-width:1200px) {
  .card-grid {
    gap:20px;
    display:flex;
    flex-direction: column;
    flex-wrap:wrap;
  }

   .card-grid .card {
    max-width:354px;
    flex-basis:100%;
   }
}




@media (max-width:880px) {
  .three-column-cards .card-text p {
    font-size:32px;
  }
    .card-grid {
align-items:center;
  }
}



@media (max-width: 640px) {
  .three-column-cards .card {
    gap:20px;
    text-align: left;
    align-items: center;
  }
 
}

@media (max-width:400px) {
  .three-column-cards .card-text p {
    font-size:24px;
  }
}

@media (max-width:350px) {
  .three-column-cards .card {
    flex-wrap:wrap;
    gap:0;
  }
}