/* 
Sitio Web Creado por ITred Spa.
Direccion: Guido Reni #4190
Pedro Aguirre Cerda - Santiago - Chile
contacto@itred.cl o itred.spa@gmail.com
https://www.itred.cl
Creado, Programado y Diseñado por ITred Spa.
BPPJ 
*/


/* -------------------------------------------------------------------------------------------------------------
   ------------------------------------- INICIO ITred Spa seccion_elegirnos .CSS ----------------------
   ------------------------------------------------------------------------------------------------------------- */

/* IMPORTACION DE FUENTE RALEWAY */

@font-face {
    font-family: 'Raleway'; /* establece el nombre de la fuente que podrá utilizar el sitio */
    src: url('/fuentes/fuentes_google/fuente_raleway.ttf') format('truetype'); /* establece la ruta del archivo de fuente y su formato */
    font-weight: 100 900; /* permite utilizar los diferentes grosores disponibles de la fuente */
    font-style: normal; /* establece el estilo normal de la fuente */
}


/* TITULO 1 SECCION ELEGIRNOS */

    .seccion_elegirnos {
        width: 100%; /* establece el ancho completo de la seccion */
        height: auto; /* permite que la altura se adapte al contenido */
        min-height: min(100vh, 850px); /* limita la altura minima en pantallas muy altas */
        display: flex; /* organiza los elementos mediante flexbox */
        flex-direction: column; /* distribuye los elementos verticalmente */
        justify-content: center; /* centra verticalmente el contenido */
        align-items: center; /* centra horizontalmente el contenido */
        padding: min(5vh, 48px) 5vw; /* controla los espacios internos en pantallas altas */
        box-sizing: border-box; /* incluye el padding dentro de las dimensiones */
        background-color: #ffffff; /* establece el fondo blanco de la seccion */
    }


    /* pantallas grandes (monitores Full HD+, iMac, monitores gaming QHD/4K) */
    @media (min-width: 1441px) {

        /* Sin media */

    }


    /* notebooks grandes (1600x900, 1920x1080) */
    @media (max-width: 1440px) {

        /* Sin media */

    }


    /* notebooks comunes (1366x768, MacBook Air/Pro) */
    @media (max-width: 1200px) {

        /* Sin media */

    }


    /* tablets horizontales / pantallas medianas (iPad Pro en horizontal, notebooks pequeños) */
    @media (max-width: 992px) {

        .seccion_elegirnos {
            min-height: 0; /* permite adaptar la altura al contenido de las tarjetas */
            padding: 3rem 4vw; /* establece espacios internos independientes de la altura */
        }

    }


    /* tablets verticales (iPad clásico, tablets Android estándar) */
    @media (max-width: 768px) {

        .seccion_elegirnos {
            padding: 2.5rem 4vw; /* ajusta los espacios internos para tablets */
            overflow-x: hidden; /* evita el desplazamiento horizontal */
        }

    }


    /* móviles extragrandes (pantallas compactas y dispositivos de gran tamaño) */
    @media (max-width: 576px) {

        .seccion_elegirnos {
            padding: 2.5rem 4vw; /* adapta los espacios internos para dispositivos moviles */
        }

    }


    /* móviles medianos (iPhone 12/13/14, Android gama media) */
    @media (max-width: 390px) {

        /* Sin media */

    }


    /* móviles pequeños (Android estándar, iPhone SE) */
    @media (max-width: 360px) {

        /* Sin media */

    }



/* TITULO 2 ENCABEZADO ELEGIRNOS */

.encabezado_elegirnos {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 14px;
    margin-bottom: 42px;
    text-align: center;
}

.linea_izquierda_elegirnos,
.linea_derecha_elegirnos {
    display: none;
}

.linea_superior_elegirnos {
    width: 130px;
    height: 2px;
    background-color: #99813D;
}

.titulo_elegirnos {
    color: #182B3A;
    font-family: 'Raleway', sans-serif;
    font-size: 4rem;
    font-weight: 500;
    line-height: 1.1;
    white-space: normal;
    text-align: center;
}

.descripcion_encabezado_elegirnos {
    max-width: 900px;
    color: #182B3A;
    font-family: 'Raleway', sans-serif;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.6;
    text-align: center;
}

    /* pantallas grandes (monitores Full HD+, iMac, monitores gaming QHD/4K) */
    @media (min-width: 1441px) {

        /* Sin media */

    }


    /* notebooks grandes (1600x900, 1920x1080) */
    @media (max-width: 1440px) {

        /* Sin media */

    }


    /* notebooks comunes (1366x768, MacBook Air/Pro) */
    @media (max-width: 1200px) {

        .encabezado_elegirnos {
            width: 90%; /* mantiene el encabezado centrado y proporcionado */
            gap: 12px; /* reduce ligeramente la separacion entre elementos */
            margin-bottom: 36px; /* separa el encabezado de las tarjetas */
        }

        .titulo_elegirnos {
            font-size: 2.75rem; /* adapta el titulo a notebooks */
        }

        .descripcion_encabezado_elegirnos {
            max-width: 760px; /* controla el largo del subtitulo */
            font-size: 1.2rem; /* evita que el subtitulo quede demasiado grande */
        }

    }


    /* tablets horizontales / pantallas medianas (iPad Pro en horizontal, notebooks pequeños) */
    @media (max-width: 992px) {

        .encabezado_elegirnos {
            width: 94%; /* mantiene margenes laterales proporcionados */
            margin-bottom: 30px; /* aproxima las tarjetas al encabezado */
        }

        .linea_superior_elegirnos {
            width: 105px; /* adapta la linea dorada a tablets */
        }

        .titulo_elegirnos {
            font-size: 2.4rem; /* mantiene la jerarquia del titulo */
        }

        .descripcion_encabezado_elegirnos {
            max-width: 650px; /* evita lineas demasiado largas */
            font-size: 1.1rem; /* conserva una lectura comoda */
            line-height: 1.5; /* adapta la separacion vertical */
        }

    }


    /* tablets verticales (iPad clásico, tablets Android estándar) */
    @media (max-width: 768px) {

        .encabezado_elegirnos {
            width: 100%; /* utiliza el ancho disponible de la seccion */
            gap: 10px; /* separa la linea, el titulo y el subtitulo */
            margin-bottom: 26px; /* mantiene el espacio previo a las tarjetas */
        }

        .linea_superior_elegirnos {
            width: 90px; /* reduce la linea dorada */
        }

        .titulo_elegirnos {
            font-size: 2rem; /* adapta el titulo a tablets verticales */
        }

        .descripcion_encabezado_elegirnos {
            max-width: 100%; /* evita sobresalir del contenedor */
            font-size: 1rem; /* mantiene el subtitulo legible */
        }

    }


    /* móviles extragrandes (pantallas compactas y dispositivos de gran tamaño) */
    @media (max-width: 576px) {

        .encabezado_elegirnos {
            width: 100%; /* utiliza el espacio disponible en moviles */
            gap: 10px; /* mantiene el orden vertical */
            margin-bottom: 22px; /* ajusta la distancia a las tarjetas */
        }

        .linea_superior_elegirnos {
            width: 72px; /* mantiene la linea proporcionada */
        }

        .titulo_elegirnos {
            font-size: 1.85rem; /* evita que el titulo se reduzca demasiado */
            line-height: 1.15; /* mejora el interlineado cuando se divide */
        }

        .descripcion_encabezado_elegirnos {
            max-width: 100%; /* limita el texto al ancho del dispositivo */
            font-size: 0.98rem; /* mantiene un tamaño estable */
            line-height: 1.45; /* facilita la lectura */
        }

    }


    /* móviles grandes (iPhone 11, iPhone Plus/Max, Android grandes) */
    @media (max-width: 414px) {

        .titulo_elegirnos {
            font-size: 1.75rem; /* adapta el titulo a moviles grandes */
        }

        .descripcion_encabezado_elegirnos {
            font-size: 0.95rem; /* ajusta el subtitulo al espacio */
            width: 85%;
        }

    }


    /* móviles medianos (iPhone 12/13/14, Android gama media) */
    @media (max-width: 390px) {

        .titulo_elegirnos {
            font-size: 1.65rem; /* evita cortes en moviles medianos */
        }

        .descripcion_encabezado_elegirnos {
            font-size: 0.95rem; /* ajusta el subtitulo al espacio */
            width: 85%;
        }

    }


    /* móviles pequeños (Android estándar, iPhone SE) */
    @media (max-width: 360px) {

        .titulo_elegirnos {
            font-size: 1.55rem; /* conserva la legibilidad en pantallas estrechas */
        }

        .descripcion_encabezado_elegirnos {
            font-size: 0.92rem; /* ajusta ligeramente el subtitulo */
        }

    }


