/* Señal Memoria — Páginas de detalle (nodo individual, Display Suite) */

.sm-detail { padding: clamp(2rem, 4vw, 3.5rem) 0 clamp(2.5rem, 5vw, 4rem); }

.sm-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 360px) 1fr;
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: start;
}
@media (max-width: 767px) { .sm-detail-grid { grid-template-columns: 1fr; } }

/* Portada (left = field_image) */
.sm-detail-cover {
  position: relative;
  aspect-ratio: 1 / 1;
  border-radius: var(--bs-border-radius-lg);
  overflow: hidden;
  background: var(--sm-ink-100);
  border: 1px solid var(--sm-border);
}
.sm-detail-cover .field,
.sm-detail-cover .field__item { position: absolute; inset: 0; height: 100%; width: 100%; margin: 0; }
.sm-detail-cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Cabecera (right) */
.sm-detail-head { padding-top: .25rem; }
.sm-detail-head .field { margin: 0 0 .35rem; }

/* Episodio: chip */
.sm-detail-head .field--name-field-episodio {
  display: inline-block;
  font-family: var(--sm-font-mono); font-size: var(--sm-fs-tag); font-weight: 600;
  letter-spacing: var(--sm-tracking-wider); text-transform: uppercase;
  color: var(--sm-green-700);
}
/* Fecha + duración: meta en línea, atenuada */
.sm-detail-head .field--name-field-fecha-de-produccion,
.sm-detail-head .field--name-field-duracion {
  display: inline-block; margin-right: 1.25rem;
  color: var(--sm-ink-500); font-size: var(--sm-fs-small);
}
/* Título */
.sm-detail-head .field--name-node-title,
.sm-detail-head h2 {
  font-family: var(--sm-font-display); font-weight: 900;
  font-size: var(--sm-fs-display-2); line-height: 1.05;
  letter-spacing: var(--sm-tracking-tighter);
  color: var(--sm-ink-950); margin: .5rem 0 1rem;
}
.sm-detail-head .field--name-node-title a { color: inherit; text-decoration: none; }

/* Audio nativo */
.sm-detail-head .field--name-field-audio { margin-top: 1.25rem; }
.sm-detail-head .field--name-field-audio .field__label { display: none; }
.sm-detail-head audio { width: 100%; display: block; }

/* Hero full-width con imagen + overlay (article / pieza) */
.sm-detail--article, .sm-detail--pieza { padding-top: 0; }
.sm-detail-hero {
  position: relative;
  margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
  background: var(--sm-ink-950);
  min-height: clamp(280px, 42vw, 460px);
  display: flex; align-items: flex-end;
  overflow: hidden;
}
.sm-detail-hero-media { position: absolute; inset: 0; z-index: 0; }
.sm-detail-hero-media .field, .sm-detail-hero-media .field__item { position: absolute; inset: 0; margin: 0; height: 100%; width: 100%; }
.sm-detail-hero-media img { width: 100%; height: 100%; object-fit: cover; }
.sm-detail-hero::after {
  content: ''; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(180deg, rgba(9,9,11,0) 25%, rgba(9,9,11,.55) 65%, rgba(9,9,11,.9) 100%);
}
.sm-detail-hero > .container { position: relative; z-index: 2; padding-bottom: clamp(1.5rem, 3vw, 2.5rem); }
.sm-detail-hero-text { max-width: 60ch; }
.sm-detail-hero-text .sm-eyebrow { color: var(--sm-amber-500); }
.sm-detail-hero-text .sm-detail-title { color: #fff; }
.sm-detail-credit { color: rgba(255,255,255,.75); font-size: var(--sm-fs-small); margin: .5rem 0 0; }

/* Ficha técnica (pieza / presidente) */
.sm-detail-specs { list-style: none; margin: 1.25rem 0 0; padding: 0; display: grid; gap: .4rem; }
.sm-detail-hero-text .sm-detail-specs { color: rgba(255,255,255,.9); }
.sm-detail-specs li { font-size: var(--sm-fs-small); }
.sm-detail-specs li span {
  display: inline-block; min-width: 6.5rem;
  font-family: var(--sm-font-mono); text-transform: uppercase;
  letter-spacing: var(--sm-tracking-wider); font-size: .72rem;
  color: var(--sm-ink-500); margin-right: .5rem;
}
.sm-detail-hero-text .sm-detail-specs li span { color: var(--sm-amber-500); }

/* Retrato vertical (presidente) */
.sm-detail-cover--portrait { aspect-ratio: 3 / 4; }

/* Frase resaltable */
.sm-detail-quote {
  border-left: 4px solid var(--sm-green-700);
  margin: 1rem 0 1.25rem; padding: .25rem 0 .25rem 1.25rem;
  font-family: var(--sm-font-display); font-style: italic;
  font-size: 1.25rem; line-height: 1.3; color: var(--sm-ink-900);
}

/* Documentos del archivo */
.sm-detail-docs { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--sm-border); }
.sm-detail-docs h2 { font-family: var(--sm-font-display); font-size: 1.5rem; color: var(--sm-ink-950); margin: 0 0 1rem; }

