@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("/assets/css/barlow-condensed-600.woff2") format("woff2");
}
@font-face {
  font-family: "Barlow Condensed";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/css/barlow-condensed-700.woff2") format("woff2");
}
@font-face {
  font-family: "Source Serif 4";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/assets/css/source-serif-4-400-600.woff2") format("woff2");
}
@font-face {
  font-family: "Source Serif 4";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/css/source-serif-4-400-italic.woff2") format("woff2");
}

:root {
  --cesped: #16402f;
  --cesped-noche: #0f2e22;
  --tiza: #f4f1e8;
  --tiza-apagada: #c9d5c9;
  --papel: #ebe6d8;
  --tinta: #1b211d;
  --gris: #585e56;
  --raya: #cfc7b6;
  --tarjeta: #e0b429;
  --cond: "Barlow Condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --ancho: 74rem;
  --medida: 41rem;
  --lado: clamp(1rem, 4.2vw, 2.75rem);
}

*,
*::before,
*::after { box-sizing: border-box; }

html {
  background: var(--cesped-noche);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

body {
  margin: 0;
  background: var(--tiza);
  color: var(--tinta);
  font-family: var(--serif);
  font-size: 1.0625rem;
  line-height: 1.62;
  overflow-wrap: break-word;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

a {
  color: var(--cesped);
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
}
a:hover {
  color: var(--cesped-noche);
  text-decoration-thickness: 2px;
}
:focus-visible {
  outline: 3px solid var(--cesped);
  outline-offset: 3px;
}
::selection {
  background: var(--tarjeta);
  color: var(--tinta);
}
button { font-family: inherit; }
.marcador { white-space: nowrap; }

.saltar {
  position: absolute;
  left: 1rem;
  top: -5rem;
  z-index: 50;
  padding: .9rem 1.1rem;
  background: var(--tiza);
  color: var(--cesped);
  font: 600 1.1rem/1 var(--cond);
}
.saltar:focus { top: 1rem; }

/* cabecera */
.mancheta {
  position: relative;
  background: var(--cesped);
  color: var(--tiza);
}
/* con el menú abierto, la cabecera queda por encima del velo; con el índice abierto, debajo */
.mancheta--abierta { z-index: 35; }
.mancheta__inner {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 0 1rem;
  max-width: var(--ancho);
  margin: 0 auto;
  padding: .55rem var(--lado) .7rem;
}
.mancheta__marca {
  justify-self: start;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--tiza);
  font: 700 1.85rem/1.1 var(--cond);
  letter-spacing: -.005em;
  text-decoration: none;
}
.mancheta__marca:hover {
  color: var(--tiza);
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: .14em;
}
.mancheta__lema {
  grid-column: 1 / -1;
  margin: -.1rem 0 0;
  color: var(--tiza-apagada);
  font-size: .98rem;
  font-style: italic;
  line-height: 1.3;
}
.mancheta__boton {
  grid-column: 2;
  grid-row: 1;
  display: none;
  align-items: center;
  gap: .55rem;
  min-height: 44px;
  margin: 0;
  padding: 0 .1rem 0 .8rem;
  border: 0;
  background: transparent;
  color: var(--tiza);
  font: 600 1.2rem/1 var(--cond);
  cursor: pointer;
}
.mancheta__boton::after,
.post__indice::after {
  content: "";
  width: .55rem;
  height: .55rem;
  margin-top: -.3rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
}
.mancheta__boton[aria-expanded="true"]::after,
.post__indice[aria-expanded="true"]::after {
  margin-top: .3rem;
  transform: rotate(-135deg);
}
.mancheta__nav { grid-column: 1 / -1; }
.mancheta__nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0 1.1rem;
  margin: .35rem 0 0;
  padding: 0;
  list-style: none;
}
.mancheta__nav a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--tiza);
  font: 600 1.15rem/1.1 var(--cond);
  text-decoration: none;
}
.mancheta__nav a:hover {
  color: var(--tiza);
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: .32em;
}
.mancheta__nav a[aria-current="page"] {
  text-decoration: underline;
  text-decoration-color: var(--tarjeta);
  text-decoration-thickness: 3px;
  text-underline-offset: .32em;
}
.mancheta :focus-visible,
.contraportada :focus-visible { outline-color: var(--tarjeta); }

/* velo detrás del menú y del índice abiertos en el móvil */
.velo {
  position: fixed;
  inset: 0;
  z-index: 30;
  background: rgba(15, 46, 34, .45);
}

.contenedor {
  max-width: var(--ancho);
  margin: 0 auto;
  padding-inline: var(--lado);
}