/* TITULO 3 CONTENEDOR TARJETAS ELEGIRNOS */

    .contenedor_tarjetas_elegirnos {
        width: 80%; /* establece el ancho del contenedor de tarjetas */
        display: grid; /* organiza las tarjetas mediante una cuadricula */
        grid-template-columns: repeat(4, minmax(0, 1fr)); /* distribuye cuatro columnas iguales */
        gap: 2vw; /* establece la separacion entre las tarjetas */
        justify-content: center; /* centra horizontalmente la cuadricula */
        align-items: stretch; /* mantiene las tarjetas de cada fila con igual altura */
    }

    .tarjeta_experiencia_elegirnos,
    .tarjeta_analisis_elegirnos,
    .tarjeta_confidencialidad_elegirnos,
    .tarjeta_resultados_elegirnos {
        min-width: 0;
        height: auto;
        min-height: 320px;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        padding: 1rem 1rem 2rem;
        box-sizing: border-box;
        background-color: #F7F5F0;
        border-radius: 14px;
        border: 2px solid rgb(237, 233, 223); /* incorpora un borde dorado discreto */
        box-shadow: 0 2px 4px rgba(42, 32, 26, 0.10);
        cursor: pointer;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
        text-align: center;
        position: relative; /* mantiene la flecha posicionada dentro de cada tarjeta */
    }

    .tarjeta_experiencia_elegirnos::after,
    .tarjeta_analisis_elegirnos::after,
    .tarjeta_confidencialidad_elegirnos::after,
    .tarjeta_resultados_elegirnos::after{
        content: '→'; /* dibuja una flecha decorativa sin cambiar el PHP */
        position: absolute; /* posiciona la flecha respecto a la tarjeta */
        right: 18px; /* separa la flecha del borde derecho */
        bottom: 14px; /* separa la flecha del borde inferior */
        font-size: 2rem; /* establece un tamaño visible */
        line-height: 1; /* evita un espacio vertical innecesario */
        color: #182B3A; /* utiliza el azul tinta corporativo */
        pointer-events: none; /* deja que el clic lo reciba la tarjeta */
    }

    .tarjeta_experiencia_elegirnos:hover,
    .tarjeta_analisis_elegirnos:hover,
    .tarjeta_confidencialidad_elegirnos:hover,
    .tarjeta_resultados_elegirnos:hover {
        transform: translateY(-8px) scale(1.02); /* eleva ligeramente las tarjetas */
        box-shadow: 0 16px 32px rgba(60, 45, 30, 0.20); /* aumenta la sombra al posicionar el cursor */
    }

    .imagen_experiencia_elegirnos,
    .imagen_analisis_elegirnos,
    .imagen_confidencialidad_elegirnos,
    .imagen_resultados_elegirnos {
        width: 130px;
        max-width: 100%;
        height: 130px;
        object-fit: contain;
        flex-shrink: 0;
        margin-bottom: 0.5rem;
    }

    .linea_experiencia_elegirnos,
    .linea_analisis_elegirnos,
    .linea_confidencialidad_elegirnos,
    .linea_resultados_elegirnos {
        width: 90%; /* establece el ancho de las lineas decorativas */
        height: 1px; /* establece el grosor de las lineas */
        margin-top: min(3vh, 20px); /* limita la separacion superior */
        margin-bottom: min(3vh, 20px); /* limita la separacion inferior */
        background-color: #c99746; /* establece el color dorado de las lineas */
        flex-shrink: 0; /* evita que las lineas reduzcan su tamaño */
        display: none;
    }

    .texto_experiencia_elegirnos,
    .texto_analisis_elegirnos,
    .texto_confidencialidad_elegirnos,
    .texto_resultados_elegirnos {
        color: #182B3A;
        font-family: 'Raleway', sans-serif;
        font-size: 1.5rem;
        font-weight: 700;
        line-height: 1.3;
        text-align: center;
        margin-bottom: 0.9rem;
    }

    .descripcion_experiencia_elegirnos,
    .descripcion_analisis_elegirnos,
    .descripcion_confidencialidad_elegirnos,
    .descripcion_resultados_elegirnos {
        color: #45494D;
        font-family: 'Raleway', sans-serif;
        font-size: 1rem;
        font-weight: 400;
        line-height: 1.5;
        text-align: center;
        max-width: 90%;
    }


    /* pantallas grandes (monitores Full HD+, iMac, monitores gaming QHD/4K) */
    @media (min-width: 1441px) {

        /* Sin media */

    }


    /* notebooks grandes (1600x900, 1920x1080) */
    @media (max-width: 1440px) {

        /* Sin media */

    }


