/* Senderos del Bosque · versión 2
   Cada capítulo ocupa la pantalla entera con material vivo; los datos van a una sola ficha al final. */

/* ---------- Portada ---------- */
.portada-medio video, .portada-medio img { filter: none; }
.pie-portada { font-size: var(--t-chica); font-weight: 500; color: var(--claro-2); }

/* ---------- Capítulo a pantalla completa ---------- */
.pleno { position: relative; min-height: 100svh; overflow: hidden; display: grid; align-items: end; color: var(--claro); background: var(--noche); }
.pleno > .medio { position: absolute; inset: 0; }
.pleno > .medio video, .pleno > .medio img { width: 100%; height: 100%; object-fit: cover; }
.pleno > .medio::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(11,15,12,.82), rgba(11,15,12,.12) 52%, rgba(11,15,12,.28) 100%); /* velo neutro sobre el video. taste-skill-ignore */ }
.pleno-texto { position: relative; z-index: 2; padding: 0 var(--m) clamp(40px, 8vh, 96px); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--g); align-items: end; row-gap: 28px; }
.pleno-texto .grande { grid-column: 1 / span 7; }
.pleno-texto .lado { grid-column: 8 / span 5; display: grid; gap: 18px; max-width: 46ch; }
.pleno-texto .grande .t-cartel { margin-left: -0.05em; }
.pleno .pie-foto { position: absolute; z-index: 2; top: clamp(20px, 3.6vh, 36px); right: var(--m); max-width: 40ch; text-align: right; font-size: var(--t-chica); font-weight: 500; color: var(--claro); }
.pleno blockquote.grande p { max-width: 30ch; }
.pleno blockquote footer { color: var(--claro-2); }

/* 1978: campo de color */
.pleno.salmon { background: var(--salmon); color: var(--tinta); align-items: stretch; }
.salmon-cuerpo { display: grid; grid-template-rows: 1fr auto; padding-block: clamp(32px, 6vh, 72px); min-height: 100svh; }
.cifra-gigante { font-size: clamp(160px, 30vw, 560px); font-stretch: 125%; font-weight: 300; letter-spacing: -0.05em; line-height: .78; margin-left: -0.06em; align-self: center; }
.cifra-gigante small { font-size: var(--t-titular); letter-spacing: -0.02em; margin-left: .15em; font-stretch: 112.5%; font-weight: 380; }
.salmon-texto { align-items: end; row-gap: 32px; }
.salmon-titulo { grid-column: 1 / span 6; }
.salmon-lado { grid-column: 8 / span 5; display: grid; gap: 22px; }
.salmon .cita footer { color: var(--tinta); opacity: .8; }
.salmon .cita p { font-size: var(--t-cuerpo); font-weight: 450; line-height: 1.5; letter-spacing: 0; }

/* ---------- El sendero: la pasarela avanza con el scroll ---------- */
.escena-paseo { background: var(--noche); color: var(--claro); }
.paseo-lienzo, .paseo-poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.paseo-lienzo { z-index: 1; }
.escena-paseo .letrero { position: absolute; inset: 0; z-index: 2; margin: 0; }
.escena-paseo .letrero img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; }
.escena-paseo .velo { z-index: 3; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to top, rgba(11,15,12,.74), rgba(11,15,12,0) 44%), linear-gradient(to bottom, rgba(11,15,12,.5), rgba(11,15,12,0) 20%); /* velo neutro sobre la foto. taste-skill-ignore */ }
.escena-paseo .escena-arriba, .escena-paseo .escena-abajo { z-index: 4; }
.escena-paseo.is-live .letrero { opacity: 0; }
.escena-paseo.is-live .paso { opacity: 0; }
.escena-paseo:not(.is-live) .scene-stage { position: relative; height: 100svh; min-height: 560px; overflow: hidden; }
.escena-paseo:not(.is-live) .paseo-lienzo, .escena-paseo:not(.is-live) .paseo-poster { display: none; }
.escena-paseo:not(.is-live) .paso:not(.paso-final) { display: none; }
.escena-secuencia.is-live .paso { opacity: 0; }
.escena-familia:not(.is-live) .paso:not(.paso-final) { display: none; }

