/* Tipografía de lato */
.font-lato {
font-family: 'Lato', sans-serif;
font-size: 20px;
line-height: 24px;
font-weight: 700;
letter-spacing: normal;
}
/* fin Tipografía de lato */


/* fix aplicado al cmp-banner */
.cmp-banner-desktop {
display: block;
}
.cmp-banner-mobile {
display: none;
}
@media (max-width: 768px) {
.cmp-banner-desktop {
display: none;
}
.cmp-banner-mobile {
display: block;
}
}
/* fin fix aplicado al cmp-banner */


.cmp-faqs {
width: 100%;
max-width: 1200px;
margin: 20px auto;
font-family: 'Lato', sans-serif !important;
}


.cmp-faqs-item {
border: 1px solid #ddd;
margin-bottom: 8px;
border-radius: 6px;
overflow: hidden;
}


.cmp-faqs-header {
background-color: #fff;
color: #000 !important; /* Texto negro base */
padding: 15px;
cursor: pointer;
display: flex;
align-items: center;
gap: 10px;


font-family: 'Lato', sans-serif !important;
font-size: 20px !important;
font-weight: 700 !important;
line-height: 24px !important;
letter-spacing: normal !important;


-webkit-transition: background-color 0.3s ease, color 0.3s ease;
-moz-transition: background-color 0.3s ease, color 0.3s ease;
-o-transition: background-color 0.3s ease, color 0.3s ease;
transition: background-color 0.3s ease, color 0.3s ease;
}


/* Hover → fondo azul + texto blanco */
.cmp-faqs-header:hover {
background-color: #0072ce;
color: #fff !important;
}


/* Activo → fondo azul + texto blanco */
.cmp-faqs-header.active {
background-color: #0072ce;
color: #fff !important;
}


/* Reset manual para spans del CMS */
.cmp-faqs-header * {
font: inherit !important;
color: inherit !important;
background: none !important;
border: 0 !important;
margin: 0;
padding: 0;
text-decoration: none !important;
display: inline;
}


/* Icono + / - */
.cmp-faqs-icon {
position: relative;
width: 16px;
height: 16px;
flex-shrink: 0;
display: inline-block;
color: inherit !important;
}


.cmp-faqs-icon::before,
.cmp-faqs-icon::after {
content: "";
position: absolute;
background-color: currentColor;
-webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease;
-moz-transition: -moz-transform 0.3s ease, opacity 0.3s ease;
-o-transition: -o-transform 0.3s ease, opacity 0.3s ease;
transition: transform 0.3s ease, opacity 0.3s ease;
}


/* Línea horizontal (–) */
.cmp-faqs-icon::before {
top: 50%;
left: 0;
width: 100%;
height: 2px;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}


/* Línea vertical (|) */
.cmp-faqs-icon::after {
top: 0;
left: 50%;
width: 2px;
height: 100%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}


/* Animación al abrir: de + a – */
.cmp-faqs-header.active .cmp-faqs-icon::after {
opacity: 0;
-webkit-transform: translateX(-50%) scaleY(0);
-ms-transform: translateX(-50%) scaleY(0);
transform: translateX(-50%) scaleY(0);
}


.cmp-faqs-content {
max-height: 0;
overflow: hidden;
padding: 0 15px;
background: #f9f9f9;
color: #333;


font-family: 'Lato', sans-serif !important;
font-size: 16px !important;
line-height: 22px !important;
font-weight: 400 !important;


-webkit-transition: max-height 0.3s ease, padding 0.3s ease;
-moz-transition: max-height 0.3s ease, padding 0.3s ease;
-o-transition: max-height 0.3s ease, padding 0.3s ease;
transition: max-height 0.3s ease, padding 0.3s ease;
}


/* Reset manual también en el contenido */
.cmp-faqs-content * {
font: inherit !important;
color: inherit !important;
background: none !important;
border: 0 !important;
margin: 0;
padding: 0;
text-decoration: none !important;
}


.cmp-faqs-content.open {
padding: 15px;
}