/* migas */
.migas {
  padding-top: .9rem;
  color: var(--gris);
  font: 600 1.05rem/1.3 var(--cond);
}
.migas ol {
  display: flex;
  flex-wrap: wrap;
  gap: 0 .45rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.migas li + li::before {
  content: "›";
  margin-right: .45rem;
}
.migas a,
.migas span {
  display: inline-block;
  padding: .7rem 0;
}

/* artículo y páginas interiores */
.pagina__rejilla {
  display: grid;
  gap: 3.4rem;
  padding-block: .3rem 4.5rem;
}
.post { min-width: 0; }
.post__cabecera {
  max-width: 46rem;
  margin-bottom: 2rem;
}
.post__title {
  margin: .35rem 0 .75rem;
  color: var(--cesped);
  font: 700 clamp(2.3rem, 1.45rem + 3.3vw, 3.5rem)/1.14 var(--cond);
  letter-spacing: -.01em;
  text-wrap: balance;
}
.post__fechas {
  margin: 0;
  color: var(--gris);
  font: 600 1.05rem/1.35 var(--cond);
}
.post__indice {
  display: none;
  align-items: center;
  gap: .6rem;
  min-height: 44px;
  margin: 1rem 0 0;
  padding: 0 1rem;
  border: 1px solid var(--cesped);
  border-radius: 2px;
  background: transparent;
  color: var(--cesped);
  font: 600 1.15rem/1 var(--cond);
  cursor: pointer;
}
.post__cuerpo > * { max-width: var(--medida); }
.post__cuerpo > .figura--ancha,
.post__cuerpo > .estadillo--apilado { max-width: none; }
.post__cuerpo .entradilla {
  font-size: 1.14em;
  line-height: 1.52;
}
.post__cuerpo p,
.post__cuerpo ul,
.post__cuerpo ol { margin: 0 0 1.1em; }
.post__cuerpo ul,
.post__cuerpo ol { padding-left: 1.35em; }
.post__cuerpo li {
  margin-bottom: .5em;
  padding-left: .3em;
}
.post__cuerpo ul > li::marker { color: var(--cesped); }
.post__cuerpo ol > li::marker {
  color: var(--cesped);
  font-family: var(--cond);
  font-weight: 700;
}
.post__cuerpo h2 {
  margin: 2.9rem 0 .75rem;
  color: var(--cesped);
  font: 700 clamp(1.75rem, 1.4rem + 1.1vw, 2.2rem)/1.22 var(--cond);
  letter-spacing: -.005em;
  text-wrap: balance;
  scroll-margin-top: 1.2rem;
}
.post__cuerpo h3 {
  margin: 2rem 0 .45rem;
  color: var(--tinta);
  font: 600 1.45rem/1.25 var(--cond);
}
.post__cuerpo h2 + h3 { margin-top: 1rem; }

/* figuras y esquemas */
.figura { margin: 2.2rem 0 2.5rem; }
.figura--ancha img { width: 100%; }
.figura--estrecha { max-width: 32.3rem; }
.figura figcaption {
  max-width: var(--medida);
  margin-top: .65rem;
  color: var(--gris);
  font-size: max(1rem, .9em);
  font-style: italic;
  line-height: 1.45;
}
.figura__credito {
  display: block;
  margin-top: .15rem;
  font: 600 .98em/1.35 var(--cond);
  font-style: normal;
}
.esquema svg {
  display: block;
  width: 100%;
  height: auto;
}
.esquema--campo,
.esquema--suelas { max-width: var(--medida); }
.esquema svg.esquema__ancho { display: none; }
.esquema svg.esquema__alto { max-width: 22rem; }
.esquema--bloque { max-width: 26rem; }
.esquema--tabla { max-width: 23rem; }
.esquema__pareja {
  display: grid;
  gap: 1.1rem 1.4rem;
}
.esquema__rotulo {
  display: block;
  margin: 0 0 .3rem;
  color: var(--cesped);
  font: 700 1.2rem/1.2 var(--cond);
}
/* fotos y esquemas estrechos: con sitio en la columna, el pie va al lado y no debajo */
.post__cuerpo { container-type: inline-size; }
@container (min-width: 47rem) {
  .figura--estrecha,
  .esquema--bloque,
  .esquema--tabla {
    display: grid;
    grid-template-columns: var(--hueco, 32.3rem) minmax(0, 1fr);
    align-items: end;
    gap: 0 1.6rem;
    max-width: none;
  }
  .esquema--bloque { --hueco: 26rem; }
  .esquema--tabla { --hueco: 23rem; }
  .figura--estrecha figcaption,
  .esquema--bloque figcaption,
  .esquema--tabla figcaption {
    margin: 0;
    padding-bottom: .15rem;
  }
}
.rot { font-family: var(--cond); font-weight: 600; }
.rot--cota { font-size: 38px; }
.rot--cota-bloque { font-size: 30px; font-weight: 700; }
.rot--leyenda { font-size: 25px; }
.rot--sigla { font-size: 30px; font-weight: 700; }
.rot--fila { font-size: 17px; }
.rot--zona { font-size: 18px; }

/* tablas (estadillos): todas con el mismo formato; las de cuatro columnas o más se apilan en móvil */
.estadillo {
  margin: 2rem 0 2.4rem;
  overflow-x: auto;
}
.estadillo table {
  width: 100%;
  border-collapse: collapse;
  font-size: max(1rem, .92em);
  line-height: 1.45;
}
.estadillo caption {
  margin: 0 0 .7rem;
  color: var(--cesped);
  font: 700 1.3rem/1.25 var(--cond);
  text-align: left;
}
.estadillo th,
.estadillo td {
  padding: .65rem 1.1rem .65rem 0;
  border-bottom: 1px solid var(--raya);
  text-align: left;
  vertical-align: top;
}
.estadillo th:last-child,
.estadillo td:last-child { padding-right: 0; }
.estadillo thead th {
  padding-top: 0;
  padding-bottom: .45rem;
  border-bottom: 2px solid var(--tinta);
  color: var(--gris);
  font: 600 1.02rem/1.25 var(--cond);
  vertical-align: bottom;
}
.estadillo tbody th {
  color: var(--tinta);
  font: 600 1.12rem/1.3 var(--cond);
}
.estadillo .cifra {
  text-align: right;
  font-variant-numeric: lining-nums tabular-nums;
}

/* columna lateral */
.lateral__label,
.sumario__label {
  margin: 0 0 .3rem;
  color: var(--cesped);
  font: 700 1.4rem/1.2 var(--cond);
}
.lateral__lista {
  margin: 0;
  padding: 0;
  list-style: none;
}
.lateral__lista li { margin: 0 0 .8rem; }
.lateral__lista a {
  display: flex;
  align-items: flex-end;
  min-height: 44px;
  padding: .5rem 0 .1rem;
  color: var(--tinta);
  font: 600 1.22rem/1.2 var(--cond);
  text-decoration: none;
}
.lateral__lista a:hover {
  color: var(--cesped);
  text-decoration: underline;
  text-underline-offset: .14em;
}
.lateral__fecha {
  display: block;
  margin-top: .1rem;
  color: var(--gris);
  font: 600 1.05rem/1.35 var(--cond);
}
.sumario { margin-top: 2.6rem; }
.sumario__cabeza {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.sumario__cerrar {
  display: none;
  align-items: center;
  min-height: 44px;
  padding: 0 .2rem 0 .8rem;
  border: 0;
  background: transparent;
  color: var(--cesped);
  font: 600 1.15rem/1 var(--cond);
  text-decoration: underline;
  text-underline-offset: .2em;
  cursor: pointer;
}
.sumario__lista {
  margin: 0;
  padding: 0 0 0 1.5rem;
}
.sumario__lista li::marker {
  color: var(--gris);
  font: 600 1.05rem var(--cond);
}
.sumario__lista a {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: .3rem 0;
  color: var(--tinta);
  font: 600 1.15rem/1.25 var(--cond);
  text-decoration: none;
}
.sumario__lista a:hover {
  color: var(--cesped);
  text-decoration: underline;
  text-underline-offset: .14em;
}

/* portada */
.primera-plana__cabecera {
  display: grid;
  gap: 1rem 3rem;
  padding-block: 1.8rem 2.3rem;
}
.primera-plana__titulo {
  max-width: 16ch;
  text-wrap: balance;
  margin: 0;
  color: var(--cesped);
  font: 700 clamp(2.5rem, 1.3rem + 4.2vw, 4.4rem)/1.14 var(--cond);
  letter-spacing: -.012em;
}
.primera-plana__entradilla {
  max-width: 34rem;
  margin: 0;
  font-size: 1.14em;
  line-height: 1.52;
}
.primera-plana__fecha {
  margin: .8rem 0 0;
  color: var(--gris);
  font: 600 1.05rem/1.35 var(--cond);
}
.primera-plana__fecha span { white-space: nowrap; }
.apertura {
  position: relative;
  display: grid;
  gap: 1.2rem 3rem;
  padding-bottom: 3.6rem;
}
.apertura__foto img { width: 100%; }
.apertura__titulo {
  margin: 0 0 .5rem;
  font: 700 clamp(1.95rem, 1.35rem + 2vw, 2.8rem)/1.2 var(--cond);
  letter-spacing: -.008em;
  text-wrap: balance;
}
.apertura__titulo a,
.pieza__titulo a {
  display: block;
  min-height: 44px;
  padding-block: .1rem;
  color: var(--cesped-noche);
  text-decoration: none;
}
/* toda la pieza abre el artículo: el enlace del titular se extiende sobre la foto y el texto */
.apertura__titulo a::after,
.pieza__titulo a::after {
  content: "";
  position: absolute;
  inset: 0;
}
.apertura__titulo a:hover,
.pieza__titulo a:hover {
  color: var(--cesped);
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: .12em;
}
.apertura__meta,
.pieza__meta {
  margin: 0 0 .7rem;
  color: var(--gris);
  font: 600 1.05rem/1.35 var(--cond);
}
.apertura__resumen {
  margin: 0;
  font-size: 1.06em;
}
.anteriores__label {
  margin: 0 0 1.3rem;
  color: var(--cesped);
  font: 700 1.7rem/1.2 var(--cond);
}
.anteriores__lista {
  margin: 0;
  padding: 0;
  list-style: none;
}
.pieza {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  align-items: start;
  gap: .9rem 1rem;
  margin-bottom: 2.4rem;
}
.pieza > img {
  grid-column: 1;
  grid-row: 1;
  width: 100%;
}
.pieza__texto {
  grid-column: 2;
  grid-row: 1;
}
.pieza__titulo {
  margin: 0 0 .25rem;
  font: 700 clamp(1.45rem, 1.25rem + .9vw, 1.95rem)/1.2 var(--cond);
  text-wrap: balance;
}
.pieza__meta { margin: 0; }
.pieza__resumen {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 0;
}
.primera-plana__resto { padding-bottom: 4.5rem; }
.primera-plana__cierre {
  max-width: 36rem;
  padding-top: .6rem;
}
.primera-plana__archivo {
  max-width: 26rem;
  margin: 0 0 1.5rem;
}
.primera-plana__archivo img { width: 100%; }
.primera-plana__nota {
  margin: 0;
  font-style: italic;
}

/* 404 */
.perdido {
  max-width: 38rem;
  padding-block: 2.5rem 5.5rem;
}
.perdido__dibujo {
  display: block;
  width: min(100%, 17rem);
  height: auto;
  margin-bottom: 1.2rem;
}
.perdido h1 {
  margin: 0 0 1rem;
  color: var(--cesped);
  font: 700 clamp(3rem, 2rem + 4vw, 4.8rem)/1.14 var(--cond);
}
.perdido p { margin: 0 0 1rem; font-size: 1.14em; line-height: 1.52; }
.perdido__lista {
  margin: .2rem 0 0;
  padding: 0;
  list-style: none;
}
.perdido__lista li { margin-bottom: .35rem; }
.perdido__lista a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding-block: .2rem;
  font: 600 1.3rem/1.2 var(--cond);
}

/* pie */
.contraportada {
  background: var(--cesped-noche);
  color: var(--tiza);
}
.contraportada__inner {
  display: grid;
  gap: .2rem 3rem;
  max-width: var(--ancho);
  margin: 0 auto;
  padding: 2.6rem var(--lado) 2.4rem;
}
.contraportada__marca {
  margin: 0 0 .4rem;
  font: 700 1.5rem/1.2 var(--cond);
}
.contraportada p { margin: 0; }
.contraportada a { color: var(--tiza); }
.contraportada a:hover { color: var(--tiza); }
.contraportada a[aria-current="page"] {
  text-decoration-color: var(--tarjeta);
  text-decoration-thickness: 2px;
}
.contraportada__correo a,
.contraportada__enlaces a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font: 600 1.15rem/1.3 var(--cond);
}
.contraportada__enlaces {
  display: flex;
  flex-direction: column;
  margin: .4rem 0 .2rem;
  padding: 0;
  list-style: none;
}
.contraportada__copy {
  padding-top: .5rem;
  color: var(--tiza-apagada);
  font-size: 1rem;
}