/* notebooks comunes (1366x768, MacBook Air/Pro) */
@media (max-width: 1200px) {

    .contenedor_tarjetas_elegirnos {
        width: 85%; /* aprovecha el ancho disponible */
        grid-template-columns: repeat(4, minmax(0, 1fr)); /* mantiene las cuatro tarjetas en una fila */
        gap: 16px; /* separa las tarjetas */
    }

    .tarjeta_experiencia_elegirnos,
    .tarjeta_analisis_elegirnos,
    .tarjeta_confidencialidad_elegirnos,
    .tarjeta_resultados_elegirnos {
        min-height: 200px; /* mantiene una altura proporcionada */
        padding: 20px 12px 45px; /* reserva espacio para la flecha */
    }

    .imagen_experiencia_elegirnos,
    .imagen_analisis_elegirnos,
    .imagen_confidencialidad_elegirnos,
    .imagen_resultados_elegirnos {
        width: 100px; /* adapta los iconos a las cuatro columnas */
        height: 100px; /* mantiene sus proporciones */
    }

    .texto_experiencia_elegirnos,
    .texto_analisis_elegirnos,
    .texto_confidencialidad_elegirnos,
    .texto_resultados_elegirnos {
        font-size: 1.3rem; /* mantiene los titulos proporcionados */
        margin-bottom: 12px; /* separa el titulo de la descripcion */
    }

    .descripcion_experiencia_elegirnos,
    .descripcion_analisis_elegirnos,
    .descripcion_confidencialidad_elegirnos,
    .descripcion_resultados_elegirnos {
        max-width: 95%; /* aprovecha el espacio interno */
        font-size: 1rem; /* mantiene las descripciones legibles */
        line-height: 1.5; /* separa las lineas */
    }

}

    /* tablets horizontales / pantallas medianas (iPad Pro en horizontal, notebooks pequeños) */
    @media (max-width: 992px) {

        .contenedor_tarjetas_elegirnos {
            width: 94%; /* mantiene margenes laterales */
            grid-template-columns: repeat(2, minmax(0, 1fr)); /* distribuye las tarjetas en dos columnas */
            gap: 14px; /* mantiene separadas las tarjetas */
        }

        .tarjeta_experiencia_elegirnos,
        .tarjeta_analisis_elegirnos,
        .tarjeta_confidencialidad_elegirnos,
        .tarjeta_resultados_elegirnos {
            display: grid; /* organiza icono y textos horizontalmente */
            grid-template-columns: 86px minmax(0, 1fr); /* reserva una columna para el icono */
            grid-template-rows: auto auto; /* coloca titulo y descripcion uno debajo del otro */
            align-items: center; /* centra los elementos respecto a su espacio */
            align-content: center; /* centra el contenido dentro de la tarjeta */
            column-gap: 12px; /* separa imagen y texto */
            row-gap: 6px; /* separa titulo y descripcion */
            min-height: 145px; /* compacta las tarjetas respecto al diseño anterior */
            padding: 16px 17px 36px; /* reserva un espacio inferior para la flecha */
            text-align: left; /* alinea el contenido a la izquierda */
        }

        .imagen_experiencia_elegirnos,
        .imagen_analisis_elegirnos,
        .imagen_confidencialidad_elegirnos,
        .imagen_resultados_elegirnos {
            grid-column: 1; /* coloca el icono en la primera columna */
            grid-row: 1 / span 2; /* alinea el icono junto al titulo y la descripcion */
            width: 82px; /* mantiene un icono visible y proporcionado */
            height: 82px; /* conserva sus proporciones */
            margin-bottom: 0; /* elimina la separacion vertical anterior */
            align-self: center; /* centra el icono verticalmente */
        }

        .texto_experiencia_elegirnos,
        .texto_analisis_elegirnos,
        .texto_confidencialidad_elegirnos,
        .texto_resultados_elegirnos {
            grid-column: 2; /* coloca el titulo a la derecha del icono */
            grid-row: 1; /* posiciona el titulo encima de la descripcion */
            min-width: 0; /* permite ajustar el texto disponible */
            margin-bottom: 0; /* utiliza la separacion definida por grid */
            font-size: 1.15rem; /* mantiene el titulo legible */
            text-align: left; /* alinea el titulo a la izquierda */
            align-self: end; /* aproxima el titulo a la descripcion */
        }

        .descripcion_experiencia_elegirnos,
        .descripcion_analisis_elegirnos,
        .descripcion_confidencialidad_elegirnos,
        .descripcion_resultados_elegirnos {
            grid-column: 2; /* coloca la descripcion a la derecha del icono */
            grid-row: 2; /* posiciona la descripcion debajo del titulo */
            min-width: 0; /* permite que el texto se distribuya en varias lineas */
            max-width: 100%; /* utiliza todo el ancho de la columna de texto */
            font-size: 0.94rem; /* mantiene la descripcion legible */
            line-height: 1.45; /* mejora la separacion entre lineas */
            text-align: left; /* evita espacios excesivos de justificacion */
            align-self: start; /* aproxima la descripcion al titulo */
        }

        .tarjeta_experiencia_elegirnos::after,
        .tarjeta_analisis_elegirnos::after,
        .tarjeta_confidencialidad_elegirnos::after,
        .tarjeta_resultados_elegirnos::after {
            right: 14px; /* mantiene la flecha en la esquina inferior derecha */
            bottom: 10px; /* separa la flecha del borde inferior */
        }

    }


    /* tablets verticales (iPad clásico, tablets Android estándar) */
    @media (max-width: 768px) {

        .contenedor_tarjetas_elegirnos {
            width: 100%; /* aprovecha el espacio interno de la seccion */
            gap: 12px; /* mantiene una separacion uniforme */
        }

        .tarjeta_experiencia_elegirnos,
        .tarjeta_analisis_elegirnos,
        .tarjeta_confidencialidad_elegirnos,
        .tarjeta_resultados_elegirnos {
            grid-template-columns: 68px minmax(0, 1fr); /* adapta la columna del icono */
            column-gap: 9px; /* reduce ligeramente la separacion horizontal */
            row-gap: 5px; /* mantiene el titulo cerca de la descripcion */
            min-height: 125px; /* reduce la altura de las tarjetas */
            padding: 14px 12px 34px; /* deja espacio para la flecha sin exagerar la altura */
        }

        .imagen_experiencia_elegirnos,
        .imagen_analisis_elegirnos,
        .imagen_confidencialidad_elegirnos,
        .imagen_resultados_elegirnos {
            width: 65px; /* adapta los iconos a la cuadricula */
            height: 65px; /* conserva las proporciones */
        }

        .texto_experiencia_elegirnos,
        .texto_analisis_elegirnos,
        .texto_confidencialidad_elegirnos,
        .texto_resultados_elegirnos {
            font-size: 1.02rem; /* mantiene titulos legibles sin ocupar demasiado espacio */
            line-height: 1.3; /* permite dividir los titulos si hace falta */
        }

        .descripcion_experiencia_elegirnos,
        .descripcion_analisis_elegirnos,
        .descripcion_confidencialidad_elegirnos,
        .descripcion_resultados_elegirnos {
            font-size: 0.9rem; /* adapta la descripcion a dos columnas */
            line-height: 1.4; /* conserva una separacion adecuada */
            width: 85%;
            text-align: justify;
        }

    }



    /* móviles extragrandes (pantallas compactas y dispositivos de gran tamaño) */
    @media (max-width: 576px) {

        .contenedor_tarjetas_elegirnos {
            width: 90%; /* utiliza todo el ancho disponible */
            grid-template-columns: minmax(0, 1fr); /* muestra una tarjeta por fila */
            gap: 12px; /* conserva separaciones compactas */
        }

        .tarjeta_experiencia_elegirnos,
        .tarjeta_analisis_elegirnos,
        .tarjeta_confidencialidad_elegirnos,
        .tarjeta_resultados_elegirnos {
            grid-template-columns: 80px minmax(0, 1fr); /* mantiene icono a la izquierda y textos a la derecha */
            column-gap: 13px; /* mantiene separacion entre icono y textos */
            row-gap: 5px; /* separa titulo y descripcion */
            min-height: 126px; /* evita tarjetas excesivamente altas */
            padding: 16px 16px 35px; /* reserva espacio inferior para la flecha */
        }

        .imagen_experiencia_elegirnos,
        .imagen_analisis_elegirnos,
        .imagen_confidencialidad_elegirnos,
        .imagen_resultados_elegirnos {
            width: 76px; /* muestra un icono proporcionado */
            height: 76px; /* mantiene sus dimensiones */
            margin-bottom: 0; /* elimina margenes verticales anteriores */
        }

        .texto_experiencia_elegirnos,
        .texto_analisis_elegirnos,
        .texto_confidencialidad_elegirnos,
        .texto_resultados_elegirnos {
            font-size: 1.12rem; /* mantiene jerarquia en pantallas moviles */
            line-height: 1.25; /* ajusta el interlineado */
            text-align: left; /* mantiene el titulo junto al icono */
        }

        .descripcion_experiencia_elegirnos,
        .descripcion_analisis_elegirnos,
        .descripcion_confidencialidad_elegirnos,
        .descripcion_resultados_elegirnos {
            font-size: 0.91rem; /* mantiene la descripcion legible */
            line-height: 1.4; /* controla la altura ocupada por el texto */
            text-align: left; /* conserva la alineacion horizontal */
        }

        .tarjeta_experiencia_elegirnos::after,
        .tarjeta_analisis_elegirnos::after,
        .tarjeta_confidencialidad_elegirnos::after,
        .tarjeta_resultados_elegirnos::after {
            right: 14px; /* mantiene las flechas alineadas a la derecha */
            bottom: 9px; /* las separa del borde inferior */
            font-size: 1.8rem; /* deja la flecha proporcionada */
        }

    }

    /* móviles grandes (iPhone 11, iPhone Plus/Max, Android grandes) */
    @media (max-width: 414px) {

        .tarjeta_experiencia_elegirnos,
        .tarjeta_analisis_elegirnos,
        .tarjeta_confidencialidad_elegirnos,
        .tarjeta_resultados_elegirnos {
            grid-template-columns: 68px minmax(0, 1fr); /* ajusta el espacio destinado al icono */
            min-height: 100px; /* conserva una tarjeta compacta */
            padding: 25px 13px 30px; /* adapta los espacios interiores */
        }

        .imagen_experiencia_elegirnos,
        .imagen_analisis_elegirnos,
        .imagen_confidencialidad_elegirnos,
        .imagen_resultados_elegirnos {
            width: 65px; /* adapta el icono al ancho del dispositivo */
            height: 65px; /* conserva sus proporciones */
        }

        .texto_experiencia_elegirnos,
        .texto_analisis_elegirnos,
        .texto_confidencialidad_elegirnos,
        .texto_resultados_elegirnos {
            font-size: 1.06rem; /* adapta los titulos al espacio */
        }

        .descripcion_experiencia_elegirnos,
        .descripcion_analisis_elegirnos,
        .descripcion_confidencialidad_elegirnos,
        .descripcion_resultados_elegirnos {
            font-size: 0.91rem; /* mantiene la descripcion legible */
            line-height: 1.4; /* controla la altura ocupada por el texto */
            text-align: justify; /* conserva la alineacion horizontal */
            width: 85%;
        }


    }


    /* móviles medianos (iPhone 12/13/14, Android gama media) */
    @media (max-width: 390px) {

        .tarjeta_experiencia_elegirnos,
        .tarjeta_analisis_elegirnos,
        .tarjeta_confidencialidad_elegirnos,
        .tarjeta_resultados_elegirnos {
            grid-template-columns: 64px minmax(0, 1fr); /* aprovecha mejor el espacio */
            column-gap: 9px; /* separa los iconos de los textos */
            padding: 30px 12px 30px; /* mantiene una altura compacta */
        }

        .imagen_experiencia_elegirnos,
        .imagen_analisis_elegirnos,
        .imagen_confidencialidad_elegirnos,
        .imagen_resultados_elegirnos {
            width: 61px; /* adapta el ancho del icono */
            height: 61px; /* conserva las proporciones */
        }

        .descripcion_experiencia_elegirnos,
        .descripcion_analisis_elegirnos,
        .descripcion_confidencialidad_elegirnos,
        .descripcion_resultados_elegirnos {
            font-size: 0.91rem; /* mantiene la descripcion legible */
            line-height: 1.4; /* controla la altura ocupada por el texto */
            text-align: left; /* conserva la alineacion horizontal */
            width: 85%;
        }


    }   

    /* móviles pequeños (Android estándar, iPhone SE) */
    @media (max-width: 360px) {

        .tarjeta_experiencia_elegirnos,
        .tarjeta_analisis_elegirnos,
        .tarjeta_confidencialidad_elegirnos,
        .tarjeta_resultados_elegirnos {
            grid-template-columns: 58px minmax(0, 1fr); /* ajusta la columna del icono */
            column-gap: 8px; /* mantiene una separacion minima */
            min-height: 112px; /* conserva las tarjetas compactas */
            padding: 30px 11px 30px; /* reserva espacio para la flecha */
        }

        .imagen_experiencia_elegirnos,
        .imagen_analisis_elegirnos,
        .imagen_confidencialidad_elegirnos,
        .imagen_resultados_elegirnos {
            width: 56px; /* reduce ligeramente los iconos */
            height: 56px; /* mantiene sus proporciones */
        }

        .texto_experiencia_elegirnos,
        .texto_analisis_elegirnos,
        .texto_confidencialidad_elegirnos,
        .texto_resultados_elegirnos {
            font-size: 1rem; /* mantiene los titulos legibles */
        }

        .descripcion_experiencia_elegirnos,
        .descripcion_analisis_elegirnos,
        .descripcion_confidencialidad_elegirnos,
        .descripcion_resultados_elegirnos {
            font-size: 0.8rem; /* evita comprimir demasiado las descripciones */
            text-align: justify;
            width: 85%;
        }

    }