/* Audio en bloque (bundle audio): bajo el hero, ancho de lectura */
.sm-detail-audio--block { max-width: 72ch; margin: clamp(1.5rem, 3vw, 2rem) auto 0; }
.sm-detail-audio--block .field__label { display: none; }
.sm-detail-audio--block audio { width: 100%; display: block; }

/* Video: cabecera + embed responsive 16:9 */
.sm-detail--video { padding-top: clamp(1.5rem, 3vw, 2.5rem); }
.sm-detail-vhead { max-width: 72ch; margin: 0 auto 1.25rem; }
.sm-detail-video {
  position: relative; width: 100%; aspect-ratio: 16 / 9;
  border-radius: var(--bs-border-radius-lg); overflow: hidden;
  background: var(--sm-ink-950); border: 1px solid var(--sm-border);
}
.sm-detail-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.sm-detail-video .field, .sm-detail-video .field__item { position: absolute; inset: 0; margin: 0; height: 100%; width: 100%; }
.sm-detail-video img { width: 100%; height: 100%; object-fit: cover; }
.sm-detail-credit--dark { color: var(--sm-ink-500); max-width: 72ch; margin: .6rem auto 0; }

/* Cuerpo editorial */
.sm-detail-body { max-width: 72ch; margin: clamp(2rem, 4vw, 3rem) auto 0; }
.sm-prose, .sm-prose .field__item { color: var(--sm-ink-700); line-height: 1.75; font-size: 1.0625rem; }
.sm-prose p { margin: 0 0 1.25rem; }
.sm-prose h2, .sm-prose h3 {
  font-family: var(--sm-font-display); color: var(--sm-ink-950);
  margin: 2rem 0 .75rem; line-height: 1.2;
}
.sm-prose h2 { font-size: 1.6rem; }
.sm-prose h3 { font-size: 1.3rem; }
.sm-prose a { color: var(--sm-green-700); text-decoration: underline; }
.sm-prose a:hover { color: var(--sm-green-900); }
.sm-prose img { max-width: 100%; height: auto; border-radius: var(--bs-border-radius); margin: 1rem 0; }
.sm-prose ul, .sm-prose ol { margin: 0 0 1.25rem; padding-left: 1.5rem; }
.sm-prose li { margin-bottom: .4rem; }
.sm-prose blockquote {
  border-left: 4px solid var(--sm-green-700); margin: 1.5rem 0; padding: .5rem 0 .5rem 1.25rem;
  color: var(--sm-ink-900); font-style: italic;
}

/* ============ Detalle de Pieza (rediseño archivístico) ============ */
.sm-detail--pieza { padding-top: clamp(2rem, 4vw, 3.5rem); }
.sm-pieza-head { max-width: 60ch; margin: 0 0 clamp(1.5rem, 3vw, 2rem); }
.sm-pieza-head .sm-detail-title { color: var(--sm-ink-950); margin: .5rem 0 0; }
.sm-pieza-tema {
  margin: .75rem 0 0; font-family: var(--sm-font-display);
  font-size: var(--sm-fs-lead); color: var(--sm-ink-500);
}

