@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');

*{
    margin: 0;
    padding: 0;
    border: 0;
    box-sizing: border-box;
    font-size: 100%;
    vertical-align: baseline;
}

html, body{
    width: 100%;
    min-height: 100%;
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    background-color: #000;
    touch-action: manipulation;
}

html{
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body{
    text-align: left;
    font-family: 'Poppins', sans-serif;
}

/* ===== CONTAINER ===== */
.container{
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 100px;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
}

/* ===== HEADER ===== */
.header{
    position: relative;
    width: 100%;
    min-height: 100vh;
    min-height: 100svh;
    overflow: hidden;
    background-color: #000;
}

/* ===== CARRUSEL DE FONDO ===== */
.hero-slider{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.hero-slide{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.9s ease;
}

.hero-slide.active{
    opacity: 1;
}

.hero-slide img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    display: block;
}


/* ===== BARRA SUPERIOR ===== */
.barra-superior{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0 0 0;
}

.logo{
    display: flex;
    align-items: center;
    cursor: pointer;
    margin-left: 0px;
    margin-top: 60px;
}

.logo-img{
    width: 150px;
    height: auto;
    object-fit: contain;
    display: block;
}

.logo-click{
    cursor: pointer;
    transition: transform 0.15s ease;
}

.logo-click:active{
    transform: scale(0.95);
}

/* ===== NAVBAR ===== */
.navbar{
    display: flex;
    gap: 42px;
    align-items: center;
    position: relative;
    top: 35px;
    right: 30px;
}

.navbar a{
    font-family: 'Poppins', sans-serif;
    position: relative;
    text-decoration: none;
    color: #ffffff;
    font-size: 20px;
    font-weight: 500;
    white-space: nowrap;
    transition: color 0.3s ease;
}

.navbar a:hover{
    color: #f29100;
    transform: scale(1.03);
}

.navbar a:focus-visible,
.navbar a.is-active{
    color: #f29100;
}

/* ===== CONTENIDO CENTRAL ===== */
.contenido-header.omex-hero{
    width: 100%;
    min-height: calc(100vh - 120px);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    color: #ffffff;
    padding: 40px 0 120px 0;
}

.hero-texto{
    max-width: 750px;
}

.titulo-header{
    font-family: 'Poppins', sans-serif;
    font-size: clamp(40px, 5vw, 66px);
    font-weight: 400;
    line-height: 1.1;
    margin: 0 0 22px 0;
    color: #ffffff;
}

.descripcion-header{
    font-family: 'Poppins', sans-serif;
    font-size: clamp(16px, 1.4vw, 22px);
    font-weight: 400;
    line-height: 1.7;
    max-width: 4000px;
    margin: 50px 0 90px 0;
    color: #ffffff;
}

.hero-botones{
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
    transform: scale(1.2);
    transform-origin: left center;
}

.btn-hero{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 15px;
    text-decoration: none;
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.2px;
    border: 1px solid #ffffff;
    border-radius: 5px;
    transition: transform 0.4s ease, background-color 0.35s ease, color 0.35s ease;
}

.btn-hero-principal{
    background: #f29100;
    border-color: #f29100;
    color: #ffffff;
}

.btn-hero-secundario{
    background: rgba(255, 255, 255, 0.04);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    padding: 0 80px;
}

.btn-hero:hover{
    transform: translateY(-5px);
}

/* ===== MENU MÓVIL ===== */
.menu-toggle{
    display: none;
    background: none;
    border: none;
    color: #ffffff;
    font-size: 38px;
    line-height: 1;
    cursor: pointer;
    z-index: 5000;
}

.menu-mobile{
    position: fixed;
    inset: 0;
    background: rgba(14, 14, 14, 0.97);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 4500;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(10px);
    transition: opacity 0.28s ease, transform 0.28s ease, visibility 0.28s ease;
}

.menu-mobile.is-open{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

.menu-close{
    display: block;
    position: absolute;
    top: 28px;
    right: 28px;
    background: none;
    border: none;
    color: #ffffff;
    font-size: 34px;
    cursor: pointer;
}

.menu-logo{
    margin-bottom: 40px;
}

.menu-logo .logo-img{
    width: 180px;
    height: auto;
}

.menu-mobile nav{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 22px;
}

.menu-mobile nav a{
    text-decoration: none;
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: 22px;
    font-weight: 500;
    position: relative;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.25s ease, transform 0.25s ease, color 0.3s ease;
}

.menu-mobile.is-open nav a{
    opacity: 1;
    transform: translateY(0);
}

.menu-mobile nav a span{
    color: inherit;
}

/* ===== RESPONSIVO ===== */
@media (max-width: 1100px){

    .navbar{
        gap: 28px;
    }

    .navbar a{
        font-size: 14px;
    }

    .titulo-header{
        font-size: clamp(40px, 6vw, 62px);
    }
}


.solo-mobile-salto{
    display: none;
}

.solo-desktop-salto{
    display: inline;
}

.solo-mobile-salto{
    display: none;
}

#abrirCorreoProyecto{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f29100;
    border-color: #f29100;
    color: #ffffff;
}





























































@media (max-width: 768px){

    

    html,
    body{
        margin: 0;
        padding: 0;
        overflow-x: hidden;
    }

    .header{
        position: relative;
        width: 100%;
        min-height: 100svh;
        overflow: hidden;
        background-color: #000;
    }

    .container{
        width: 100%;
        max-width: none;
        margin: 0;
        padding-left: 20px;
        padding-right: 20px;
        box-sizing: border-box;
        position: relative;
        z-index: 2;
    }

    /* barra superior */
    .barra-superior{
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 18px 0 0 0;
        position: relative;
        z-index: 3000;
    }

    .logo{
        display: flex;
        align-items: center;
        cursor: pointer;
        margin: 0;
        margin-top: 40px;
        left: 25px;
        position: relative;
    }

    .logo-img{
        width: 140px;
        height: auto;
        object-fit: contain;
        display: block;
    }

    .navbar{
        display: none;
    }

    /* hamburguesa */
    .menu-toggle{
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 60px;
        height: 60px;
        padding: 0;
        background: none;
        border: none;
        color: #ffffff;
        font-size: 55px;
        line-height: 1;
        cursor: pointer;
        position: relative;
        z-index: 3600;
        right:15px;
        top: 15px;
    }

    /* contenido central */
    .contenido-header.omex-hero{
    width: 100%;
    min-height: calc(100svh - 90px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #ffffff;
    padding: 0 0 90px 0;
    position: relative;
    top: -20px;
    z-index: 2;
}

    .hero-texto{
        width: 100%;
        max-width: 100%;
        text-align: center;
    }

    .titulo-header{
        font-family: 'Poppins', sans-serif;
        font-size: clamp(29px, 7.2vw, 44px);
        font-weight: 400;
        line-height: 1.05;
        margin: 0 0 50px 0;
        color: #ffffff;
        text-align: center;
    }

    .descripcion-header{
    font-family: 'Poppins', sans-serif;
    font-size: clamp(18px, 1.6vw, 24px);
    font-weight: 400;
    line-height: 1.5;
    max-width: 440px;
    margin: 0 auto 70px auto;
    color: #ffffff;
    text-align: center;
}

    .hero-botones{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 25px;
        transform: none;
        width: 100%;
    }

    .btn-hero{
        width: 100%;
        max-width: 320px;
        min-height: 46px;
        padding: 0 18px;
        font-size: 15px;
        justify-content: center;
        text-align: center;
    }

    .btn-hero-secundario{
        padding: 0 18px;
    }

    /* menú móvil */
    .menu-mobile{
    position: fixed;
    inset: 0;
    background-color: #1d1d1b;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 4500;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(10px);
    transition: opacity 0.28s ease, transform 0.28s ease, visibility 0.28s ease;
}

.menu-mobile.is-open{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

    .menu-close{
        display: block;
        position: absolute;
        top: 90px;
        right: 45px;
        background: none;
        border: none;
        color: #ffffff;
        font-size: 60px;
        cursor: pointer;
    }

    .menu-logo{
        margin-bottom: 150px;
    }

    .menu-logo .logo-img{
        width: 200px;
        height: auto;
        top: 50px;
        position: relative;

    }

    .menu-mobile nav{
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 22px;
    }

    .menu-mobile nav a{
    text-decoration: none;
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: 20px;
    font-weight: 500;
    position: relative;
    transition: color 0.3s ease, transform 0.3s ease;
}

.menu-mobile nav a:hover{
    color: #f29100;
    transform: scale(1.08);
}

.menu-mobile nav a:active{
    transform: scale(0.97);
}

    html.menu-open,
    body.menu-open{
        overflow: hidden;
        height: 100vh;
        touch-action: none;
    }

.solo-mobile-salto{
    display: inline;
}

.solo-tablet-salto{
    display: none;
}
}











































/* ===== MODAL FORMULARIO PROYECTO ===== */
.modal-formulario-proyecto{
    position: fixed;
    inset: 0;
    z-index: 6000;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.modal-formulario-proyecto.is-open{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.modal-formulario-overlay{
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.modal-formulario-caja{
    position: relative;
    width: calc(100% - 80px);
    max-width: 1120px;
    max-height: calc(100vh - 80px);
    margin: 40px auto;
    background: rgba(18, 18, 18, 0.96);
    border: 1px solid rgba(255, 255, 255, 0.16);
    box-shadow: 0 20px 70px rgba(0, 0, 0, 0.45);
    overflow: hidden;
    z-index: 2;
    border-radius: 30px;    
}

.modal-formulario-cerrar{
    position: absolute;
    top: 22px;
    right: 22px;
    width: 46px;
    height: 46px;
    background: none;
    border: none;
    color: #ffffff;
    font-size: 30px;
    opacity: 0.9;
    line-height: 1;
    cursor: pointer;
    z-index: 5;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.modal-formulario-cerrar:hover{
    transform: scale(1.06);
    opacity: 0.85;
}

.modal-formulario-grid{
    display: grid;
    grid-template-columns: 0.95fr 1.25fr;
    min-height: 100%;
}

.modal-formulario-info{
    background:
        linear-gradient(rgba(0,0,0,0.75), rgba(0,0,0,0.75)),
        url("imagenes/imagen-formulario.png");
    background-size: cover;
    background-position: center;
    padding: 70px 48px 48px 48px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding-top: 110px;
}

.modal-formulario-etiqueta{
    display: inline-block;
    margin-bottom: 18px;
    color: #f29100;
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1.5px;
}

.modal-formulario-info h2{
    margin: 0 0 20px 0;
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(38px, 3.2vw, 54px);
    font-weight: 600;
    line-height: 1.02;
    max-width: 320px;
}

.modal-formulario-texto{
    margin: 0 0 28px 0;
    color: rgba(255,255,255,0.88);
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    line-height: 1.65;
}

.modal-formulario-lista{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.modal-formulario-lista li::before{
    content: "";
    position: absolute;
    left: 0;
    top: 7px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #f29100;
}

.modal-formulario-contenido{
    padding: 70px 42px 42px 42px;
    overflow-y: auto;
}

.formulario-proyecto{
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.formulario-fila{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.formulario-campo{
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.formulario-campo-full{
    width: 100%;
    margin-top: 6px;
}

.formulario-campo label{
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;
}

.formulario-campo input,
.formulario-campo select,
.formulario-campo textarea{
    width: 100%;
    min-height: 52px;
    padding: 14px 16px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.16);
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    line-height: 1.4;
    outline: none;
    transition: border-color 0.25s ease, background-color 0.25s ease, box-shadow 0.25s ease;
    border-radius: 8px;
}

.formulario-campo textarea{
    min-height: 140px;
    resize: vertical;
}

.formulario-campo input::placeholder,
.formulario-campo textarea::placeholder{
    color: rgba(255,255,255,0.52);
}

.formulario-campo input:focus,
.formulario-campo select:focus,
.formulario-campo textarea:focus{
    border-color: rgba(242,145,0,0.9);
    box-shadow: 0 0 0 1px rgba(242,145,0,0.35);
    background: rgba(255,255,255,0.06);
}

.formulario-acciones{
    display: flex;
    justify-content: center;
    margin-top: 8px;
}

.btn-enviar-formulario{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 58px;
    padding: 0 40px;
    background: #f29100;
    border: 1px solid #f29100;
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: transform 0.25s ease, opacity 0.25s ease, box-shadow 0.25s ease;
    border-radius: 5px;
}

.btn-enviar-formulario:hover{
    transform: translateY(-2px);
    opacity: 0.92;
}








/* ===== MENSAJE ÉXITO FORMULARIO ===== */
.mensaje-exito-formulario{
    position: fixed;
    inset: 0;
    z-index: 7000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(0,0,0,0.68);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

.mensaje-exito-formulario.is-open{
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.mensaje-exito-caja{
    position: relative;
    width: 100%;
    max-width: 620px;
    padding: 46px 40px 38px;
    background: rgba(18,18,18,0.96);
    border: 1px solid rgba(255,255,255,0.16);
    border-radius: 12px;
    box-shadow: 0 24px 70px rgba(0,0,0,0.42);
    text-align: center;
}

.mensaje-exito-etiqueta{
    display: inline-block;
    margin-bottom: 14px;
    color: rgba(255,255,255,0.78);
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 1.4px;
    text-transform: uppercase;
}

.mensaje-exito-caja h3{
    margin: 0 0 14px;
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(32px, 2.4vw, 44px);
    font-weight: 600;
    line-height: 1.05;
}

.mensaje-exito-caja p{
    margin: 0 auto 26px;
    max-width: 460px;
    color: rgba(255,255,255,0.84);
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    line-height: 1.7;
}

.mensaje-exito-boton{
    min-height: 58px;
    padding: 0 40px;
    border: 1px solid #f29100;
    background: #f29100;
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: transform 0.25s ease, opacity 0.25s ease;
    border-radius: 5px;
    box-shadow: none;
}

.mensaje-exito-boton:hover{
    transform: translateY(-2px);
    opacity: 0.94;
    box-shadow: none;
}

@media (max-width: 768px){
    .mensaje-exito-caja{
        padding: 38px 22px 24px;
    }

    .mensaje-exito-caja p{
        font-size: 14px;
        line-height: 1.65;
    }

    .mensaje-exito-boton{
        width: 100%;
    }
}

























@media (max-width: 768px){

    .modal-formulario-proyecto{
        inset: 0;
    }

    .modal-formulario-overlay{
        background: rgba(0, 0, 0, 0.82);
        backdrop-filter: blur(4px);
        -webkit-backdrop-filter: blur(4px);
    }

    .modal-formulario-caja{
        position: fixed;
        inset: 0;
        width: 100%;
        max-width: 100%;
        height: 100svh;
        max-height: 100svh;
        margin: 0;
        border-radius: 0;
        border: none;
        box-shadow: none;
        background: rgba(18, 18, 18, 0.98);
        overflow: hidden;
    }

    .modal-formulario-cerrar{
        position: absolute;
        top: 30px;
        right: 3px;
        width: 60px;
        height: 60px;
        background: none;
        border: none;
        color: #ffffff;
        font-size: 55px;
        line-height: 1;
        cursor: pointer;
        z-index: 20;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    .modal-formulario-grid{
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
        height: 100%;
        min-height: 100%;
    }

    .modal-formulario-info{
        padding: 46px 20px 22px 20px;
        background:
            linear-gradient(rgba(0,0,0,0.74), rgba(0,0,0,0.74)),
            url("imagenes/imagen-formulario.png");
        background-size: cover;
        background-position: center;
        min-height: 220px;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        align-items: center;
        text-align: center;
    }

    .modal-formulario-etiqueta{
        display: inline-block;
        margin: 0 0 10px 0;
        color: #f29100;
        font-family: 'Poppins', sans-serif;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 1.2px;
        text-align: center;
    }

    .modal-formulario-info h2{
        margin: 10px 0 12px 0;
        max-width: 280px;
        color: #ffffff;
        font-family: 'Poppins', sans-serif;
        font-size: clamp(24px, 7.6vw, 40px);
        font-weight: 600;
        line-height: 0.95;
        text-align: center;
    }

    .modal-formulario-texto{
        margin: 30px auto;
        max-width: 450px;
        color: rgba(255,255,255,0.88);
        font-family: 'Poppins', sans-serif;
        font-size: 16px;
        font-weight: 400;
        line-height: 1.5;
        text-align: center;
    }

    .modal-formulario-lista{
        display: none;
    }

    .modal-formulario-contenido{
    padding: 16px 20px 22px 20px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    display: flex;
    justify-content: center;
}

    .formulario-proyecto{
        display: flex;
        flex-direction: column;
        gap: 12px;
        width: 100%;
        max-width: 430px;
    }

    .formulario-fila{
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .formulario-campo{
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    .formulario-campo label{
        color: #ffffff;
        font-family: 'Poppins', sans-serif;
        font-size: 13px;
        font-weight: 500;
        line-height: 1.2;
    }

    .formulario-campo input,
    .formulario-campo select,
    .formulario-campo textarea{
        width: 100%;
        min-height: 48px;
        padding: 12px 14px;
        background: rgba(255,255,255,0.04);
        border: 1px solid rgba(255,255,255,0.16);
        color: #ffffff;
        font-family: 'Poppins', sans-serif;
        font-size: 15px;
        line-height: 1.4;
        outline: none;
        border-radius: 8px;
    }

    .formulario-campo textarea{
        min-height: 110px;
        resize: none;
    }

    .formulario-campo-full{
        width: 100%;
        margin-top: 0;
    }

    .formulario-acciones{
    display: flex;
    justify-content: center;
    margin-top: 16px;
    padding-top: 8px;
    padding-bottom: 40px;
}

    .btn-enviar-formulario{
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        max-width: 260px;
        min-height: 46px;
        padding: 0 18px;
        background: #f29100;
        border: 1px solid #f29100;
        color: #ffffff;
        font-family: 'Poppins', sans-serif;
        font-size: 15px;
        font-weight: 500;
        border-radius: 5px;
    }
}





























@media (max-width: 768px){

    .mensaje-exito-formulario{
        position: fixed;
        inset: 0;
        z-index: 7000;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 20px;
        background: rgba(0,0,0,0.82);
        backdrop-filter: blur(4px);
        -webkit-backdrop-filter: blur(4px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 0.3s ease, visibility 0.3s ease;
    }

    .mensaje-exito-formulario.is-open{
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }

    .mensaje-exito-caja{
        position: relative;
        width: 100%;
        max-width: 320px;
        padding: 38px 22px 26px 22px;
        background: rgba(18,18,18,0.98);
        border: 1px solid rgba(255,255,255,0.16);
        border-radius: 20px;
        box-shadow: none;
        text-align: center;
    }

    .mensaje-exito-etiqueta{
        display: inline-block;
        margin-bottom: 12px;
        color: rgba(255,255,255,0.78);
        font-family: 'Poppins', sans-serif;
        font-size: 11px;
        font-weight: 500;
        letter-spacing: 1.2px;
        text-transform: uppercase;
    }

    .mensaje-exito-caja h3{
        margin: 0 0 14px 0;
        color: #ffffff;
        font-family: 'Poppins', sans-serif;
        font-size: clamp(24px, 7.6vw, 40px);
        font-weight: 600;
        line-height: 0.95;
        text-align: center;
    }

    .mensaje-exito-caja p{
        margin: 0 auto 24px auto;
        max-width: 260px;
        color: rgba(255,255,255,0.84);
        font-family: 'Poppins', sans-serif;
        font-size: 16px;
        font-weight: 400;
        line-height: 1.5;
        text-align: center;
    }

    .mensaje-exito-boton{
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        max-width: 220px;
        min-height: 44px;
        padding: 0 18px;
        border: 1px solid #f29100;
        background: #f29100;
        color: #ffffff;
        font-family: 'Poppins', sans-serif;
        font-size: 15px;
        font-weight: 500;
        cursor: pointer;
        border-radius: 5px;
        box-shadow: none;
    }

    .mensaje-exito-boton:hover{
        transform: translateY(-2px);
        opacity: 0.94;
        box-shadow: none;
    }
}























/* ===== SECCIÓN LO QUE RESOLVEMOS ===== */
.resolvemos{
    position: relative;
    width: 100%;
    padding: 90px 0 110px 0;
    background-image: url("imagenes/fondo-resolvemos.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
}

.resolvemos-contenido{
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 100px;
    box-sizing: border-box;
    position: relative;
}

.resolvemos-titulo-box{
    width: fit-content;
    margin: 0 auto 90px auto;
    padding: 12px 50px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    background: rgba(0, 0, 0, 0.10);
}

.resolvemos-titulo-box h2{
    font-family: 'Poppins', sans-serif;
    font-size: clamp(34px, 3.4vw, 56px);
    font-weight: 700;
    line-height: 1;
    color: #ffffff;
    text-align: center;
    margin: 0;
}

.resolvemos-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 90px;
    align-items: start;
    max-width: 1200px;
    margin: 0 auto;
}

.resolvemos-col{
    display: flex;
    flex-direction: column;
    gap: 22px;
    min-width: 0;
}

.resolvemos-item{
    display: flex;
    align-items: flex-start;
    gap: 14px;
    min-width: 0;
}

.resolvemos-item .check{
    position: relative;
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    margin-top: 4px;
}

.resolvemos-item .check::before{
    content: "";
    position: absolute;
    left: 2px;
    top: 0px;
    width: 8px;
    height: 14px;
    border-right: 2px solid #f29100;
    border-bottom: 2px solid #f29100;
    transform: rotate(45deg);
}

.resolvemos-item p{
    margin: 0;
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(16px, 1.4vw, 22px);
    font-weight: 400;
    line-height: 1.7;   
}
























@media (max-width: 768px){

    .resolvemos{
        width: 100%;
        padding: 90px 0 110px 0;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        overflow: hidden;
    }

    .resolvemos-contenido{
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0 20px;
        box-sizing: border-box;
        position: relative;
    }

    .resolvemos-titulo-box{
        width: 100%;
        max-width: 320px;
        margin: 0 auto 100px auto;
        padding: 12px 20px;
        border: 1px solid rgba(255, 255, 255, 0.45);
        background: rgba(0, 0, 0, 0.10);
        text-align: center;
    }

    .resolvemos-titulo-box h2{
        font-family: 'Poppins', sans-serif;
        font-size: clamp(28px, 8vw, 40px);
        font-weight: 700;
        line-height: 1.05;
        color: #ffffff;
        margin: 0;
        text-align: center;
    }

    .resolvemos-grid{
        display: grid;
        grid-template-columns: 1fr;
        gap: 24px;
        align-items: start;
    }

    .resolvemos-col{
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    .resolvemos-item{
        display: flex;
        align-items: flex-start;
        justify-content: center;
        gap: 12px;
        text-align: center;
    }

    .resolvemos-item .check{
        position: relative;
        flex: 0 0 18px;
        width: 18px;
        height: 18px;
        margin-top: 4px;
    }

    .resolvemos-item .check::before{
        content: "";
        position: absolute;
        left: 2px;
        top: 0;
        width: 8px;
        height: 13px;
        border-right: 2px solid #f29100;
        border-bottom: 2px solid #f29100;
        transform: rotate(45deg);
    }

    .resolvemos-item p{
        margin: 0;
        color: #ffffff;
        font-family: 'Poppins', sans-serif;
        font-size: clamp(18px, 1.6vw, 24px);
        font-weight: 400;
        line-height: 1.45;
        text-align: center;
    }
}




























/* ===== SECCIÓN SERVICIOS DE ALTO VALOR ===== */
.servicios-alto-valor{
    position: relative;
    width: 100%;
    padding: 90px 0 110px 0;
    background-image:
    linear-gradient(rgba(0,0,0,0.62), rgba(0,0,0,0.62)),
    url("imagenes/fondo-servicios-alto-valor.jpg");
    background-color: #6e6e6e;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
}

.servicios-alto-valor-contenido{
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 100px;
    box-sizing: border-box;
    position: relative;
}

.servicios-alto-valor-titulo-box{
    width: fit-content;
    margin: 0 auto 90px auto;
    padding: 12px 70px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    background: rgba(0, 0, 0, 0.10);
}

.servicios-alto-valor-titulo-box h2{
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(34px, 3.4vw, 56px);
    font-weight: 700;
    line-height: 1;
    color: #ffffff;
    text-align: center;
}

.servicios-alto-valor-descripcion{
    margin: 0 auto 90px auto;
    max-width: 900px;
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(16px, 1.4vw, 22px);
    font-weight: 400;
    line-height: 1.7;
    text-align: center;
}

.servicios-alto-valor-grid{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 50px;
    max-width: 530px;
    margin: 0 auto;
}




















@media (max-width: 768px){

    .servicios-alto-valor{
        width: 100%;
        padding: 100px 0 85px 0;
        background-image:
            linear-gradient(rgba(0,0,0,0.62), rgba(0,0,0,0.62)),
            url("imagenes/fondo-servicios-alto-valor.jpg");
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        overflow: hidden;
    }

    .servicios-alto-valor-contenido{
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0 20px;
        box-sizing: border-box;
        position: relative;
    }

    .servicios-alto-valor-titulo-box{
        width: 100%;
        max-width: 320px;
        margin: 0 auto 100px auto;
        padding: 12px 20px;
        border: 1px solid rgba(255, 255, 255, 0.45);
        background: rgba(0, 0, 0, 0.10);
        text-align: center;
    }

    .servicios-alto-valor-titulo-box h2{
        margin: 0;
        font-family: 'Poppins', sans-serif;
        font-size: clamp(28px, 8vw, 40px);
        font-weight: 700;
        line-height: 1.05;
        color: #ffffff;
        text-align: center;
    }

    .servicios-alto-valor-descripcion{
        margin: 0 auto 70px auto;
        max-width: 380px;
        color: #ffffff;
        font-family: 'Poppins', sans-serif;
        font-size: clamp(18px, 1.6vw, 24px);
        font-weight: 400;
        line-height: 1.45;
        text-align: center;
    }

    .servicios-alto-valor-grid{
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 210px));
        justify-content: center;
        gap: 25px;
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
    }
}

























/* ===== SECCIÓN SOLUCIONES ===== */
.soluciones{
    position: relative;
    width: 100%;
    padding: 90px 0 110px 0;
    background-image: url("imagenes/fondo-servicios.jpg");
    background-color: #6e6e6e;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
}

.soluciones-contenido{
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 100px;
    box-sizing: border-box;
    position: relative;
}

.soluciones-titulo-box{
    width: fit-content;
    margin: 0 auto 90px auto;
    padding: 12px 150px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    background: rgba(0, 0, 0, 0.10);
}

.soluciones-titulo-box h2{
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(34px, 3.4vw, 56px);
    font-weight: 700;
    line-height: 1;
    color: #ffffff;
    text-align: center;
}

.soluciones-grid{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 50px;
    max-width: 900px;
    margin: 0 auto;
}

.solucion-card{
    perspective: 1200px;
    aspect-ratio: 1 / 0.9;
    width: 100%;
}

.solucion-card-inner{
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: transform 1.3s ease;
}

.solucion-card:hover .solucion-card-inner{
    transform: rotateY(180deg);
}

.solucion-card-front,
.solucion-card-back{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    border: 1px solid rgba(255, 255, 255, 0.35);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px 16px;
    text-align: center;
    box-sizing: border-box;
}

.solucion-card-front{
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}   

.solucion-card-back{
    background: #f29100;
    border-color: #f29100;
    transform: rotateY(180deg);
    justify-content: flex-start;
    align-items: center;
    text-align: center;
    padding: 60px 16px 16px 16px;
}

.solucion-icono{
    width: 60px;
    height: 60px;
    margin-bottom: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    top: 15px;
}

.solucion-icono-wifi{
    position: relative;
    top: 30px;
}

.solucion-icono img{
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    display: block;
    object-fit: contain;
}

.solucion-card-front h3{
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(17px, 1.18vw, 23px);
    font-weight: 400;
    line-height: 1.22;
    color: #ffffff;
    text-align: center;
}

.solucion-card-back h3{
    margin: 0 0 10px 0;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(17px, 1.18vw, 23px);
    font-weight: 400;
    line-height: 1.15;
    color: #ffffff;
}

.solucion-card-back p{
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.3;
    color: #ffffff;
}


.solucion-card-destacada .solucion-card-back{
    background: #f29100;
    border-color: #f29100;
}

.solucion-card-destacada .solucion-card-back-linea{
    background: #ffffff;
}

.solucion-card-destacada .solucion-card-back h3,
.solucion-card-destacada .solucion-card-back p{
    color: #ffffff;
}

.solucion-card-back-separador{
    width: 80%;
    height: 1px;
    background: rgb(255, 255, 255);
    margin: 0 0 25px 0;
    
}

.solucion-card:hover .solucion-card-inner{
    transform: rotateY(180deg);
}

.solucion-card{
    cursor: pointer;
}























@media (max-width: 768px){

    .soluciones{
        width: 100%;
        padding: 100px 0 85px 0;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        overflow: hidden;
    }

    .soluciones-contenido{
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0 20px;
        box-sizing: border-box;
        position: relative;
    }

    .soluciones-titulo-box{
        width: 100%;
        max-width: 320px;
        margin: 0 auto 100px auto;
        padding: 12px 20px;
        border: 1px solid rgba(255, 255, 255, 0.45);
        background: rgba(0, 0, 0, 0.10);
        text-align: center;
    }

    .soluciones-titulo-box h2{
        margin: 0;
        font-family: 'Poppins', sans-serif;
        font-size: clamp(28px, 8vw, 40px);
        font-weight: 700;
        line-height: 1.05;
        color: #ffffff;
        text-align: center;
    }

    .soluciones-grid{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 210px));
    justify-content: center;
    gap: 25px;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
}

.solucion-card{
    aspect-ratio: 1 / 0.88;
    width: 210px;
    max-width: 100%;
    perspective: 1200px;
}

    .solucion-card-inner{
        position: relative;
        width: 100%;
        height: 100%;
        transform-style: preserve-3d;
        transition: transform 1.3s ease;
    }

    .solucion-card-front,
    .solucion-card-back{
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        backface-visibility: hidden;
        -webkit-backface-visibility: hidden;
        box-sizing: border-box;
    }

    .solucion-card-front{
        background: rgba(255, 255, 255, 0.04);
        border: 1px solid rgba(255, 255, 255, 0.18);
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 14px 12px;
        text-align: center;
    }

    .solucion-card-back{
    background: #f29100;
    border: 1px solid #f29100;
    transform: rotateY(180deg);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    text-align: center;
    padding: 24px 14px 14px 14px;
}

    .solucion-icono{
        width: 46px;
        height: 46px;
        margin-bottom: 22px;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        top: 0;
    }

    .solucion-icono-wifi{
        position: relative;
        top: 12px;
    }

    .solucion-icono img{
        max-width: 100%;
        max-height: 100%;
        width: auto;
        height: auto;
        display: block;
        object-fit: contain;
    }

    .solucion-card-back h3{
    margin: 0 0 6px 0;
    font-family: 'Poppins', sans-serif;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.12;
    color: #ffffff;
    text-align: center;
}


   .solucion-card-back p{
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.22;
    color: #ffffff;
    text-align: center;
}

    .solucion-card-back-separador{
    width: 72%;
    height: 1px;
    background: rgb(255, 255, 255);
    margin: 0 auto 10px auto;
}

.solucion-card:hover .solucion-card-inner{
    transform: none;
}

.solucion-card.is-flipped .solucion-card-inner{
    transform: rotateY(180deg);
}

    .solo-mobile-salto{
    display: inline;
}
}






















/* ===== SECCIÓN PROYECTOS Y CLIENTES ===== */
.proyectos-clientes{
    position: relative;
    width: 100%;
    padding: 100px 0 110px 0;
    background-image: url("imagenes/fondo-proyectos.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden;
}

.proyectos-clientes-contenido{
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 100px;
    box-sizing: border-box;
    position: relative;
}

.proyectos-clientes-titulo-box{
    width: fit-content;
    margin: 0 auto 90px auto;
    padding: 12px 50px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    background: rgba(0, 0, 0, 0.10);
}

.proyectos-clientes-titulo-box h2{
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(34px, 3.4vw, 56px);
    font-weight: 700;
    line-height: 1;
    color: #ffffff;
    text-align: center;
}

.proyecto-destacado{
    display: grid;
    grid-template-columns: 140px 1fr;
    grid-template-areas:
        "logo titulo"
        "resultados resultados";
    column-gap: 40px;
    row-gap: 40px;
    align-items: start;
}

.proyecto-logo{
    grid-area: logo;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    margin-top: 0;
    min-height: 190px;
}

.proyecto-logo img{
    width: 150px;
    height: auto;
    display: block;
    object-fit: contain;
}

.logo-proyecto{
    height: auto;
    display: block;
    object-fit: contain;
}

.proyecto-logo img.logo-unam{
    width: 120px;
    transform: translateY(-45px);
}

.proyecto-logo img.logo-bancoppel{
    width: 170px;
    transform: translateY(5px);
    position: relative;
    left: 5px;
}

.proyecto-logo img.logo-kikos{
    width: 120px;
    transform: translateY(-70px);
    left: 5px;
    position: relative;
}

.proyecto-logo img.logo-berlitz{
    width: 145px;
    transform: translateY(-5px);
    left: 5px;
    position: relative;
}

.proyecto-info{
    display: contents;
}

.proyecto-titulo{
    grid-area: titulo;
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(18px, 1.6vw, 24px);
    font-weight: 500;
    line-height: 1.5;
    color: #ffffff;
    max-width: 1000px;
    min-height: 200px;
    text-align: center;
}

.proyecto-resultados{
    grid-area: resultados;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) 50px minmax(0, 1.3fr) 50px minmax(0, 1.3fr) 50px;    column-gap: 18px;
    align-items: start;
    width: 100%;
    margin-top: -30px;
}

.proyecto-bloque{
    min-width: 0;
    min-height: 170px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    width: 100%;
}

.proyecto-bloque h4{
    margin: 0 0 20px 0;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(17px, 1.05vw, 20px);
    font-weight: 500;
    line-height: 1.1;
    color: #ffffff;
    letter-spacing: 0.2px;
    text-align: center;
}

.proyecto-bloque p{
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(17px, 1.18vw, 23px);
    font-weight: 400;
    line-height: 1.3;
    color: #ffffff;
    max-width: 440px;
    text-align: center;
}

.proyecto-flecha{
    display: flex;
    align-items: center;
    justify-content: center;
    color: #f29100;
    font-family: 'Poppins', sans-serif;
    font-size: 30px;
    font-weight: 600;
    line-height: 1;
    min-height: 170px;
    transform: translate(40px, -20px);
    user-select: none;
}

.proyecto-flecha-ajustada{
    margin-left: -70px;
    font-size: 30px;
}
























@media (max-width: 768px){

    .proyectos-clientes{
        width: 100%;
        padding: 100px 0 85px 0;
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        overflow: hidden;
    }

    .proyectos-clientes-contenido{
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0 20px;
        box-sizing: border-box;
        position: relative;
    }

    .proyectos-clientes-titulo-box{
        width: 100%;
        max-width: 320px;
        margin: 0 auto 50px auto;
        padding: 12px 20px;
        border: 1px solid rgba(255, 255, 255, 0.45);
        background: rgba(0, 0, 0, 0.10);
        text-align: center;
    }

    .proyectos-clientes-titulo-box h2{
        margin: 0;
        font-family: 'Poppins', sans-serif;
        font-size: clamp(26px, 7.2vw, 36px);
        font-weight: 700;
        line-height: 1.2;
        color: #ffffff;
        text-align: center;
    }

    .proyecto-destacado{
        display: grid;
        grid-template-columns: 1fr;
        grid-template-areas:
            "logo"
            "titulo"
            "resultados";
        gap: 26px;
        align-items: start;
        text-align: center;
    }

    .proyecto-logo{
    grid-area: logo;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 40px;
    height: 210px;
    min-height: 210px;
}

    .proyecto-logo img{
        width: 140px;
        height: 90px;
        height: auto;
        display: block;
        object-fit: contain;
        position: relative;
        transform: none;
        left: 0;
    }

    .logo-proyecto{
    position: relative;
    height: auto;
    display: block;
    object-fit: contain;
}

/* uno por uno en móvil */
.proyecto-logo img.logo-unam{
    width: 140px;
    left: 0;
    transform: translateY(0);
    position: relative;
}

.proyecto-logo img.logo-bancoppel{
    width: 200px;
    left: 0;
    transform: translateY(10px);
    position: relative;
}

.proyecto-logo img.logo-kikos{
    width: 145px;
    left: 0;
    transform: translateY(-6px);
    position: relative;
}

.proyecto-logo img.logo-berlitz{
    width: 180px;
    left: 0;
    transform: translateY(8px);
    position: relative;
}

    .proyecto-info{
        display: contents;
    }

    .proyecto-titulo{
        grid-area: titulo;
        margin: 40px auto 0 auto;
        font-family: 'Poppins', sans-serif;
        font-size: clamp(18px, 1.6vw, 24px);;
        font-weight: 500;
        line-height: 1.28;
        color: #ffffff;
        text-align: center;
        max-width: 400px;
        min-height: 95px;
    }

    .proyecto-resultados{
    grid-area: resultados;
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 22px;
    align-items: start;
    width: 100%;
    margin-top: 0;
}

.proyecto-bloque{
    min-width: 0;
    min-height: 135px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    text-align: center;
    padding: 0 14px;
    box-sizing: border-box;
}

.proyecto-bloque h4{
    margin: 0 0 8px 0;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(18px, 1.6vw, 24px);
    font-weight: 500;
    line-height: 1.1;
    color: #ffffff;
    letter-spacing: 0.2px;
    text-align: center;
    max-width: 280px;
}

.proyecto-bloque p{
    margin: 0px auto;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(18px, 1.6vw, 24px);
    font-weight: 400;
    line-height: 1.38;
    color: #ffffff;
    text-align: center;
    max-width: 360px;
}

    .proyecto-flecha,
    .proyecto-flecha-ajustada{
        display: flex;
        align-items: center;
        justify-content: center;
        color: #f29100;
        font-family: 'Poppins', sans-serif;
        font-size: 28px;
        font-weight: 600;
        line-height: 1;
        min-height: auto;
        transform: none;
        margin-left: 0;
        user-select: none;
    }

    .solo-tablet-salto{
    display: none !important;
}
}








































































/* ===== SECCIÓN METODOLOGÍA ===== */
.metodologia-omex{
    position: relative;
    width: 100%;
    padding: 90px 0 110px 0;
    background-color: #050505;
    overflow: hidden;
}

.metodologia-contenido{
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 clamp(40px, 6vw, 100px);
    box-sizing: border-box;
    position: relative;
}

.metodologia-titulo-box{
    width: fit-content;
    margin: 0 auto 60px auto;
    padding: 12px 50px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    background: rgba(0, 0, 0, 0.10);
}

.metodologia-titulo-box h2{
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(34px, 3.4vw, 56px);
    font-weight: 700;
    line-height: 1;
    color: #ffffff;
    text-align: center;
}

.metodologia-linea-tiempo{
    position: relative;
    display: grid;
    gap: 60px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: start;
    transform: none;
}

.metodologia-linea-tiempo::before{
    content: "";
    position: absolute;
    top: 24px;
    left: calc(clamp(40px, 6vw, 100px) * -1);
    right: calc(clamp(40px, 6vw, 100px) * -1);
    height: 2px;
    background: linear-gradient(
        to right,
        rgba(242,145,0,0.18) 0%,
        rgba(242,145,0,0.75) 20%,
        #f29100 50%,
        rgba(242,145,0,0.75) 80%,
        rgba(242,145,0,0.18) 100%
    );
    z-index: 0;
}

.metodo-card{
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 48px minmax(1px, 1fr);
    grid-template-areas:
        "numero numero"
        "icono texto";
    grid-template-rows: auto auto;
    column-gap: 14px;
    row-gap: 14px;
    align-items: start;
    justify-items: center;
}

.metodo-numero{
    grid-area: numero;
    width: 48px;
    height: 48px;
    margin: 0 auto 2px auto;
    border-radius: 50%;
    border: 1px solid rgba(242,145,0,0.7);
    background: #050505;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #f29100;
    font-family: 'Poppins', sans-serif;
    font-size: 20px;
    font-weight: 600;
    position: relative;
}

.metodo-icono{
    grid-area: icono;
    width: 48px;
    height: 48px;
    border: none;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 0;
    align-self: start;
    justify-self: center;
    margin: 2px 40px 0 0;
}

.metodo-icono img{
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.metodo-icono-4 img{
    transform: scale(0.88) translateX(-10px);
}

.metodo-icono-3 img{
    transform: scale(0.88) translateX(-10px);
}

.metodo-texto{
    grid-area: texto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    min-height: 165px;
    text-align: center;
    width: 170px;
    max-width: none;
    transform: translateX(-27px);
}

.metodo-texto h3{
    margin: 0 0 10px 0;
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(14px, 1.05vw, 18px);
    font-weight: 600;
    line-height: 1.12;
    text-align: center;
    min-height: 53px;
    white-space: normal;
    padding-top: 10px;
}

.metodo-texto p{
    margin: 8px 0 0 0;
    color: rgba(255,255,255,0.88);
    font-family: 'Poppins', sans-serif;
    font-size: clamp(13px, 1.05vw, 15px);
    font-weight: 400;
    line-height: 1.45;
    text-align: center;
    min-height: auto;
}

.metodo-imagen{
    grid-column: 1 / -1;
    width: 100%;
    height: 90px;
    margin-top: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.metodo-imagen img{
    width: 180px;
    height: 75px;
    object-fit: cover;
    object-position: center;
    display: block;
}

.metodo-imagen{
    display: none;
}
























@media (min-width: 769px) and (max-width: 1100px){

    .metodologia-contenido{
        padding: 0 40px;
    }

    .metodologia-linea-tiempo{
        gap: 34px;
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .metodo-card{
        grid-template-columns: 44px minmax(0, 1fr);
        column-gap: 10px;
    }

    .metodo-icono{
        width: 42px;
        height: 42px;
        margin: 2px 25px 0 0;
    }

    .metodo-texto{
        width: 150px;
        max-width: 150px;
        transform: translateX(-20px);
    }

    .metodo-texto h3{
        font-size: clamp(10px, 1.2vw, 14px);
    }

    .metodo-texto p{
        font-size: clamp(9px, 1.1vw, 12px);
        line-height: 1.35;
        margin-top: -10px;
    }
}
































@media (max-width: 768px){

    .metodologia-omex{
        width: 100%;
        padding: 100px 0 90px 0;
        background-color: #050505;
        overflow: hidden;
    }

    .metodologia-contenido{
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0 20px;
        box-sizing: border-box;
        position: relative;
    }

    .metodologia-titulo-box{
        width: 100%;
        max-width: 320px;
        margin: 0 auto 100px auto;
        padding: 12px 20px;
        border: 1px solid rgba(255, 255, 255, 0.45);
        background: rgba(0, 0, 0, 0.10);
        text-align: center;
    }

    .metodologia-titulo-box h2{
        margin: 0;
        font-family: 'Poppins', sans-serif;
        font-size: clamp(28px, 8vw, 40px);
        font-weight: 700;
        line-height: 1.05;
        color: #ffffff;
        text-align: center;
    }

    .metodologia-linea-tiempo{
        display: flex;
        flex-direction: column;
        gap: 34px;
        position: relative;
        max-width: 360px;
        margin: 0 auto;
    }

    .metodologia-linea-tiempo::before{
        display: none;
    }

    .metodo-card{
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 52px 220px;
    grid-template-areas:
        "numero texto"
        "icono texto";
    column-gap: 18px;
    row-gap: 14px;
    justify-content: center;
    align-items: start;
    padding-bottom: 34px;
    border-bottom: 1px solid rgba(255,255,255,0.12);
    max-width: 320px;
    margin: 0 auto;
}

    .metodo-card:last-child{
        padding-bottom: 0;
        border-bottom: none;
    }

    .metodo-numero{
    grid-area: numero;
    width: 44px;
    height: 44px;
    margin: 0;
    border-radius: 50%;
    border: 1px solid rgba(242,145,0,0.7);
    background: #050505;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #f29100;
    font-family: 'Poppins', sans-serif;
    font-size: 18px;
    font-weight: 600;
    justify-self: center;
}

    .metodo-icono{
    grid-area: icono;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    margin: 0;
    justify-self: center;
    align-self: start;
}

    .metodo-icono img{
        width: 100%;
        height: 100%;
        object-fit: contain;
        display: block;
    }

    .metodo-icono-4{
    transform: translateX(10px);
}

.metodo-icono-3{
    transform: translateX(7px);
}

    .metodo-texto{
    grid-area: texto;
    width: 220px;
    max-width: 220px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    min-height: auto;
    text-align: center;
    transform: translateX(0px);
}

    .metodo-texto h3{
        margin: 0 0 8px 0;
        color: #ffffff;
        font-family: 'Poppins', sans-serif;
        font-size: clamp(18px, 1.6vw, 24px);
        font-weight: 500;
        line-height: 1.1;
        text-align: center;
        min-height: auto;
        white-space: normal;
        padding-top: 10px;
    }

    .metodo-texto p{
    width: 100%;
    margin: 0;
    color: rgba(255,255,255,0.82);
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    min-height: auto;
    padding-top: 16px;
}

    .metodo-imagen{
        display: none;
    }
}

























/* ===== SECCIÓN CERTIFICACIONES ===== */
.certificaciones{
    position: relative;
    width: 100%;
    padding: 90px 0 40px 0;
    background-color: #111111;
    overflow: hidden;
}

.certificaciones-contenido{
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 100px;
    box-sizing: border-box;
    position: relative;
}

.certificaciones-titulo-box{
    width: fit-content;
    margin: 0 auto 80px auto;
    padding: 12px 50px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    background: rgba(0, 0, 0, 0.10);
}

.certificaciones-titulo-box h2{
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(34px, 3.4vw, 56px);
    font-weight: 700;
    line-height: 1;
    color: #ffffff;
    text-align: center;
}

.certificaciones-descripcion{
    margin: 0 auto 60px auto;
    max-width: 1100px;
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(16px, 1.4vw, 22px);
    font-weight: 400;
    line-height: 1.7;
    text-align: center;
}

.certificaciones-slider{
    width: 100vw;
    max-width: none;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    overflow: hidden;
    position: relative;
    margin-top: -8px;
    padding: 30px 0 0 0;
}

.certificaciones-track{
    display: flex;
    align-items: center;
    gap: 60px;
    width: max-content;
    animation: mover-certificaciones 50s linear infinite;
}

.certificacion-item{
    width: 180px;
    min-width: 180px;
    min-height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    flex: 0 0 auto;
}

.certificacion-item img{
    max-width: 100%;
    max-height: 76px;
    width: auto;
    height: auto;
    display: block;
    object-fit: contain;
    filter: none;
    opacity: 1;
    transition: transform 0.25s ease, opacity 0.25s ease;
}

.certificacion-item img:hover{
    transform: translateY(-3px) scale(1.04);
    opacity: 1;
}

/* AJUSTES INDIVIDUALES */
.certificacion-qualys img{
    max-height: 74px;
}

.certificacion-panduit img{
    max-height: 62px;
}

.certificacion-hp img{
    max-height: 58px;
}

.certificacion-hp{
    width: 55px;
    min-width: 55px;
}

.certificacion-fortinet img{
    max-height: 54px;
}

.certificacion-huawei img{
    max-height: 50px;
}

@keyframes mover-certificaciones{
    from{
        transform: translateX(0);
    }
    to{
        transform: translateX(calc(-30% - 14px));
    }
}

























@media (max-width: 768px){

    .certificaciones{
        width: 100%;
        padding: 100px 0 85px 0;
        background-color: #111111;
        overflow: hidden;
    }

    .certificaciones-contenido{
        width: 100%;
        max-width: none;
        margin: 0;
        padding: 0 20px;
        box-sizing: border-box;
        position: relative;
    }

    .certificaciones-titulo-box{
        width: 100%;
        max-width: 360px;
        margin: 0 auto 100px auto;
        padding: 12px 20px;
        border: 1px solid rgba(255, 255, 255, 0.45);
        background: rgba(0, 0, 0, 0.10);
        text-align: center;
        box-sizing: border-box;
    }

    .certificaciones-titulo-box h2{
        margin: 0;
        font-family: 'Poppins', sans-serif;
        font-size: clamp(28px, 8vw, 40px);
        font-weight: 700;
        line-height: 1.05;
        color: #ffffff;
        text-align: center;
        white-space: normal;
        overflow-wrap: break-word;
        word-break: break-word;
    }

    .certificaciones-descripcion{
        margin: 0 auto 80px auto;
        max-width: 320px;
        color: rgba(255,255,255,0.82);
        font-family: 'Poppins', sans-serif;
        font-size: clamp(18px, 1.6vw, 24px);
        font-weight: 400;
        line-height: 1.38;
        text-align: center;
    }

    .certificaciones-slider{
        width: 100vw;
        max-width: none;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        overflow: hidden;
        position: relative;
        margin-top: 0;
        padding: 0;
    }

    .certificaciones-track{
        display: flex;
        align-items: center;
        gap: 40px;
        width: max-content;
        animation: mover-certificaciones 40s linear infinite;
    }

    .certificacion-item{
        width: 130px;
        min-width: 130px;
        min-height: 90px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        flex: 0 0 auto;
    }

    .certificacion-item img{
        max-width: 100%;
        max-height: 52px;
        width: auto;
        height: auto;
        display: block;
        object-fit: contain;
        transition: transform 0.25s ease, opacity 0.25s ease;
    }

    .certificacion-item img:hover{
        transform: none;
        opacity: 1;
    }

    .certificacion-qualys img{
        max-height: 50px;
    }

    .certificacion-panduit img{
        max-height: 42px;
    }

    .certificacion-hp{
        width: 48px;
        min-width: 48px;
    }

    .certificacion-hp img{
        max-height: 46px;
    }

    .certificacion-fortinet img{
        max-height: 38px;
    }

    .certificacion-huawei img{
        max-height: 36px;
    }
}























.footer{
    background-color: #1d1d1b;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    color: #fff;
    padding-top: 80px;
}

/* Grid principal */
.footer-contenido{
    display: grid;
    grid-template-columns: 2.5fr 1fr 1.8fr;
    gap: 60px;
    padding: 0 100px;
    align-items: flex-start;
}

/* Logo */
.footer-logo img{
    height: 75px;
    width: auto;
    margin-left: 0;
    position: relative;
    top: 10px;
}

.footer-logo-link{
    display: inline-block;
    text-decoration: none;
}

/* Descripción */
.descripcion-footer{
    margin-top: 30px;
    font-size: clamp(14px, 1.2vw, 18px);
    line-height: 1.4;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
}

/* Títulos */
.footer h4{
    font-size: clamp(15px, 1.4vw, 20px);
    margin-bottom: 20px;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
}

/* Listas */
.footer ul{
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer ul li{
    margin-bottom: -3px;
}

.footer ul li a{
    text-decoration: none;
    color: #ffffff;
    font-size: clamp(14px, 1vw, 16px);
    line-height: 0.9;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
}

.footer ul li a:hover{
    color: #f29100;
}

/* Contacto */
.direccion-footer{
    font-size: clamp(14px, 1vw, 18px);
    line-height: 1.9;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
}

/* Links generales */
.footer a{
    text-decoration: none;
    color: #ffffff;
    font-size: clamp(14px, 1vw, 18px);
    line-height: 1.5;
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
}

.footer a:hover{
    color: #f29100;
}

/* Línea decorativa */
.footer-linea{
    margin-top: 40px;
    height: 6px;
    width: 100vw;
    margin-left: calc(-100px);
    background: linear-gradient(
        to right,
        #f29100 0%,
        #f29100 40%,
        rgba(242, 145, 0, 0.6) 70%,
        rgba(242, 145, 0, 0) 100%
    );
}

/* Copy */
.footer-copy{
    padding: 40px 100px 30px;
    font-size: clamp(14px, 1vw, 16px);
    font-family: 'Poppins', sans-serif;
    font-weight: 300;
}











@media (max-width: 768px){

    .footer{
        background-color: #1d1d1b;
        padding-top: 90px;
    }

    .footer-contenido{
        grid-template-columns: 1fr;
        gap: 40px;
        padding: 0 20px;
        text-align: center;
    }

    .footer-copy{
        padding: 30px 20px;
        text-align: center;
        font-size: 14px;
    }

    .footer-logo{
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .footer-logo img{
        height: 70px;
        width: auto;
        display: block;
        margin: 0 auto 30px auto;
    }

    .descripcion-footer{
        margin-top: 30px;
        font-size: clamp(15px, 5vw, 16px);
        line-height: 1.5;
        text-align: center;
    }

    .footer ul li{
        margin-bottom: 4px;
    }

    .footer ul li a{
        line-height: 1.2;
    }

    .footer-linea{
        width: 100%;
        margin: 30px 0 0 0;
    }
}














































.pagina-privacidad{
    height: auto;
    overflow: visible;
    position: relative;
    margin: 0;
    padding: 0;
}

.container-privacidad{
    min-height: 100vh;
    padding: 60px 100px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #6e6e6e;
    color: white;
    margin: 0;
    border: 0;
    position: relative;
}

.container-privacidad::after{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 4px;
    background: #6e6e6e;
    pointer-events: none;
}

/* TÍTULO principal */
.titulo-privacidad{
    color: #ffffff;
    font-family: 'Poppins', sans-serif;
    font-size: clamp(48px, 6vw, 72px);
    font-weight: 400;
    margin-top: 55px;
    margin-bottom: 30px;
    line-height: 0.95;
}

/* TEXTO del aviso */
.texto-privacidad p{
    font-family: 'Poppins', sans-serif;
    font-size: clamp(16px, 1.8vw, 20px);
    font-weight: 400;
    line-height: 1.7;
    margin-top: 0;
    margin-bottom: 28px;
    color: rgb(255, 255, 255);
    text-align: justify;
    text-justify: inter-word;
}

/* BOTÓN volver */
.btn-volver-inicio{
    display: inline-block;
    margin-top: 10px;
    margin-bottom: 40px;
    padding: 14px 28px;
    border-radius: 14px;
    background: #f29100;
    color: rgb(255, 255, 255);
    text-decoration: none;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    font-size: clamp(14px, 1.2vw, 18px);
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.btn-volver-inicio:hover{
    transform: scale(1.03);
    opacity: 0.92;
}

/* Si metes listas o puntos legales */
.texto-privacidad ul{
    margin: 0 0 35px 25px;
    padding: 0;
}

.texto-privacidad li{
    font-family: 'Poppins', sans-serif;
    font-size: clamp(16px, 1.8vw, 20px);
    font-weight: 400;
    line-height: 1.5;
    margin-bottom: 12px;
    color: rgb(255, 255, 255);
    text-align: justify;
    text-justify: inter-word;
}

.footer{
    margin-top: 0;
    border-top: 0;
}

.texto-privacidad{
    margin-bottom: 0;
}

.texto-privacidad p:last-child{
    margin-bottom: 0;
}






















@media (max-width: 768px) {

    body.pagina-privacidad{
        margin: 0;
        padding: 0;
        min-height: 100vh;
        overflow-x: hidden;
    }

    #topo-privacidad{
        margin-top: 0;
        padding-top: env(safe-area-inset-top, 20px);
        width: 100%;
    }

    .container-privacidad{
        padding: 60px 20px;
    }

    .titulo-privacidad{
        font-family: 'Poppins', sans-serif;
        font-size: clamp(32px, 8.2vw, 54px);
        text-align: center;
        margin-top: 40px;
    }

    .texto-privacidad p{
        font-family: 'Poppins', sans-serif;
        font-size: 16px;
        line-height: 1.5;
        text-align: justify;
        margin-bottom: 25px;
    }

    .texto-privacidad li{
        font-family: 'Poppins', sans-serif;
        font-size: 16px;
        line-height: 1.5;
    }

    .btn-volver-inicio{
        display: flex;
        justify-content: center;
        align-items: center;
        width: fit-content;
        margin: 30px auto;
        padding: 12px 20px;
        background: #f29100;
        color: rgb(255, 255, 255);
        text-decoration: none;
        border-radius: 10px;
        font-family: 'Poppins', sans-serif;
    }
}








































.solo-tablet-salto{
    display: none;
}