/* TITULO 4 MODALES ELEGIRNOS */

    .fondo_modal_experiencia_elegirnos,
    .fondo_modal_analisis_elegirnos,
    .fondo_modal_confidencialidad_elegirnos,
    .fondo_modal_resultados_elegirnos {
        position: fixed; /* mantiene el modal fijo sobre la pagina */
        top: 0; /* posiciona el modal desde el borde superior */
        left: 0; /* posiciona el modal desde el borde izquierdo */
        width: 100%; /* ocupa todo el ancho de la pantalla */
        height: 100vh; /* establece la altura completa como respaldo */
        height: 100dvh; /* utiliza la altura visible del dispositivo */
        display: none; /* mantiene el modal oculto inicialmente */
        justify-content: center; /* centra horizontalmente el contenido */
        align-items: center; /* centra verticalmente el contenido */
        padding: 2vh 2vw; /* establece espacios alrededor del contenido */
        background-color: rgba(25, 20, 16, 0.72); /* establece el fondo oscurecido */
        z-index: 99999; /* mantiene el modal sobre los demas elementos */
        box-sizing: border-box; /* incluye el padding dentro de las dimensiones */
    }

    .contenido_modal_experiencia_elegirnos,
    .contenido_modal_analisis_elegirnos,
    .contenido_modal_confidencialidad_elegirnos,
    .contenido_modal_resultados_elegirnos {
        width: 70%; /* establece el ancho general del modal */
        max-width: 1000px; /* limita el ancho maximo */
        height: min(70vh, 640px); /* limita la altura del modal en pantallas altas */
        max-height: calc(100dvh - 24px); /* evita que sobrepase la pantalla visible */
        display: flex; /* organiza la imagen y la informacion horizontalmente */
        overflow: hidden; /* evita que el contenido sobresalga del modal */
        background-color: #ffffff; /* establece el fondo blanco */
        border-radius: 14px; /* redondea las esquinas del modal */
        box-shadow: 0 18px 55px rgba(20, 16, 12, 0.24); /* establece una sombra alrededor del modal */
        box-sizing: border-box; /* incluye los espacios dentro de las dimensiones */
    }

    .contenedor_imagen_modal_experiencia_elegirnos,
    .contenedor_imagen_modal_analisis_elegirnos,
    .contenedor_imagen_modal_confidencialidad_elegirnos,
    .contenedor_imagen_modal_resultados_elegirnos {
        width: 44%; /* establece el ancho del panel de imagen */
        height: 100%; /* ocupa toda la altura del modal */
        flex-shrink: 0; /* evita que el panel reduzca su tamaño */
        background-color: #f8f4ee; /* establece el fondo crema del panel */
        overflow: hidden; /* evita que la imagen sobresalga */
    }

    .imagen_modal_experiencia_elegirnos,
    .imagen_modal_analisis_elegirnos,
    .imagen_modal_confidencialidad_elegirnos,
    .imagen_modal_resultados_elegirnos {
        width: 100%; /* ocupa el ancho completo del panel */
        height: 100%; /* ocupa la altura completa del panel */
        display: block; /* elimina espacios inferiores de la imagen */
        object-fit: cover; /* cubre el panel sin deformar la imagen */
    }

    .informacion_modal_experiencia_elegirnos,
    .informacion_modal_analisis_elegirnos,
    .informacion_modal_confidencialidad_elegirnos,
    .informacion_modal_resultados_elegirnos {
        position: relative; /* permite posicionar los elementos internos */
        width: 56%; /* establece el ancho del panel informativo */
        height: 100%; /* ocupa toda la altura disponible */
        min-height: 0; /* permite ajustar el contenido dentro del panel */
        padding: min(7vh, 55px) 4vw min(4vh, 32px) 4vw; /* limita los espacios internos en pantallas altas */
        box-sizing: border-box; /* incluye el padding dentro de las dimensiones */
        overflow-y: auto; /* permite desplazar el contenido cuando sea necesario */
    }

    .boton_cerrar_modal_experiencia_elegirnos,
    .boton_cerrar_modal_analisis_elegirnos,
    .boton_cerrar_modal_confidencialidad_elegirnos,
    .boton_cerrar_modal_resultados_elegirnos {
        position: absolute; /* posiciona el boton dentro del panel informativo */
        top: min(2vh, 16px); /* limita la separacion superior */
        right: 2vw; /* establece la separacion derecha */
        width: 35px; /* establece el ancho del boton */
        height: 35px; /* establece la altura del boton */
        display: flex; /* organiza el contenido del boton */
        justify-content: center; /* centra horizontalmente el simbolo */
        align-items: center; /* centra verticalmente el simbolo */
        padding: 0; /* elimina los espacios internos */
        border: none; /* elimina el borde del boton */
        background-color: transparent; /* mantiene el fondo transparente */
        color: #99813D; /* establece el color del simbolo */
        font-family: Arial, Helvetica, sans-serif; /* establece la tipografia del boton */
        font-size: 30px; /* establece el tamaño del simbolo */
        font-weight: 300; /* establece el grosor del simbolo */
        line-height: 1; /* controla la altura de linea */
        cursor: pointer; /* muestra el cursor de seleccion */
    }

    .boton_cerrar_modal_experiencia_elegirnos:hover,
    .boton_cerrar_modal_analisis_elegirnos:hover,
    .boton_cerrar_modal_confidencialidad_elegirnos:hover,
    .boton_cerrar_modal_resultados_elegirnos:hover {
        color: #99813D; /* cambia el color al posicionar el cursor */
    }

    .encabezado_modal_experiencia_elegirnos,
    .encabezado_modal_analisis_elegirnos,
    .encabezado_modal_confidencialidad_elegirnos,
    .encabezado_modal_resultados_elegirnos {
        width: 100%; /* ocupa el ancho completo del contenedor */
        display: flex; /* organiza los elementos horizontalmente */
        justify-content: center; /* centra horizontalmente los elementos */
        align-items: center; /* centra verticalmente los elementos */
        gap: 1vw; /* establece la separacion entre los elementos */
        margin-bottom: min(3vh, 24px); /* limita la separacion inferior */
        box-sizing: border-box; /* incluye los espacios dentro de las dimensiones */
    }

    .linea_izquierda_modal_experiencia_elegirnos,
    .linea_izquierda_modal_analisis_elegirnos,
    .linea_izquierda_modal_confidencialidad_elegirnos,
    .linea_izquierda_modal_resultados_elegirnos {
        flex: 1; /* permite utilizar el espacio disponible */
        height: 1px; /* establece el grosor de las lineas */
        background-color: #182B3A; /* establece el color dorado */
    }

    .titulo_modal_experiencia_elegirnos,
    .titulo_modal_analisis_elegirnos,
    .titulo_modal_confidencialidad_elegirnos,
    .titulo_modal_resultados_elegirnos {
        min-width: 0; /* permite adaptar el titulo al espacio disponible */
        color: #182B3A; /* establece el color dorado del titulo */
        font-family: 'Raleway', sans-serif; /* establece la tipografia Raleway */
        font-size: min(3vh, 23px); /* limita el crecimiento del titulo en pantallas altas */
        font-weight: 600; /* establece el grosor del titulo */
        line-height: 1.2; /* establece la separacion entre lineas */
        text-align: center; /* centra horizontalmente el titulo */
        white-space: nowrap; /* mantiene el titulo en una sola linea cuando existe espacio */
    }

    .linea_derecha_modal_experiencia_elegirnos,
    .linea_derecha_modal_analisis_elegirnos,
    .linea_derecha_modal_confidencialidad_elegirnos,
    .linea_derecha_modal_resultados_elegirnos {
        flex: 1; /* permite utilizar el espacio disponible */
        height: 1px; /* establece el grosor de las lineas */
        background-color: #182B3A; /* establece el color dorado */
    }

    .subtitulo_modal_experiencia_elegirnos,
    .subtitulo_modal_analisis_elegirnos,
    .subtitulo_modal_confidencialidad_elegirnos,
    .subtitulo_modal_resultados_elegirnos {
        margin-bottom: min(4vh, 20px); /* controla la separacion inferior */
        color: #2F3B46; /* establece el color dorado del subtitulo */
        font-family: 'Raleway', sans-serif; /* establece la tipografia Raleway */
        font-size: min(2.2vh, 15px); /* limita el tamaño del subtitulo */
        font-weight: 600; /* establece el grosor del texto */
        line-height: 1.45; /* establece la separacion vertical entre lineas */
        text-align: justify; /* mantiene el texto justificado */
    }

    .texto_modal_experiencia_elegirnos,
    .texto_modal_analisis_elegirnos,
    .texto_modal_confidencialidad_elegirnos,
    .texto_modal_resultados_elegirnos {
        margin: 0; /* elimina los margenes predeterminados de las listas */
        padding-left: 1.25rem; /* establece una sangria estable para las listas */
        color: #45494D; /* establece el color del contenido */
        font-family: 'Raleway', sans-serif; /* establece la tipografia Raleway */
        font-size: min(2vh, 15px); /* limita el tamaño del texto en pantallas altas */
        line-height: 2; /* establece la separacion vertical entre lineas */
        text-align: left; /* mantiene el contenido justificado */    }

    .item_modal_experiencia_elegirnos,
    .item_modal_analisis_elegirnos,
    .item_modal_confidencialidad_elegirnos,
    .item_modal_resultados_elegirnos{            
        position: relative; /* permite posicionar las viñetas doradas */
        padding-left: 20px; /* reserva espacio a la izquierda para las viñetas */
        margin-bottom: 5px; /* establece una separacion pequeña entre elementos */
        line-height: 1.45; /* mantiene una lectura comoda */
        text-align: left; /* mantiene el texto alineado a la izquierda */
    }
    .viñeta_modal_experiencia_elegirnos,
    .viñeta_modal_analisis_elegirnos,
    .viñeta_modal_confidencialidad_elegirnos,
    .viñeta_modal_resultados_elegirnos{
        position: absolute; /* permite ubicar la viñeta junto al texto */
        left: 0; /* coloca la viñeta al inicio del elemento */
        top: 5px; /* alinea la viñeta con la primera linea del texto */
        width: 4px; /* establece el ancho de la viñeta */
        height: 4px; /* establece la altura de la viñeta */
        border-radius: 50%; /* convierte la viñeta en un circulo */
        background-color: #99813D; /* establece el color dorado corporativo */
    }


    /* SUBTITULO 1 MODAL EXPERIENCIA COMPROBADA */

        /* sin estilos */


    /* SUBTITULO 2 MODAL ANALISIS ESTRATEGICO */

        /* sin estilos */


    /* SUBTITULO 3 MODAL CONFIDENCIALIDAD ABSOLUTA */

        /* sin estilos */


    /* SUBTITULO 4 MODAL ORIENTACION A RESULTADOS */

        /* sin estilos */


    .boton_conocer_mas {
        width: 250px; /* establece el ancho del boton */
        max-width: 100%; /* evita que el boton supere el ancho disponible */
        height: 42px; /* establece la altura del boton */
        margin-top: min(4vh, 30px); /* controla la separacion superior del boton */
        padding: 0; /* elimina los espacios internos */
        background: linear-gradient(135deg, #d4a64f, #b8862e); /* establece el fondo degradado */
        border: none; /* elimina el borde */
        border-radius: 6px; /* redondea las esquinas */
        color: #ffffff; /* establece el color blanco del texto */
        font-family: 'Raleway', sans-serif; /* establece la tipografia Raleway */
        font-size: 16px; /* establece el tamaño del texto */
        font-weight: 700; /* establece el grosor del texto */
        cursor: pointer; /* muestra el cursor de seleccion */
        box-shadow: 0 3px 8px rgba(184, 134, 46, 0.25); /* establece una sombra suave */
        display: none;
    }

    .boton_conocer_mas:hover {
        background: linear-gradient(135deg, #c99746, #9f7021); /* modifica el degradado al pasar el cursor */
    }



    /* pantallas grandes (monitores Full HD+, iMac, monitores gaming QHD/4K) */
    @media (min-width: 1441px) {

        /* Sin media */

    }


    /* notebooks grandes (1600x900, 1920x1080) */
    @media (max-width: 1440px) {

        /* Sin media */

    }


    /* notebooks comunes (1366x768, MacBook Air/Pro) */
    @media (max-width: 1200px) {

        .contenido_modal_experiencia_elegirnos,
        .contenido_modal_analisis_elegirnos,
        .contenido_modal_confidencialidad_elegirnos,
        .contenido_modal_resultados_elegirnos {
            width: 76%; /* mantiene el ancho original del modal */
            max-width: 950px; /* limita el ancho maximo */
            height: min(70vh, 640px); /* conserva la altura original con un limite */
        }

        .contenedor_imagen_modal_experiencia_elegirnos,
        .contenedor_imagen_modal_analisis_elegirnos,
        .contenedor_imagen_modal_confidencialidad_elegirnos,
        .contenedor_imagen_modal_resultados_elegirnos {
            width: 38%; /* reduce el ancho destinado a la imagen */
        }

        .informacion_modal_experiencia_elegirnos,
        .informacion_modal_analisis_elegirnos,
        .informacion_modal_confidencialidad_elegirnos,
        .informacion_modal_resultados_elegirnos {
            width: 62%; /* aumenta el ancho destinado a la informacion */
            padding: min(4.5vh, 40px) 3vw min(3vh, 28px) 3vw; /* limita los espacios internos */
        }

        .encabezado_modal_experiencia_elegirnos,
        .encabezado_modal_analisis_elegirnos,
        .encabezado_modal_confidencialidad_elegirnos,
        .encabezado_modal_resultados_elegirnos {
            margin-top: min(2vh, 16px); /* limita la separacion superior del encabezado */
        }

    }


    /* tablets horizontales / pantallas medianas (iPad Pro en horizontal, notebooks pequeños) */
    @media (max-width: 992px) {

        .contenido_modal_experiencia_elegirnos,
        .contenido_modal_analisis_elegirnos,
        .contenido_modal_confidencialidad_elegirnos,
        .contenido_modal_resultados_elegirnos {
            width: 82%; /* mantiene el ancho original del modal */
            height: min(76vh, 640px); /* limita la altura en tablets altas */
        }

        .contenedor_imagen_modal_experiencia_elegirnos,
        .contenedor_imagen_modal_analisis_elegirnos,
        .contenedor_imagen_modal_confidencialidad_elegirnos,
        .contenedor_imagen_modal_resultados_elegirnos {
            width: 34%; /* reduce el espacio destinado a la imagen */
        }

        .informacion_modal_experiencia_elegirnos,
        .informacion_modal_analisis_elegirnos,
        .informacion_modal_confidencialidad_elegirnos,
        .informacion_modal_resultados_elegirnos {
            width: 66%; /* aumenta el espacio destinado a la informacion */
            padding: min(3.5vh, 32px) 3vw min(3vh, 24px) 3vw; /* controla los espacios internos */
        }

        .encabezado_modal_experiencia_elegirnos,
        .encabezado_modal_analisis_elegirnos,
        .encabezado_modal_confidencialidad_elegirnos,
        .encabezado_modal_resultados_elegirnos {
            margin-top: min(3vh, 22px); /* controla la separacion superior del encabezado */
        }

        .titulo_modal_experiencia_elegirnos,
        .titulo_modal_analisis_elegirnos,
        .titulo_modal_confidencialidad_elegirnos,
        .titulo_modal_resultados_elegirnos {
            white-space: normal; /* permite dividir titulos largos */
            overflow-wrap: break-word; /* evita que los titulos sobresalgan */
        }

    }


    /* tablets verticales (iPad clásico, tablets Android estándar) */
    @media (max-width: 768px) {

        .contenido_modal_experiencia_elegirnos,
        .contenido_modal_analisis_elegirnos,
        .contenido_modal_confidencialidad_elegirnos,
        .contenido_modal_resultados_elegirnos {
            width: 82%; /* mantiene el ancho original del modal */
            height: min(88vh, 640px); /* conserva la altura anterior con un limite */
            flex-direction: column; /* coloca la imagen arriba y la informacion debajo */
        }

        .contenedor_imagen_modal_experiencia_elegirnos,
        .contenedor_imagen_modal_analisis_elegirnos,
        .contenedor_imagen_modal_confidencialidad_elegirnos,
        .contenedor_imagen_modal_resultados_elegirnos {
            width: 100%; /* ocupa el ancho completo del modal */
            height: 28%; /* reserva la parte superior para la imagen */
            flex: 0 0 28%; /* conserva la proporcion del panel de imagen */
        }

        .informacion_modal_experiencia_elegirnos,
        .informacion_modal_analisis_elegirnos,
        .informacion_modal_confidencialidad_elegirnos,
        .informacion_modal_resultados_elegirnos {
            width: 100%; /* ocupa el ancho completo del modal */
            height: auto; /* permite adaptar la altura al espacio restante */
            min-height: 0; /* permite el desplazamiento interno */
            flex: 1; /* ocupa el espacio restante debajo de la imagen */
            padding: 3.5vh 6vw 3vh 6vw; /* mantiene los espacios originales */
            overflow-y: auto; /* permite desplazar los textos cuando sea necesario */
        }

        .encabezado_modal_experiencia_elegirnos,
        .encabezado_modal_analisis_elegirnos,
        .encabezado_modal_confidencialidad_elegirnos,
        .encabezado_modal_resultados_elegirnos {
            gap: 2vw; /* ajusta la separacion entre los elementos */
            margin-top: 0; /* elimina el desplazamiento heredado de tablets horizontales */
            margin-bottom: 2vh; /* establece la separacion inferior */
        }

        .linea_izquierda_modal_experiencia_elegirnos,
        .linea_izquierda_modal_analisis_elegirnos,
        .linea_izquierda_modal_confidencialidad_elegirnos,
        .linea_izquierda_modal_resultados_elegirnos,
        .linea_derecha_modal_experiencia_elegirnos,
        .linea_derecha_modal_analisis_elegirnos,
        .linea_derecha_modal_confidencialidad_elegirnos,
        .linea_derecha_modal_resultados_elegirnos {
            flex: 0 0 8vw; /* establece un ancho controlado para las lineas */
        }

        .titulo_modal_experiencia_elegirnos,
        .titulo_modal_analisis_elegirnos,
        .titulo_modal_confidencialidad_elegirnos,
        .titulo_modal_resultados_elegirnos {
            font-size: min(2.6vh, 19px); /* mantiene el tamaño anterior con un limite */
            white-space: normal; /* permite dividir los titulos */
        }

        .subtitulo_modal_experiencia_elegirnos,
        .subtitulo_modal_analisis_elegirnos,
        .subtitulo_modal_confidencialidad_elegirnos,
        .subtitulo_modal_resultados_elegirnos {
            margin-bottom: 2.5vh; /* mantiene la separacion inferior */
            font-size: min(2vh, 16px); /* limita el tamaño de los subtitulos */
        }

        .texto_modal_experiencia_elegirnos,
        .texto_modal_analisis_elegirnos,
        .texto_modal_confidencialidad_elegirnos,
        .texto_modal_resultados_elegirnos {
            font-size: min(1.9vh, 16px); /* controla el tamaño de los textos */
        }

        .boton_cerrar_modal_experiencia_elegirnos,
        .boton_cerrar_modal_analisis_elegirnos,
        .boton_cerrar_modal_confidencialidad_elegirnos,
        .boton_cerrar_modal_resultados_elegirnos {
            top: 12px; /* establece la separacion superior */
            right: 15px; /* establece la separacion derecha */
            font-size: 28px; /* ajusta el tamaño del simbolo */
        }

        .boton_conocer_mas {
            width: 230px; /* ajusta el ancho del boton */
            height: 40px; /* ajusta la altura del boton */
            margin-top: min(3vh, 24px); /* controla la separacion superior */
        }

    }


    /* móviles extragrandes (pantallas compactas y dispositivos de gran tamaño) */
    @media (max-width: 576px) {

        .contenido_modal_experiencia_elegirnos,
        .contenido_modal_analisis_elegirnos,
        .contenido_modal_confidencialidad_elegirnos,
        .contenido_modal_resultados_elegirnos {
            width: 90%; /* mantiene el ancho original del modal */
            height: min(84vh, 640px); /* mantiene la altura proporcional con un limite */
        }

        .contenedor_imagen_modal_experiencia_elegirnos,
        .contenedor_imagen_modal_analisis_elegirnos,
        .contenedor_imagen_modal_confidencialidad_elegirnos,
        .contenedor_imagen_modal_resultados_elegirnos {
            height: 23%; /* reserva el 23% de la altura para la imagen */
            flex-basis: 23%; /* establece la proporcion de la imagen */
        }

        .informacion_modal_experiencia_elegirnos,
        .informacion_modal_analisis_elegirnos,
        .informacion_modal_confidencialidad_elegirnos,
        .informacion_modal_resultados_elegirnos {
            padding: 4vh 10vw 2.5vh 10vw; /* mantiene los espacios del diseño movil */
        }

        .boton_cerrar_modal_experiencia_elegirnos,
        .boton_cerrar_modal_analisis_elegirnos,
        .boton_cerrar_modal_confidencialidad_elegirnos,
        .boton_cerrar_modal_resultados_elegirnos {
            top: 1vh; /* ajusta la separacion superior */
            right: 2vw; /* ajusta la separacion derecha */
            width: 28px; /* establece el ancho del boton */
            height: 28px; /* establece la altura del boton */
            font-size: 25px; /* ajusta el tamaño del simbolo */
        }

        .encabezado_modal_experiencia_elegirnos,
        .encabezado_modal_analisis_elegirnos,
        .encabezado_modal_confidencialidad_elegirnos,
        .encabezado_modal_resultados_elegirnos {
            gap: 2vw; /* mantiene la separacion entre los elementos */
            margin-bottom: 2vh; /* establece la separacion inferior */
            padding-right: 18px; /* reserva espacio para el boton cerrar */
            box-sizing: border-box; /* incluye el padding dentro del ancho */
        }

        .linea_izquierda_modal_experiencia_elegirnos,
        .linea_izquierda_modal_analisis_elegirnos,
        .linea_izquierda_modal_confidencialidad_elegirnos,
        .linea_izquierda_modal_resultados_elegirnos,
        .linea_derecha_modal_experiencia_elegirnos,
        .linea_derecha_modal_analisis_elegirnos,
        .linea_derecha_modal_confidencialidad_elegirnos,
        .linea_derecha_modal_resultados_elegirnos {
            flex-basis: 5vw; /* reduce el ancho de las lineas decorativas */
        }

        .titulo_modal_experiencia_elegirnos,
        .titulo_modal_analisis_elegirnos,
        .titulo_modal_confidencialidad_elegirnos,
        .titulo_modal_resultados_elegirnos {
            font-size: min(2vh, 16px); /* recupera el tamaño compacto de los titulos */
            white-space: normal; /* permite dividir titulos largos */
            line-height: 1.25; /* ajusta la separacion entre lineas */
        }

        .subtitulo_modal_experiencia_elegirnos,
        .subtitulo_modal_analisis_elegirnos,
        .subtitulo_modal_confidencialidad_elegirnos,
        .subtitulo_modal_resultados_elegirnos {
            margin-bottom: 2.5vh; /* establece la separacion inferior */
            font-size: min(1.8vh, 15px); /* mantiene el tamaño del subtitulo */
            line-height: 1.45; /* mantiene la separacion entre lineas */
            text-align: justify; /* mantiene el texto justificado */
        }

        .texto_modal_experiencia_elegirnos,
        .texto_modal_analisis_elegirnos,
        .texto_modal_confidencialidad_elegirnos,
        .texto_modal_resultados_elegirnos {
            font-size: min(1.7vh, 15px); /* recupera el tamaño compacto del contenido */
            text-align: justify; /* mantiene el texto justificado */
        }

        .boton_conocer_mas {
            width: 220px; /* ajusta el ancho del boton */
            height: 40px; /* establece la altura del boton */
            font-size: max(13px, min(1.5vh, 15px)); /* mantiene el texto legible en moviles */
        }

    }


    /* móviles grandes (iPhone 11, iPhone Plus/Max, Android grandes) */
    @media (max-width: 414px) {

        /* Sin media */

    }


    /* móviles medianos (iPhone 12/13/14, Android gama media) */
    @media (max-width: 390px) {

        .contenido_modal_experiencia_elegirnos,
        .contenido_modal_analisis_elegirnos,
        .contenido_modal_confidencialidad_elegirnos,
        .contenido_modal_resultados_elegirnos {
            width: 91%; /* mantiene el ancho original del modal */
            height: min(84vh, 640px); /* limita la altura del modal */
        }

        .contenedor_imagen_modal_experiencia_elegirnos,
        .contenedor_imagen_modal_analisis_elegirnos,
        .contenedor_imagen_modal_confidencialidad_elegirnos,
        .contenedor_imagen_modal_resultados_elegirnos {
            height: 22%; /* reserva el 22% de la altura para la imagen */
            flex-basis: 22%; /* establece la proporcion del panel de imagen */
        }

        .informacion_modal_experiencia_elegirnos,
        .informacion_modal_analisis_elegirnos,
        .informacion_modal_confidencialidad_elegirnos,
        .informacion_modal_resultados_elegirnos {
            padding: 4vh 10vw 2.5vh 10vw; /* mantiene los espacios internos */
        }

        .titulo_modal_experiencia_elegirnos,
        .titulo_modal_analisis_elegirnos,
        .titulo_modal_confidencialidad_elegirnos,
        .titulo_modal_resultados_elegirnos {
            font-size: min(2.3vh, 16px); /* controla el tamaño de los titulos */
        }

    }


    /* móviles pequeños (Android estándar, iPhone SE) */
    @media (max-width: 360px) {

        .contenido_modal_experiencia_elegirnos,
        .contenido_modal_analisis_elegirnos,
        .contenido_modal_confidencialidad_elegirnos,
        .contenido_modal_resultados_elegirnos {
            width: 92%; /* mantiene el ancho original del modal */
            height: min(85vh, 640px); /* conserva la altura anterior con un limite */
        }

        .contenedor_imagen_modal_experiencia_elegirnos,
        .contenedor_imagen_modal_analisis_elegirnos,
        .contenedor_imagen_modal_confidencialidad_elegirnos,
        .contenedor_imagen_modal_resultados_elegirnos {
            height: 21%; /* reserva el 21% de la altura para la imagen */
            flex-basis: 21%; /* establece la proporcion del panel de imagen */
        }

        .informacion_modal_experiencia_elegirnos,
        .informacion_modal_analisis_elegirnos,
        .informacion_modal_confidencialidad_elegirnos,
        .informacion_modal_resultados_elegirnos {
            padding: 4vh 10vw 2.5vh 10vw; /* mantiene los espacios internos del diseño original */
        }

        .titulo_modal_experiencia_elegirnos,
        .titulo_modal_analisis_elegirnos,
        .titulo_modal_confidencialidad_elegirnos,
        .titulo_modal_resultados_elegirnos {
            font-size: min(2vh, 16px); /* mantiene el titulo compacto */
            white-space: normal; /* permite dividir titulos largos */
            line-height: 1.25; /* ajusta la separacion vertical */
        }

        .linea_izquierda_modal_experiencia_elegirnos,
        .linea_izquierda_modal_analisis_elegirnos,
        .linea_izquierda_modal_confidencialidad_elegirnos,
        .linea_izquierda_modal_resultados_elegirnos,
        .linea_derecha_modal_experiencia_elegirnos,
        .linea_derecha_modal_analisis_elegirnos,
        .linea_derecha_modal_confidencialidad_elegirnos,
        .linea_derecha_modal_resultados_elegirnos {
            flex-basis: 5vw; /* mantiene el ancho reducido de las lineas */
        }

        .subtitulo_modal_experiencia_elegirnos,
        .subtitulo_modal_analisis_elegirnos,
        .subtitulo_modal_confidencialidad_elegirnos,
        .subtitulo_modal_resultados_elegirnos {
            font-size: min(1.7vh, 14px); /* recupera el tamaño del subtitulo */
            line-height: 1.4; /* mantiene la separacion entre lineas */
            text-align: justify; /* conserva el texto justificado */
        }

        .texto_modal_experiencia_elegirnos,
        .texto_modal_analisis_elegirnos,
        .texto_modal_confidencialidad_elegirnos,
        .texto_modal_resultados_elegirnos {
            font-size: min(1.6vh, 14px); /* recupera el tamaño del contenido en 360px */
            line-height: 1.4; /* ajusta la separacion entre lineas */
            text-align: justify; /* mantiene el contenido justificado */
        }


    }

/* -------------------------------------------------------------------------------------------------------------
   -------------------------------------- FIN ITred Spa seccion_elegirnos .CSS ------------------------
   ------------------------------------------------------------------------------------------------------------- */


/* 
Sitio Web Creado por ITred Spa.
Direccion: Guido Reni #4190
Pedro Aguirre Cerda - Santiago - Chile
contacto@itred.cl o itred.spa@gmail.com
https://www.itred.cl
Creado, Programado y Diseñado por ITred Spa.
BPPJ 
*/