/* Media */
.sm-pieza-figure { margin: 0 0 clamp(1.5rem, 3vw, 2.5rem); }
.sm-pieza-figure img,
.sm-pieza-figure picture { display: block; width: 100%; height: auto; border-radius: var(--bs-border-radius-lg); }
.sm-pieza-figure figcaption {
  margin-top: .6rem; font-size: var(--sm-fs-small);
  color: var(--sm-ink-500); font-style: italic;
}
.sm-pieza-video { margin: 0 0 clamp(1.5rem, 3vw, 2.5rem); }
.sm-pieza-video video { width: 100%; height: auto; border-radius: var(--bs-border-radius-lg); display: block; }
.sm-pieza-audio { margin: 0 0 clamp(1.5rem, 3vw, 2.5rem); }
.sm-pieza-audio audio { width: 100%; display: block; }
.sm-pieza-audio .field__label { display: none; }

/* Audios al pie de la pieza, con título por archivo. */
.sm-pieza-audios { margin-top: clamp(2.5rem, 5vw, 4rem); padding-top: 2rem; border-top: 1px solid var(--sm-border); display: grid; gap: 1.5rem; }
.sm-pieza-audio-item { display: grid; gap: .6rem; }
.sm-pieza-audio-title { font-family: var(--sm-font-display, serif); font-size: clamp(1.05rem, 2vw, 1.25rem); line-height: 1.3; margin: 0; }
.sm-pieza-audio-player { width: 100%; display: block; }

/* Cuerpo + ficha (2 columnas) */
.sm-pieza-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: clamp(2rem, 4vw, 3.5rem);
  align-items: start;
}
@media (max-width: 900px) { .sm-pieza-layout { grid-template-columns: 1fr; } }

