/*
Theme Name: Steeler Child
Theme URI: http://demo.7iquid.com/steeler
Author: 7iquid
Author URI: http://themeforest.net/user/7iquid
Template: steeler
Description: Tema hijo para personalizaciones del sitio.
Version: 3.0
License: ThemeForest
Text Domain: steeler-child
*/


/*
==================================================
ÍNDICE
==================================================

1. LAYOUT - GRID SERVICIOS HOME
2. LAYOUT - AJUSTES VISUALES (DESKTOP)
3. FORMULARIOS - CONTACT FORM 7 (CHECK POLÍTICA)
4. COMPONENTES - CARRUSEL SERVICIOS
5. RESPONSIVE - TABLET
6. RESPONSIVE - MOBILE

==================================================
*/


/*
==================================================
1. LAYOUT - GRID SERVICIOS HOME
Estructura base con flex para igualar alturas
==================================================
*/

#grid_servicios_home .cms-grid-inner {
    display: flex;
    flex-wrap: wrap;
}

#grid_servicios_home .grid-item {
    display: flex;
}

#grid_servicios_home .grid-item-inner {
    display: flex;
    flex-direction: column;
    width: 100%;
}

#grid_servicios_home .entry-body {
    display: flex;
    flex-direction: column;
    height: 100%;
}

#grid_servicios_home .action-buttons {
    margin-top: auto;
}

.diferenciaciones_about {
	height: 420px;
	min-height: 420px;
}

/*
==================================================
2. LAYOUT - AJUSTES VISUALES (DESKTOP)
Control de alturas para evitar desalineaciones
==================================================
*/

#grid_servicios_home .entry-title {
    min-height: 48px;
}

#grid_servicios_home .entry-content {
    min-height: 70px;
}

.caja-overlay-inicio .cms-fancy-box {
    height: 300px;
    min-height: 300px;
}

.blog_grid .entry-body {
	height: 300px;
	min-height: 300px;
}

.blog_grid .entry-body-inner {
	display: flex;
    flex-direction: column;
    min-height: 100% !important;
    height: 100%;
    justify-content: space-between;
}

.testimonials_centered .slick-dots {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center !important;
}

.testimonials_centered .client-said{
	text-align: center !important;
}

.cms-testimonial-carousel.layout3 .cms-client-wrapper .t-icon {
	right: 0px !important;
}

.acordeon_faqs .cms-ac-title {
	padding-top: 20px !important;
	padding-bottom: 20px !important;
}
/*
==================================================
3. FORMULARIOS - CONTACT FORM 7
Checkbox aceptación política de privacidad
==================================================
*/

.enlace_politica {
    display: flex;
    align-items: center;
    gap: 8px;
	margin-bottom: 20px;
}

/* Eliminamos márgenes por defecto de CF7 */
.enlace_politica .wpcf7-list-item {
    margin: 0 !important;
}

.enlace_politica .wpcf7-form-control-wrap {
    margin: 0 !important;
}

/* Ocultamos el texto generado por CF7 (solo queremos el checkbox) */
.enlace_politica .wpcf7-list-item-label {
    display: none;
}

/* Forzamos visibilidad del checkbox */
.enlace_politica input[type="checkbox"] {
    display: inline-block;
    opacity: 1 !important;
    position: relative !important;
}

/* Alineación interna del acceptance */
.enlace_politica .wpcf7-acceptance {
    display: flex;
    align-items: center;
}

/* Hover sobre enlace */
.enlace_politica:hover a {
    color: #fb512c;
    transition: color 0.3s ease;
}

/* Mensajes de error */
.custom-error {
    display: block;
    margin-top: 5px;
    color: #ff3b3b;
    font-size: 12px;
}

.error-input {
    border-color: #ff3b3b !important;
}

.wpcf7-not-valid-tip,
.wpcf7-response-output {
    display: none !important;
}

/*
==================================================
4. COMPONENTES - CARRUSEL SERVICIOS
Ajustes para igualar alturas en slick carousel
==================================================
*/

.carrusel_servicios .slick-track {
    display: flex;
}

.carrusel_servicios .slick-slide {
    height: auto;
}

.carrusel_servicios .carousel-item {
    height: auto;
}

.carrusel_servicios .carousel-item-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.carrusel_servicios .entry-featured {
    flex-shrink: 0;
}

.carrusel_servicios .entry-body {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.carrusel_servicios .entry-body-inner {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.carrusel_servicios .action-buttons {
    margin-top: auto;
    display: none;
}


/*
==================================================
5. RESPONSIVE - TABLET
Ajustes de alturas intermedios
==================================================
*/

@media (max-width: 1024px) {

    #grid_servicios_home .entry-title {
        min-height: 44px;
    }

    #grid_servicios_home .entry-content {
        min-height: 60px;
    }
	
	#site-header-wrap .site-branding a img {
    	max-height: 60px;
	}
	
	
	.form_servicios .boton-formulario {
		justify-content: center;
	}

}


/*
==================================================
6. RESPONSIVE - MOBILE
Eliminación de alturas forzadas para mejorar UX
==================================================
*/

@media (max-width: 767px) {

    #grid_servicios_home .cms-grid-inner {
        display: block;
    }

    #grid_servicios_home .grid-item {
        display: block;
    }

    #grid_servicios_home .grid-item-inner,
    #grid_servicios_home .entry-body {
        display: block;
        height: auto;
    }

    #grid_servicios_home .action-buttons {
        margin-top: 15px;
    }

    #grid_servicios_home .entry-title,
    #grid_servicios_home .entry-content {
        min-height: auto;
    }
	
	.testimonials_centered .client-heading-star {
		display: none;
	}
	
	.boton-formulario {
		justify-content: center;
	}
	
	.diferenciaciones_about {
		height: 350px;
		min-height: 350px;
	}
	
	
	/*Ajuste para que los iconos en las listas de servicios se ajusten al texto*/
	.elementor-icon-list-item {
        display: flex;
        align-items: center;
        justify-content: center; /* centra todo el conjunto */
        text-align: center;
    }

    .elementor-icon-list-icon {
        flex: 0 0 auto;
        /*margin-right: 8px; espacio entre icono y texto */
    }

    .elementor-icon-list-text {
        width: auto;
		max-width: fit-content;
    }
	
}