/* ===== FEATURE ICON CENTER FIX ===== */
/* This file ensures feature icons are properly centered on all screen sizes */

/* Base styling for feature icons - ensure centering */
.feature__icon {
  text-align: center !important;
  display: block !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* For flex-based feature icons */
.feature__icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Ensure parent container centers the icon */
.feature__card {
  text-align: center !important;
}

/* Mobile specific fixes */
@media (max-width: 768px) {
  .feature__icon {
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
  }
}

@media (max-width: 480px) {
  .feature__icon {
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
  }
}

/* Ensure emoji/text icons are centered */
.feature__icon:not(:empty) {
  text-align: center !important;
}

/* For any child elements inside feature icons */
.feature__icon * {
  text-align: center !important;
}