/* hasta 37.99em: móvil */
@media (max-width: 37.99em) {
  .interactivo .mancheta__boton { display: inline-flex; }
  .interactivo .mancheta__nav { display: none; }
  .interactivo .mancheta--abierta .mancheta__nav { display: block; }
  .mancheta__nav ul {
    flex-direction: column;
    padding-bottom: .4rem;
  }
  .mancheta__nav a { font-size: 1.3rem; }
  /* cabecera oculta a la vista, no a los lectores de pantalla */
  .estadillo--apilado thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
  }
  .estadillo--apilado thead tr,
  .estadillo--apilado thead th {
    display: block;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    overflow: hidden;
  }
  .estadillo--apilado tr {
    display: block;
    padding: .75rem 0 .65rem;
    border-bottom: 1px solid var(--raya);
  }
  .estadillo--apilado tbody th,
  .estadillo--apilado td {
    display: block;
    padding: .1rem 0;
    border: 0;
  }
  .estadillo--apilado tbody th { margin-bottom: .15rem; }
  .estadillo--apilado td[data-label]::before {
    content: attr(data-label) ": ";
    color: var(--gris);
    font: 600 1.02rem/1 var(--cond);
  }
}

/* hasta 56.99em: el índice del artículo se abre desde un botón */
@media (max-width: 56.99em) {
  .interactivo .post__indice { display: inline-flex; }
  .interactivo .sumario { display: none; }
  .interactivo .sumario.sumario--abierto {
    display: block;
    position: fixed;
    z-index: 40;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: min(80vh, 36rem);
    overflow-y: auto;
    margin: 0;
    padding: .5rem var(--lado) calc(1.2rem + env(safe-area-inset-bottom, 0px));
    background: var(--tiza);
    box-shadow: 0 -.4rem 1.6rem rgba(15, 46, 34, .25);
  }
  .interactivo .sumario__cerrar { display: inline-flex; }
}

