/* ernestoosuna.com · bajo las puertas (versión 13, 10 oct 2026): la frase, el dossier de prensa y el contacto.
   Un solo hilo: desde la portada aparecen al plegar las puertas; desde el paisaje, bajo la tierra.
   Papel, tinta y azul hondo. Filetes finos en lugar de cajas; los objetos, grandes y sueltos sobre el papel. */

#contenido { position: relative; z-index: 3; }
body.desplegando #contenido { display: none; }
/* en el paisaje el dossier sale de la tierra: el papel sube sobre ella */
body.escena #contenido::before { content: ''; position: absolute; left: 0; right: 0; top: -140px; height: 140px; background: linear-gradient(rgba(250, 248, 244, 0), var(--papel)); pointer-events: none; }
.seccion { position: relative; background: var(--papel); color: var(--tinta); }
.seccion__dentro { width: var(--columna); margin: 0 auto; }
.visualmente-oculto { position: absolute !important; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.antetitulo { display: flex; align-items: baseline; gap: 14px; margin: 0 0 clamp(26px, 4.5vh, 48px); font: 600 11.5px/1 var(--fuente-texto); letter-spacing: 0.22em; text-transform: uppercase; color: var(--tinta-suave); }
.antetitulo::after { content: ''; flex: 1; height: 1px; background: var(--filete); transform: translateY(-3px); }
.kit__titulo { display: flex; align-items: baseline; gap: 14px; margin: 0 0 clamp(26px, 4vh, 44px); font: 600 11.5px/1 var(--fuente-texto); letter-spacing: 0.22em; text-transform: uppercase; color: var(--azul-hondo); }
.kit__titulo::after { content: ''; flex: 1; height: 1px; background: var(--filete); transform: translateY(-3px); }

/* ---------- la frase: donde estaban las puertas ---------- */
#tesis { min-height: 100vh; display: grid; align-content: center; padding: 14vh 0 12vh; text-align: center; }
body.escena #tesis { display: none; }
.tesis__frase { margin: 0 auto; max-width: 14.5em; font-family: var(--fuente-titulo); font-weight: 400; font-size: clamp(36px, 0.9rem + 4.7vw, 98px); line-height: 1.0; letter-spacing: -0.036em; font-variation-settings: "opsz" 144, "SOFT" 0, "WONK" 0; color: var(--azul-hondo); text-wrap: balance; }
.tesis__casas { margin: clamp(24px, 4.5vh, 44px) 0 0; font-family: var(--fuente-titulo); font-style: italic; font-weight: 340; font-size: clamp(19px, 1.5vw, 26px); line-height: 1.4; color: var(--tinta); font-variation-settings: "opsz" 36; }
.tesis__casas a { font-style: normal; font-weight: 450; color: var(--azul-hondo); text-decoration: none; border-bottom: 1px solid rgba(15, 42, 87, 0.35); transition: border-color .2s ease; }
.tesis__casas a:hover { border-bottom-color: var(--azul-hondo); }

/* ---------- el dossier ---------- */
#prensa { padding: clamp(70px, 12vh, 140px) 0 clamp(30px, 5vh, 60px); border-top: 1px solid var(--filete); }
body.escena #prensa { border-top: 0; }
.kit__cabeza { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5.5vw, 96px); align-items: start; }
.kit__retrato { margin: 0; }
.kit__retrato img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 30%; }
.kit__nombre { margin: 0; font-family: var(--fuente-titulo); font-weight: 400; font-size: clamp(44px, 1.1rem + 4.4vw, 100px); line-height: 0.94; letter-spacing: -0.04em; font-variation-settings: "opsz" 144, "SOFT" 0, "WONK" 0; color: var(--azul-hondo); text-wrap: balance; }
.kit__descriptor { margin: clamp(16px, 2.6vh, 24px) 0 0; font: 500 15px/1.5 var(--fuente-texto); color: var(--tinta-suave); }
.kit__bio { margin-top: clamp(26px, 4.5vh, 44px); }
.kit__bio p { margin: 0 0 0.85em; max-width: 34em; font-family: var(--fuente-titulo); font-weight: 360; font-size: clamp(18px, 1.28vw, 21.5px); line-height: 1.56; font-variation-settings: "opsz" 14; text-wrap: pretty; }
.kit__acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin: 4px 0 0; }
.kit__mas { padding: 2px 0; border: 0; border-bottom: 1px solid rgba(15, 42, 87, 0.35); background: none; color: var(--azul-hondo); font: 600 13px/1.2 var(--fuente-texto); cursor: pointer; }
.kit__mas:hover { border-bottom-color: var(--azul-hondo); }
.kit__mas .kit__mas-breve { display: none; }
.kit__mas[aria-expanded="true"] .kit__mas-breve { display: inline; }
.kit__mas[aria-expanded="true"] .kit__mas-largo { display: none; }
.copiar { display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border: 1px solid rgba(28, 31, 43, 0.28); border-radius: 999px; background: none; color: var(--tinta); font: 600 11.5px/1 var(--fuente-texto); letter-spacing: 0.06em; cursor: pointer; transition: border-color .2s ease, background-color .2s ease, color .2s ease; }
.copiar:hover { border-color: var(--azul-hondo); color: var(--azul-hondo); }
.copiar.hecho { background: var(--azul-hondo); border-color: var(--azul-hondo); color: #fff; }
.datos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: clamp(30px, 5vh, 52px) 0 0; border-top: 1px solid var(--tinta); }
.datos div { padding: 14px 18px 0 0; }
.datos dt { margin: 0 0 8px; font: 600 10.5px/1.2 var(--fuente-texto); letter-spacing: 0.2em; text-transform: uppercase; color: var(--tinta-suave); }
.datos dd { margin: 0; font: 500 14.5px/1.45 var(--fuente-texto); }

