.container-flex {
  display: flex;
  flex-direction: row;
  gap: 2rem;
  justify-content: center;
  align-items: flex-start;
}

@media (max-width: 991.98px) {
  .container-flex {
    flex-direction: column;
    gap: 1.5rem;
  }
}

/* --- Touch Only --- */
/* Hide on mouse devices, show on touch devices */
.touch-only {
  display: none !important;
}

@media (pointer: coarse) {
  .touch-only {
    display: block !important; /* Or inline-block / flex depending on needs */
  }
}

/* --- No-Touch Only (Mouse/Fine Pointer) --- */
/* Show on mouse devices, hide on touch devices */
.no-touch-only {
  display: block !important;
}

@media (pointer: coarse) {
  .no-touch-only {
    display: none !important;
  }
}