@media (min-width: 38em) {
  body { font-size: 1.125rem; }
  .mancheta__inner {
    grid-template-columns: auto 1fr;
    padding-block: .95rem .35rem;
  }
  .mancheta__marca { font-size: 2.2rem; }
  .mancheta__nav ul { gap: 0 1.3rem; }
  .esquema__pareja { grid-template-columns: 1fr 1fr; }
  .esquema svg.esquema__ancho { display: block; }
  .esquema svg.esquema__alto { display: none; }
  .pieza {
    grid-template-columns: minmax(0, 4fr) minmax(0, 7fr);
    grid-template-rows: auto 1fr;
    gap: 0 2rem;
  }
  .pieza > img { grid-row: 1 / span 2; }
  .pieza__meta { margin-bottom: .55rem; }
  .pieza__resumen { grid-column: 2; }
  .contraportada__inner { grid-template-columns: 1fr auto; }
  .contraportada__marca,
  .contraportada__correo { grid-column: 1; }
  .contraportada__enlaces {
    grid-column: 2;
    grid-row: 1 / span 3;
    align-self: start;
    display: grid;
    grid-template-columns: auto auto;
    gap: 0 1.6rem;
    margin: 0;
  }
  .contraportada__copy { grid-column: 1; }
}

@media (min-width: 57em) {
  body { font-size: 1.1875rem; }
  .mancheta__inner { padding-block: 1.3rem .45rem; }
  .mancheta__marca { font-size: 2.55rem; }
  .pagina__rejilla {
    grid-template-columns: minmax(0, 1fr) 15.5rem;
    gap: clamp(3rem, 6vw, 5.5rem);
  }
  .lateral > :last-child {
    position: sticky;
    top: 1.5rem;
  }
  .lateral__nav { padding-top: .5rem; }
  .primera-plana__cabecera {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    align-items: end;
    padding-block: 2.8rem 3rem;
  }
  .apertura {
    grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
    align-items: center;
    padding-bottom: 4.4rem;
  }
  .primera-plana__resto {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 15.5rem;
    gap: clamp(3rem, 6vw, 5.5rem);
  }
  .primera-plana__cierre {
    position: sticky;
    top: 1.5rem;
    align-self: start;
    margin-top: 3.4rem;
    padding-top: 0;
  }
}

@media (min-width: 78em) {
  .mancheta__inner {
    align-items: end;
    padding-block: 1.6rem 1rem;
  }
  .mancheta__lema { grid-column: 1; grid-row: 2; }
  .mancheta__nav {
    grid-column: 2;
    grid-row: 1 / span 2;
    justify-self: end;
  }
  .mancheta__nav ul { margin: 0; gap: 0 1.4rem; }
}

@media print {
  .mancheta__nav, .mancheta__boton, .lateral, .saltar, .post__indice { display: none; }
  .mancheta, .contraportada { background: none; color: #000; }
  .mancheta__marca, .mancheta__lema { color: #000; }
  a { color: #000; }
}