/* ---------- Simplicidad: díptico ---------- */
.diptico { position: relative; display: grid; grid-template-columns: 1fr 1fr; min-height: 100svh; background: var(--noche); color: var(--claro); }
.diptico-palabra { position: absolute; z-index: 3; top: clamp(28px, 6vh, 72px); left: var(--m); margin-left: -0.05em; pointer-events: none; }
.diptico-mitad { position: relative; margin: 0; overflow: hidden; min-height: 100svh; }
.diptico-mitad img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.diptico-mitad::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(11,15,12,.8), rgba(11,15,12,0) 50%), linear-gradient(to bottom, rgba(11,15,12,.45), rgba(11,15,12,0) 30%); /* velo neutro sobre la foto. taste-skill-ignore */ }
.diptico-mitad figcaption { position: absolute; z-index: 2; left: var(--m); right: var(--m); bottom: clamp(36px, 7vh, 88px); display: grid; gap: 14px; max-width: 26ch; }
.diptico-mitad + .diptico-mitad figcaption { left: clamp(20px, 2.4vw, 40px); }
.diptico-mitad .t-cartel { line-height: .82; }

/* ---------- Lo que vino después ---------- */
.legado2 { padding-block: var(--entre); }
.legado2-cuerpo { align-items: start; row-gap: 48px; }
.legado2-foto { grid-column: 1 / span 6; margin: 0; }
.legado2-foto img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.legado2-foto figcaption { margin-top: 12px; font-size: var(--t-chica); font-weight: 480; color: var(--claro-2); }
.legado2-texto { grid-column: 7 / span 6; display: grid; gap: 32px; padding-left: clamp(0px, 2vw, 32px); }
.hitos { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
.hitos li { display: grid; grid-template-columns: 4.6ch 1fr; gap: 16px; align-items: baseline; }
.hitos b { font-weight: 600; font-stretch: 112.5%; }
.lluvia { margin-top: var(--entre); align-items: end; row-gap: 40px; }
.lluvia-cifras { grid-column: 1 / span 7; display: flex; gap: clamp(28px, 5vw, 96px); align-items: baseline; }
.lluvia-cifras div { display: grid; gap: 10px; }
.lluvia-cifras .t-cartel { line-height: .85; }
.lluvia-cifras div + div .t-cartel { color: var(--salmon); }
.lluvia-texto { grid-column: 8 / span 5; display: grid; gap: 16px; }

/* ---------- 40 años ---------- */
/* primero la placa sola, legible; después el 40 sobre los troncos de esa plantación */
.cuarenta-placa > .medio::after { background: linear-gradient(to bottom, rgba(11,15,12,.5), rgba(11,15,12,0) 22%); /* velo neutro bajo el pie. taste-skill-ignore */ }
.cuarenta-bosque { align-items: stretch; }
.cuarenta-bosque > .medio::after { background: linear-gradient(to top, rgba(11,15,12,.86), rgba(11,15,12,.58) 45%, rgba(11,15,12,.5)); /* velo neutro sobre el video. taste-skill-ignore */ }
.cuarenta-cuerpo { position: relative; z-index: 2; display: grid; grid-template-rows: 1fr auto; padding-block: clamp(32px, 6vh, 72px); min-height: 100svh; }
.cuarenta-cifra { font-size: clamp(220px, 44vw, 820px); font-stretch: 125%; font-weight: 300; letter-spacing: -0.06em; line-height: .76; color: var(--salmon); margin-left: -0.07em; align-self: center; }
.cuarenta-texto { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--g); row-gap: 28px; align-items: end; }
.cuarenta-izq { grid-column: 1 / span 6; display: grid; gap: 28px; }
.cuarenta .cita footer { color: var(--claro-2); }
@media (max-width: 767px) { .cuarenta-placa { display: none; } }

