.icon-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--secan-space-s);
  height: 100%;
  padding: var(--secan-space-2xl);
  background-color: var(--secan-white);
  border: 1px solid var(--secan-divider);
  border-radius: var(--secan-radius-3);
  box-shadow: var(--secan-shadow-1);
}

.icon-card__icon {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  overflow: hidden;
  border-radius: var(--secan-radius-pill);
  background-color: var(--secan-input-bg);
}

.icon-card__icon img {
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.icon-card__icon--fallback::before {
  content: "";
  width: 18px;
  height: 18px;
  border: 4px solid var(--secan-red);
  border-radius: var(--secan-radius-pill);
}

.icon-card__title {
  margin: 0;
  font-family: var(--secan-font-heading);
  font-size: var(--secan-fs-h6);
  font-weight: var(--secan-fw-bold);
  line-height: var(--secan-lh-h6);
  color: var(--secan-black);
}

.icon-card__description {
  margin: 0;
  font-family: var(--secan-font-body);
  font-size: var(--secan-fs-body-medium);
  line-height: var(--secan-lh-body);
  color: var(--secan-gray-dark);
}