/* Página del centenario de Arnoldo Palacios. Reutiliza literacidad.css y añade
   núcleos de la exposición, sedes, videos, documental y visor de fotos. */
.lit-quote cite { display: block; margin-top: 1rem; font-style: normal; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; font-size: .85rem; opacity: .85; }

.ap-nucleos { display: grid; gap: 4rem; }
.ap-nucleo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 2.5rem; align-items: start; }
.ap-nucleo:nth-child(even) { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
.ap-nucleo:nth-child(even) .ap-nucleo__texto { order: 2; }
.ap-nucleo__num { display: inline-block; font-weight: 800; color: var(--gold); font-size: 1.1rem; letter-spacing: .1em; margin-bottom: .4rem; }
.ap-nucleo__texto h3 { font-size: 1.6rem; color: var(--dark-blue); margin: 0 0 .8rem; }
.ap-nucleo__texto p { color: var(--dark-gray); line-height: 1.7; margin: 0; }
.ap-nucleo__fotos { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.2rem; }
.ap-foto { margin: 0; }
.ap-foto button { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }
.ap-foto img { width: 100%; height: auto; display: block; border-radius: 4px; box-shadow: 0 10px 25px rgba(5, 58, 90, .15); }
.ap-foto--vertical { max-width: 380px; justify-self: center; width: 100%; }
.ap-foto figcaption { font-size: .88rem; color: var(--gray); padding-top: .5rem; }

.ap-video { margin: 0 auto; max-width: 960px; }
.ap-video video { width: 100%; height: auto; display: block; background: #000; border-radius: 6px; }
.ap-video figcaption { font-size: .9rem; color: var(--gray); text-align: center; padding-top: .5rem; }
.ap-making { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 2rem; align-items: start; }
.ap-making .lit-prose { margin: 0; }

.ap-sedes { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1.2rem; }
.ap-sede { background: var(--white); border-radius: 8px; padding: 1.4rem; border-top: 4px solid var(--gold); box-shadow: 0 6px 18px rgba(5, 58, 90, .08); display: flex; flex-direction: column; gap: .4rem; }
.ap-sede__fecha { text-transform: uppercase; letter-spacing: .1em; font-size: .78rem; font-weight: 700; color: var(--secondary-blue); }
.ap-sede h3 { margin: 0; font-size: 1.25rem; color: var(--dark-blue); }
.ap-sede p { margin: 0; color: var(--dark-gray); font-size: .95rem; line-height: 1.5; flex: 1; }
.ap-sede__publico { font-weight: 700; color: var(--primary-blue); font-size: .9rem; }
.ap-nota { text-align: center; color: var(--gray); font-size: .88rem; margin-top: 1.5rem; }
.ap-impacto { margin-top: 2.5rem; }

.ap-documental { max-width: 820px; margin: 0 auto; background: var(--dark-blue); color: #fff; border-radius: 10px; padding: clamp(1.6rem, 4vw, 3rem); }
.ap-documental h2 { color: #fff; margin: .6rem 0 1rem; font-size: clamp(1.5rem, 3vw, 2.1rem); }
.ap-documental p { color: rgba(255, 255, 255, .88); line-height: 1.7; }
.ap-documental__tag { display: inline-block; background: var(--gold); color: var(--black); font-weight: 700; font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; padding: .3rem .8rem; border-radius: 999px; }
.ap-allies { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }

.ap-visor { border: 0; padding: 0; background: transparent; max-width: 96vw; max-height: 96vh; }
.ap-visor::backdrop { background: rgba(0, 0, 0, .9); }
.ap-visor img { max-width: 94vw; max-height: 86vh; display: block; margin: 0 auto; }
.ap-visor__pie { color: #fff; text-align: center; margin: .6rem 0 0; font-size: .95rem; }
.ap-visor__cerrar { position: fixed; top: 12px; right: 18px; background: none; border: 0; color: #fff; font-size: 2.4rem; line-height: 1; cursor: pointer; }

@media (max-width: 860px) {
  .ap-nucleo, .ap-nucleo:nth-child(even) { grid-template-columns: 1fr; gap: 1.2rem; }
  .ap-nucleo:nth-child(even) .ap-nucleo__texto { order: 0; }
  .ap-making { grid-template-columns: 1fr; }
}

/* style.css oculta img[loading=lazy] hasta que main.js les pone .loaded; esta página no carga main.js */
.arnoldo-page img[loading="lazy"] { opacity: 1; }