/* static/css/responsive.css — loaded last, after every page stylesheet.

   The fitted artboard composition (STAGE and WIDE, base.css) needs a design
   pixel of at least 0.8333: below that the type's clamp() floors keep text
   larger than the boxes that shrank around it. So everything narrower than
   1600px flows: the same vocabulary, in fluid columns that grow with their
   copy, with normal document scroll. The design pixel is redefined per
   breakpoint in base.css (1600 → 1/1600 of the width, 1200 → 1/1440,
   900 → 1/760, 600 → 1/430).

   Sections, widest first: FLOW (below 1600), 1200, 900, 600. Rules for
   shared components sit in each section above the page rules. */

/* ======================================================================== */
/* FLOW — below 1600px                                                      */
/* ======================================================================== */
@media (max-width: 1599.98px) {
  /* ---- Header: logo | edition + nav (centred) | index ------------------ */
  .hd {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    column-gap: calc(48 * var(--u));
  }
  .hd__index { justify-self: end; }

  /* ---- Footer: fluid columns, the same four cells ---------------------- */
  .ft { grid-template-columns: minmax(0, 1.2fr) minmax(0, 2fr) minmax(0, 1fr) auto; }
  .ft__cell--coords {
    grid-template-columns: auto auto;
    justify-content: start;
    column-gap: calc(64 * var(--u));
    padding-left: calc(56 * var(--u));
  }
  .ft__cell--status { padding-left: calc(56 * var(--u)); }
  .ft__cell--brand { padding-left: calc(32 * var(--u)); }

  /* ---- Type on its floor: line boxes follow the font -------------------
     Where a clamp() floor holds the type above its scaled size, a line
     height set in design px would be tighter than the text. */
  .card__body { line-height: max(calc(16 * var(--u)), 1.3em); }
  .card__id, .card__src-label { line-height: max(calc(16 * var(--u)), 1.3em); }
  .legend__label { line-height: max(calc(20 * var(--u)), 1.3em); }

  /* ---- Home ----------------------------------------------------------- */
  .home { height: auto; grid-template-rows: auto auto; }
  .home__top {
    grid-template-columns: minmax(0, 1fr) minmax(0, .7fr) minmax(0, calc(714.1 * var(--u)));
    padding-bottom: calc(48 * var(--u));
  }
  .home__mark { width: auto; margin-inline: calc(24 * var(--u)); }
  .home__mark img {
    left: 50%;
    width: min(calc(314.04 * var(--u)), 100% - calc(60 * var(--u)));
    transform: translateX(-50%);
  }
  .home__latest { grid-column: auto; }
  .home__latest-body { height: auto; min-height: calc(365.8 * var(--u)); }
  .legend__row { width: auto; }
  .legend__label { max-width: none; }

  .home__bottom { grid-template-columns: minmax(0, 1fr); }
  .home__cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    height: auto;
    margin: calc(19.6 * var(--u)) 0 0;
  }
  .card--compact { min-height: calc(248 * var(--u)); }
  .home__project {
    margin: calc(48 * var(--u)) calc(-2.4 * var(--u)) 0 0;
    padding: 0 calc(2.4 * var(--u)) calc(48 * var(--u)) 0;
    border-top: var(--rule-strong) solid var(--ink);
  }
  .home__project::before { display: none; }
  .home__project .home__label { margin-left: calc(-2.8 * var(--u)); }
  .home__project .panel { margin-left: 0; }
  .panel {
    grid-template-columns: calc(199.9 * var(--u)) minmax(0, 1fr) auto;
    height: auto;
    padding-bottom: calc(53.7 * var(--u));
  }
  .panel__text p { max-width: 60ch; }
  .panel__cta { padding-right: calc(64 * var(--u)); }

  /* ---- Archivo: one column, the list in the page's own flow ------------ */
  .arch { display: block; height: auto; }
  .arch__main { display: block; }
  .arch__hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    height: auto;
    padding-bottom: calc(40 * var(--u));
  }
  .arch__hero > :not(.arch__mark) { grid-column: 1; }
  .arch__mark {
    position: static;
    grid-column: 2;
    grid-row: 1 / span 3;
    align-self: start;
    margin: calc(0.5 * var(--u)) calc(60 * var(--u)) 0 calc(40 * var(--u));
  }
  .arch__meta {
    grid-template-columns: repeat(3, auto);
    justify-content: space-between;
    width: auto;
  }
  .arch__meta p { padding-inline: calc(24 * var(--u)); }
  .arch__meta p:nth-child(2) { padding-left: calc(24 * var(--u)); }
  .arch__list {
    width: auto;
    margin: calc(19.7 * var(--u)) 0 0 calc(-3 * var(--u));
    overflow: visible;
  }
  .row {
    grid-template-columns: calc(203.7 * var(--u)) minmax(0, 1fr) calc(262.6 * var(--u)) minmax(0, calc(360 * var(--u)));
  }
  .row__textcol::before, .row__evidence::before, .row__source::before { bottom: calc(24.9 * var(--u)); }
  .row__textcol { padding-bottom: calc(40 * var(--u)); }
  .arch__bar { display: none; }
  .arch__rail {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: calc(80 * var(--u));
    align-items: start;
    margin: calc(48 * var(--u)) 0 0;
    padding: calc(40 * var(--u)) 0 calc(72 * var(--u));
    border-top: var(--rule-strong) solid var(--ink);
    overflow: visible;
  }
  /* Right under the list; the rail's own top rule is the pager's rule. */
  .arch__rail .pager { order: -1; grid-column: 1 / -1; max-width: calc(461.2 * var(--u)); margin: 0 0 calc(8 * var(--u)); padding: 0; border-top: 0; }
  .arch__about h2 { margin-top: calc(40 * var(--u)); }
  .arch__brand { margin-top: calc(40 * var(--u)); }
  .arch__brand .arch__pub { margin-top: 0; }
  .arch__name { max-width: 100%; }

  /* ---- PREFRAME detail: the expanded row grows with its copy ----------- */
  .pf { height: auto; }
  .pf__bar { padding-top: calc(40 * var(--u)); }
  .pf__row {
    grid-template-columns: calc(520 * var(--u)) minmax(0, 1fr) calc(340 * var(--u));
    margin-bottom: calc(48 * var(--u));
  }
  .pf__idcol { padding-bottom: calc(96 * var(--u)); }
  .pf__frame { margin: calc(40 * var(--u)) auto 0 calc(40 * var(--u)); }
  .pf__textcol, .pf__evidence { min-height: calc(640 * var(--u)); }
  .pf__textcol { padding-right: calc(40 * var(--u)); }
  .pf__evidence { padding-right: calc(32 * var(--u)); padding-left: calc(40 * var(--u)); }
  .pf__obs { line-height: max(calc(41 * var(--u)), 1.25em); }
  .pf__meta { line-height: max(calc(22 * var(--u)), 1.3em); }

  /* ---- Editorial: the bands grow with their copy ----------------------- */
  .ed { height: auto; overflow: visible; margin-inline: 0; padding-inline: 0; }

  /* ---- Términos: the page grows with its copy ------------------------- */
  .tyc { width: auto; max-width: calc(1030.2 * var(--u) + 12 * var(--u)); height: auto; overflow: visible; }

  .ed__top {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    min-height: 0;
  }
  .ed__hero { grid-column: 1 / -1; padding-bottom: calc(32 * var(--u)); }
  .ed__top > .ed__col { min-height: calc(302.5 * var(--u)); margin-block: 0 calc(26.9 * var(--u)); }
  .ed__top > .ed__col:first-of-type { border-left: 0; }
  .ed__col--project { padding-left: 0; }
  .ed__marks { position: static; margin-top: calc(40 * var(--u)); }
  .ed__col--note { padding-right: calc(24 * var(--u)); }
  /* The artboard's hand-set line breaks only hold at the artboard's measure. */
  .ed__text br { display: none; }
  .ed__bottom { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ed__col--why { margin-left: 0; padding-right: calc(24 * var(--u)); }
  .ed__col--why .ed__text { margin-left: 0; }
  /* Tight artboard leading only holds on one line; a wrapped note or
     title gets room to breathe once the type sits at its floor. */
  .ed__step-title { line-height: max(calc(17 * var(--u)), 1.25em); }
  .ed__step-note, .ed__terms { line-height: max(calc(16 * var(--u)), 1.3em); }
  .ed .ed__step-note { margin-top: calc(2 * var(--u)); }
  /* A wrapped note would run its dashes into the next step: steps size to
     their copy and keep clear space for the next step's mark. */
  .ed .ed__step { min-height: 0; padding-bottom: calc(26 * var(--u)); }
  .ed .ed__step:last-child { padding-bottom: 0; }
  .ed__col--why .xh--bl { left: calc(2.9 * var(--u)); }
  .ed__col--water { padding-right: calc(24 * var(--u)); }
  .ed__step-note::after {
    width: 100%;
    max-width: calc(505.1 * var(--u));
    background-size: calc(4.9 * var(--u)) 100%, calc(100% - 16.34 * var(--u)) 100%, calc(4.9 * var(--u)) 100%;
  }

  /* ---- Iconos: header, then title, then a grid that fills the width ---- */
  .ico__hd {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
    height: auto;
    padding: calc(32 * var(--u)) 0;
  }
  .ico__logo { position: static; grid-column: 2; }
  .ico__meta { grid-column: 3; justify-self: end; }
  .ico__meta p { position: static; }
  .ico__meta .ico__index { display: flex; align-items: center; gap: calc(8 * var(--u)); margin-top: calc(16 * var(--u)); }
  .ico__target { position: static; }
  .ico__hd .snd { left: auto; right: 0; top: auto; bottom: calc(10 * var(--u)); }
  .ico__nav { left: 50%; top: auto; bottom: calc(4 * var(--u)); transform: translateX(-50%); }
  .ico__head { position: static; padding-top: calc(40 * var(--u)); white-space: normal; }
  .ico { height: auto; overflow: visible; padding: calc(56 * var(--u)) 0 calc(48 * var(--u)); }
  .ico__grid {
    grid-template-columns: repeat(auto-fill, minmax(calc(84 * var(--u)), 1fr));
    justify-items: center;
    margin: 0;
  }
  .ico .pager, .ico--last .pager {
    width: min(calc(461.2 * var(--u)), 100%);
    margin: calc(40 * var(--u)) 0 0 auto;
  }
  .ico--last .pager { margin: calc(40 * var(--u)) auto 0 0; }
  .ico__ft {
    grid-template-columns: repeat(2, auto) minmax(0, 1fr) repeat(2, auto);
    height: auto;
    padding-bottom: calc(40 * var(--u));
  }
  .ico__ft-text, .ico__ft-text:first-child { padding-inline: calc(40 * var(--u)); }
  .ico__ft-text:first-child { padding-left: 0; }
  .ico__keys { padding-left: calc(96 * var(--u)); }
  .ico__ft-count { padding-left: calc(40 * var(--u)); }
  .ico__ft-brand img { margin-left: calc(40 * var(--u)); }
}

