/* The neutral wrapper keeps the original reading order on small screens and in viewers. */
.soil-main261,.soil-methods261 {display:contents}

@media(min-width:1001px) {
  /* One centered workspace, with the same edges for picker, index and sheets. */
  body[data-foundation] #ecko :is(#elegir-vista-frentes,#frentes-index250,#frentes-content250,.front-reading-hint252) {
    width:100%;max-width:1440px;margin-inline:auto;box-sizing:border-box;
  }
  body[data-foundation] #ecko #frentes-content250 {background:transparent}
  body[data-foundation] #ecko .front-reading-hint252 {padding-inline:24px}
  body[data-foundation] #ecko #frentes-content250 > .proy {padding:24px!important}
  body[data-foundation] #ecko #frentes-content250 .front-summary252 {min-height:0;gap:10px}
  body[data-foundation] #ecko #frentes-content250 .front-body252 {
    display:grid;grid-template-columns:minmax(320px,360px) minmax(0,1fr);
    grid-template-rows:auto auto auto minmax(0,1fr);
    align-items:start;align-content:start;gap:18px 28px;
    margin-top:18px;padding-top:18px;border-top:1px solid #b2c8d426;
  }
  /* Only this presentational wrapper is flattened. The sheet retains its own
     measurable box for the existing scroll and automatic closing logic. */
  body[data-foundation] #ecko #frentes-content250 .front-layout64 {display:contents!important}
  body[data-foundation] #ecko #frentes-content250 .front-body252 > .desc {
    grid-column:2;grid-row:1;margin:0;max-width:78ch;
    font-size:14px;line-height:1.85;
  }
  body[data-foundation] #ecko #frentes-content250 .front-facts250 {
    grid-column:2;grid-row:2;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.4fr);
    gap:16px;margin:0;padding:16px 18px;
    border:1px solid #b2c8d426;border-radius:8px;background:#13273730;
  }
  body[data-foundation] #ecko #frentes-content250 .front-facts250 dt {
    font-size:11px;line-height:1.7;margin-bottom:6px;
  }
  body[data-foundation] #ecko #frentes-content250 .front-facts250 dd {
    font-size:21px;line-height:1.5;
  }
  body[data-foundation] #ecko #frentes-content250 .front-layout64 > .foundation-metrics {
    grid-column:1!important;grid-row:1/5!important;
    width:100%;max-width:none;min-width:0;
    border:0!important;background:transparent!important;
  }
  body[data-foundation] #ecko #frentes-content250 .front-layout64 > .et-gallery-bar {
    grid-column:2!important;grid-row:3!important;max-width:none;
    padding:0!important;border:0;gap:16px!important;
  }
  body[data-foundation] #ecko #frentes-content250 .front-layout64 > .gallery-row68 {
    grid-column:2!important;grid-row:4!important;
    width:min(100%,var(--gallery-cap261,100%))!important;
    max-width:100%!important;justify-self:start!important;align-self:start!important;
    margin:0!important;gap:8px!important;
  }
  body[data-foundation] #ecko #frentes-content250 .gallery-row68 img,
  body[data-foundation] #ecko #frentes-content250 .gallery-row68 img:is(:hover,:focus-visible) {
    height:auto!important;max-height:280px!important;max-width:100%!important;
    width:100%!important;object-fit:contain!important;
  }

  /* The machine and the strata stay compact; the measurement lanes are retained. */
  body[data-foundation] #ecko #frentes-content250 .soil-feature.soil-spaced250 {
    padding:18px!important;border-radius:10px;
  }
  body[data-foundation] #ecko #frentes-content250 .soil-feature .soil-heading {gap:6px 16px}
  body[data-foundation] #ecko #frentes-content250 .soil-feature .soil-heading strong {font-size:15px}
  body[data-foundation] #ecko #frentes-content250 .soil-feature .soil-heading > span {font-size:11px}
  body[data-foundation] #ecko #frentes-content250 .soil-feature .soil-classification {
    margin-top:12px;padding-block:10px;font-size:11px;gap:8px 12px;
  }
  body[data-foundation] #ecko #frentes-content250 .soil-feature.soil-inside252 .soil-section {
    --rig-width241:84px;--rig-height241:126px;--rig-axis241:16.2px;
    height:224px!important;min-height:224px!important;
    margin:calc(var(--rig-height241) + 18px) 0 0!important;
  }
  body[data-foundation] #ecko #frentes-content250 .soil-feature .soil-reference250 {margin:10px 0 0}
  body[data-foundation] #ecko #frentes-content250 .soil-feature .soil-note {
    margin:14px 0 0!important;font-size:11px!important;line-height:1.7!important;
  }
  body[data-foundation] #ecko #frentes-content250 .drill-progress257 {margin-top:14px}
  body[data-foundation] #ecko #frentes-content250 .drill-controls257 {gap:8px;margin-top:12px}
  body[data-foundation] #ecko #frentes-content250 .drill-controls257 button {
    min-height:44px;padding:10px 12px;font-size:11px;gap:7px;
  }
  body[data-foundation] #ecko #frentes-content250 .et-diagram-open {
    min-height:44px;padding:10px 14px!important;font-size:11px!important;
    margin:12px 0 0!important;
  }

  /* Gallery-only view: the brief and figures have a column of their own. */
  body[data-foundation] #ecko[data-fronts-view="gallery"] #frentes-content250 .front-body252 {
    grid-template-columns:minmax(260px,.85fr) minmax(0,1.4fr);
    grid-template-rows:auto minmax(0,1fr);
  }
  body[data-foundation] #ecko[data-fronts-view="gallery"] #frentes-content250 .front-body252 > .desc {grid-column:1;grid-row:1}
  body[data-foundation] #ecko[data-fronts-view="gallery"] #frentes-content250 .front-facts250 {
    grid-column:1;grid-row:2;grid-template-columns:repeat(2,minmax(0,1fr));
  }
  body[data-foundation] #ecko[data-fronts-view="gallery"] #frentes-content250 .front-facts250 > div:last-child {grid-column:1/-1}
  body[data-foundation] #ecko[data-fronts-view="gallery"] #frentes-content250 .front-layout64 > .et-gallery-bar {grid-row:1!important}
  body[data-foundation] #ecko[data-fronts-view="gallery"] #frentes-content250 .front-layout64 > .gallery-row68 {grid-row:2!important}

  /* Diagram-only view: a bounded drawing beside the technical brief. */
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 {max-width:1120px}
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .front-body252 {
    grid-template-columns:minmax(300px,360px) minmax(0,1fr);
    grid-template-rows:auto minmax(0,1fr);
  }
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .front-layout64 > .foundation-metrics {grid-row:1/3!important}
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .front-facts250 {grid-template-columns:repeat(2,minmax(0,1fr))}
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .front-facts250 > div:last-child {grid-column:1/-1}

  /* Trenches use the same centered, balanced workspace. */
  body[data-foundation] #ecko #zanjeo {width:100%;max-width:1440px;margin-inline:auto}
  body[data-foundation] #ecko #zanjeo :is(.trench-intro239,.trench-view-picker254) {max-width:none}
  body[data-foundation] #ecko #zanjeo .trench-project-layout239 {
    grid-template-columns:minmax(320px,420px) minmax(0,1fr);gap:28px;
  }
  body[data-foundation] #ecko #zanjeo .trench-photo-area239 {min-width:0}
  body[data-foundation] #ecko #zanjeo .trench-project-description240 {max-width:75ch;margin-bottom:18px}
  body[data-foundation] #ecko #zanjeo .trench-photo-area239 > .et-gallery-bar {padding:16px 0 0!important;border:0}
  body[data-foundation] #ecko #zanjeo .trench-gallery239 {max-width:680px;margin:16px 0 0}
  body[data-foundation] #ecko #zanjeo .trench-gallery239:not(.trench-gallery-three239) img {
    max-height:280px;max-width:100%;width:auto;height:auto;object-fit:contain;
  }
  body[data-foundation] #ecko #zanjeo .trench-gallery-three239 {max-width:560px}
  body[data-foundation] #ecko #zanjeo[data-trench-view="gallery"] .trench-project-layout239 {
    grid-template-columns:minmax(240px,.65fr) minmax(0,1.35fr);max-width:none;
  }
  body[data-foundation] #ecko #zanjeo[data-trench-view="diagram"] .trench-project-layout239 {max-width:1120px;margin-inline:auto}
  body[data-foundation] #ecko #zanjeo .trench-diagram240 {padding:18px}
}