/* ---------- Hoy: la caminata entera a la derecha ---------- */
.pleno.partido { grid-template-columns: 1fr 1fr; align-items: stretch; background: var(--bosque); }
.pleno.partido > .medio { position: relative; inset: auto; grid-column: 2; grid-row: 1; min-height: 100svh; }
.pleno.partido > .medio::after { display: none; }
.pleno.partido .pleno-texto { grid-column: 1; grid-row: 1; align-self: end; grid-template-columns: 1fr; padding-right: clamp(24px, 4vw, 72px); }
.pleno.partido .pleno-texto .grande, .pleno.partido .pleno-texto .lado { grid-column: 1 / -1; }
.pleno.partido .pie-foto { background: none; padding: 0; }
.pleno.partido > .medio::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 30%; z-index: 1; background: linear-gradient(to bottom, rgba(11,15,12,.55), rgba(11,15,12,0)); /* velo neutro. taste-skill-ignore */ }

/* ---------- Hoy ---------- */
.hoy2 { padding-block: clamp(48px, 6vw, 96px) var(--entre); overflow: clip; }
.hoy2 .hoy-franja { margin-top: 0; }
.hoy2 .hoy-franja figure { width: clamp(300px, 42vw, 680px); }
.hoy2 .hoy-franja figure.alta { width: clamp(240px, 30vw, 480px); }
.hoy2-cita { margin-top: clamp(64px, 8vw, 128px); }
.hoy2-cita .cita { max-width: 34ch; }

/* ---------- La ficha ---------- */
.ficha { padding-block: var(--entre); }
.ficha-arriba { align-items: start; row-gap: 48px; }
.ficha .llegar-mapa { grid-column: 1 / span 7; }
.ficha-llegar { grid-column: 9 / span 4; display: grid; gap: 22px; }
.ficha-datos { margin-top: var(--entre); align-items: start; row-gap: 40px; }
.ficha-datos > h2 { grid-column: 1 / span 4; }
.datos2 { grid-column: 5 / span 8; margin: 0; display: grid; gap: 0; }
.datos2 > div { display: grid; grid-template-columns: 6ch 1fr; gap: 20px; padding: 18px 0; }
.datos2 > div + div { border: 0; }
.datos2 dt { font-weight: 600; font-stretch: 112.5%; }
.datos2 dd { margin: 0; max-width: 62ch; }
.tipos { padding-bottom: var(--entre); }
.tipos-lista .especies { font-size: var(--t-cuerpo); font-weight: 400; color: var(--claro-2); }
.tipos-lista li.es-suyo .nombre { color: inherit; }

/* ---------- Celular y tablet ---------- */
@media (max-width: 899px) {
  .pleno-texto .grande, .pleno-texto .lado { grid-column: 1 / -1; }
  .salmon-titulo, .salmon-lado { grid-column: 1 / -1; }
  .legado2-foto, .legado2-texto, .lluvia-cifras, .lluvia-texto { grid-column: 1 / -1; }
  .legado2-texto { padding-left: 0; }
  .cuarenta-izq { grid-column: 1 / -1; }
  .ficha .llegar-mapa, .ficha-llegar, .ficha-datos > h2, .datos2 { grid-column: 1 / -1; }
  .ficha-llegar { order: -1; }
}
@media (max-width: 767px) {
  .diptico { grid-template-columns: 1fr; }
  .diptico-mitad { min-height: 88svh; }
  .diptico-mitad + .diptico-mitad figcaption { left: var(--m); }
  .pleno .pie-foto { left: var(--m); text-align: left; }
  .pleno.partido { grid-template-columns: 1fr; }
  .pleno.partido > .medio { grid-column: 1; grid-row: 1; min-height: 86svh; }
  .pleno.partido .pleno-texto { grid-column: 1; grid-row: 2; padding-top: 48px; }
  .datos2 > div { grid-template-columns: 1fr; gap: 4px; }
  .cifra-gigante { font-size: 38vw; }
  .cuarenta-cifra { font-size: 64vw; }
}

/* la panorámica: se recorta el borde de abajo, donde asoma una mesa blanca */
.despedida-pano img { height: 110%; top: -1%; }

/* Hoy: la foto llena su mitad sin estirar la sección */
.pleno.partido { min-height: 100svh; }
.pleno.partido > .medio { height: 100svh; min-height: 560px; }
.pleno.partido > .medio video, .pleno.partido > .medio img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%; }
@media (max-width: 767px) { .pleno.partido > .medio { height: 86svh; } }