/* Improvements scoped to the requested sections. */
.foundation-banner{position:relative;isolation:isolate;overflow:hidden;padding-top:clamp(220px,30vw,420px)}
.foundation-banner-photo{position:absolute;top:0;left:0;width:100%;height:620px;object-fit:cover;object-position:center 45%;z-index:-2}
.foundation-banner::before{content:"";position:absolute;inset:0 0 auto;height:640px;z-index:-1;background:linear-gradient(180deg,rgba(27,36,48,.12),rgba(27,36,48,.2) 25%,var(--concreto) 96%)}
.foundation-banner .head{max-width:900px}.foundation-banner .lede{color:#e4e8ed}
/* Natural aspect ratios reveal the entire original photograph, without frames. */
#ecko .proy-fotos{align-items:start;gap:10px}
#ecko .proy-fotos .fp-main,#ecko .proy-fotos .fp-side{aspect-ratio:auto;height:auto;overflow:visible;background:transparent;padding:0;border:0}
#ecko .proy-fotos .fp-side{grid-template-rows:auto auto;align-items:start;gap:10px}
#ecko .proy-fotos img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;display:block}
.soil-detail{margin-top:24px;border-top:1px solid #ffffff30;border-bottom:1px solid #ffffff30}
.soil-detail summary{cursor:pointer;min-height:58px;padding:16px 0;display:flex;gap:12px;align-items:center;justify-content:space-between;font-weight:600;font-size:14px;list-style:none}
.soil-detail summary::-webkit-details-marker{display:none}.soil-detail summary span{color:var(--senal);font-family:'IBM Plex Mono',monospace;font-size:12px}
.soil-content{padding:0 0 22px}.soil-content>p{font-size:14px;color:#d0d6df;max-width:65ch}
.soil-section{height:270px;position:relative;margin:38px 0 32px;border-top:2px solid var(--senal);border-bottom:1px dashed #ffffff40}
.ground-label{position:absolute;left:0;top:-28px;font-size:12px;color:var(--senal)}
.soil-layers{position:absolute;inset:0;display:grid;grid-template-rows:25% 35% 40%;overflow:hidden}
.soil-layers i:nth-child(1){background:repeating-linear-gradient(160deg,#7e6c512c 0 2px,#7e6c514a 2px 12px)}
.soil-layers i:nth-child(2){background:repeating-linear-gradient(20deg,#77695144 0 1px,#77695122 1px 9px)}
.soil-layers i:nth-child(3){background:repeating-linear-gradient(160deg,#4b56633b 0 2px,#4b56636b 2px 20px)}
.soil-pile{position:absolute;left:23%;top:0;width:30px;height:var(--depth);background:linear-gradient(90deg,#c8cfd7,#f1f2f5 50%,#818c98);border:1px solid white;transform-origin:top;box-shadow:0 0 24px #0003}
.soil-detail[open] .soil-pile{animation:descend 1.6s ease-out both}
.soil-depth{position:absolute;left:42%;top:calc(var(--depth) - 42px);color:var(--senal);font-size:26px;line-height:1.2}
.soil-depth small{display:block;font-size:11px;font-weight:400;color:#e1e6ed;margin-top:5px}
.soil-scale{position:absolute;bottom:-25px;right:0;font-size:11px;color:#b3becb}
.soil-content .soil-note{font-size:11px;color:#aab5c4;margin-top:38px}.soil-replay{border:1px solid #ffffff45;background:transparent;color:var(--senal);padding:10px 15px;cursor:pointer}
@keyframes descend{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.trajectory-route .tabla{position:relative;padding-left:30px;border-left:1px solid #ffffff35;margin-left:12px}
.trajectory-route .route-stop{display:block;position:relative;padding:0;border:0;border-bottom:1px solid #ffffff20;margin:0}
.trajectory-route .route-stop::before{content:"";position:absolute;width:11px;height:11px;border-radius:50%;left:-36px;top:30px;background:var(--concreto);border:2px solid var(--senal)}
.trajectory-route .route-stop[open]::before{background:var(--senal);box-shadow:0 0 0 5px #f5c5181a}
.route-stop summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:22px;padding:22px 0;font-size:clamp(18px,2.3vw,27px);font-weight:600;line-height:1.25}
.route-stop summary::-webkit-details-marker{display:none}.route-stop summary::after{content:'+';margin-left:auto;color:var(--senal);font-size:24px;font-weight:400}.route-stop[open] summary::after{content:'−'}
.route-stop .route-number{font-family:'IBM Plex Mono',monospace;font-size:13px;color:var(--senal);flex:none}
.route-stop>.chips{padding:0 0 28px}.route-stop .chip.lista{flex:1 1 320px;max-width:none}.route-stop .chip-photo .ph{height:auto;aspect-ratio:auto}.route-stop .chip-photo img{height:auto;object-fit:contain}
@media(max-width:700px){.foundation-banner{padding-top:240px}.foundation-banner-photo{height:420px}.foundation-banner::before{height:450px}.foundation-banner .head .btn{margin-left:0}.soil-detail summary{align-items:flex-start;flex-direction:column;gap:6px}.soil-section{height:230px}.trajectory-route .tabla{padding-left:20px;margin-left:5px}.trajectory-route .route-stop::before{left:-26px}.route-stop summary{gap:12px}.route-stop .chip{max-width:100%}}
@media(prefers-reduced-motion:reduce){.soil-detail[open] .soil-pile{animation:none}}
/* The trajectory sits on the original light portfolio background. */
.trajectory-route .tabla{border-left-color:#b8b3a9;border-top:0}
.trajectory-route .route-stop{border-bottom-color:#d5d0c6}
.trajectory-route .route-stop::before{background:var(--cal);border-color:#a8850b}
.trajectory-route .route-stop[open]::before{background:var(--senal)}
.trajectory-route .route-number,.trajectory-route summary::after{color:#8a6c00}
/* Align photographic slides to the viewport, including fractional mobile widths. */
#destacados-track{gap:0;scroll-padding:0}
#destacados-track>.obra{scroll-snap-align:start;scroll-snap-stop:always}
#obras{padding-top:30px}
#obras>.wrap>.sub:first-child{margin-top:0!important}
.foundation-metrics{display:grid;grid-template-columns:minmax(110px,.65fr) minmax(0,2fr);gap:0;margin-top:28px;align-items:stretch;border:1px solid #ffffff25}
.pile-count{padding:24px 16px;background:var(--senal);color:var(--concreto);display:flex;flex-direction:column;justify-content:center;gap:12px}
.pile-count>b{font-size:clamp(34px,4vw,54px);line-height:1;font-weight:800}
.pile-count>span{font-family:'IBM Plex Mono',monospace;font-size:11px;line-height:1.5;text-transform:uppercase}
.soil-feature{padding:22px 20px 14px;min-width:0;background:#1b243075}
.soil-heading{display:flex;flex-direction:column;gap:10px;font-size:14px}.soil-heading>span{font-size:12px;color:#cbd2dc}.soil-heading b{color:var(--senal)}
.soil-feature .soil-section{height:230px;margin:40px 0 32px}
.soil-feature .soil-pile{transform:scaleY(0);left:15%;width:26px}
.soil-feature.is-visible .soil-pile{animation:descend 1.8s cubic-bezier(.2,.65,.3,1) forwards}
.soil-feature .soil-depth{left:39%;font-size:27px}.soil-feature .soil-note{font-size:10px;line-height:1.5;color:#adb7c6;margin:0}
.route-stop{scroll-margin-top:100px}.route-stop.is-current summary{color:#8a6c00}
@media(max-width:700px){.foundation-metrics{grid-template-columns:94px minmax(0,1fr)}.pile-count{padding:16px 10px}.pile-count>b{font-size:34px}.pile-count>span{font-size:10px}.soil-feature{padding:18px 12px 12px}.soil-heading{font-size:13px}.soil-heading>span{font-size:11px}.soil-feature .soil-section{height:210px}.soil-feature .soil-pile{left:9%;width:20px}.soil-feature .soil-depth{left:32%;font-size:25px}.soil-depth small{font-size:10px}.soil-scale{font-size:10px}#obras{padding-top:24px}}
@media(prefers-reduced-motion:reduce){.soil-feature .soil-pile{transform:none}.soil-feature.is-visible .soil-pile{animation:none}}
.diameter-view{margin:20px 0 22px;padding:14px 0;border-top:1px solid #ffffff20;border-bottom:1px solid #ffffff20;text-align:center}
.diameter-view>p{margin:0 0 10px;font-size:11px;color:#cbd2dc}
.diameter-view svg{display:block;width:140px;max-width:100%;height:auto;margin:0 auto;overflow:visible}
.diameter-axis{stroke:#ffffff25;stroke-width:1;stroke-dasharray:3 4}
.diameter-ring{fill:none;stroke:var(--senal);stroke-width:2;opacity:0;transform-origin:70px 70px}
.diameter-ring:nth-of-type(2){stroke:#e7edf4}.diameter-ring:nth-of-type(3){stroke:#9db3c9}
.diameter-values{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 12px;margin-top:10px}
.diameter-label{color:var(--senal);font-size:12px;font-family:'IBM Plex Mono',monospace;opacity:0}
.diameter-label:nth-child(2){color:#e7edf4}.diameter-label:nth-child(3){color:#9db3c9}
.diameter-view>small{display:block;color:#adb7c6;font-size:10px;margin-top:8px}
.soil-feature.is-visible .diameter-ring{animation:ring-arrive .65s ease-out var(--ring-delay) forwards}
.soil-feature.is-visible .diameter-label{animation:ring-label .4s ease-out var(--ring-delay) forwards}
@keyframes ring-arrive{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}
@keyframes ring-label{to{opacity:1}}
@media(max-width:700px){.diameter-view svg{width:120px}.diameter-label{font-size:11px}}
@media(prefers-reduced-motion:reduce){.diameter-ring,.diameter-label{opacity:1}.soil-feature.is-visible .diameter-ring,.soil-feature.is-visible .diameter-label{animation:none}}
