/** * CSS MOBILE - max-width: 768px * Orden según estructura HTML del home: * body > header > main.container > .row > .col-12 > * .banner-principal | #servicios | #nuestro-trabajo | #nosotros > #formulario-contacto */ @media (max-width: 768px) { .srs-extra-wrap { padding: 0 20px!important; } .banner-principal.position-relative.text-center.text-white .h-100 { height: 100% !important; } .banner-principal.position-relative.text-center.text-white { height: 300px !important; } .page-id-271 .sh-section .sh-extra-wrap { max-width: 1140px; margin: 60px auto 0; padding: 0 12px; } .position-absolute.top-50.start-50.translate-middle { margin-top: 7rem; } #servicios .col-6.col-md-3 .p-4 { padding: 0.1rem !important; } #formulario-contacto .row.justify-content-center.text-center.mb-5 img { width: 80% !important; } .row.formulario-web .col-md-12.p-4.titulo-contacto.text-center img { width: 30% !important; } /* -------------------------------------------------- 1. BODY (global) — sin margen -------------------------------------------------- */ body { padding-left: 0; padding-right: 0; overflow-x: hidden; } /* -------------------------------------------------- 2. HEADER
-------------------------------------------------- */ .container-header { padding-left: 0; padding-right: 0; } /* -------------------------------------------------- 3. MAIN — ancho completo (banner e imágenes full width)
-------------------------------------------------- */ main.container { padding-left: 0; padding-right: 0; max-width: 100%; margin-left: 0; margin-right: 0; box-sizing: border-box; } main .row { margin-left: auto; margin-right: auto; display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.75rem 1rem; max-width: 100%; box-sizing: border-box; } main > .row > .col-12 { grid-column: 1 / -1; } main .container > div, main .titulo-principal { max-width: 100%; box-sizing: border-box; } /* Portada: la fila que envuelve todo el contenido va en block (no grid) */ body.home main .row, body.servilleta-front main .row { display: block !important; } body.home main > .row > .col-12, body.servilleta-front main > .row > .col-12 { width: 100%; max-width: 100%; } body.home main, body.servilleta-front main { overflow-x: hidden; max-width: 100%; } body.home main .container, body.servilleta-front main .container { max-width: 100%; box-sizing: border-box; } /* -------------------------------------------------- 4. BANNER HERO — full width (sin padding)