/* 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-v2.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}
}

/* ============================================================
   Ajustes — segunda revisión
   ============================================================ */

/* --- Barra superior más transparente, integrada al contenido --- */
#hd,header.solid{background:rgba(19,28,39,.7);-webkit-backdrop-filter:blur(20px) saturate(135%);backdrop-filter:blur(20px) saturate(135%);border-bottom:1px solid rgba(255,255,255,.09)}
#menu.on{background:rgba(15,23,32,.96);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}

/* --- Sin flechas en el listado de especialidades ------------ */
.map-routes i{display:none}
.map-heading a{padding-bottom:12px}

/* --- Cimentación: párrafos juntos, sin hueco muerto --------- */
.foundation-film-zone .foundation-intro{padding-bottom:0!important}
.foundation-film-zone .foundation-intro p:last-of-type{margin-bottom:0!important}
.foundation-film-zone .foundation-story{padding-top:14px!important}
.foundation-film-zone .foundation-story .lede{margin-top:0!important}
.foundation-story .ecko-brand{margin-top:22px!important;padding-bottom:20px}

/* --- Logo Ecko Terra de margen a margen -------------------- */
.foundation-story .mk{width:100%}
.foundation-story .mk img{width:100%;max-width:none;height:auto}
@media(min-width:701px){.foundation-story .rama{grid-template-columns:minmax(0,440px) 1fr}}

/* --- Entrada suave del texto de cimentación ---------------- */
@keyframes entra-suave{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
body[data-foundation] .foundation-intro .kicker,
body[data-foundation] .foundation-intro h1,
body[data-foundation] .foundation-intro p,
body[data-foundation] .foundation-story .lede,
body[data-foundation] .foundation-story .ecko-brand{animation:entra-suave .85s cubic-bezier(.22,.61,.36,1) both}
body[data-foundation] .foundation-intro .kicker{animation-delay:.06s}
body[data-foundation] .foundation-intro h1{animation-delay:.2s}
body[data-foundation] .foundation-intro p{animation-delay:.36s}
body[data-foundation] .foundation-story .lede{animation-delay:.52s}
body[data-foundation] .foundation-story .ecko-brand{animation-delay:.68s}

@media(max-width:700px){
/* --- Inicio: la foto del hero deja de salir recortada ------ */
.hero-fullbleed .bg{height:auto!important;min-height:0;max-height:none;aspect-ratio:3/2}
.hero-fullbleed .bg img{object-position:center}
.hero-fullbleed .bg::after{background:linear-gradient(0deg,#111d2766,transparent 36%)}

/* --- Inicio: destacados, foto completa y texto debajo ------ */
.featured-fullbleed{padding-bottom:48px}
#destacados-track>.obra{min-height:0;padding:0 0 30px;justify-content:flex-start}
#destacados-track .ph{position:relative;inset:auto;width:100%;aspect-ratio:4/3;z-index:0;overflow:hidden}
#destacados-track .ph img{opacity:1;object-position:center}
#destacados-track .ph::after{background:linear-gradient(180deg,transparent 64%,rgba(27,36,48,.5) 100%)}
#destacados-track .txt{padding:22px var(--gut) 0;max-width:none}
#destacados-track h3{font-size:30px}
.featured-fullbleed .car-nav{top:22%}

/* --- Logo Ecko: ancho completo del texto ------------------- */
.foundation-story .mk img{max-width:none;width:100%}
}