/*========================================
0. GENERICOS
========================================*/

/* 1. Importación de la fuente desde Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Outfit:wght@100;200;300;400;500;600;700;800;900&display=swap');

/* 2. Aplicación global a todo el sitio */
body, h3, h4, h5, h6, p, a, li, span, div {
    font-family: 'Inter', sans-serif !important;
}

body {
   background: #fff;
}

.material-icons {
    font-family: 'Material Icons' !important;
}

.col .responsive-img,
.video-responsive {
    border-radius: 0px;
    min-width: 10px !important;
    margin-left: 7px;
    margin-top: 0px;
}


/* Tablet y móvil: imagen arriba y texto debajo */
@media (max-width: 992px) {
    .row:has(> div > .bloque-ebook) > div {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 32px !important;
    }

    .row > div > .col.bloque-ebook {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Columna de la imagen arriba */
    .row > div > .col.bloque-ebook:has(img) {
        order: 1;
    }

    /* Columna del texto debajo */
    .row > div > .col.bloque-ebook:has(h4) {
        order: 2;
        gap: 24px !important;
    }

    .row > div > .col.bloque-ebook img.responsive-img {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 440px !important;
        height: auto !important;
        margin: 0 auto !important;
        border-radius: 24px;
    }
}



.header img,
.footer img,
.icons img {
    border-radius: 0 !important;
}

.dynamicform:has(> .header) {
   min-width: 100%;
}

.row:has(> div > .margin-block) {
  overflow: hidden;
  padding: 24px;
}

.row:has(> div > .vertical-center-trigger) > div {
    display: flex;
    align-items: center;
}

/*-----RESPONSIVE---------*/
@media only screen and (max-width: 992px) {
    .row:has(> div > .vertical-center-trigger) > div {
       flex-wrap: wrap;
    }
    .dynamicform:has(> .reverse) {
      display: flex;
      flex-direction: column-reverse;
    }
}

span.blue-text {
    color: #1a3e77 !important;
}

.row:has(> div > .gradient-blue) {
    background: linear-gradient(
        to top,
        #C2D3E7 0%,
        #D8E3F0 45%,
        #FFFFFF 100%
    ) !important;
}

/*================================   
CENTRAR TEXTO
================================*/
.gradient-blue > div:nth-child(2) {
    transform: translateX(-50%);
    margin-left: 50%;
}

/*================================   
1. TIPOGRAFÍA
================================*/

body h1,
body h1 * {
    display: block;
    width: 100%;
    font-size: clamp(2.6rem, 6vw, 4.5rem);
    line-height: 1.2;
    font-weight: 700;
    word-wrap: normal;
    margin-top: 218px;
    font-family: 'Outfit', sans-serif !important;
}

@media (max-width: 768px) {
    h1, 
    .white-text {
        margin-top: 48px !important;
    }
}

body h2,
body h2 * { 
    font-size: clamp(1.875rem, 4vw, 2.5rem) !important;
    line-height: 1.3 !important;
    margin-top: 86px;
    font-family: 'Outfit', sans-serif !important;
}

@media (max-width: 768px) {
 h2{
  margin-top: 12px!important;
   }
}


h3 { 
    color: #1C1D1F; 
    font-size: 28px; 
}

p { 
    font-size: 17px; 
    color: #1C1D1F; 
}

.p-medium p {
    font-size: clamp(1.125rem, 2.2vw, 1.375rem) !important;
    line-height: 1.45 !important;
}

.p-large p {
    font-size: clamp(1.375rem, 3vw, 1.75rem) !important;
    line-height: 1.3 !important;
} 

.row:has(> div > .vertical-center) > div {
    display: flex;
    align-items: center;
}


/*=============================
MARGIN-SECTION
=============================*/
.row:has(> div > .margin-section) {   
    padding: 35px 0;
    display: block;
    overflow: hidden;
}

/* Responsive */
@media (max-width: 768px) {
    .row:has(> div > .margin-section) {
        padding: 24px !important;
        margin-bottom: 40px;
    }
}



/*========================
HEADER EBOOK
=========================*/

/* Fila exterior con el fondo */
.row:has(> div > .header-ebook) {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-height: 418px;
    margin: 0 !important;
    padding: 100px 24px 40px !important;
    box-sizing: border-box;

    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}

/* Padre de las columnas */
.row:has(> div > .header-ebook) > div {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Ocultar columnas vacías laterales */
.row:has(> div > .header-ebook) > div > .col:empty {
    display: none !important;
}

/* Columna con el contenido */
.row > div > .col.header-ebook:has(h1) {
    float: none !important;
    flex: 0 1 900px !important;
    width: 100% !important;
    max-width: 900px !important;
    min-width: 0;
    margin: 0 auto !important;
    padding: 0 !important;
    box-sizing: border-box;
    text-align: center !important;
}

/* Limpiar espacios internos */
.header-ebook > div > .row,
.header-ebook > div > .row > .col {
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Antetítulo */
.header-ebook p {
    margin: 0 !important;
    padding: 0 !important;
    color: #fff !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    text-align: center !important;
}

/* Título principal */
.header-ebook h1 {
    display: block !important;
    width: 100% !important;
    max-width: 650px !important;
    margin: 20px auto 36px !important;
    padding: 0 !important;

    color: #fff !important;
    font-size: clamp(32px, 4vw, 48px) !important;
    font-weight: 800 !important;
    line-height: 1.22 !important;
    letter-spacing: -0.8px;
    text-align: center !important;
    white-space: normal !important;
}

/* Evitar estilos globales en los spans */
.header-ebook h1 span {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
}

/* Botón */
.header-ebook a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    width: 312px;
    max-width: 100%;
    min-height: 63px;
    padding: 18px 28px !important;
    box-sizing: border-box;

    background: #000 !important;
    border: none !important;
    border-radius: 999px !important;
    color: #fff !important;

    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    text-align: center;
    text-decoration: none !important;
}

.header-ebook a:hover {
    background: #252525 !important;
}

.header-ebook a:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 4px;
}

/* Móvil */
@media (max-width: 600px) {
    .row:has(> div > .header-ebook) {
        min-height: auto;
        padding: 64px 20px 48px !important;
    }

    .header-ebook p {
        font-size: 15px !important;
    }

    .header-ebook h1 {
        margin: 20px auto 30px !important;
        font-size: 32px !important;
        letter-spacing: -0.5px;
    }

    .header-ebook a {
        width: 290px;
        min-height: 58px;
        font-size: 15px !important;
    }
}



/*========================
BLOQUE EBOOK: IMAGEN + TEXTO
=========================*/

/* Fila exterior */
.row:has(> div > .bloque-ebook) {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 64px 24px !important;
    box-sizing: border-box;
}

/* Distribución en ordenador */
.row:has(> div > .bloque-ebook) > div {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start !important;
    gap: 48px;

    width: 100% !important;
    max-width: 1150px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    box-sizing: border-box;
}

/* Eliminar espacios generados por el CMS */
.row:has(> div > .bloque-ebook) > div::before,
.row:has(> div > .bloque-ebook) > div::after {
    display: none !important;
    content: none !important;
}

/* Columnas principales */
.row > div > .col.bloque-ebook {
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
}

/* Limpiar espacios de los módulos interiores */
.bloque-ebook > div,
.bloque-ebook > div > .row,
.bloque-ebook > div > .row > .col {
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box;
}

/* Imagen del ebook */
.row > div > .col.bloque-ebook img.responsive-img {
    display: block !important;
    position: static !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;

    margin: 0 auto !important;
    padding: 0 !important;
    transform: none !important;

    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    box-sizing: border-box;
    margin-top: -55px!important;
}

/* Columna de textos */
.row > div > .col.bloque-ebook:has(h4) {
    display: flex !important;
    flex-direction: column !important;
    gap: 56px !important;
}

/* Cajas de preguntas */
.bloque-ebook h4 {
    display: flex !important;
    align-items: center;
    justify-content: center;

    width: 100% !important;
    min-height: 78px !important;
    margin: 0 !important;
    padding: 22px 24px !important;
    box-sizing: border-box;
    border-radius: 16px;

    font-family: 'Inter', sans-serif !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    text-align: center !important;
}

/* Primera pregunta */
.bloque-ebook:has(h4) > div:nth-child(1) h4 {
    background-color: #C58FD0 !important;
    color: #fff !important;
}

/* Segunda pregunta */
.bloque-ebook:has(h4) > div:nth-child(2) h4 {
    background-color: #EBD9EF !important;
    color: #54245D !important;
}

/* Tercera pregunta */
.bloque-ebook:has(h4) > div:nth-child(3) h4 {
    background-color: #502258 !important;
    color: #C58FD0 !important;
}

/* Texto dentro de las cajas */
.bloque-ebook h4 span,
.bloque-ebook h4 strong,
.bloque-ebook h4 a {
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    text-decoration: none !important;
}

/* Párrafo descriptivo */
.bloque-ebook p {
    margin: 0 !important;
    padding: 0 !important;
    color: #000 !important;
    font-size: 20px !important;
    line-height: 1.25 !important;
    text-align: left !important;
}

.bloque-ebook p span {
    font-size: inherit !important;
    line-height: inherit !important;
}

/* Separación antes del párrafo final */
.row > div > .col.bloque-ebook:has(h4) > div:nth-child(4) {
    margin-top: -18px !important;
}

/* Salto final del párrafo */
.bloque-ebook p > br:last-child {
    display: none;
}

/*========================
TABLET Y MÓVIL
=========================*/

@media (max-width: 992px) {
    .row:has(> div > .bloque-ebook) {
        padding: 40px 20px !important;
    }

    /* Imagen arriba y textos debajo */
    .row:has(> div > .bloque-ebook) > div {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        align-items: flex-start !important;
        gap: 32px !important;
    }

    .row > div > .col.bloque-ebook {
        flex: 0 0 100% !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Imagen primero */
    .row > div > .col.bloque-ebook:has(img):not(:has(h4)) {
        order: 1 !important;
    }

    /* Textos después */
    .row > div > .col.bloque-ebook:has(h4) {
        order: 2 !important;
        gap: 24px !important;
    }

    /* Imagen centrada en tablet */
    .row > div > .col.bloque-ebook img.responsive-img {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 380px !important;
        height: auto !important;
        margin: 0 auto !important;
    }

    .bloque-ebook h4 {
        min-height: 72px !important;
        padding: 20px 18px !important;
        font-size: 18px !important;
    }

    .bloque-ebook p {
        font-size: 18px !important;
        line-height: 1.4 !important;
    }

    .row > div > .col.bloque-ebook:has(h4) > div:nth-child(4) {
        margin-top: 0 !important;
    }
}

/*========================
MÓVIL: IMAGEN MÁS PEQUEÑA
=========================*/

@media (max-width: 600px) {
    .row:has(> div > .bloque-ebook) {
        padding: 32px 16px !important;
    }

    .row > div > .col.bloque-ebook img.responsive-img {
        width: 85% !important;
        min-width: 0 !important;
        max-width: 280px !important;
        height: auto !important;
        margin: 0 auto !important;
    }
}



/*------------------------------------------
CONTACT FORM
-----------------------------------------*/
.dynamicform:has(> .contact-form) {
    display: flex;
    justify-content: center;
    gap: 10px;
    background-color: #EEEEEE;
    border-radius: 24px;
    padding: 62px;
    margin-top: 120px!important;
    margin-bottom: 150px!important;
    padding: 42px !important;
}


.contact-form.card {
    grid-template-columns: auto !important;
    margin-top: 20px!important;
    margin-bottom: 60px!important;
}


/* -------------------------------------
----------- VISTA MOVIL---------------
---------------------------------------*/
/* Ajuste específico para móvil */
@media (max-width: 768px) {


/*----  CONTACT FORM ------*/
    .dynamicform:has(> .contact-form){
        padding: 43px 12px 0 12px !important;
        flex-wrap: wrap;
     }
}