/* Base: la v1 publicada (papel blanco, tinta, escala de portada de libro). Blanco y negro solo
   en las fotos de archivo del autor; las de actividades, noticias y videoteca van en color.
   Pies forzados: logo de la Cátedra en #0000ff sobre el gris de Joan, Andada Pro en títulos,
   barra U. de Chile estándar, sin etiquetas en mayúsculas ni cursivas sobre los títulos.
   Versión elegida por la FCEI el 23 de octubre de 2026: azul y naranja, silueta azul, ancho fluido. */
:root {
  --paper: #ffffff;
  --ink: #141414;
  --ink-2: #4a4a4a;
  --ink-3: #6b6b6b;
  --rule: #e2e2e2;
  --wash: #ededed;
  --azul: #0000c2; /* Campo azul más oscuro para el contraste (Gonzalo, 30 de octubre); el logo sigue en #0000ff */
  --azul-claro: #d9dcff;
  --gris-joan: #ededed;
  --night: #0e1729;
  --acento: #ff7a1a;
  --acento-t: #141414;
  --enlace: #a63f08;
  --subrayado: #ff7a1a;
  --display: "Andada Pro", Georgia, serif;
  --sans: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
  --max: none;
  --gut: clamp(16px, 6vw, 140px);
}
html .hero h1 { font-size: clamp(3.4rem, 7.4vw, 8rem); }
html .sec-head h2, html .chair-h { font-size: clamp(2.4rem, 4.6vw, 5rem); }
html .hero-lede, html .chair-text p.big, html .author-intro { max-width: 36ch; }
html .premio p { max-width: 38rem; }