.kit__parte { margin-top: clamp(90px, 15vh, 170px); }

/* la obra: cuatro objetos sobre el papel, del mismo alto de mesa */
.objetos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(24px, 3.4vw, 56px); }
.objeto { display: flex; flex-direction: column; }
.objeto__imagen { display: flex; align-items: flex-end; justify-content: center; height: clamp(190px, 21vw, 310px); margin-bottom: 26px; }
.objeto__imagen img { display: block; max-width: 100%; max-height: 100%; height: auto; object-fit: contain; transition: transform .5s var(--curva); }
.objeto:hover .objeto__imagen img { transform: translateY(-6px); }
.objeto__emblema { width: 72%; filter: drop-shadow(0 18px 22px rgba(43, 79, 138, 0.18)); }
.objeto__figura { filter: drop-shadow(0 22px 26px rgba(28, 31, 43, 0.2)); }
.objeto__maqueta { -webkit-mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, #000 62%, transparent 100%); mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, #000 62%, transparent 100%); mix-blend-mode: multiply; }
.objeto__imagen--marcapaginas { gap: 10%; }
.objeto__imagen--marcapaginas img { max-width: 40%; box-shadow: 0 22px 30px -16px rgba(28, 31, 43, 0.45); }
.objeto__imagen--marcapaginas img:first-child { transform: rotate(-5deg); }
.objeto__imagen--marcapaginas img:last-child { transform: rotate(4deg) translateY(-8px); }
.objeto:hover .objeto__imagen--marcapaginas img:first-child { transform: rotate(-7deg) translateY(-6px); }
.objeto:hover .objeto__imagen--marcapaginas img:last-child { transform: rotate(6deg) translateY(-14px); }
.objeto__nombre { margin: 0; padding-top: 16px; border-top: 1px solid var(--tinta); font-family: var(--fuente-titulo); font-weight: 420; font-size: clamp(22px, 1.75vw, 29px); line-height: 1.1; letter-spacing: -0.014em; font-variation-settings: "opsz" 72; }
.objeto__traduccion { display: block; margin-top: 4px; font-size: 0.55em; letter-spacing: 0; color: var(--tinta-suave); }
.objeto__linea { margin: 12px 0 0; font: 400 15px/1.55 var(--fuente-texto); text-wrap: pretty; }
.objeto__estado { margin: auto 0 0; padding-top: 14px; font: 500 13px/1.4 var(--fuente-texto); color: var(--azul-hondo); }
.objeto__estado a { color: var(--azul-hondo); text-decoration: none; border-bottom: 1px solid rgba(15, 42, 87, 0.35); padding-bottom: 2px; }
.objeto__estado a::after { content: " \2197"; }
.objeto__estado a:hover { border-bottom-color: var(--azul-hondo); }
.objetos__libro { margin: clamp(36px, 6vh, 60px) 0 0; font-family: var(--fuente-titulo); font-style: italic; font-weight: 340; font-size: clamp(18px, 1.4vw, 23px); color: var(--tinta); }
.objetos__libro i { font-style: normal; font-weight: 450; color: var(--azul-hondo); }

/* las charlas: para invitarle */
.charlas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(24px, 3.4vw, 56px); counter-reset: charla; }
.charlas li { counter-increment: charla; padding-top: 16px; border-top: 1px solid var(--tinta); }
.charlas li::before { content: counter(charla, decimal-leading-zero); display: block; margin-bottom: 14px; font: 500 12px/1 var(--fuente-texto); color: var(--tinta-suave); font-variant-numeric: tabular-nums; }
.charlas p { margin: 0; font: 400 15px/1.55 var(--fuente-texto); text-wrap: pretty; }
.charlas .charlas__titulo { margin: 0 0 12px; font-family: var(--fuente-titulo); font-weight: 420; font-size: clamp(24px, 2vw, 34px); line-height: 1.08; letter-spacing: -0.02em; color: var(--azul-hondo); font-variation-settings: "opsz" 96; }
.charlas__formato { margin: clamp(28px, 4.5vh, 44px) 0 0; font: 500 14px/1.6 var(--fuente-texto); color: var(--tinta-suave); }
.charlas__formato a { color: var(--azul-hondo); font-weight: 600; text-decoration: none; border-bottom: 1px solid rgba(15, 42, 87, 0.35); }

