/* Make each service a uniform card */
.service {
    min-width: 300px !important;
    min-height: 325px !important;
    width: auto !important;
    height: auto !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;

    background: rgba(255,255,255,0.05) !important;
    border-radius: 14px !important;
    padding: 12px !important;
}

/* Center the icon container */
.service-icon {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin-bottom: 12px !important;
}

/* Big centered icon */
.service-icon img {
    width: 196px !important;
    height: 196px !important;
    display: block !important;
    margin: 0 auto !important;
    object-fit: contain !important;
}

/* Title under icon, centered */
.service-title {
    margin-top: 4px !important;
    font-size: 0.95rem !important;
    text-align: center !important;
}

/* Description under title, centered */
.service-description {
    margin-top: 2px !important;
    font-size: 0.75rem !important;
    opacity: 0.8 !important;
    text-align: center !important;
}

/* Spacing between cards */
.services-group {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 24px !important;
    justify-content: center !important;
}

/* Force shrink ANY image inside first System card */
.services-group:nth-of-type(2) li:nth-child(1) img {
  width: 60px !important;
  height: 60px !important;
  max-width: 60px !important;
  max-height: 60px !important;
  object-fit: contain !important;
  display: block;
  margin: 0 auto 8px auto !important;
}