/* ======================================================================== */
/* 1200px                                                                   */
/* ======================================================================== */
@media (max-width: 1200px) {
  /* Home: the eye-drop mark gives its column to the copy. */
  .home__top { grid-template-columns: minmax(0, 1fr) minmax(0, calc(714.1 * var(--u))); column-gap: calc(40 * var(--u)); }
  .home__mark { display: none; }

  /* Editorial: two columns; the methodology takes a full row. */
  .ed__top, .ed__bottom { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ed__top > .ed__col--about { grid-column: 1 / -1; min-height: 0; padding-left: 0; border-left: 0; }
  .ed__col--about .ed__text { max-width: 72ch; }
  .ed__col--about .xh--bl { left: calc(2.9 * var(--u)); }
  .ed__col--method {
    grid-column: 1 / -1;
    margin-top: 0;
    padding-left: 0;
    border-left: 0;
  }
  .ed__col--method .xh--bl { left: calc(2.9 * var(--u)); }
  .ed__bottom > .ed__col--method { margin-top: 0; }
  .ed__top > .ed__col--about, .ed__bottom > .ed__col--method {
    padding-top: calc(28 * var(--u));
    border-top: var(--rule-strong) solid var(--ink);
  }

  /* PREFRAME detail: the evidence column becomes a band under the row. */
  .pf__row { grid-template-columns: calc(560 * var(--u)) minmax(0, 1fr); }
  .pf__frame { margin-left: calc(32 * var(--u)); }
  .pf__evidence {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: auto auto auto;
    grid-auto-flow: column;
    column-gap: calc(40 * var(--u));
    align-items: start;
    min-height: 0;
    margin: 0 calc(24 * var(--u));
    padding: calc(28 * var(--u)) 0 calc(40 * var(--u));
    border-top: var(--rule) dashed var(--ink);
  }
  .pf__evidence::before { display: none; }
  .pf__evidence .row__label:first-child { grid-area: 1 / 1; }
  .pf__date { grid-area: 2 / 1; }
  .pf__evidence-label { grid-area: 1 / 2; margin-top: 0; }
  .pf__verify { grid-area: 2 / 2; }
  .pf__evidence .card__rule { display: none; }
  .pf__evidence .row__src-label { grid-area: 1 / 3; }
  .pf__src { grid-area: 2 / 3; }

  /* Iconos: the keys take their own row. */
  .ico__ft { grid-template-columns: repeat(3, auto) minmax(0, 1fr); }
  .ico__keys {
    grid-column: 1 / -1;
    grid-row: 2;
    height: auto;
    margin-top: calc(32 * var(--u));
    padding-top: calc(32 * var(--u));
    border-left: 0 !important;
    border-top: var(--rule-strong) solid var(--ink);
  }
  .ico__ft-brand { justify-self: end; }
}

/* ======================================================================== */
/* 900px — tablet portrait: the disclosure nav, two columns at most         */
/* ======================================================================== */
@media (max-width: 900px) {
  .shell { padding-inline: calc(28 * var(--u)); }

  /* ---- Header: logo | MENÚ, the nav drops below as a list -------------- */
  .hd, .ico__hd {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: calc(16 * var(--u));
    height: auto;
    margin-right: 0;
    padding: calc(20 * var(--u)) 0;
  }
  .hd__logo { margin: 0; }
  .hd__center { display: contents; }
  .hd__edition, .hd__index, .hd__sep, .ico__meta { display: none; }
  .has-nav-js .hd__toggle {                 /* without the script there is nothing to toggle */
    display: inline-flex;
    align-items: center;
    gap: calc(12 * var(--u));
    min-height: 44px;                       /* a comfortable touch target */
    padding: 0 calc(16 * var(--u));
    border: var(--rule) solid var(--ink);
    background: none;
    color: inherit;
    font: inherit;
    font-size: var(--fs-nav);
    font-weight: var(--fw-medium);
    line-height: 1;
    cursor: pointer;
  }
  .hd__toggle-icon { display: inline-block; transition: transform .2s ease; }
  /* SONIDO joins the top row, left of MENÚ. */
  .hd, .ico__hd { grid-template-columns: minmax(0, 1fr) auto auto; }
  .snd, .ico__hd .snd {
    position: static;
    grid-row: 1;
    grid-column: 2;
    min-height: 44px;
    padding: 0 calc(8 * var(--u));
    font-size: var(--fs-nav);
  }
  .hd__toggle { grid-row: 1; grid-column: 3; }
  .hd__toggle[aria-expanded="true"] .hd__toggle-icon { transform: rotate(45deg); }
  .hd__nav, .ico__nav {
    grid-column: 1 / -1;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    margin-top: calc(20 * var(--u));
    border-top: var(--rule) solid var(--ink);
  }
  .ico__nav {                               /* the Iconos nav is no longer focus-revealed */
    position: static;
    display: flex;
    padding: 0;
    clip-path: none;
    transform: none;
    white-space: normal;
  }
  .hd__nav a, .ico__nav a {
    display: flex;
    align-items: center;
    min-height: 44px;
    padding: calc(8 * var(--u)) 0;
    border-bottom: var(--rule) dashed var(--ink);
  }
  .hd__nav a[aria-current] {
    border-bottom-color: var(--ink);
    text-decoration: underline;
    text-underline-offset: .35em;
    text-decoration-thickness: var(--rule);
  }
  /* Hidden only once nav.js has run; without it the list stays open. */
  .has-nav-js .hd__nav:not(.is-open), .has-nav-js .ico__nav:not(.is-open) { display: none; }
  .ico__logo { grid-column: 1; }
  .ico__logo svg { width: calc(220 * var(--u)); }

  /* ---- Footer: two columns --------------------------------------------- */
  .ft {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    height: auto;
    margin-inline: 0;
    padding: 0 0 calc(28 * var(--u));
  }
  .ft__cell { height: auto; margin: calc(24 * var(--u)) 0 0; }
  .ft__cell + .ft__cell { border-left: 0; }
  .ft__cell--pub { grid-area: 1 / 1; }
  .ft__cell--status { grid-area: 1 / 2; padding: calc(3.55 * var(--u)) 0 0 calc(24 * var(--u)); border-left: var(--rule-strong) solid var(--ink) !important; }
  .ft__cell--coords {
    grid-area: 2 / 1 / 3 / -1;
    padding: calc(20 * var(--u)) 0 0;
    border-top: var(--rule) dashed var(--ink);
  }
  .ft__cell--brand { grid-area: 3 / 1 / 4 / -1; padding: 0; }
  .ft__cell--brand img { margin: 0 0 0 auto; }

  /* ---- Home ------------------------------------------------------------ */
  .home__top { grid-template-columns: minmax(0, 1fr); row-gap: calc(40 * var(--u)); margin-right: 0; padding-right: 0; }
  .home__latest-body { grid-template-columns: minmax(0, 1fr) auto; }
  .home__latest-body::after { display: none; }
  .legend {
    margin-block: calc(26.4 * var(--u));
    padding: calc(4 * var(--u)) calc(28 * var(--u)) 0 calc(36 * var(--u));
    border-left: var(--rule) solid var(--ink);
  }
  .home__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: calc(14.9 * var(--u)); }
  .panel { grid-template-columns: calc(170 * var(--u)) minmax(0, 1fr); padding-bottom: 0; }
  .panel__text { height: auto; padding-right: calc(24 * var(--u)); padding-bottom: calc(8 * var(--u)); }
  .panel__cta {
    grid-column: 1 / -1;
    height: auto;
    margin-top: calc(40 * var(--u));
    padding: calc(24 * var(--u)) calc(32 * var(--u));
    border-left: 0;
    border-top: var(--rule-strong) solid var(--ink);
  }

  /* ---- Archivo --------------------------------------------------------- */
  .arch__mark { width: calc(200 * var(--u)); margin-right: 0; }
  .arch__meta { grid-template-columns: minmax(0, 1fr); }
  .arch__meta p, .arch__meta p:nth-child(n) {
    height: auto;
    padding: calc(10 * var(--u)) calc(8 * var(--u));
    border-left: 0;
    text-align: left;
    white-space: normal;
  }
  .arch__meta p + p { border-top: var(--rule) dashed var(--ink); }
  .row { grid-template-columns: calc(180 * var(--u)) repeat(2, minmax(0, 1fr)); }
  .row__idcol { grid-row: 1 / span 2; min-height: calc(190 * var(--u)); }
  .row__textcol { grid-column: 2 / -1; padding: calc(23.65 * var(--u)) calc(40 * var(--u)) calc(24 * var(--u)) calc(32 * var(--u)); }
  .row__evidence, .row__source { padding: calc(20 * var(--u)) calc(16 * var(--u)) calc(28 * var(--u)) calc(32 * var(--u)); }
  .row__evidence::before, .row__source::before { top: calc(20 * var(--u)); }
  .row__evidence::after {                   /* dashed rule over the lower cells */
    content: "";
    position: absolute;
    top: 0;
    left: calc(32 * var(--u));
    right: calc(-100% + 16 * var(--u));
    border-top: var(--rule) dashed var(--ink);
  }

  /* ---- PREFRAME detail: one column, the frame first -------------------- */
  .pf__row { grid-template-columns: minmax(0, 1fr); }
  .pf__idcol { padding-bottom: calc(88 * var(--u)); }
  .pf__frame { margin: calc(8 * var(--u)) auto 0; }
  .pf__textcol {
    min-height: 0;
    margin: 0 calc(24 * var(--u));
    padding: calc(28 * var(--u)) 0 calc(36 * var(--u));
    border-top: var(--rule) dashed var(--ink);
  }
  .pf__textcol::before { display: none; }
  .pf__obs { margin: 0; }
  .pf__evidence { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: calc(8 * var(--u)); }
  .pf__evidence .row__src-label { grid-area: 3 / 1; margin-top: calc(24 * var(--u)); }
  .pf__src { grid-area: 4 / 1 / 5 / -1; }

  /* ---- Iconos footer ---------------------------------------------------- */
  .ico__ft { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-right: 0; }
  .ico__ft > * { height: auto; margin-top: calc(32 * var(--u)); }
  .ico__ft-text:nth-child(2) { grid-area: 1 / 2; }
  .ico__keys {
    grid-column: 1 / -1;
    grid-row: 2;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding-left: 0;
  }
  .ico__key { padding-left: calc(64 * var(--u)); }
  .ico__key-mark { left: calc((var(--dx) + 64) * var(--u)); }
  .ico__ft-count { grid-area: 3 / 1; padding-left: 0; border-left: 0 !important; }
  .ico__ft-brand { grid-area: 3 / 2; justify-self: end; border-left: 0 !important; }

  /* ---- Preloader: the lockup stacks, centred --------------------------
     Sized from the overlay (container units), so a classic scrollbar never
     pushes it off centre; the height term keeps a short window from
     clipping it, and `safe` keeps its top edge reachable regardless. */
  .pre__stage[data-stage] { --u: min(calc(100cqw / 1000), calc(100cqh / 1100)); }
  .pre__stage {
    inset: 0;
    left: 0;
    top: 0;
    width: auto;
    height: auto;
    display: grid;
    grid-template-areas: "top" "ho" "words" "bottom";
    justify-items: center;
    align-content: safe center;
    row-gap: calc(48 * var(--u));
    padding: 24px;
    transform: none;
    text-align: center;
  }
  .pre__meta, .pre__ho, .pre__words { position: static; }
  .pre__meta--top { grid-area: top; }
  .pre__ho { grid-area: ho; }
  .pre__words { grid-area: words; }
  .pre__meta--bottom { grid-area: bottom; }
  .pre__meta p { line-height: max(calc(45 * var(--u)), 1.3em); }
  .pre__sub { line-height: max(calc(30 * var(--u)), 1.3em); }
  .pre__tag { line-height: max(calc(27 * var(--u)), 1.3em); }
  .pre__name { margin-inline: auto; }
  .pre__sub, .pre__tag { margin-inline: auto; }
}

