Advanced → CSS Classes:iconos-responsive/*/* ===========================
Reglas para iconos horizontal -> vertical en móvil
Aplicar la clase al widget o al contenedor padre: iconos-responsive
=========================== *//* 1) Icon List (lista de iconos) */
.iconos-responsive .elementor-icon-list-items,
.iconos-responsive .elementor-icon-list {
display: flex !important;
flex-direction: row !important;
gap: 20px !important; /* separación horizontal en desktop */
align-items: center !important;
}/* 2) Si usás varios Icon Box (cada uno es un widget) dentro de un contenedor padre */
.iconos-responsive > .elementor-widget-wrap,
.iconos-responsive .elementor-widget-container,
.iconos-responsive .elementor-row {
display: flex !important;
flex-direction: row !important;
gap: 20px !important;
align-items: center !important;
}/* 3) También soporta cuando la clase está en el widget (wrapper) y el
o .elementor-icon-box es el hijo */
.iconos-responsive .elementor-icon-box,
.iconos-responsive .elementor-icon-box-wrapper,
.iconos-responsive .elementor-icon-list-item {
/* aseguramos que cada elemento se comporte como ‘fila’ en desktop */
display: flex !important;
align-items: center !important;
gap: 10px !important;
}/* ===========================
MÓVIL: convertir a columna y poner separación 10px
=========================== */
@media (max-width: 767px) {
.iconos-responsive .elementor-icon-list-items,
.iconos-responsive .elementor-icon-list,
.iconos-responsive > .elementor-widget-wrap,
.iconos-responsive .elementor-widget-container,
.iconos-responsive .elementor-row {
flex-direction: column !important;
gap: 10px !important; /* separación vertical 10px */
align-items: stretch !important;
}/* Que cada item ocupe el 100% si corresponde */
.iconos-responsive .elementor-icon-list-item,
.iconos-responsive .elementor-icon-box,
.iconos-responsive .elementor-widget {
width: 100% !important;
}/* Si querés que el icono quede encima del texto en icon-box */
.iconos-responsive .elementor-icon-box .elementor-icon {
margin-bottom: 6px !important;
}
.iconos-responsive .elementor-icon-box .elementor-icon-box-content {
display: block !important;
text-align: left !important;
}
}*/
