/* Shared responsive safeguards. */
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:90px}
img,video{max-width:100%}
.wrap,.project-info,.viewer-description,.native-content,.map-heading,.map-routes{min-width:0}
h1,h2,h3,p,li,dd{overflow-wrap:break-word}
[hidden]{display:none!important}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,select:focus-visible{outline:2px solid #d7ae16;outline-offset:4px}
.foundation-film-zone{overflow:hidden;background:#14212b;padding-bottom:64px}
.foundation-background-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;pointer-events:none}
.foundation-film-zone::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#111d27e8,#111d2799),linear-gradient(0deg,#1b2531,transparent 20%)}
.foundation-film-zone .foundation-intro,.foundation-film-zone .foundation-story{background:transparent!important;color:#fff}
.foundation-film-zone p{color:#eef1f4}
.foundation-film-zone .foundation-intro{padding-top:110px!important;margin-top:0}
.foundation-film-zone .foundation-story{padding-top:20px;padding-bottom:0}
.foundation-video-toggle{position:absolute;bottom:18px;right:max(24px,var(--gut));background:#111d2799;border:1px solid #ffffff70;color:white;padding:10px 16px;min-height:44px;cursor:pointer}
.foundation-story .ecko-brand{align-items:center}
.foundation-story .mk img{height:auto}
.viewer-stage img,.native-hero img,.native-gallery img{height:auto;object-fit:contain}
.scope-controls select{width:100%;min-height:44px;font-size:16px}
.specialty-map button{touch-action:manipulation}
@media(max-width:700px){
.foundation-film-zone .foundation-intro{padding-top:108px!important}
.foundation-film-zone h1{font-size:clamp(36px,10vw,50px);line-height:1.08}
.foundation-film-zone .foundation-intro p,.foundation-story p,.foundation-story .lede{font-size:16px;line-height:1.6}
.foundation-film-zone .kicker{font-size:11px;letter-spacing:.12em}
.foundation-story .ecko-brand{margin-top:18px!important}
.foundation-story .mk{margin-block:16px}.foundation-story .ecko-brand p{margin-block:16px 0}
.foundation-video-toggle{font-size:12px}
.fleet-immersive .flota>div{padding:24px}.fleet-immersive .flota em{font-size:15px;line-height:1.6}
.project-info,.viewer-description{padding:24px!important}
.project-info b{font-size:clamp(22px,6vw,30px);line-height:1.2}
.viewer-controls{gap:8px}.viewer-controls button{min-height:44px}
.banner-lightbox-bar{padding-inline:12px;gap:8px}.banner-lightbox button{font-size:14px}
.home-compact .hero.hero-fullbleed{min-height:calc(100svh - 74px);padding-block:12px}
.home-compact .hero-fullbleed .inner{padding-bottom:8px}
.home-compact .hero-fullbleed .hero-pagination button{min-height:44px}
.home-compact .hero-fullbleed .cta{padding-right:0}
}
@media(max-width:700px) and (max-height:650px){
.home-compact .hero-fullbleed .inner{padding-top:12px}
.home-compact .hero-fullbleed h1{font-size:29px}
.home-compact .hero-fullbleed .inner>p:not(.tag){font-size:13px;line-height:1.35;margin-top:8px}
.home-compact .hero-fullbleed .cta{margin-top:10px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.foundation-film-zone{background:#14212b url('/img/cimentacion-poster-2026.jpg') center/cover no-repeat}

/* ============================================================
   Ajuste fotográfico — septiembre 2026
   1. Las fotos se veían lavadas: se quita el velo que las apagaba.
   2. Se veían recortadas: se quita el zoom artificial.
   3. La foto de la flota se muestra completa y a resolución nativa.
   4. Menos aire en la explicación de cimentación.
   ============================================================ */

/* --- 1. Fotos a su opacidad real --------------------------- */
.hero .bg img.on,
.hero-fullbleed .bg img.on,
.phero .bg img.on{opacity:1}
#destacados-track .ph img{opacity:1}
.civil-mosaic img{opacity:1}

/* --- 2. Sin acercamiento automático ------------------------ */
.hero .bg img,
.hero-fullbleed .bg img,
.phero .bg img{animation:none!important;transform:none!important}

/* --- Velos más ligeros: sólo donde hay texto encima -------- */
.hero-fullbleed .bg::after{background:linear-gradient(90deg,#101a23cc 0%,#101a2359 44%,#101a2300 74%),linear-gradient(0deg,#101a23f2 0%,#101a235e 17%,transparent 44%)}
.phero .bg::after{background:linear-gradient(to top,rgba(16,26,35,.93) 4%,rgba(16,26,35,.58) 44%,rgba(16,26,35,.2) 100%)}
.foundation-film-zone::before{background:linear-gradient(90deg,#111d27cc,#111d278c),linear-gradient(0deg,#1b2531,transparent 22%)}

/* --- 3. Flota propia: la foto como imagen, no como fondo --- */
.fleet-layout{margin-top:38px;display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.7fr);gap:22px;align-items:stretch}
.fleet-photo{margin:0;min-width:0;background:#0f1922;border:1px solid #ffffff26;line-height:0}
.fleet-photo img{width:100%;height:auto;display:block}
.fleet-layout .flota{margin-top:0;grid-template-columns:repeat(2,1fr)}
.fleet-immersive .flota>div{background:#1e2937;backdrop-filter:none;border-bottom:1px solid #ffffff1f}
@media(max-width:1000px){
.fleet-layout{grid-template-columns:1fr;gap:20px}
.fleet-photo{max-width:520px}
}
@media(max-width:560px){.fleet-layout .flota{grid-template-columns:1fr}}

/* --- 4. Explicación de cimentación: menos aire ------------- */
.foundation-film-zone{padding-bottom:42px}
.foundation-film-zone .foundation-intro{padding-bottom:0!important}
.foundation-film-zone .foundation-story{padding-top:16px;padding-bottom:0}
.foundation-story .lede{margin-top:0}
.foundation-story .ecko-brand{margin-top:28px!important;padding-bottom:24px;margin-bottom:0}
.foundation-story .mk{margin-block:0}
.foundation-story .ecko-brand p{margin-block:0}

@media(max-width:700px){
.foundation-film-zone{padding-bottom:34px}
.foundation-film-zone .foundation-story{padding-top:12px}
.foundation-story .ecko-brand{margin-top:22px!important;padding-bottom:20px}
.foundation-story .mk{margin-block:14px}
.foundation-story .ecko-brand p{margin-block:14px 0}
/* El hero del inicio: menos recorte de la foto en pantalla vertical */
.hero-fullbleed .bg{height:56svh}
.hero-fullbleed .bg::after{background:linear-gradient(0deg,#101a23 0%,#101a236b 23%,transparent 53%)}
}