.tarjeta-icono-wrapper {
  min-width: 0;
}

.tarjeta-icono {
  max-width: 708px;
  padding: 28px 20px;
  box-sizing: border-box;
}

.tarjeta-icono--oscura {
  background-color: var(--color-primary-2);
}

.tarjeta-icono--clara {
  background-color: var(--color-white);
  border: 1px solid var(--color-border-divider);
}

.tarjeta-icono--oscura.tarjeta-icono--clickable:hover,
.tarjeta-icono--oscura.tarjeta-icono--clickable:active {
  background-color: var(--color-primary-3);
  text-decoration: none;
}

.tarjeta-icono--oscura.tarjeta-icono--clickable:hover .tarjeta-icono__icono,
.tarjeta-icono--oscura.tarjeta-icono--clickable:active .tarjeta-icono__icono {
  background-color: var(--color-secondary-1);
}

.tarjeta-icono--oscura.tarjeta-icono--clickable:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px var(--color-secondary-3);
}

.tarjeta-icono--clara.tarjeta-icono--clickable:hover,
.tarjeta-icono--clara.tarjeta-icono--clickable:active {
  background-color: var(--color-tertiary-1);
  border-color: var(--color-tertiary-3);
  text-decoration: none;
}

.tarjeta-icono--clara.tarjeta-icono--clickable:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px var(--color-tertiary-3);
}

.tarjeta-icono.is-disabled {
  background-color: var(--color-bg-inactive);
  pointer-events: none;
  cursor: not-allowed;
}

.tarjeta-icono.is-disabled .tarjeta-icono__icono {
  background-color: var(--color-neutral-4);
  color: var(--color-text-inactive);
}

.tarjeta-icono.is-disabled .tarjeta-icono__titulo {
  color: var(--color-text-inactive);
}

.tarjeta-icono__icono {
  width: 72px;
  height: 72px;
  margin: 0 0 14px;
  font-size: 40px;
  background-color: var(--mp-gold-500);
  color: var(--color-primary-2);
}

/* Con descripción: el círculo baja a 56px; el icono guarda la misma
   proporción que en el tamaño normal (40/72 ≈ 0.556 → 56 * 0.556 ≈ 31px). */
.tarjeta-icono__icono--con-descripcion {
  width: 56px;
  height: 56px;
  font-size: 31px;
}

.tarjeta-icono__titulo {
  margin: 0 0 14px;
  font-size: 1.125rem;
}

.tarjeta-icono__titulo--con-descripcion {
  font-size: 17px;
}

.tarjeta-icono--oscura .tarjeta-icono__titulo {
  color: var(--color-neutral-1);
}

.tarjeta-icono--clara .tarjeta-icono__titulo {
  color: var(--color-primary-2);
}

.tarjeta-icono__descripcion {
  margin: 0 0 14px;
  font-size: 0.875rem;
}

.tarjeta-icono--oscura .tarjeta-icono__descripcion {
  color: rgba(255, 255, 255, 0.75);
}

.tarjeta-icono--clara .tarjeta-icono__descripcion {
  color: var(--color-text-body-secondary);
}

.tarjeta-icono__enlace {
  margin: auto 0 14px;
  padding-top: 10px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--color-secondary-3);
}

.tarjeta-icono__enlace:hover {
  color: var(--color-secondary-2);
}

.tarjeta-icono__enlace:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px var(--color-focus-ring);
  border-radius: var(--radius-small);
}