/* Azul del logo como campo o línea (franja del Premio, fechas, reproductor), nunca como texto sobre blanco */
html ::selection { background: var(--azul); color: #fff; }
html :focus-visible { outline-color: var(--azul); }
html .head { border-bottom: 0; }
html .hero { background: var(--gris-joan); border-bottom: 0; }
html .nav a:hover { border-color: var(--azul); }
html .book.acento { background: var(--azul); border-color: var(--azul); color: #fff; }
html .play { background: var(--azul); }
html .play::after { border-left-color: #fff; }
html .premio { background: var(--azul); }
html .premio p, html .status { color: var(--azul-claro); }
html .status::before { background: #fff; }
html .premio .btn:hover { background: #141414; border-color: #141414; color: #fff; }
html .premio .ph-box { background: rgba(255,255,255,.12); color: var(--azul-claro); }
html .premio :focus-visible { outline-color: #fff; }

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 17px; line-height: 1.6; }
::selection { background: var(--acento); color: var(--acento-t); }
img { max-width: 100%; display: block; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--enlace); outline-offset: 3px; }
.wrap { max-width: var(--max); margin: 0 auto; padding-inline: var(--gut); }
h1, h2, h3 { margin: 0; font-weight: 400; text-wrap: balance; }
p { margin: 0; }
.ph { color: var(--ink-3); }
.ph-box { background: var(--wash); color: var(--ink-3); display: grid; place-items: center; text-align: center; font-size: .9rem; }

/* Barra U. de Chile: el estándar, en negro */
.uch { background: var(--ink); color: #fff; font-size: 15px; }
.uch .wrap { display: flex; align-items: center; gap: 22px; height: 42px; }
.uch a { text-decoration: none; }
.uch .u { display: flex; }
.uch .u img { width: 156px; height: 13px; }
.uch .unidad { color: #fff; font-family: "PT Sans", sans-serif; font-size: 16px; white-space: nowrap; }
.uch .unidad:hover { text-decoration: underline; text-underline-offset: 4px; }
.uch-q { margin-left: auto; display: flex; align-items: center; border-bottom: 1px solid #8a8a8a; width: 210px; }
.uch-q input { flex: 1; min-width: 0; background: transparent; border: 0; color: #fff; font: 15px var(--sans); padding: 4px 0; }
.uch-q input::placeholder { color: #b5b5b5; }
.uch-q button { background: none; border: 0; color: #fff; padding: 2px; cursor: pointer; display: grid; }
.uch-q svg { width: 17px; height: 17px; }

/* Encabezado como el de la v1: logo de la Cátedra a la izquierda, menú a la derecha */
.head { background: var(--gris-joan); }
/* Encabezado de 120 px: Cátedra a 70 px y FCEI a 90 px de alto (Gonzalo, 30 de octubre) */
.logos { display: flex; align-items: center; gap: 40px; min-height: 120px; padding-block: 15px; position: relative; }
.logos .logo img { height: 70px; width: auto; }
.logo-fcei { margin-left: auto; display: flex; }
.logo-fcei img { height: 90px; width: auto; }
.nav-row { position: sticky; top: 0; z-index: 20; background: var(--gris-joan); border-top: 1px solid #d6d6d6; border-bottom: 1px solid #d6d6d6; }
.nav { display: flex; gap: 32px; font-size: .95rem; font-weight: 500; white-space: nowrap; }
.nav a { text-decoration: none; color: var(--ink-2); padding-block: 13px 11px; border-bottom: 2px solid transparent; }
.nav a:hover { color: var(--ink); border-color: var(--ink); }
.menu { display: none; }
.menu .cerrar, .menu[open] .abrir { display: none; }
.menu[open] .cerrar { display: inline; }
.menu[open] svg.cerrar { display: block; }
/* Solo ícono, de ancho fijo: abierto o cerrado mide lo mismo y no empuja los logos (Gaby, 2 de noviembre) */
.menu summary { list-style: none; cursor: pointer; display: grid; place-items: center; width: 44px; height: 44px; margin-right: -10px; }
.menu summary svg { width: 26px; height: 26px; }
.menu summary:hover { color: var(--azul); }
.menu summary::-webkit-details-marker { display: none; }
.menu nav { position: absolute; left: 0; right: 0; top: 100%; z-index: 5; background: var(--gris-joan); border-bottom: 1px solid var(--ink); display: grid; padding: 8px var(--gut) 16px; }
.menu nav a { text-decoration: none; padding: 10px 0; border-bottom: 1px solid #d6d6d6; font-family: var(--display); font-size: 1.3rem; }
@media (max-width: 1020px) {
  .nav-row { display: none; }
  .menu { display: block; }
  .head { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid #d6d6d6; }
  .logo-fcei { margin-left: auto; }
}
.menu nav a[aria-current="page"] { color: var(--ink); box-shadow: inset 3px 0 0 var(--azul); padding-left: 14px; }
section[id] { scroll-margin-top: 60px; }
@media (max-width: 1020px) { section[id] { scroll-margin-top: 80px; } }

.btn { display: inline-block; text-decoration: none; font-size: .95rem; font-weight: 600; padding: 14px 22px; border: 1px solid var(--ink); transition: background .2s, color .2s, border-color .2s; }
.btn.solid { background: var(--acento); border-color: var(--acento); color: var(--acento-t); }
.btn:hover { background: var(--ink); border-color: var(--ink); color: #fff; }
.more { font-size: .95rem; font-weight: 600; text-decoration: underline; text-decoration-color: var(--subrayado, currentColor); text-underline-offset: 5px; color: #c75000; white-space: nowrap; }
.more:hover { text-decoration-thickness: 3px; }

/* Portada */
.hero { overflow: hidden; border-bottom: 1px solid var(--ink); }
.hero .wrap { display: grid; grid-template-columns: repeat(12, 1fr); gap: 0 24px; align-items: end; padding-top: clamp(32px, 5vw, 64px); }
.hero-text { grid-column: 1 / 7; grid-row: 1; position: relative; z-index: 2; padding-bottom: clamp(32px, 5vw, 72px); }
.hero h1 { font-family: var(--display); font-size: clamp(3.4rem, 8vw, 6rem); line-height: .88; letter-spacing: -.025em; margin-bottom: 26px; }
.hero h1 .c { display: block; font-size: clamp(1.3rem, 2.2vw, 1.8rem); line-height: 1.2; letter-spacing: 0; color: var(--ink-2); margin-top: 20px; }
.hero-lede { font-size: clamp(1.05rem, 1.5vw, 1.2rem); line-height: 1.55; max-width: 34ch; }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.hero-foto { grid-column: 7 / 13; grid-row: 1; aspect-ratio: 4 / 3; margin-bottom: clamp(32px, 5vw, 72px); background: #dcdcdc; }
.hero-foto svg { display: block; width: 100%; height: 100%; }
.hero-foto line { stroke: #b8b8b8; stroke-width: 1; vector-effect: non-scaling-stroke; }
@media (prefers-reduced-motion: no-preference) {
  .hero h1, .hero-lede, .actions { animation: rise .9s cubic-bezier(.2,.7,.2,1) both; }
  .hero-lede { animation-delay: .12s; } .actions { animation-delay: .22s; }
  @keyframes rise { from { transform: translateY(18px); opacity: 0; } to { transform: none; opacity: 1; } }
  @keyframes fade { from { opacity: 0; filter: blur(4px); } to { opacity: 1; filter: none; } }
}
@media (max-width: 820px) {
  .hero-text, .hero-foto { grid-column: 1 / -1; grid-row: auto; }
  .actions .btn { flex: 1 1 14rem; text-align: center; }
}

/* Secciones */
.sec { padding-block: clamp(64px, 9vw, 120px); }
.sec-head { display: flex; justify-content: space-between; align-items: end; gap: 16px 32px; flex-wrap: wrap; margin-bottom: 40px; }
.sec-head h2, .chair-h { font-family: var(--display); font-size: clamp(2.4rem, 5vw, 4rem); line-height: 1; letter-spacing: -.015em; }

/* La Cátedra */
.chair { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 40px 64px; align-items: center; }
.chair-photos { display: grid; grid-template-columns: 2fr 1fr; gap: 12px; }
.chair-photos img { width: 100%; height: 100%; object-fit: cover; }
.chair-photos .main { grid-row: span 2; aspect-ratio: 4 / 5; }
.chair-photos .sm { aspect-ratio: 1; }
.chair-text { display: grid; gap: 22px; }
.chair-text p.big { font-family: var(--display); font-size: 1.4rem; line-height: 1.45; }
.docs { border-top: 1px solid var(--ink); }
.docs a { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--rule); text-decoration: none; font-weight: 500; }
.docs a span { color: var(--ink-3); font-weight: 400; font-size: .9rem; text-align: right; }
.docs a:hover { color: var(--enlace); }
@media (max-width: 860px) { .chair { grid-template-columns: 1fr; } }

/* Antonio Skármeta */
.author { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 48px 72px; }
.author-photos { display: grid; gap: 16px; align-content: start; }
.author-photos img { filter: grayscale(1); width: 100%; object-fit: cover; }
.author-photos .p1 { aspect-ratio: 4 / 3; }
.author-photos .pair { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.author-photos .pair img { aspect-ratio: 1; }
.author-intro { font-family: var(--display); font-size: clamp(1.3rem, 2vw, 1.65rem); line-height: 1.45; margin-bottom: 40px; }
.life { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink); }
.life li { display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: 4px 24px; padding: 16px 0; border-bottom: 1px solid var(--rule); align-items: baseline; }
.life .y { font-family: var(--display); font-size: 1.6rem; line-height: 1; }
@media (max-width: 860px) { .author { grid-template-columns: 1fr; } }

/* Obra: estantería */
.obra { margin-top: clamp(64px, 8vw, 104px); }
.obra .sec-head h2 { font-size: clamp(2rem, 3.6vw, 2.8rem); }
.shelf-wrap { overflow-x: auto; padding-bottom: 8px; }
.shelf { display: flex; align-items: flex-end; gap: 6px; min-height: 360px; border-bottom: 10px solid var(--ink); padding-inline: 4px; width: max-content; min-width: 100%; }
.book { writing-mode: vertical-rl; transform: rotate(180deg); display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 18px 0; text-decoration: none; background: var(--wash); color: var(--ink-3); border: 1px solid #d6d6d6; transition: transform .25s ease, background .25s, color .25s; }
.book:hover, .book:focus-visible { transform: rotate(180deg) translateY(12px); background: var(--ink); color: #fff; }
.book .t { font-family: var(--display); font-size: 1.05rem; line-height: 1; white-space: nowrap; }
.book .y { font-size: .8rem; font-weight: 600; }
.book.acento { background: var(--acento); color: var(--acento-t); border-color: var(--acento); }
.book.dark { background: #2a2a2a; color: #d6d6d6; border-color: #2a2a2a; }
.shelf-note { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 18px; font-size: .95rem; }
.shelf-note .more { margin-right: 28px; }

/* Actividades */
.activ { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: 48px 72px; }
.agenda { border-top: 1px solid var(--ink); }
.ev { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr) 12rem; gap: 8px 28px; align-items: baseline; padding: 26px 0; border-bottom: 1px solid var(--rule); text-decoration: none; }
.ev:hover .ev-title { color: var(--enlace); }
.ev-date { font-family: var(--display); font-size: 3rem; line-height: .9; }
.ev-date small { display: block; font-family: var(--sans); font-size: .85rem; margin-top: 8px; }
.ev-title { display: block; font-family: var(--display); font-size: 1.45rem; line-height: 1.3; transition: color .2s; }
.ev-type { display: block; font-size: .9rem; font-weight: 500; margin-top: 4px; }
.ev-place { font-size: .9rem; }
.news h3 { font-family: var(--display); font-size: 1.8rem; line-height: 1; margin-bottom: 18px; }
.news-list { border-top: 1px solid var(--ink); margin-bottom: 20px; }
.new { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--rule); text-decoration: none; }
.new img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.new .t { display: block; font-family: var(--display); font-size: 1.1rem; line-height: 1.3; }
.new .m { display: block; font-size: .85rem; margin-top: 6px; }
@media (max-width: 1020px) { .activ { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .ev { grid-template-columns: 5.5rem minmax(0, 1fr); } .ev-place { grid-column: 2; } .ev-date { font-size: 2.4rem; } }

/* Videoteca */
.videoteca { background: var(--wash); }
.vids { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 32px; }
.vid { text-decoration: none; display: grid; gap: 10px; align-content: start; }
.thumb { position: relative; overflow: hidden; background: var(--ink); }
.thumb img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; opacity: .94; transition: transform .6s ease, opacity .3s; }
.vid:hover .thumb img { transform: scale(1.03); opacity: 1; }
.play { position: absolute; left: 20px; bottom: 20px; width: 56px; height: 56px; border-radius: 50%; background: var(--acento); display: grid; place-items: center; }
.play::after { content: ""; border-left: 15px solid var(--acento-t); border-top: 9px solid transparent; border-bottom: 9px solid transparent; margin-left: 4px; }
.vid.small .play { width: 40px; height: 40px; left: 12px; bottom: 12px; }
.vid.small .play::after { border-left-width: 11px; border-top-width: 7px; border-bottom-width: 7px; }
.vid .t { font-family: var(--display); font-size: 1.25rem; line-height: 1.3; }
.vid.big .t { font-size: clamp(1.7rem, 3vw, 2.4rem); line-height: 1.1; }
.vid .m { font-size: .85rem; }
.side-vids { display: grid; gap: 28px; }
@media (max-width: 760px) { .vids { grid-template-columns: 1fr; } }

/* Docencia */
.duo { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); }
.duo > div { padding: 48px 48px 48px 0; display: grid; gap: 16px; align-content: start; }
.duo > div + div { padding: 48px 0 48px 48px; border-left: 1px solid var(--rule); }
.duo h3 { font-family: var(--display); font-size: clamp(1.9rem, 3.4vw, 2.8rem); line-height: 1.05; }
.equipo { display: flex; gap: 12px; }
.equipo span { width: 56px; height: 56px; border-radius: 50%; background: var(--wash); border: 1px solid #d6d6d6; }
.ficha { display: grid; grid-template-columns: 1fr 1fr; margin: 0; }
.ficha div { padding: 12px 0; border-bottom: 1px solid var(--rule); }
.ficha dt { font-size: .85rem; color: var(--ink-2); }
.ficha dd { margin: 0; font-family: var(--display); font-size: 1.3rem; }
.duo .btn { justify-self: start; }
@media (max-width: 760px) { .duo { grid-template-columns: 1fr; } .duo > div, .duo > div + div { padding: 36px 0; border-left: 0; } .duo > div + div { border-top: 1px solid var(--rule); } }

/* Investigación */
.research { display: grid; grid-template-columns: 160px repeat(3, minmax(0, 1fr)); gap: 32px 40px; align-items: start; }
.research > img { border: 1px solid var(--rule); }
.research h3 { font-family: var(--display); font-size: 1.5rem; line-height: 1.1; padding-bottom: 12px; border-bottom: 1px solid var(--ink); }
.research ul { list-style: none; margin: 0 0 16px; padding: 0; }
.research li { padding: 12px 0; border-bottom: 1px solid var(--rule); }
.research li .t { display: block; font-family: var(--display); font-size: 1.1rem; line-height: 1.35; }
.research li small { display: block; font-size: .85rem; margin-top: 2px; }
@media (max-width: 1020px) { .research { grid-template-columns: 120px minmax(0, 1fr); } .research > div { grid-column: 2; } }
@media (max-width: 560px) { .research { grid-template-columns: 1fr; } .research > img { width: 140px; } .research > div { grid-column: 1; } }

/* Premio: la franja oscura de la página */
.premio { background: var(--night); color: #fff; }
.premio .wrap { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 32px 72px; align-items: end; padding-block: clamp(64px, 9vw, 112px); }
.emblema { width: 100%; max-width: 300px; height: auto; margin-bottom: 28px; }
.premio h2 { font-family: var(--display); font-size: clamp(2.4rem, 4.6vw, 3.8rem); line-height: 1.02; letter-spacing: -.015em; max-width: 12em; }
.premio p { color: #c9cfdb; font-size: 1.1rem; margin: 24px 0 30px; max-width: 34rem; }
.premio .btn { border-color: #fff; color: #fff; }
.premio .btn.solid { background: var(--acento); border-color: var(--acento); color: var(--acento-t); }
.premio .btn:hover { background: #fff; color: var(--night); border-color: #fff; }
.status { display: inline-flex; align-items: center; gap: 10px; font-size: .95rem; color: #c9cfdb; }
.status::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--acento); }
.premio .ph-box { background: rgba(255,255,255,.06); color: #aab2c2; aspect-ratio: 4 / 3; margin-bottom: 18px; }
@media (max-width: 860px) { .premio .wrap { grid-template-columns: 1fr; } }

/* Pie: el esquema de los sitios SISIB (CEDIM, UChile TV, uchile.cl) */
.foot { background: var(--gris-joan); font-size: .95rem; }
.foot-nav { border-bottom: 1px solid #d6d6d6; }
.foot-nav .wrap { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 32px; padding-block: 18px; }
.foot-nav a { text-decoration: none; font-weight: 500; color: var(--ink-2); }
.foot-nav a:hover { color: var(--ink); text-decoration: underline; text-decoration-color: var(--subrayado, currentColor); text-underline-offset: 5px; }
.foot-main { display: flex; align-items: center; justify-content: space-between; gap: 32px; padding-block: 44px; flex-wrap: wrap; }
.marcas { display: flex; align-items: center; gap: 28px; }
.marcas img { height: 64px; width: auto; }
.marcas a + .sep + a img { height: 72px; }
.marcas .sep { width: 1px; align-self: stretch; background: #c9c9c9; }
.contacto { font-style: normal; display: grid; gap: 4px; text-align: right; }
.contacto a { color: var(--enlace); text-decoration: underline; text-decoration-color: var(--subrayado, currentColor); text-underline-offset: 4px; }
.foot-inst { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 28px; padding-block: 0 40px; }
.foot-inst > .ph { font-size: .9rem; }
.foot-inst img { height: 45px; width: auto; }
.foot-inst img.acad { height: 50px; }
.foot-inst .ph-box { height: 45px; padding: 0 14px; background: #e2e2e2; font-size: .82rem; }
.redes { margin-left: auto; display: flex; gap: 10px; }
.redes a { width: 38px; height: 38px; border-radius: 50%; border: 1px solid #bdbdbd; display: grid; place-items: center; color: var(--ink); transition: background .2s, color .2s, border-color .2s; }
.redes a:hover { background: var(--ink); border-color: var(--ink); color: #fff; }
.redes svg { width: 19px; height: 19px; }
.foot-sisib { background: var(--ink); color: #cfcfcf; font-size: .82rem; }
.foot-sisib .wrap { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 24px; padding-block: 16px; text-align: center; }
.foot-sisib a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.foot-sisib .credits { flex-basis: 100%; color: #9a9a9a; font-size: .75rem; line-height: 1.5; }
@media (max-width: 760px) {
  .foot-main { flex-direction: column; align-items: flex-start; }
  .contacto { text-align: left; }
  .marcas img { height: 46px; } .marcas a + .sep + a img { height: 52px; }
  .redes { margin-left: 0; }
}
@media (max-width: 820px) {
  .uch .unidad { display: none; }
  .uch-q { width: auto; flex: 1; max-width: 160px; }
  .logos { gap: 20px; min-height: 0; padding-block: 14px; }
  .logos .logo img { height: 46px; }
  .logo-fcei img { height: 46px; }
}
@media (max-width: 560px) { .docs a { flex-direction: column; gap: 2px; } .docs a span { text-align: left; } }

/* Fiel al wireframe aprobado el 13 de octubre (portada.html): mismos bloques, mismo orden */
.hero { position: relative; background: var(--gris-joan); min-height: clamp(460px, 44vw, 640px); display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; border-bottom: 0; }
.hero-img { position: absolute; right: 0; bottom: 0; height: 92%; width: auto; max-width: 60%; object-fit: contain; object-position: right bottom; }
@media (max-width: 820px) { .hero { min-height: 0; } .hero-img { position: static; grid-row: 2; justify-self: end; width: 100%; height: auto; max-width: none; } .hero .wrap { padding-bottom: 8px; } }
.hero .wrap { display: block; width: 100%; padding-top: 48px; padding-bottom: clamp(32px, 5vw, 72px); position: relative; z-index: 2; }
.hero-card { padding: 0; max-width: 640px; }
.hero h1 .c { margin: 0 0 14px; }

.chair .docs { border-top: 1px solid var(--ink); }

.author-photos img { aspect-ratio: 4 / 5; object-position: 50% 0; max-height: 640px; }

.tapas { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 24px; }
.tapa { text-decoration: none; display: grid; gap: 10px; align-content: start; }
.tapa .ph-box { aspect-ratio: 2 / 3; border: 1px solid #d6d6d6; transition: transform .25s ease; }
.tapa:hover .ph-box { transform: translateY(-6px); }
.tapa .y { font-family: var(--display); font-size: 1.15rem; }
.tapa .t { line-height: 1.3; }
.sublinks { display: flex; flex-wrap: wrap; gap: 12px 32px; margin-top: 40px; padding-top: 20px; border-top: 1px solid var(--rule); }
@media (max-width: 860px) { .tapas { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

.ev { grid-template-columns: 6.5rem minmax(0, 1fr) 11rem; align-items: center; }
.ev-date { display: grid; place-items: center; aspect-ratio: 1; background: var(--wash); font-size: 2.2rem; text-align: center; }
.ev-date small { margin-top: 2px; }
.ev-type { margin: 0 0 4px; }
.ev-place { display: grid; gap: 2px; text-align: right; }
.new { grid-template-columns: 1fr; gap: 8px; }
.new .m { margin: 0 0 4px; }
.new .t { transition: color .2s; }
.new:hover .t { color: var(--enlace); }
@media (max-width: 760px) { .ev { grid-template-columns: 5rem minmax(0, 1fr); } .ev-place { text-align: left; } .ev-date { font-size: 1.8rem; } }

.vid.big .resumen { color: var(--ink-3); max-width: 46ch; }
.side-vids { gap: 20px; align-content: start; }
.vid.side { grid-template-columns: 150px minmax(0, 1fr); gap: 16px; align-items: start; }
.vid.side .t { font-size: 1.1rem; }
.vid.side .play { width: 34px; height: 34px; left: 8px; bottom: 8px; }
.vid.side .play::after { border-left-width: 9px; border-top-width: 6px; border-bottom-width: 6px; margin-left: 3px; }

.research { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1020px) { .research { grid-template-columns: 1fr; } .research > div { grid-column: auto; } }

.premio .ficha { grid-template-columns: 1fr 1fr; }
.premio .ficha div { border-color: rgba(255,255,255,.2); }
.premio .ficha dt { color: #aab2c2; }
html .premio .ficha dt { color: var(--azul-claro); }
html .ev-date { background: var(--azul); color: #fff; }
html .premio .ficha dd.ph { color: #fff; }

.fg { display: grid; grid-template-columns: 2fr 1.2fr 1fr 1fr; gap: 40px; padding-block: 56px 40px; }
.fg h2 { margin: 0 0 14px; font-family: var(--display); font-size: 1.25rem; font-weight: 400; }
.fg .inst { display: flex; align-items: center; flex-wrap: wrap; gap: 20px 28px; }
.fg .inst img { height: 45px; width: auto; }
.fg .inst img.acad { height: 50px; }
.fg .inst-txt { font-family: var(--display); font-size: 1.05rem; line-height: 1.2; max-width: 10ch; }
.accesos-pie { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.fg .redes { margin-left: 0; }
.fg .redes a { color: var(--ink); }
.fg .redes a:hover { color: #fff; }
.fg .inst + .more { display: inline-block; margin-top: 22px; white-space: normal; }
.fg a { color: var(--enlace); text-decoration-color: var(--subrayado, currentColor); text-underline-offset: 4px; }
.fb { border-top: 1px solid #c9c9c9; padding-block: 20px 28px; display: grid; gap: 8px; }
.fb .id { font-weight: 500; }
.fb .credits { color: var(--ink-3); font-size: .78rem; line-height: 1.5; }
@media (max-width: 1020px) { .fg { grid-template-columns: 1fr 1fr; } .fg > div:first-child { grid-column: 1 / -1; } }
@media (max-width: 560px) { .fg { grid-template-columns: 1fr; } }

/* Páginas interiores: cabecera de sección, submenú, listados y paginación */
.nav a[aria-current="page"] { color: var(--ink); border-color: var(--azul); }
.page-head { background: var(--gris-joan); }
.page-head .wrap { padding-block: clamp(32px, 5vw, 64px) clamp(28px, 4vw, 48px); }
.migas { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: .9rem; color: var(--ink-2); margin-bottom: 18px; }
.migas a { color: var(--ink-2); text-underline-offset: 4px; }
.migas span[aria-hidden] { color: var(--ink-3); }
.page-head h1 { font-family: var(--display); font-size: clamp(2.8rem, 6vw, 5.6rem); line-height: .95; letter-spacing: -.02em; }
.page-head .bajada { font-size: clamp(1.05rem, 1.5vw, 1.2rem); max-width: 52ch; margin-top: 18px; }
.subnav { border-bottom: 1px solid var(--rule); background: var(--paper); }
.subnav .wrap { display: flex; gap: 4px 32px; overflow-x: auto; font-size: .95rem; font-weight: 500; white-space: nowrap; }
.subnav a { text-decoration: none; color: var(--ink-2); padding: 16px 0 14px; border-bottom: 3px solid transparent; }
.subnav a:hover { color: var(--ink); }
.subnav a[aria-current="page"] { color: var(--ink); border-color: var(--acento); }
@media (max-width: 760px) { .subnav .wrap { flex-wrap: wrap; overflow: visible; gap: 0 22px; } .subnav a { padding: 12px 0 9px; } }

.listado { padding-block: clamp(40px, 6vw, 80px); }
.filtros { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; padding-bottom: 20px; margin-bottom: 8px; border-bottom: 1px solid var(--ink); font-size: .95rem; }
.filtros .total { color: var(--ink-2); }
.filtros .orden { margin-left: auto; display: flex; flex-wrap: wrap; gap: 8px; }
.chip { font: inherit; font-weight: 500; background: transparent; border: 1px solid #c9c9c9; padding: 6px 14px; border-radius: 999px; color: var(--ink-2); cursor: pointer; text-decoration: none; }
.chip:hover { border-color: var(--ink); color: var(--ink); }
.chip[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }

/* Noticias: la primera con imagen grande, el resto en fila */
.nota { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 16px 40px; padding: 28px 0; border-bottom: 1px solid var(--rule); text-decoration: none; align-items: start; }
.nota .img { aspect-ratio: 3 / 2; width: 100%; object-fit: cover; }
.nota .m { display: block; font-size: .9rem; color: var(--ink-2); margin-bottom: 6px; }
.nota .t { display: block; font-family: var(--display); font-size: clamp(1.35rem, 2vw, 1.75rem); line-height: 1.2; transition: color .2s; }
.nota .r { display: block; margin-top: 10px; max-width: 62ch; }
.nota:hover .t { color: var(--enlace); }
.nota.destacada { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); padding-top: 36px; }
.nota.destacada .t { font-size: clamp(1.8rem, 3.2vw, 2.8rem); line-height: 1.08; }
@media (max-width: 760px) { .nota, .nota.destacada { grid-template-columns: 1fr; } }

/* Videoteca: grilla de charlas */
.charlas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 32px; padding-top: 28px; }
.charlas .vid .t { font-size: 1.3rem; }
.charlas .thumb .ph-box { aspect-ratio: 16 / 9; }
.dur { position: absolute; right: 12px; bottom: 12px; background: rgba(20,20,20,.85); color: #fff; font-size: .8rem; font-weight: 600; padding: 2px 8px; }
@media (max-width: 1020px) { .charlas { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .charlas { grid-template-columns: 1fr; } }

/* Investigación: fichas */
.fichas { list-style: none; margin: 0; padding: 0; }
.fichas li { display: grid; grid-template-columns: minmax(0, 1fr) 15rem; gap: 12px 40px; padding: 26px 0; border-bottom: 1px solid var(--rule); align-items: start; }
.fichas .t { display: block; font-family: var(--display); font-size: clamp(1.3rem, 1.9vw, 1.6rem); line-height: 1.25; }
.fichas .a { display: block; margin-top: 6px; color: var(--ink-2); }
.fichas .r { display: block; margin-top: 10px; max-width: 64ch; }
.fichas dl { margin: 0; display: grid; gap: 8px; font-size: .9rem; }
.fichas dt { color: var(--ink-2); }
.fichas dd { margin: 0; font-weight: 500; }
.fichas .acciones { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 14px; }
@media (max-width: 760px) { .fichas li { grid-template-columns: 1fr; } }

.paginas { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin-top: 48px; font-size: .95rem; font-weight: 500; }
.paginas a, .paginas span { min-width: 42px; height: 42px; display: grid; place-items: center; padding: 0 12px; text-decoration: none; border: 1px solid transparent; }
.paginas a:hover { border-color: var(--ink); }
.paginas [aria-current="page"] { background: var(--ink); color: #fff; }
.paginas .ext { border-color: #c9c9c9; }

@media (max-width: 600px) { .filtros .orden { margin-left: 0; } }

/* Marcadores de video: gris más oscuro que el fondo de la sección para que se lean como reproductor */
.thumb .ph-box { aspect-ratio: 16 / 9; background: #d4d4d4; color: var(--ink-2); }
.videoteca .thumb { background: #d4d4d4; }

/* Títulos de tarjetas como encabezados reales: heredan el estilo de los span que reemplazan */
.ev-title, .new .t, .vid .t, .research li .t, .nota .t, .fichas .t { margin: 0; font-weight: 400; }
.vid.side .m { display: block; margin-top: 4px; }

/* Docencia: el botón de inscripción ocupa el ancho en móvil, como los del hero */
@media (max-width: 820px) { .duo .btn { justify-self: stretch; text-align: center; } }

/* Agenda: fecha como marcador mientras no haya actividades reales */
.ev-date.ph { font-size: 1.6rem; }
@media (max-width: 760px) { .ev-date.ph { font-size: 1.25rem; } }

/* Noticias: la destacada con imagen; el resto, lista de prensa con la fecha a la izquierda */
.nota.texto { grid-template-columns: 11rem minmax(0, 1fr); padding: 24px 0; }
.nota.texto .m { margin: 6px 0 0; }
@media (max-width: 760px) { .nota.texto { grid-template-columns: 1fr; gap: 4px; } .nota.texto .m { margin: 0; } }

/* Investigación: etiqueta chica en gris, valor en tinta */
.fichas dl { border-left: 1px solid var(--rule); padding-left: 20px; }
.fichas dt { font-size: .8rem; color: var(--ink-3); }
.fichas dd.ph { color: var(--ink-2); }
@media (max-width: 760px) { .fichas dl { border-left: 0; padding-left: 0; grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Agenda completa: próximas y realizadas */
.listado h2.bloque { font-family: var(--display); font-size: clamp(1.8rem, 3vw, 2.4rem); line-height: 1.1; margin: 0 0 18px; }
.listado .agenda + h2.bloque { margin-top: 72px; }
.realizadas .ev-date { background: var(--wash); color: var(--ink-3); }

/* Páginas de la arquitectura: bloques compartidos de las interiores */
.premio h2 a { color: inherit; text-decoration: none; }
.premio h2 a:hover { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 8px; }
/* Docencia: título a la izquierda y texto a la derecha, para no dejar media página vacía (Gaby, 2 de noviembre) */
.curso { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 16px 72px; align-items: start; }
.curso .prosa h2 { margin: 0; }
@media (max-width: 860px) { .curso { grid-template-columns: 1fr; } }
.dos { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 40px 72px; align-items: start; }
.prosa { display: grid; gap: 16px; max-width: 68ch; align-content: start; }
.prosa h2 { font-family: var(--display); font-size: clamp(1.6rem, 2.6vw, 2.1rem); line-height: 1.15; }
.prosa h2:not(:first-child) { margin-top: 24px; }
.prosa ul, .prosa ol { margin: 0; padding-left: 1.2em; display: grid; gap: 6px; }
.foto { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.caja { background: var(--wash); padding: 32px; display: grid; gap: 18px; align-content: start; }
.caja h2 { font-family: var(--display); font-size: 1.6rem; line-height: 1.1; }
.caja .btn { justify-self: start; }
.caja .ficha { border-top: 1px solid var(--ink); }
.caja .ficha div { border-color: #d6d6d6; }
@media (max-width: 860px) { .dos { grid-template-columns: 1fr; } .caja .btn { justify-self: stretch; text-align: center; } }

/* Accesos a las otras páginas de la sección */
.accesos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 72px; border-top: 1px solid var(--ink); }
.accesos.dos-col { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.accesos a { display: grid; gap: 8px; align-content: start; padding: 24px 32px 28px 0; text-decoration: none; border-bottom: 1px solid var(--rule); }
.accesos a + a { padding-left: 32px; border-left: 1px solid var(--rule); }
.accesos h2 { font-family: var(--display); font-size: 1.45rem; line-height: 1.2; transition: color .2s; }
.accesos span { color: var(--ink-2); font-size: .95rem; }
.accesos a:hover h2 { color: var(--enlace); }
@media (max-width: 760px) { .accesos, .accesos.dos-col { grid-template-columns: 1fr; } .accesos a, .accesos a + a { padding: 20px 0; border-left: 0; } }

/* Decreto: un documento para descargar */
.descarga { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px 48px; padding: 40px; background: var(--wash); }
.descarga h2 { font-family: var(--display); font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.2; max-width: 30ch; margin-bottom: 8px; }
@media (max-width: 560px) { .descarga { padding: 28px 20px; } .descarga .btn { flex: 1; text-align: center; } }

/* Personas: consejo, coordinación y equipo académico */
.personas { list-style: none; margin: 0 0 56px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 32px 24px; }
.personas li { display: grid; gap: 4px; justify-items: start; font-size: .95rem; }
.personas h3 { font-family: var(--display); font-size: 1.2rem; line-height: 1.25; margin-top: 10px; }
.retrato { width: 96px; height: 96px; border-radius: 50%; background: var(--wash); border: 1px solid #d6d6d6; }
.personas.chica { margin: 0; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.personas.chica .retrato { width: 64px; height: 64px; }

/* Instituciones */
.instituciones { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.instituciones li { display: grid; gap: 12px; align-content: start; padding-top: 28px; border-top: 1px solid var(--ink); }
.instituciones img { height: 64px; width: auto; justify-self: start; margin-bottom: 8px; }
.instituciones h2 { font-family: var(--display); font-size: 1.5rem; line-height: 1.2; }
@media (max-width: 860px) { .instituciones { grid-template-columns: 1fr; } }

/* Obra completa y fichas de libro */
.tapa > .ph:not(.y):not(.ph-box) { font-family: var(--display); font-size: 1.05rem; line-height: 1.25; }
.obra-todas { padding-top: 28px; row-gap: 40px; }

/* Tablas: premios y ganadores */
.tabla { width: 100%; border-collapse: collapse; font-size: .98rem; }
.tabla th { text-align: left; font-weight: 600; font-size: .85rem; color: var(--ink-2); padding: 0 24px 12px 0; border-bottom: 1px solid var(--ink); }
.tabla td { padding: 16px 24px 16px 0; border-bottom: 1px solid var(--rule); vertical-align: top; }
.tabla td:first-child { font-family: var(--display); font-size: 1.15rem; white-space: nowrap; }
@media (max-width: 600px) {
  .tabla thead { display: none; }
  .tabla tr { display: grid; gap: 2px; padding: 14px 0; border-bottom: 1px solid var(--rule); }
  .tabla td { padding: 0; border: 0; }
}

/* Skármeta y la Universidad de Chile: tres bloques */
.bloques { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 48px; }
.bloques > div { display: grid; gap: 14px; align-content: start; padding-top: 24px; border-top: 1px solid var(--ink); }
.bloques h2 { font-family: var(--display); font-size: 1.6rem; line-height: 1.15; }
@media (max-width: 860px) { .bloques { grid-template-columns: 1fr; } }

/* Ciclo de cine y galería */
.peliculas, .galeria { list-style: none; margin: 0; padding: 0; display: grid; gap: 40px 24px; }
.peliculas { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.peliculas li, .galeria a { display: grid; gap: 6px; align-content: start; font-size: .92rem; text-decoration: none; }
.peliculas .ph-box { aspect-ratio: 2 / 3; margin-bottom: 8px; }
.peliculas h2, .galeria h2 { font-family: var(--display); font-size: 1.2rem; line-height: 1.25; }
.peliculas .funcion { margin-top: 6px; padding-top: 8px; border-top: 1px solid var(--rule); }
.galeria { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.galeria .ph-box { aspect-ratio: 4 / 3; margin-bottom: 8px; transition: background .2s; }
.galeria a:hover .ph-box { background: #e2e2e2; }
.galeria a:hover h2 { color: var(--enlace); }
@media (max-width: 1020px) { .peliculas { grid-template-columns: repeat(3, minmax(0, 1fr)); } .galeria { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .peliculas { grid-template-columns: repeat(2, minmax(0, 1fr)); } .galeria { grid-template-columns: 1fr; } }

/* Ficha de charla */
.charla { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 32px 48px; align-items: start; margin-bottom: 48px; }
.ficha-charla { margin: 0; display: grid; border-top: 1px solid var(--ink); }
.ficha-charla div { padding: 12px 0; border-bottom: 1px solid var(--rule); }
.ficha-charla dt { font-size: .85rem; color: var(--ink-3); }
.ficha-charla dd { margin: 0; font-family: var(--display); font-size: 1.15rem; }
.ficha-charla dd.ph { color: var(--ink-2); }
.transcripcion { border-top: 1px solid var(--ink); border-bottom: 1px solid var(--rule); padding: 14px 0; margin-top: 16px; }
.transcripcion summary { cursor: pointer; font-weight: 600; }
.transcripcion p { margin-top: 12px; }
@media (max-width: 860px) { .charla { grid-template-columns: 1fr; } }

/* Inscripción */
.formulario { min-height: 280px; }
.tapa .genero { color: var(--ink-2); font-size: .9rem; line-height: 1.35; }

/* Obra: libros con sinopsis (Contenidos web, 27 de octubre) */
.libros { list-style: none; margin: 0; padding: 28px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px 40px; }
.libros li { display: grid; grid-template-columns: 140px 1fr; gap: 24px; align-items: start; }
.libros .ph-box { aspect-ratio: 2 / 3; border: 1px solid #d6d6d6; }
.libros h3 { font-family: var(--display); font-size: 1.4rem; line-height: 1.2; margin: 0 0 4px; }
.libros .y { color: var(--ink-2); font-size: .95rem; }
.libros p { margin: 12px 0 0; }
@media (max-width: 860px) { .libros { grid-template-columns: 1fr; } .libros li { grid-template-columns: 96px 1fr; gap: 18px; } }

/* Instituciones: externas con logo, unidades de la Universidad en texto */
.instituciones.dos-inst { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.instituciones.unidades h3 { font-family: var(--display); font-size: 1.25rem; line-height: 1.25; }
.instituciones p { margin: 0; }
.fuente { margin-top: 40px; color: var(--ink-2); font-size: .9rem; }
@media (max-width: 860px) { .instituciones.dos-inst { grid-template-columns: 1fr; } }

/* Biografía: álbum con las fotos de archivo de Nora Preperski */
.album-bloque { margin-top: 88px; }
.album { list-style: none; margin: 0; padding: 28px 0 0; columns: 4 240px; column-gap: 16px; }
.album li { break-inside: avoid; margin-bottom: 16px; }
.album img { display: block; width: 100%; height: auto; }

/* Variantes ?f1 y ?f2 (27 de octubre): foto de archivo en el hero y la silueta pasa a la franja del Premio */
.hero-archivo, .premio-silueta { display: none; }
html.f1 .hero-img, html.f2 .hero-img, html.f1 .premio .ph-box, html.f2 .premio .ph-box { display: none; }
html.f1 .hero-archivo, html.f2 .hero-archivo, html.f1 .premio-silueta, html.f2 .premio-silueta { display: block; }
.premio-silueta { width: 100%; height: auto; margin-bottom: 18px; }

/* f1: la foto ocupa todo el hero y el texto va en blanco sobre un velo a la izquierda */
html.f1 .hero { background: #1a1712; }
html.f1 .hero-archivo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 48%; }
html.f1 .hero::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgba(14,12,9,.82) 0%, rgba(14,12,9,.55) 38%, rgba(14,12,9,0) 68%); }
html.f1 .hero h1, html.f1 .hero-lede { color: #fff; }
html.f1 .hero h1 .c { color: #e4e0d8; }
html.f1 .hero .btn:not(.solid) { border-color: #fff; color: #fff; }
html.f1 .hero .btn:not(.solid):hover { background: #fff; color: var(--ink); }

/* f2: texto sobre el gris de Joan a la izquierda, foto a sangre en la mitad derecha */
html.f2 .hero-archivo { position: absolute; top: 0; right: 0; bottom: 0; width: 52%; height: 100%; object-fit: cover; object-position: 58% 50%; }
html.f2 .hero-card { max-width: min(640px, 44vw); }

@media (max-width: 820px) {
  html.f1 .hero, html.f2 .hero { min-height: 0; background: var(--gris-joan); }
  html.f1 .hero::before { display: none; }
  html.f1 .hero h1, html.f1 .hero-lede { color: var(--ink); }
  html.f1 .hero h1 .c { color: var(--ink-2); }
  html.f1 .hero .btn:not(.solid) { border-color: var(--ink); color: var(--ink); }
  html.f1 .hero-archivo, html.f2 .hero-archivo { position: static; grid-row: 1; width: 100%; height: auto; aspect-ratio: 4 / 3; }
  html.f2 .hero-card { max-width: none; }
}

/* ?f3: la composición de f2 con la foto del escritorio */
html .hero-archivo.b, html.foto-b .hero-archivo:not(.b) { display: none; }
html.foto-b .hero-archivo.b { display: block; }
html.f2.foto-b .hero-archivo.b { object-position: 45% 50%; }

/* Enlace para saltar al contenido: solo visible con el teclado */
.saltar { position: absolute; left: 1rem; top: -4rem; z-index: 100; background: #fff; color: var(--ink); padding: .5rem 1rem; }
.saltar:focus { top: .5rem; }
html .uch :focus-visible, html .foot-sisib :focus-visible { outline-color: #fff; }

/* Tapas de libros y fotos de archivo en la columna de la biografía */
.tapa-img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; border: 1px solid #d6d6d6; transition: transform .25s ease; }
.tapa:hover .tapa-img { transform: translateY(-6px); }
html .author-photos img.columna { aspect-ratio: auto; max-height: none; margin-top: 56px; }
.solo-movil { display: none; }
@media (max-width: 860px) { html .author-photos img.columna { display: none; } .solo-movil { display: revert; } }
.ev-resumen { margin: 8px 0 0; color: var(--ink-2); font-size: .95rem; }

/* Lanzamiento del 2 de noviembre: obra sin tapa, afiche con programa y buscador */
.listado .agenda + .afiche { margin-top: 72px; }
.afiche-img { width: 100%; height: auto; border: 1px solid #d6d6d6; }
.programa { margin: 0 0 24px; }
.programa > div { display: grid; grid-template-columns: 4.5rem minmax(0, 1fr); gap: 16px; padding: 16px 0; border-top: 1px solid var(--rule); }
.programa dt { font-family: var(--display); font-size: 1.25rem; }
.programa dd { margin: 0; display: grid; gap: 6px; }
.programa dd span { color: var(--ink-2); }
.buscar { margin-top: 24px; max-width: 40rem; }
.buscar label { display: block; margin-bottom: 8px; }
.buscar div { display: flex; gap: 12px; }
.buscar input { flex: 1; min-width: 0; font: inherit; padding: 10px 12px; border: 1px solid #8a8a8a; background: #fff; }
.resumen-busqueda { margin: 0 0 24px; }
.resultados { list-style: none; margin: 0; padding: 0; max-width: 46rem; }
.resultados li { padding: 20px 0; border-top: 1px solid var(--rule); }
.resultados a { font-family: var(--display); font-size: 1.35rem; }
.resultados p { margin: 6px 0 0; color: var(--ink-2); }
/* Franja del Premio en la portada por defecto: foto de archivo a la derecha (en ?f1, ?f2 y ?f3 va la silueta) */
.premio-foto { width: 100%; height: auto; display: block; }
html.f1 .premio-foto, html.f2 .premio-foto { display: none; }
html .premio .wrap { align-items: center; }

/* Obra en filas, como la referencia de Gonzalo (30 de octubre): año, tapa si la hay, título, género y reseña */
.libros { grid-template-columns: 1fr; gap: 0; padding-top: 12px; }
.libros li { grid-template-columns: 6rem 96px minmax(0, 1fr); gap: 32px; padding: 28px 0; border-bottom: 1px solid var(--rule); }
/* Sin tapa no hay caja, pero el texto queda alineado con las filas que sí tienen */
.libros li.sin-tapa { grid-template-columns: 6rem 96px minmax(0, 1fr); }
.libros li.sin-tapa > div { grid-column: 3; }
.libros .anio { font-family: var(--display); font-size: 1.4rem; line-height: 1.2; color: var(--ink-2); }
.libros h3 { font-size: 1.6rem; }
.libros .y { font-size: .9rem; color: var(--ink-3); }
@media (max-width: 860px) {
  .libros li { grid-template-columns: 72px minmax(0, 1fr); gap: 4px 18px; }
  .libros li.sin-tapa { grid-template-columns: minmax(0, 1fr); }
  .libros li.sin-tapa > div { grid-column: auto; }
  .libros .anio { grid-column: 1 / -1; font-size: 1.15rem; }
}

/* Pie (rehecho el 30 de octubre): marca y dos columnas de enlaces, franja de instituciones en una sola fila
   y línea final con identificación, crédito de Wikimedia y SISIB a la derecha. Enlaces internos y externos separados */
.foot { background: var(--gris-joan); color: var(--ink); font-size: .95rem; }
.foot h2 { font-family: var(--sans); font-size: .95rem; font-weight: 600; color: var(--ink); margin: 0 0 16px; }
.pie-arriba { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1.2fr); gap: 40px 64px; padding-block: 64px 56px; }
.pie-catedra img { height: 64px; width: auto; }
.pie-catedra p { margin-top: 20px; color: var(--ink-2); max-width: 32ch; line-height: 1.55; }
.pie-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.pie-col a { color: var(--ink-2); text-decoration: none; }
.pie-col a:hover { color: var(--ink); text-decoration: underline; text-decoration-color: var(--acento); text-decoration-thickness: 2px; text-underline-offset: 5px; }
/* Secciones con peso propio: Andada Pro y una línea por entrada, como las listas de la portada */
.pie-secciones ul { gap: 0; border-top: 1px solid var(--ink); }
.pie-secciones li { border-bottom: 1px solid #d0d0d0; }
.pie-secciones a { display: block; padding: 10px 0; font-family: var(--display); font-size: 1.15rem; line-height: 1.2; color: var(--ink); }
.pie-otros ul { gap: 14px; padding-top: 0; margin-top: -4px; }
.pie-inst { border-top: 1px solid #d0d0d0; padding-block: 36px 40px; }
.logos-inst { display: flex; align-items: center; flex-wrap: wrap; gap: 28px 64px; }
.logos-inst a { display: inline-flex; }
.logos-inst img { width: auto; }
.logos-inst .i-uchile, .logos-inst .i-fcei { height: 48px; }
.logos-inst .i-goethe { height: 46px; }
.logos-inst .i-acad { height: 54px; }
.pie-abajo { border-top: 1px solid #d0d0d0; padding-block: 22px 28px; display: flex; justify-content: space-between; align-items: end; gap: 12px 48px; flex-wrap: wrap; }
/* El crédito va solo en su fila, a todo el ancho; debajo, la fotografía y SISIB (Gaby, 4 de noviembre) */
.pie-abajo > div { display: contents; }
.pie-abajo .id { flex: 1 1 100%; }
.pie-abajo .credits { flex: 1 1 20rem; }
.pie-abajo .id { font-size: .88rem; color: var(--ink-2); }
.pie-abajo .credits { font-size: .78rem; color: var(--ink-3); }
.pie-abajo .sisib { font-size: .85rem; color: var(--ink-2); white-space: nowrap; }
@media (max-width: 1020px) { .pie-arriba { grid-template-columns: 1fr 1fr; } .pie-catedra { grid-column: 1 / -1; } }
@media (max-width: 560px) {
  .pie-arriba { grid-template-columns: 1fr; }
  .logos-inst { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 24px; }
  .pie-abajo .sisib { white-space: normal; }
}

/* Enlaces a otros sitios: ícono después del texto y aviso solo para lectores de pantalla */
.icono-externo { display: inline-block; width: .7em; height: .7em; margin-left: .35em; vertical-align: .05em; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Planilla de revisión (2 de noviembre de 2026) */
/* Obra: los textos ocupan todo el ancho (N° 9) */
.prosa.ancho { max-width: none; }
/* Nombres de instituciones enlazados a su sitio (N° 8): sin subrayado hasta pasar el cursor */
.instituciones h2 a, .instituciones h3 a { text-decoration: none; }
.instituciones h2 a:hover, .instituciones h3 a:hover { text-decoration: underline; text-underline-offset: 4px; }
/* Pie de foto en Skármeta y la Universidad de Chile */
.foto-pie { margin: 0; }
.foto-pie figcaption { margin-top: 10px; font-size: .9rem; line-height: 1.45; color: var(--ink-2); }
/* Pantallas muy chicas (bajo ~390 px): los logos no caben a 46 px y el navegador los achicaba dentro de su caja
   (captura de Gaby, 2 de noviembre). Ahora bajan de alto en proporción al ancho, sin encogerse ni deformarse:
   ancho útil 88vw (gutter de 6vw por lado), menos 2 espacios de 14 px y el botón de 34 px; 5.98 = suma de
   ancho/alto de los dos logos (243/60 + 116/60) */
@media (max-width: 820px) {
  .logos { gap: 14px; }
  .logos .logo, .logo-fcei, .menu { flex-shrink: 0; }
  .logos .logo img, .logo-fcei img { height: min(46px, calc((88vw - 62px) / 5.98)); max-width: none; }
}
/* Barra negra en pantallas chicas: la imagen "Universidad de Chile" se aplastaba (100 px de ancho en vez de 156 a 320 px
   de pantalla); ahora mantiene su tamaño y es el buscador el que se achica */
.uch .u { flex-shrink: 0; }
.uch .u img { max-width: none; }
.uch-q { min-width: 0; }
@media (max-width: 400px) { .uch .wrap { gap: 16px; } }