/* Phone landscape (and any short window in the flowing range): the marks
   and the words sit side by side, as on the artboard, between the meta. */
@media (max-width: 900px) and (max-height: 560px) and (orientation: landscape) {
  .pre__stage[data-stage] { --u: min(calc(100cqw / 1400), calc(100cqh / 720)); }
  .pre__stage {
    grid-template-areas: "top top" "ho words" "bottom bottom";
    grid-template-columns: auto auto;
    justify-content: center;
    align-items: center;
    column-gap: calc(40 * var(--u));
    row-gap: calc(40 * var(--u));
    padding-block: 16px;
  }
  .pre__meta--top, .pre__meta--bottom { justify-self: center; }
  .pre__words { text-align: left; }
  .pre__name, .pre__sub, .pre__tag { margin-inline: 0; }
}

/* ======================================================================== */
/* 600px — phone: one column                                                */
/* ======================================================================== */
@media (max-width: 600px) {
  .shell { padding-inline: calc(18 * var(--u)); }
  .hd__logo svg { width: calc(170 * var(--u)); }
  .hero { font-size: max(33.6px, calc(48 * var(--u))); line-height: 1.15; }
  .ico__title { font-size: max(21.3px, calc(30 * var(--u))); line-height: 1.3; }
  .card--compact { min-height: 0; }

  .ft { grid-template-columns: 1fr; }
  .ft__cell--status { grid-area: auto; padding-left: 0; border-left: 0 !important; }
  .ft__cell--pub, .ft__cell--coords, .ft__cell--brand { grid-area: auto; }
  .ft__cell--coords { grid-template-columns: 1fr; }
  .ft__cell--brand img { margin: 0; }

  /* Home */
  .hero__note br { display: none; }
  .home__latest-body { grid-template-columns: 1fr; }
  .card--featured { padding-left: calc(28 * var(--u)); padding-right: calc(28 * var(--u)); }
  .card--featured .card__body { max-width: none; }
  .legend {
    margin: 0 calc(28 * var(--u));
    padding: calc(12 * var(--u)) 0 calc(24 * var(--u));
    border-left: 0;
    border-top: var(--rule) solid var(--ink);
  }
  .legend__mark { margin-left: calc(-9.2 * var(--u)); }
  .home__cards { grid-template-columns: 1fr; }
  .card__body { -webkit-line-clamp: unset; overflow: visible; }
  .panel { grid-template-columns: 1fr; padding-top: calc(32 * var(--u)); }
  .panel__mark { margin-left: calc(28 * var(--u)); }
  .panel__text { margin-top: calc(24 * var(--u)); padding: 0 calc(28 * var(--u)); border-left: 0; }
  .panel__cta { padding-inline: calc(28 * var(--u)); }

  /* Archivo */
  .arch__hero { grid-template-columns: 1fr; }
  .arch__mark { grid-column: 1; grid-row: auto; width: calc(160 * var(--u)); margin: calc(28 * var(--u)) 0 0; }
  .arch__lede br { display: none; }
  .row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .row__idcol {
    grid-column: 1 / -1;
    grid-row: 1;
    display: flex;
    align-items: center;
    gap: calc(24 * var(--u));
    min-height: 0;
    padding: calc(16 * var(--u)) calc(24 * var(--u)) 0 0;
  }
  .row__mark { position: static; width: calc(90 * var(--u)); height: calc(90 * var(--u)); }
  .row__num { padding-top: 0; }
  .row__textcol { grid-column: 1 / -1; grid-row: 2; padding: calc(8 * var(--u)) calc(21.4 * var(--u)) calc(24 * var(--u)); }
  .row__textcol::before { display: none; }
  .row__body { --row-lh: 1.25em; font-size: max(14.3px, calc(21 * var(--u))); }
  .row__evidence { padding-left: calc(21.4 * var(--u)); padding-bottom: calc(48 * var(--u)); }
  .row__evidence::before { display: none; }
  .row__evidence::after { left: calc(21.4 * var(--u)); right: calc(-100% + 21.4 * var(--u)); }
  .row__source { padding-left: calc(20 * var(--u)); }
  .arch__rail { grid-template-columns: 1fr; }

  /* PREFRAME detail */
  .pf__bar { grid-template-columns: minmax(0, 1fr); row-gap: calc(24 * var(--u)); }
  .pf__bar .pager { grid-template-columns: auto auto auto; justify-content: space-between; }
  .pf__frame {
    --corner: calc(24 * var(--u));
    width: calc(280 * var(--u));
    height: calc(320 * var(--u));
    margin-left: calc(24 * var(--u));
  }
  .pf__orbit { width: calc(228 * var(--u)); height: calc(228 * var(--u)); }
  .pf__glyph { width: calc(220 * var(--u)); height: calc(220 * var(--u)); }
  .pf__scale { width: calc(200 * var(--u)); }
  .pf__axis { left: calc(-12 * var(--u)); right: calc(-12 * var(--u)); }
  .pf__caption { left: calc(100% + 10 * var(--u)); }
  .pf__obs { font-size: max(17.8px, calc(26 * var(--u))); line-height: 1.3; letter-spacing: -.06em; }
  .pf__evidence { grid-template-columns: minmax(0, 1fr); grid-auto-flow: row; }
  .pf__evidence .row__label:first-child, .pf__date, .pf__evidence-label, .pf__verify,
  .pf__evidence .row__src-label, .pf__src { grid-area: auto; }
  .pf__evidence-label, .pf__evidence .row__src-label { margin-top: calc(28 * var(--u)); }

  /* Editorial */
  .ed__top, .ed__bottom { grid-template-columns: 1fr; }
  .ed__top > .ed__col, .ed__bottom > .ed__col, .ed__top > .ed__col:first-of-type {
    min-height: 0;
    margin-block: 0;
    padding: calc(28 * var(--u)) 0 calc(56 * var(--u));
    border-left: 0;
    border-top: var(--rule-strong) solid var(--ink);
  }
  .ed__top > .ed__col:first-of-type { border-top: 0; }
  .ed .xh--bl { left: calc(2.9 * var(--u)); bottom: calc(18 * var(--u)); }
  .ed__step { padding-left: calc(84 * var(--u)); }
  .ed__step::before { left: calc(62 * var(--u)); }
  .ed__step-title { white-space: pre-wrap; }

  /* Iconos */
  .ico__ft { grid-template-columns: 1fr; }
  .ico__ft > * + * { border-left: 0; }
  .ico__ft-text:nth-child(2), .ico__ft-count, .ico__ft-brand { grid-area: auto; justify-self: start; }
  .ico__ft-text, .ico__ft-text:first-child { padding: 0; }
  .ico__keys { grid-row: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; grid-auto-flow: row; row-gap: calc(8 * var(--u)); }
  .ico__ft-brand img { margin-left: 0; }

  [data-stage] { --u: calc(100vw / 640); }
}