@media(min-width:1360px) {
  /* Supplemental schematics share the drawing's height instead of adding to it. */
  body[data-foundation] #ecko #frentes-content250 .front-has-methods261 .front-body252 {
    grid-template-columns:minmax(520px,1fr) minmax(0,1fr);
  }
  body[data-foundation] #ecko #frentes-content250 .front-has-methods261 .soil-feature {
    display:grid;grid-template-columns:minmax(250px,1.1fr) minmax(180px,.9fr);
    column-gap:20px;align-items:start;
  }
  body[data-foundation] #ecko #frentes-content250 .front-has-methods261 .soil-heading {grid-column:1/-1;grid-row:1}
  body[data-foundation] #ecko #frentes-content250 .front-has-methods261 .soil-classification {grid-column:1/-1;grid-row:2}
  body[data-foundation] #ecko #frentes-content250 .front-has-methods261 .soil-section {grid-column:1;grid-row:3}
  body[data-foundation] #ecko #frentes-content250 .front-has-methods261 .soil-reference250 {grid-column:1;grid-row:4}
  body[data-foundation] #ecko #frentes-content250 .front-has-methods261 .soil-methods261 {
    grid-column:2;grid-row:3/5;display:flex;flex-direction:column;gap:18px;
    min-width:0;margin-top:20px;padding-left:18px;border-left:1px solid #b2c8d426;
  }
  body[data-foundation] #ecko #frentes-content250 .soil-methods261 > figure {
    margin:0!important;padding:0;border:0;
  }
  body[data-foundation] #ecko #frentes-content250 .soil-methods261 figcaption {font-size:11px;margin-bottom:10px;line-height:1.7}
  body[data-foundation] #ecko #frentes-content250 .soil-methods261 figcaption span {font-size:10px}
  body[data-foundation] #ecko #frentes-content250 .front-has-methods261 .soil-note {grid-column:1/-1;grid-row:5}
  body[data-foundation] #ecko #frentes-content250 .front-has-methods261 .drill-progress257 {grid-column:1/-1;grid-row:6}
  body[data-foundation] #ecko #frentes-content250 .front-has-methods261 .drill-controls257 {grid-column:1;grid-row:7}
  body[data-foundation] #ecko #frentes-content250 .front-has-methods261 .et-diagram-open {grid-column:2;grid-row:7;justify-self:start}

  body[data-foundation] #ecko[data-fronts-view="gallery"] #frentes-content250 .front-has-methods261 .front-body252 {
    grid-template-columns:minmax(260px,.85fr) minmax(0,1.4fr);
  }
  /* Without photographs, place a landscape-format drawing beside the brief.
     The cut itself stays the same size; its legend and controls fill the side. */
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 {max-width:1440px}
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .proy .front-body252 {
    grid-template-columns:minmax(260px,.6fr) minmax(0,1.4fr);
  }
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .front-body252 > .desc,
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .front-facts250 {grid-column:1}
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .front-layout64 > .foundation-metrics {grid-column:2!important}
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .soil-feature {
    display:grid;grid-template-columns:minmax(250px,320px) minmax(180px,1fr);
    column-gap:22px;align-items:start;align-content:start;
  }
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .soil-main261 {display:block;grid-column:1;grid-row:1/8}
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .soil-heading {grid-column:2;grid-row:1}
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .soil-classification {grid-column:2;grid-row:2}
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .soil-methods261 {
    display:flex;flex-direction:column;gap:16px;grid-column:2;grid-row:3;
    margin-top:16px;padding:0;border:0;
  }
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .soil-note {grid-column:2;grid-row:4}
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .drill-progress257 {grid-column:2;grid-row:5}
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .drill-controls257 {grid-column:2;grid-row:6}
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .et-diagram-open {grid-column:2;grid-row:7;justify-self:start}

  /* A longitudinal cut and cross-section sit side by side on wide screens. */
  body[data-foundation] #ecko #zanjeo .trench-project-layout239 {
    grid-template-columns:minmax(500px,1fr) minmax(0,1fr);
  }
  body[data-foundation] #ecko #zanjeo .trench-diagram240 {
    display:grid;grid-template-columns:minmax(0,1fr) 140px;column-gap:18px;
    align-items:start;
  }
  body[data-foundation] #ecko #zanjeo .trench-diagram-heading240 {grid-column:1/-1;grid-row:1;padding-bottom:14px}
  body[data-foundation] #ecko #zanjeo .trench-view-label240 {grid-column:1/-1;grid-row:2;margin-block:12px}
  body[data-foundation] #ecko #zanjeo .trench-side240 {grid-column:1;grid-row:3;align-self:center}
  body[data-foundation] #ecko #zanjeo .trench-section240 {
    grid-column:2;grid-row:3;grid-template-columns:minmax(0,1fr);gap:12px;
    margin:0!important;align-self:center;
  }
  body[data-foundation] #ecko #zanjeo .trench-cross240 {max-height:82px}
  body[data-foundation] #ecko #zanjeo .trench-dimensions240 {grid-template-columns:minmax(0,1fr);gap:10px}
  body[data-foundation] #ecko #zanjeo .trench-dimensions240 dd {font-size:24px}
  body[data-foundation] #ecko #zanjeo .trench-sequence240 {grid-column:1/-1;grid-row:4}
  body[data-foundation] #ecko #zanjeo .trench-progress240 {grid-column:1/-1;grid-row:5}
  body[data-foundation] #ecko #zanjeo .trench-status240 {grid-column:1/-1;grid-row:6}
  body[data-foundation] #ecko #zanjeo .trench-controls240 {grid-column:1/-1;grid-row:7}
  body[data-foundation] #ecko #zanjeo .trench-diagram-note240 {grid-column:1/-1;grid-row:8}
  body[data-foundation] #ecko #zanjeo[data-trench-view="gallery"] .trench-project-layout239 {
    grid-template-columns:minmax(240px,.65fr) minmax(0,1.35fr);
  }
}

@media(min-width:1600px) {
  body[data-foundation] #ecko[data-fronts-view="diagram"] #frentes-content250 .soil-methods261:has(> figure + figure) {
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;
  }
}