/* Ficha técnica */
.sm-pieza-ficha {
  position: sticky; top: 2rem;
  background: var(--sm-paper-050);
  border: 1px solid var(--sm-border);
  border-radius: var(--bs-border-radius-lg);
  padding: 1.5rem;
}
@media (max-width: 900px) { .sm-pieza-ficha { position: static; } }
.sm-pieza-ficha h2 {
  font-family: var(--sm-font-display);
  font-size: var(--sm-fs-tag); font-weight: 700;
  text-transform: uppercase; letter-spacing: var(--sm-tracking-wider);
  color: var(--sm-green-700); margin: 0 0 1rem;
}
.sm-pieza-ficha dl { margin: 0; }
.sm-pieza-ficha dt {
  font-size: var(--sm-fs-tag); font-weight: 700;
  text-transform: uppercase; letter-spacing: var(--sm-tracking-wide);
  color: var(--sm-ink-500); margin-top: .9rem;
}
.sm-pieza-ficha dt:first-child { margin-top: 0; }
.sm-pieza-ficha dd {
  margin: .15rem 0 0; font-size: var(--sm-fs-small);
  color: var(--sm-ink-900); line-height: var(--sm-leading-base);
}
.sm-pieza-tags { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: 1.25rem; padding-top: 1.25rem; border-top: 1px solid var(--sm-border); }
.sm-pieza-tag {
  display: inline-block; font-size: var(--sm-fs-tag); font-weight: 600;
  color: var(--sm-green-900); background: var(--sm-green-100);
  padding: .25rem .65rem; border-radius: 999px;
}
/* Tags como enlaces al término (#33) */
a.sm-pieza-tag { text-decoration: none; transition: background .15s ease, color .15s ease; }
a.sm-pieza-tag:hover, a.sm-pieza-tag:focus-visible { background: var(--sm-green-200, #cdeccf); color: var(--sm-green-900); }

/* Contenido relacionado */
.sm-pieza-rel { margin-top: clamp(2.5rem, 5vw, 4rem); padding-top: 2rem; border-top: 1px solid var(--sm-border); }
.sm-pieza-rel-title {
  font-family: var(--sm-font-display); font-size: var(--sm-fs-h2);
  font-weight: 800; letter-spacing: var(--sm-tracking-tight);
  color: var(--sm-ink-950); margin: 0 0 1.5rem;
}
.sm-rel-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
@media (max-width: 991px) { .sm-rel-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { .sm-rel-grid { grid-template-columns: 1fr; } }
.sm-rel-card { display: block; text-decoration: none; color: inherit; }
.sm-rel-card-img {
  aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--bs-border-radius);
  background: var(--sm-ink-100);
}
.sm-rel-card-img img, .sm-rel-card-img picture { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.sm-rel-card:hover .sm-rel-card-img img { transform: scale(1.05); }
.sm-rel-card h3 {
  font-family: var(--sm-font-display); font-size: 1rem; font-weight: 700;
  line-height: var(--sm-leading-tight); margin: .6rem 0 0; color: var(--sm-ink-900);
}
.sm-rel-card:hover h3 { color: var(--sm-green-700); }

/* ============ Detalle de Artículo (cuerpo de paragraphs) ============ */
.sm-article-body { max-width: 72ch; margin-inline: auto; }
/* Paragraphs: separación y media a ancho de columna */
.sm-article-body .paragraph { margin: 0 0 1.5rem; }
.sm-article-body .field--name-field-audio,
.sm-article-body .paragraph--type--parrafo-audio { margin: 1.75rem 0; }
.sm-article-body audio { width: 100%; display: block; }
.sm-article-body .field__label { display: none; }
.sm-article-body img { max-width: 100%; height: auto; border-radius: var(--bs-border-radius); }
.sm-article-meta { max-width: 72ch; margin: 2rem auto 0; padding-top: 1.5rem; border-top: 1px solid var(--sm-border); }
.sm-article-meta .sm-pieza-tags { margin-top: 0; padding-top: 0; border-top: 0; }

/* ============ Audio nativo (paragraph parrafo_audio) ============ */
.sm-audio { margin: 1.75rem 0; }
.sm-audio .audiofield,
.sm-audio .audiofield-player { width: 100%; }
.sm-audio audio { width: 100%; display: block; height: 44px; }
/* El <label> de audiofield (nombre crudo del .mp3) queda SOLO como nombre
   accesible para lectores de pantalla; los editores ya muestran la cita en el
   texto contiguo, así que no se duplica visualmente. */
.sm-audio .audiofield label {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}

/* Portada de audio: cover más contenido (no full-width) */
.sm-pieza-figure--audio { max-width: 460px; }
.sm-pieza-figure--audio img,
.sm-pieza-figure--audio picture { border-radius: var(--bs-border-radius-lg); }

/* ============================================================
   Detalle de EPISODIO DE PODCAST — "player card" 2026
   (DS layout ds_2col_stacked_fluid; reusa estilos de campo de .sm-detail-head)
   ============================================================ */
.sm-detail--podcast { padding: 0; }

.sm-epi-hero {
  background:
    radial-gradient(900px 320px at 88% -10%, rgba(46, 118, 50, .10), transparent 60%),
    linear-gradient(180deg, var(--sm-paper-050), var(--sm-paper-000));
  border-bottom: 1px solid var(--sm-border);
  padding: clamp(1.5rem, 4vw, 2.75rem) 0 clamp(2rem, 4vw, 3rem);
}
.sm-epi-back {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  font-family: var(--sm-font-display);
  font-size: var(--sm-fs-small);
  font-weight: 700;
  letter-spacing: var(--sm-tracking-wide);
  text-transform: uppercase;
  color: var(--sm-green-700);
  text-decoration: none;
  margin-bottom: var(--sm-sp-4);
}
.sm-epi-back:hover { color: var(--sm-green-900, #1c4a1f); }

/* Grilla cover + cabecera (anula el grid base con columnas propias). */
.sm-epi-grid {
  display: grid;
  grid-template-columns: minmax(240px, 320px) 1fr;
  gap: clamp(1.5rem, 4vw, 3rem);
  align-items: center;
}
@media (max-width: 767px) {
  .sm-epi-grid { grid-template-columns: 1fr; gap: 1.5rem; }
}

/* Portada cuadrada con sombra. */
.sm-epi-cover {
  position: relative;
  aspect-ratio: 1 / 1;
  max-width: 320px;
  border-radius: var(--bs-border-radius-xl, 1rem);
  overflow: hidden;
  box-shadow: 0 20px 50px rgba(9, 9, 11, .22);
  background: var(--sm-ink-100);
}
.sm-epi-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }

.sm-epi-head { padding-top: 0; }
.sm-epi-eyebrow {
  display: block;
  margin-bottom: .35rem;
  color: var(--sm-green-700);
}
/* El badge EP / fecha / duración / título / audio salen del right region y ya
   tienen estilo en .sm-detail-head; aquí solo se afina la escala del podcast. */
.sm-epi-head .field--name-node-title,
.sm-epi-head h2 { font-size: clamp(1.9rem, 4vw, 2.8rem); margin-top: .35rem; }
.sm-epi-head .field--name-field-audio { margin-top: 1.5rem; }
.sm-epi-head audio { width: 100%; }

/* Cuerpo editorial (créditos + descripción) en columna legible. */
.sm-epi-body { max-width: 72ch; margin: clamp(1.75rem, 4vw, 2.5rem) auto 0; }

/* ============================================================
   La Voz del Poder — pestañas Biografía / Discursos / Multimedia
   ============================================================ */
.sm-lvp-tabs { margin-top: clamp(2.5rem, 6vw, 4rem); }
.sm-lvp-tablist { display: inline-flex; }
.sm-lvp-panel { animation: sm-fade-in .3s var(--sm-ease-out, ease-out); }
.sm-lvp-panel[hidden] { display: none; }
/* El contenido del CMS trae el primer párrafo con text-align:justify inline;
   unificar a la izquierda. Sin tope de ancho (biografía a todo el ancho). */
.sm-lvp-panel.sm-prose :where(p, li) { text-align: left !important; }
.sm-lvp-panel-intro {
  max-width: 70ch; margin: 0 0 2rem;
  font-style: italic; color: var(--sm-ink-700);
  border-left: 3px solid var(--sm-green-700, #2E7632); padding-left: 1rem;
}
.sm-lvp-mm-title {
  font-family: var(--sm-font-display, serif);
  font-size: clamp(1.25rem, 2.5vw, 1.6rem);
  margin: 2.5rem 0 1.25rem;
}
.sm-lvp-mm-title:first-of-type { margin-top: 0; }

/* Lista de recursos (documento/audio/imagen): tarjetas apiladas. */
.sm-lvp-reclist { display: grid; gap: 1.25rem; margin-bottom: 1rem; }
.sm-lvp-reclist--img { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }

.sm-lvp-rec {
  display: grid; gap: 1.25rem;
  background: #fff;
  border: 1px solid var(--sm-border, #e5e5e5);
  border-radius: var(--bs-border-radius-lg, .75rem);
  padding: 1.25rem;
  transition: box-shadow var(--sm-dur-base) var(--sm-ease-out);
}
.sm-lvp-rec:hover { box-shadow: var(--sm-shadow-sm); }
.sm-lvp-rec--doc { grid-template-columns: 120px 1fr; align-items: start; }
.sm-lvp-rec--img { grid-template-columns: 1fr; }
@media (max-width: 575px) { .sm-lvp-rec--doc { grid-template-columns: 1fr; } }

.sm-lvp-rec-thumb {
  border-radius: var(--bs-border-radius, .5rem); overflow: hidden;
  background: var(--sm-ink-100); aspect-ratio: 3 / 4;
}
.sm-lvp-rec--img .sm-lvp-rec-thumb { aspect-ratio: 4 / 3; }
.sm-lvp-rec-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

.sm-lvp-rec-media { border-radius: var(--bs-border-radius, .5rem); overflow: hidden; }
.sm-lvp-rec-media :is(iframe, .youtube-container, .media-youtube-video) { width: 100%; aspect-ratio: 16 / 9; border: 0; display: block; }

.sm-lvp-rec-date {
  display: inline-block;
  font-family: var(--sm-font-mono, monospace);
  font-size: var(--sm-fs-tag, .75rem); text-transform: uppercase;
  letter-spacing: .04em; color: var(--sm-ink-600); margin-bottom: .4rem;
}
.sm-lvp-rec-title {
  font-family: var(--sm-font-display, serif);
  font-size: clamp(1.05rem, 2vw, 1.3rem); line-height: 1.25; margin: 0 0 .65rem;
}
.sm-lvp-rec-text { color: var(--sm-ink-700); margin: 0 0 1rem; }
.sm-lvp-rec-body > :last-child { margin-bottom: 0; }
.sm-lvp-audio { width: 100%; margin: .25rem 0 1rem; }

.sm-lvp-relacionados {
  margin-top: clamp(3rem, 7vw, 5rem); padding-top: 2rem;
  border-top: 1px solid var(--sm-border, #e5e5e5);
  display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
}

@keyframes sm-fade-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }