﻿header video {
    display: none;
}

.tiveLoader::after {
    background-size: 70vw;
}


div.video {
    /*background-image: url('../../assets/img/bg-intro.PNG');
    background-size: cover;*/
    background: #37dfd9;
}

div.mainBanner {
    background: none;
    display:none;
}

.video.before, .video.after {
    content: '';
    display: none;
    z-index: 1;
}
video.before, video.after {
    content: '';
    background: none;
    display: none;
}

.masonry {
    flex-direction: row;
}

.column {
    width: calc(100%/3);
}

.fixed-nav-img {
    width: 25vw;
}

.parallax.right img:nth-child(1) {
    right: 21vw;
    width: 7vw;
}


.parallax.right img:nth-child(2) {
    right: 4vw;
    width: 25vw;
    top: 10em;
}

.parallax.right img:nth-child(3) {
    right: 0vw;
    width: 30vw;
}

.parallax.left img:nth-child(1) {
    left: 0vw;
    width: 30vw;
}

.parallax.left img:nth-child(2) {
    left: 0vw;
    width: 25vw;
}

.parallax.left img:nth-child(3) {
    top: 10em;
    left: 8vw;
    width: 25vw;
}


.parallax.middle, .parallax.tive {
    top: 75%;
}

.tiveLoader::after {
    left: 0;
}

nav {
    margin-top: 5rem;
}

    nav a img {
        width: 40%;
    }

    nav.relative div a {
        margin-top: -40%;
        position: relative;
        display: grid;
    }

    nav.fixed-nav div a {
        margin-top: 15%;
        bottom: 100%;
        position: relative;
    }

.video.parallax
{
    transition: top ease 1s;
}

.sct-Clientes span {
    font-size: 3.8em;
}

.grid-clients {
    padding-top: 3em;
    padding-bottom: 8em;
}

    .grid-clients img {
        width: 49%;
    }

/* === Responsive: form de contacto, footer, sct-Clientes === */

/* Footer: en mobile debe fluir al final del documento, no estar
   fixed tapando el contenido. (En desktop sigue fixed-bottom como
   siempre — queda como una barra persistente.) */
footer {
    position: relative;
    height: auto;
    bottom: auto;
    padding: 20px 15px;
    font-size: small;
}

    footer .links-footer,
    footer .col-xs-12.col-sm-6 {
        text-align: left !important;
        width: 100%;
    }

    footer ul {
        padding-left: 0;
    }

    footer img {
        width: 30% !important;
    }

/* Form: las col-md-6 (Bootstrap 3) quedan side-by-side en mobile
   (50% cada una) y se cortan. Forzar full-width en mobile. */
.contactform .row .col-md-6,
.contactform .row .col-xs-12,
.contactform .row .col-sm-12 {
    width: 100%;
    float: none;
    padding-left: 15px;
    padding-right: 15px;
}

/* Prevenir que inputs se salgan del viewport en mobile */
.contactform .form-group,
.contactform .form-control,
.contactform label,
.contactform input,
.contactform textarea {
    max-width: 100%;
    box-sizing: border-box;
}

.contactform .form-group {
    margin-bottom: 15px;
}

.contactform .form-control {
    font-size: 16px; /* evita auto-zoom en iOS al focus */
    padding: 10px 12px;
}

.contactform label {
    font-size: 0.9em;
    margin-bottom: 4px;
}

.contactform input.btn-send {
    width: 100%;
    padding: 12px;
    font-size: 1em;
}

/* main: el padding-top inline (80px) está bien en desktop pero
   en mobile deja demasiado aire encima del form. Y el padding:5%
   heredado de Site_common.css genera overflow horizontal en mobile
   porque Bootstrap .row tiene margin:-15px que se sale del contenedor. */
main.container {
    padding: 4% 15px !important;
    padding-top: 20px !important;
    width: 100% !important;
    margin: 0 !important;
    overflow-x: hidden;
    box-sizing: border-box !important;
}

/* Prevenir overflow horizontal de las rows de Bootstrap */
main .row {
    margin-left: 0;
    margin-right: 0;
}

/* contact section title (sct-Clientes) — hereda del Site_common
   sin mobile override y sale enorme. Reducir. */
.sct-Clientes span {
    font-size: 2.4em !important;
    line-height: 1.1;
}

.sct-Clientes {
    padding-bottom: 4vh;
}

.grid-clients {
    padding-top: 1.5em;
    padding-bottom: 3em;
}

/* sct-Clientes del page /contacto/ tiene paddingTop inline 40;
   en mobile queremos menos aire. */
section.sct-Clientes[style*="paddingTop"] {
    padding-top: 16px !important;
}

/* En /contacto/ el título .sct-Clientes span sale gris claro (#dddddd)
   sobre fondo blanco → ilegible en mobile. Hacerlo legible. */
main .sct-Clientes span {
    color: #333333 !important;
    font-size: 2.2em !important;
}

/* Asegurar que texto largo no se salga del viewport */
main p,
main h1,
main h2,
main h3,
main span {
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
}

/* Honeypot del form (off-screen left) — asegurar que no haga
   overflow horizontal en mobile. */
input[name="website"] {
    left: -9999px !important;
}