/* el material: descargas y textos para copiar */
.kit__material { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5.5vw, 96px); align-items: start; }
.descargas { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--tinta); }
.descargas a { display: flex; align-items: baseline; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--filete); color: var(--tinta); text-decoration: none; font: 500 15px/1.4 var(--fuente-texto); }
.descargas a::after { content: "\2193"; color: var(--azul-hondo); }
.descargas a small { margin-left: auto; font: 500 12px/1 var(--fuente-texto); color: var(--tinta-suave); letter-spacing: 0.04em; }
.descargas a:hover { color: var(--azul-hondo); }
.kit__derechos { margin: 16px 0 0; font: 500 13px/1.5 var(--fuente-texto); color: var(--tinta-suave); }
.descripciones { margin: 0; border-top: 1px solid var(--tinta); }
.descripciones div { padding: 16px 0 18px; border-bottom: 1px solid var(--filete); }
.descripciones dt { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 8px; font-family: var(--fuente-titulo); font-weight: 450; font-size: 20px; letter-spacing: -0.01em; }
.descripciones dd { margin: 0; font: 400 15px/1.55 var(--fuente-texto); text-wrap: pretty; }

/* ---------- los pies: el contacto ---------- */
#contacto { padding: clamp(80px, 14vh, 160px) 0 clamp(40px, 7vh, 72px); }
.rutas { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--tinta); }
.rutas li { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(16px, 4vw, 64px); align-items: baseline; padding: clamp(18px, 2.6vh, 26px) 0; border-bottom: 1px solid var(--filete); }
.rutas__quien { font: 500 15px/1.4 var(--fuente-texto); color: var(--tinta-suave); }
.rutas a { justify-self: start; font-family: var(--fuente-titulo); font-weight: 400; font-size: clamp(26px, 1rem + 2vw, 46px); line-height: 1.05; letter-spacing: -0.024em; color: var(--azul-hondo); text-decoration: none; font-variation-settings: "opsz" 144; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .45s var(--curva); }
.rutas a:hover { background-size: 100% 1px; }
.pie { margin: clamp(48px, 9vh, 96px) 0 0; font: 500 12px/1 var(--fuente-texto); letter-spacing: 0.16em; text-transform: uppercase; color: var(--tinta-suave); }

/* ---------- pantallas medianas y estrechas ---------- */
@media (max-width: 1100px) {
  .objetos { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: clamp(48px, 8vh, 80px); }
  .charlas { grid-template-columns: minmax(0, 1fr); }
  .datos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .datos div:nth-child(n+3) { padding-top: 18px; }
}
@media (max-width: 760px) {
  #tesis { min-height: 88vh; }
  .kit__cabeza, .kit__material { grid-template-columns: minmax(0, 1fr); }
  .kit__retrato { max-width: 72%; }
  .objetos { grid-template-columns: minmax(0, 1fr); }
  .objeto__imagen { height: 240px; }
  .rutas li { grid-template-columns: minmax(0, 1fr); gap: 6px; }
}

/* (15 oct) Obra por escalas, Registro y contacto de una dirección */
.objeto__escala { margin: 0 0 4px; font: 600 11px/1.2 var(--fuente-texto); letter-spacing: 0.18em; text-transform: uppercase; color: var(--tinta-suave); }
.registro { list-style: none; margin: 0; padding: 0; max-width: 44em; }
.registro li { padding: 0.45em 0; border-top: 1px solid rgba(28,31,43,0.12); font-family: var(--fuente-titulo); font-size: clamp(16px, 0.4vw + 0.9rem, 19px); line-height: 1.45; color: var(--tinta); }
.registro li:last-child { border-bottom: 1px solid rgba(28,31,43,0.12); }
.contacto__linea { margin: 0 0 0.5em; font-family: var(--fuente-titulo); font-size: clamp(17px, 0.4vw + 0.95rem, 21px); color: var(--tinta); }

/* (15 oct, noche) el papel bajo el paseo: obra de cinco, charlas en prosa, registro */
#obra, #charlas, #registro { padding: clamp(70px, 12vh, 140px) 0 0; }
#obra { border-top: 1px solid var(--filete); }
.objetos--cinco { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.charlas__texto p { margin: 0 0 0.85em; max-width: 36em; font-family: var(--fuente-titulo); font-weight: 360; font-size: clamp(18px, 1.28vw, 21.5px); line-height: 1.56; font-variation-settings: "opsz" 14; text-wrap: pretty; }
.charlas__texto a { color: var(--azul-hondo); font-weight: 450; text-decoration: none; border-bottom: 1px solid rgba(15, 42, 87, 0.35); }
.charlas__texto a:hover { border-bottom-color: var(--azul-hondo); }
#prensa { margin-top: clamp(70px, 12vh, 140px); }
@media (max-width: 1100px) { .objetos--cinco { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .objetos--cinco { grid-template-columns: minmax(0, 1fr); } }