/* ==========================================================================
   TEMA: EL QUINTO PODER (quintopoder.org / elquintopoder.org)
   Prensa Soberana de Nuestra América · Zero-DB · Cero Rastreo
   Estética de Prensa Clásica & Autoridad Gráfica
   ========================================================================== */

:root {
    --bg-page: #fbfaf8;
    --bg-surface: #ffffff;
    --bg-subtle: #f3f1ec;
    --bg-card: #fdfdfc;
    --text-main: #141416;
    --text-lead: #27272a;
    --text-muted: #52525b;
    --text-faint: #71717a;
    --border-newspaper: #d4d0c8;
    --border-rule: #a8a29e;
    --border-strong: #1c1917;
    --accent-red: #881337; /* Borgoña lacre de prensa */
    --accent-red-hover: #9f1239;
    --accent-gold: #b45309;
    --font-serif: "Georgia", "Cambria", "Times New Roman", "Baskerville", serif;
    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-mono: "Courier New", Courier, monospace;
    --max-w-site: 1240px;
    --max-w-post: 740px;
}

/* Reset y base */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    background-color: var(--bg-page);
    overflow-x: hidden;
    max-width: 100%;
    scroll-behavior: smooth;
}

[id^="expediente-"],
#radar,
#manifiesto,
#memoria-viva {
    scroll-margin-top: 2rem;
}

body {
    background-color: var(--bg-page);
    color: var(--text-main);
    font-family: var(--font-serif);
    font-size: 1.125rem;
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
    max-width: 100%;
    width: 100%;
    position: relative;
}

a {
    color: inherit;
    text-decoration: none;
    transition: color 0.15s ease;
}

a:hover {
    color: var(--accent-red);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

.container {
    width: 100%;
    max-width: var(--max-w-site);
    margin: 0 auto;
    padding: 0 1.5rem;
    min-width: 0;
}

/* ==========================================================================
   CABECERA PERIODÍSTICA DE PRENSA
   ========================================================================== */

.site-header {
    background: var(--bg-surface);
    border-bottom: 4px double var(--border-strong);
    padding: 0.25rem 0 0;
}

/* Barra superior de fecha y edición */
.header-topbar {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    padding: 0.75rem 0;
    font-family: var(--font-sans);
    font-size: 0.85rem;
    color: var(--text-muted);
    border-bottom: 1px solid var(--border-newspaper);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.topbar-left {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.topbar-center {
    font-weight: 700;
    color: var(--text-main);
    letter-spacing: 0.08em;
    text-align: center;
}

.topbar-right {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 0.75rem;
}

.badge-soberania {
    background: var(--accent-red);
    color: #fff;
    padding: 0.22rem 0.65rem;
    font-size: 0.80rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    border-radius: 2px;
}

/* Masthead Central */
.masthead-center {
    text-align: center;
    padding: 2rem 0 1.25rem;
}

.site-title {
    font-family: var(--font-serif);
    font-size: clamp(2rem, 6vw, 4.75rem);
    font-weight: 900;
    letter-spacing: -0.025em;
    line-height: 0.98;
    text-transform: uppercase;
    color: var(--text-main);
    margin-bottom: 0.75rem;
    word-break: break-word;
    overflow-wrap: break-word;
}

.site-title a {
    color: var(--text-main);
}

.site-title a:hover {
    color: var(--accent-red);
}

.masthead-rules {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    max-width: 820px;
    margin: 0 auto;
    width: 100%;
}

.masthead-rules::before,
.masthead-rules::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--border-rule);
}

.site-tagline {
    font-family: var(--font-serif);
    font-size: 1.05rem;
    color: var(--text-lead);
    font-style: italic;
    text-align: center;
}

.tagline-link {
    color: var(--text-lead);
    text-decoration: none;
    border-bottom: 1px dotted transparent;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.tagline-link:hover {
    color: var(--accent-red);
    border-bottom-color: var(--accent-red);
}

.tagline-arrow {
    font-style: normal;
    font-family: var(--font-sans);
    font-size: 0.9em;
    opacity: 0.6;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

.tagline-link:hover .tagline-arrow {
    transform: translateX(4px);
    opacity: 1;
}

/* Barra de Navegación por Expedientes */
.header-nav {
    border-top: 1px solid var(--border-strong);
    border-bottom: 1px solid var(--border-newspaper);
    margin-top: 1.25rem;
    background: var(--bg-surface);
    position: relative;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

.nav-expedientes-list {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    list-style: none;
    gap: 0.35rem 1.25rem;
    padding: 0.65rem 0;
    font-family: var(--font-sans);
    font-size: 0.88rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.nav-expedientes-list li {
    flex-shrink: 0;
    white-space: nowrap;
}

.nav-expedientes-list li a {
    color: var(--text-main);
    padding: 0.35rem 0.25rem;
    border-bottom: 2px solid transparent;
    transition: all 0.15s ease;
    white-space: nowrap;
    display: inline-block;
}

.nav-expedientes-list li a:hover,
.nav-expedientes-list li.active a {
    color: var(--accent-red);
    border-bottom-color: var(--accent-red);
}

/* ==========================================================================
   PORTADA: GRILLA PERIODÍSTICA
   ========================================================================== */

.frontpage-main {
    padding: 2.5rem 0 4.5rem;
}

/* Grilla Noticia Principal + Lateral con Divisor Definido */
.frontpage-lead-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 3rem;
    padding-bottom: 2.75rem;
    border-bottom: none;
    min-width: 0;
}

.lead-article {
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
    padding-right: 1rem;
    min-width: 0;
}

.lead-kicker-wrap {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.lead-badge-tag {
    background: #fef2f2;
    color: var(--accent-red);
    border: 1px solid #fecaca;
    padding: 0.2rem 0.65rem;
    font-family: var(--font-sans);
    font-size: 0.85rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-radius: 2px;
}

.lead-title {
    font-family: var(--font-serif);
    font-size: clamp(2.05rem, 3.3vw, 2.75rem);
    font-weight: 900;
    line-height: 1.14;
    letter-spacing: -0.02em;
    color: var(--text-main);
    word-break: break-word;
    overflow-wrap: break-word;
}

.lead-title a {
    color: var(--text-main);
}

.lead-title a:hover {
    color: var(--accent-red);
}

.lead-excerpt {
    font-size: 1.25rem;
    line-height: 1.55;
    color: #3f3f46;
}

.lead-meta {
    font-family: var(--font-sans);
    font-size: 0.92rem;
    color: var(--text-faint);
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.45rem 0;
    border-top: 1px solid var(--border-newspaper);
    border-bottom: 1px solid var(--border-newspaper);
}

.lead-meta .author-byline {
    font-weight: 700;
    color: var(--text-main);
}

.lead-image-wrapper {
    position: relative;
    border: 1px solid var(--border-newspaper);
    background: #000;
    overflow: hidden;
    margin-top: 0.75rem;
}

.lead-image-wrapper img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    filter: contrast(102%) saturate(95%);
    transition: transform 0.4s ease, filter 0.4s ease;
}

.lead-image-wrapper:hover img {
    transform: scale(1.02);
    filter: contrast(105%) saturate(100%);
}

.lead-image-caption {
    font-family: var(--font-sans);
    font-size: 0.92rem;
    color: #3f3f46;
    padding: 0.65rem 0 0;
    font-style: italic;
    line-height: 1.45;
}

/* Caja de Tesis y Puntos Clave de Portada */
.lead-keypoints-box {
    background: var(--bg-subtle);
    border: 1px solid var(--border-newspaper);
    border-top: 3px solid var(--accent-red);
    padding: 1.6rem;
    margin-top: 0.75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
}

.lead-keypoints-title {
    font-family: var(--font-sans);
    font-size: 0.90rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--accent-red);
    margin-bottom: 1rem;
    border-bottom: 1px solid var(--border-newspaper);
    padding-bottom: 0.45rem;
}

.lead-keypoints-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.95rem;
    margin-bottom: 1.35rem;
}

.lead-keypoints-list li {
    font-size: 1.05rem;
    line-height: 1.55;
    color: var(--text-lead);
    border-left: 3px solid var(--border-strong);
    padding-left: 0.85rem;
}

.lead-keypoints-list strong {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-main);
    display: block;
    margin-bottom: 0.25rem;
}

.lead-action-cta {
    display: flex;
    justify-content: flex-start;
}

.btn-read-lead {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--accent-red);
    color: #ffffff;
    padding: 0.7rem 1.35rem;
    font-family: var(--font-sans);
    font-size: 0.88rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-radius: 2px;
    transition: background 0.15s ease, transform 0.15s ease;
}

.btn-read-lead:hover {
    background: var(--accent-red-hover);
    color: #ffffff;
    transform: translateY(-1px);
}

.btn-read-lead-sm {
    padding: 0.55rem 1.15rem;
    font-size: 0.85rem;
}

/* ==========================================================================
   SEGUNDA NOTICIA PRINCIPAL EN PORTADA
   ========================================================================== */
.lead-second-article {
    margin-top: 2.25rem;
    padding-top: 2rem;
    border-top: 2px solid var(--border-strong);
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
}

.lead-second-grid {
    display: grid;
    grid-template-columns: 1fr 1.35fr;
    gap: 1.75rem;
    align-items: start;
    min-width: 0;
}

.lead-second-thumb-wrap {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.lead-second-thumb {
    border: 1px solid var(--border-newspaper);
    overflow: hidden;
    position: relative;
}

.lead-second-thumb img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    filter: contrast(102%) saturate(95%);
    transition: transform 0.3s ease;
}

.lead-second-thumb:hover img {
    transform: scale(1.02);
}

.lead-second-thumb-caption {
    font-family: var(--font-sans);
    font-size: 0.90rem;
    color: #3f3f46;
    font-style: italic;
    line-height: 1.45;
}

.lead-second-content {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.lead-second-title {
    font-family: var(--font-serif);
    font-size: 1.45rem;
    font-weight: 900;
    line-height: 1.24;
    color: var(--text-main);
}

.lead-second-title a {
    color: var(--text-main);
}

.lead-second-title a:hover {
    color: var(--accent-red);
}

.lead-second-excerpt {
    font-size: 1.08rem;
    color: var(--text-muted);
    line-height: 1.55;
}

.lead-second-quote-box {
    background: #f6f4ee;
    border-left: 3px solid var(--accent-red);
    padding: 0.85rem 1.05rem;
    font-family: var(--font-serif);
    font-style: italic;
    font-size: 1.02rem;
    color: var(--text-lead);
    line-height: 1.5;
}

.lead-second-quote-author {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    font-weight: 700;
    font-style: normal;
    text-transform: uppercase;
    color: var(--accent-red);
    display: block;
    margin-top: 0.35rem;
}

/* ==========================================================================
   EL DOCUMENTO DE LA SEMANA (LA PRUEBA DOCUMENTAL)
   ========================================================================== */
.lead-doc-week {
    margin-top: 2rem;
    background: #fbfaf6;
    border: 1px solid #d4cebe;
    border-top: 3px solid var(--border-strong);
    padding: 1.5rem;
    position: relative;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.03);
}

.doc-week-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
    border-bottom: 1px solid var(--border-newspaper);
    padding-bottom: 0.65rem;
    margin-bottom: 1rem;
}

.doc-week-tag {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--accent-red);
    letter-spacing: 0.08em;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    white-space: nowrap;
}

.doc-week-stamp {
    font-family: var(--font-mono);
    font-size: 0.80rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #854d0e;
    background: #fef9c3;
    border: 1px dashed #ca8a04;
    padding: 0.18rem 0.55rem;
    border-radius: 2px;
    letter-spacing: 0.06em;
    display: inline-block;
    width: fit-content;
    white-space: nowrap;
}

.doc-week-title {
    font-family: var(--font-serif);
    font-size: 1.25rem;
    font-weight: 900;
    line-height: 1.25;
    color: var(--text-main);
    margin-bottom: 0.75rem;
}

.doc-week-facsimile {
    background: #ffffff;
    border: 1px solid var(--border-newspaper);
    padding: 1.15rem 1.35rem;
    font-family: var(--font-mono);
    font-size: 0.94rem;
    line-height: 1.6;
    color: #1c1917;
    margin-bottom: 0.85rem;
    position: relative;
}

.doc-week-facsimile::before {
    content: "MEMORÁNDUM DE CONDICIONALIDAD";
    position: absolute;
    top: -9px;
    right: 15px;
    background: #ffffff;
    padding: 0 6px;
    font-size: 0.80rem;
    font-weight: 800;
    color: var(--text-faint);
    letter-spacing: 0.08em;
}

.doc-week-note {
    font-family: var(--font-sans);
    font-size: 0.90rem;
    color: var(--text-muted);
    line-height: 1.5;
    border-top: 1px dashed var(--border-newspaper);
    padding-top: 0.65rem;
}

.doc-week-note strong {
    color: var(--text-main);
}

/* Dúo de Investigaciones en Columna Principal (Cierre Equilibrado) */
.lead-subgrid-duo {
    margin-top: 2.25rem;
    padding-top: 1.75rem;
    border-top: 2px solid var(--border-strong);
}

.lead-subgrid-header {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-bottom: 1.25rem;
}

.lead-subgrid-badge {
    font-family: var(--font-sans);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--accent-red);
}

.lead-subgrid-title {
    font-family: var(--font-serif);
    font-size: 1.35rem;
    font-weight: 900;
    color: var(--text-main);
    line-height: 1.25;
}

.lead-duo-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
}

.lead-duo-card {
    display: flex;
    flex-direction: column;
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
}

.lead-duo-kicker {
    font-family: var(--font-sans);
    font-size: 0.80rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: var(--accent-red);
    margin-bottom: 0.5rem;
}

.lead-duo-thumb {
    border: 1px solid var(--border-newspaper);
    overflow: hidden;
    margin-bottom: 0.4rem;
}

.lead-duo-thumb img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
    transition: transform 0.25s ease;
}

.lead-duo-thumb a:hover img {
    transform: scale(1.02);
}

.lead-duo-caption {
    font-family: var(--font-sans);
    font-size: 0.78rem;
    color: var(--text-faint);
    line-height: 1.35;
    font-style: italic;
    margin-bottom: 0.65rem;
}

.lead-duo-title {
    font-family: var(--font-serif);
    font-size: 1.18rem;
    font-weight: 800;
    line-height: 1.3;
    margin-bottom: 0.65rem;
}

.lead-duo-title a {
    color: var(--text-main);
    text-decoration: none;
}

.lead-duo-title a:hover {
    color: var(--accent-red);
}

.lead-duo-excerpt {
    font-size: 0.98rem;
    color: var(--text-muted);
    line-height: 1.5;
    margin-bottom: 0.85rem;
}

.lead-duo-meta {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    color: var(--text-faint);
    margin-top: auto;
    padding-top: 0.65rem;
    border-top: 1px dashed var(--border-newspaper);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.lead-duo-readmore {
    font-weight: 700;
    color: var(--accent-red);
    text-decoration: none;
}

.lead-duo-readmore:hover {
    text-decoration: underline;
}

@media (max-width: 768px) {
    .lead-duo-cards {
        grid-template-columns: 1fr;
    }
}

/* Columna Lateral con Línea Vertical Definida */
.frontpage-sidebar {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
    border-left: 2px solid var(--border-newspaper);
    padding-left: 2.25rem;
}

.sidebar-header-box {
    border-bottom: 2px solid var(--border-strong);
    padding-bottom: 0.55rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
}

.sidebar-header-badge {
    font-family: var(--font-sans);
    font-size: 0.78rem;
    color: var(--accent-red);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    display: block;
}

.sidebar-kicker-title {
    font-family: var(--font-serif);
    font-size: 1.25rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    color: var(--text-main);
    line-height: 1.15;
}

.sidebar-item {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--border-newspaper);
}

.sidebar-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.sidebar-item-kicker {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--accent-red);
    letter-spacing: 0.06em;
}

.sidebar-item-title {
    font-family: var(--font-serif);
    font-size: 1.35rem;
    font-weight: 800;
    line-height: 1.25;
}

.sidebar-item-title a {
    color: var(--text-main);
}

.sidebar-item-title a:hover {
    color: var(--accent-red);
}

.sidebar-item-thumb {
    margin-top: 0.35rem;
    border: 1px solid var(--border-newspaper);
    overflow: hidden;
}

.sidebar-item-thumb img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.sidebar-item-thumb-caption {
    font-family: var(--font-sans);
    font-size: 0.82rem;
    color: var(--text-faint);
    line-height: 1.35;
    margin-top: 0.35rem;
    margin-bottom: 0.65rem;
    font-style: italic;
}

.sidebar-item-excerpt {
    font-size: 1.04rem;
    color: var(--text-muted);
    line-height: 1.55;
}

.sidebar-item-byline {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    color: var(--text-faint);
    margin-top: 0.25rem;
}

/* ==========================================================================
   EL RADAR DE LA SOBERANÍA (TRES NÚMEROS QUE EXPLICAN EL DESPOJO)
   ========================================================================== */
.section-radar-soberania {
    margin: 3.5rem 0 3.5rem;
    border-top: 2px solid var(--border-strong);
    border-bottom: 2px solid var(--border-strong);
    background: var(--bg-surface);
    padding: 2.25rem 2rem;
}

.radar-header-wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    border-bottom: 1px solid var(--border-newspaper);
    padding-bottom: 0.75rem;
    margin-bottom: 1.75rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.radar-headline-title {
    font-family: var(--font-serif);
    font-size: 1.65rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    color: var(--text-main);
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.radar-headline-subtitle {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--accent-red);
    letter-spacing: 0.06em;
}

.radar-metrics-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
    gap: 2rem;
}

.radar-metric-card {
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    border-top: 3px solid var(--border-strong);
    padding: 1.65rem 1.5rem 1.4rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
    transition: transform 0.2s ease, border-top-color 0.2s ease;
}

.radar-metric-card:hover {
    transform: translateY(-2px);
    border-top-color: var(--accent-red);
}

.radar-metric-num {
    font-family: var(--font-serif);
    font-size: clamp(1.4rem, 2.1vw, 1.75rem);
    font-weight: 900;
    line-height: 1.15;
    color: var(--accent-red);
    margin-bottom: 0.5rem;
    letter-spacing: -0.015em;
    word-break: break-word;
    overflow-wrap: break-word;
}

.radar-metric-label {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-main);
    margin-bottom: 0.5rem;
}

.radar-metric-desc {
    font-size: 1.05rem;
    color: #27272a;
    line-height: 1.55;
    margin-bottom: 1.25rem;
}

.radar-metric-source {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    color: var(--text-muted);
    line-height: 1.45;
    border-top: 1px dashed var(--border-newspaper);
    padding-top: 0.65rem;
    display: flex;
    align-items: flex-start;
    gap: 0.45rem;
}

.radar-metric-source svg {
    flex-shrink: 0;
    margin-top: 2px;
    color: var(--accent-red);
}

.radar-metric-source strong {
    color: var(--text-main);
    text-transform: uppercase;
    font-size: 0.80rem;
    letter-spacing: 0.04em;
}

/* ==========================================================================
   FRANJA DEL MANIFIESTO (EL SENTIDO DE LA TRINCHERA)
   ========================================================================== */

/* ==========================================================================
   SECCIÓN MANIFIESTO POPULAR & QUIÉNES SOMOS (FRONT & STANDALONE PAGE)
   ========================================================================== */

.section-manifiesto {
    margin: 3.5rem 0;
    position: relative;
    background: var(--bg-surface);
    border: 2px solid var(--border-strong);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
}

.anchor-target {
    position: absolute;
    top: -80px;
    visibility: hidden;
}

.manifiesto-inner {
    padding: 3rem 2.5rem;
}

.manifiesto-header {
    border-bottom: 2px solid var(--border-strong);
    padding-bottom: 2rem;
    margin-bottom: 2rem;
}

.manifiesto-badge {
    display: inline-block;
    font-family: var(--font-sans);
    font-size: 0.8rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--accent-red);
    background: rgba(153, 27, 27, 0.08);
    border: 1px solid var(--accent-red);
    padding: 0.35rem 0.75rem;
    margin-bottom: 1rem;
}

.manifiesto-headline {
    font-family: var(--font-serif);
    font-size: clamp(1.5rem, 2.8vw, 2.25rem);
    font-weight: 900;
    line-height: 1.25;
    color: var(--text-main);
    margin-bottom: 1.25rem;
    font-style: italic;
}

.manifiesto-lead-prose {
    font-family: var(--font-serif);
    font-size: 1.15rem;
    line-height: 1.6;
    color: var(--text-main);
    max-width: 900px;
}

.manifiesto-body-content {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.manifiesto-body-text {
    font-size: 1.05rem;
    line-height: 1.7;
    color: var(--text-muted);
}

.manifiesto-body-text strong {
    color: var(--text-main);
}

.manifiesto-triad-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.5rem;
    margin: 1.75rem 0;
}

.manifiesto-triad-card {
    background: var(--bg-subtle);
    border: 1px solid var(--border-newspaper);
    border-top: 3px solid var(--accent-red);
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.manifiesto-triad-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.05);
}

.manifiesto-card-num {
    font-family: var(--font-sans);
    font-size: 1.4rem;
    font-weight: 900;
    color: var(--accent-red);
    letter-spacing: -0.02em;
    margin-bottom: 0.5rem;
}

.manifiesto-card-title {
    font-family: var(--font-serif);
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--text-main);
    margin-bottom: 0.75rem;
}

.manifiesto-card-desc {
    font-size: 0.95rem;
    line-height: 1.55;
    color: var(--text-muted);
}

/* Cuadro Especial: El Porqué de Quinto Poder */
.por-que-callout-card {
    background: var(--bg-surface);
    border: 1px solid var(--border-strong);
    border-left: 4px solid var(--accent-red);
    padding: 1.75rem 2rem;
    margin: 2rem 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}

.por-que-callout-header {
    margin-bottom: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.por-que-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: var(--font-sans);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--accent-red);
}

.por-que-callout-title {
    font-family: var(--font-serif);
    font-size: 1.35rem;
    font-weight: 900;
    color: var(--text-main);
    line-height: 1.3;
}

.por-que-callout-grid {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 1.5rem;
    align-items: stretch;
}

.por-que-col {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.por-que-col p {
    font-size: 0.96rem;
    line-height: 1.6;
    color: var(--text-muted);
    margin: 0;
}

.por-que-col p strong {
    color: var(--text-main);
}

.por-que-col-highlight p {
    color: var(--text-main);
}

.por-que-col-tag {
    font-family: var(--font-sans);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-faint);
    padding-bottom: 0.25rem;
    border-bottom: 1px dashed var(--border-newspaper);
}

.por-que-tag-highlight {
    color: var(--accent-red);
    font-weight: 900;
}

.por-que-divider {
    width: 1px;
    background: var(--border-newspaper);
}

@media (max-width: 768px) {
    .por-que-callout-card {
        padding: 1.25rem;
    }
    .por-que-callout-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
    .por-que-divider {
        width: 100%;
        height: 1px;
    }
}

.manifiesto-footer-banner {
    border-top: 2px solid var(--border-strong);
    padding-top: 1.75rem;
    margin-top: 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 2rem;
    flex-wrap: wrap;
}

.manifiesto-footer-quote {
    font-family: var(--font-serif);
    font-size: 1.05rem;
    font-style: italic;
    color: var(--text-main);
    line-height: 1.45;
    max-width: 600px;
}

.manifiesto-footer-quote span {
    display: block;
    font-family: var(--font-sans);
    font-size: 0.8rem;
    font-style: normal;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--accent-red);
    margin-top: 0.35rem;
}

.manifiesto-footer-actions {
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}

.btn-manifiesto-full {
    display: inline-flex;
    align-items: center;
    font-family: var(--font-sans);
    font-size: 0.88rem;
    font-weight: 800;
    color: #fff;
    background: var(--accent-red);
    padding: 0.7rem 1.25rem;
    text-decoration: none;
    transition: background 0.2s ease;
}

.btn-manifiesto-full:hover {
    background: #7f1d1d;
    color: #fff;
}

.btn-manifiesto-print {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: var(--font-sans);
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--text-main);
    background: var(--bg-surface);
    border: 1px solid var(--border-strong);
    padding: 0.65rem 1rem;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.2s ease;
}

.btn-manifiesto-print:hover {
    border-color: var(--text-main);
    background: var(--bg-subtle);
}

/* Página dedicada: page-manifiesto.php */
.manifesto-page-container {
    padding: 2.5rem 0 4rem;
}

.container-narrow {
    max-width: 860px;
    margin: 0 auto;
}

.manifesto-page-header {
    border-bottom: 2px solid var(--border-strong);
    padding-bottom: 2rem;
    margin-bottom: 2.5rem;
}

.manifesto-page-title {
    font-family: var(--font-serif);
    font-size: clamp(2rem, 3.5vw, 2.75rem);
    font-weight: 900;
    line-height: 1.15;
    color: var(--text-main);
    margin: 0.85rem 0;
}

.manifesto-page-subtitle {
    font-family: var(--font-serif);
    font-size: 1.2rem;
    line-height: 1.55;
    color: var(--text-muted);
    font-style: italic;
    margin-bottom: 1.5rem;
}

.manifesto-epigraph-box {
    background: var(--bg-subtle);
    border-left: 4px solid var(--accent-red);
    padding: 1.5rem 1.75rem;
    margin: 2rem 0 2.5rem;
}

.manifesto-epigraph-quote {
    font-family: var(--font-serif);
    font-size: 1.15rem;
    font-style: italic;
    line-height: 1.55;
    color: var(--text-main);
    margin-bottom: 0.5rem;
}

.manifesto-epigraph-cite {
    display: block;
    font-family: var(--font-sans);
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--accent-red);
}

.manifesto-full-prose p {
    font-size: 1.1rem;
    line-height: 1.75;
    margin-bottom: 1.5rem;
}

@media (max-width: 768px) {
    .manifiesto-inner {
        padding: 2rem 1.25rem;
    }
    .manifiesto-triad-grid {
        grid-template-columns: 1fr;
    }
    .manifiesto-footer-banner {
        flex-direction: column;
        align-items: flex-start;
    }
}

.manifesto-strip {
    margin: 0 0 3.5rem;
    background: var(--bg-subtle);
    border-top: 2px solid var(--border-strong);
    border-bottom: 2px solid var(--border-strong);
    padding: 2.5rem 2rem;
    text-align: center;
}

.manifesto-quote {
    font-family: var(--font-serif);
    font-size: clamp(1.3rem, 2.4vw, 1.75rem);
    font-style: italic;
    line-height: 1.45;
    color: var(--text-main);
    max-width: 960px;
    margin: 0 auto 1rem;
}

.manifesto-author {
    font-family: var(--font-sans);
    font-size: 0.92rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--accent-red);
    font-weight: 800;
}

/* ==========================================================================
   GRILLA DE EXPEDIENTES VIVOS
   ========================================================================== */

.section-expedientes-grid {
    margin-top: 3.5rem;
}

.section-headline-bar {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    border-bottom: 2px solid var(--border-strong);
    padding-bottom: 0.5rem;
    margin-bottom: 2.25rem;
}

.section-headline-title {
    font-size: 1.65rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.01em;
}

.section-headline-meta {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    text-transform: uppercase;
    color: var(--text-muted);
    font-weight: 700;
    letter-spacing: 0.05em;
}

.articles-grid-3col {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem;
}

.article-card {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    padding: 1.75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
}

.article-card-thumb {
    margin: -0.25rem 0 0.25rem;
    border: 1px solid var(--border-newspaper);
    overflow: hidden;
}

.article-card-thumb img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
    transition: transform 0.25s ease;
}

.article-card-thumb a:hover img {
    transform: scale(1.02);
}

.article-card-kicker {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--accent-red);
    letter-spacing: 0.07em;
}

.article-card-title {
    font-size: 1.35rem;
    font-weight: 800;
    line-height: 1.28;
}

.article-card-title a {
    color: var(--text-main);
}

.article-card-title a:hover {
    color: var(--accent-red);
}

.article-card-excerpt {
    font-size: 1.05rem;
    color: var(--text-muted);
    line-height: 1.55;
}

.article-card-meta {
    font-family: var(--font-sans);
    font-size: 0.92rem;
    color: var(--text-faint);
    margin-top: auto;
    padding-top: 0.85rem;
    border-top: 1px solid var(--border-newspaper);
    display: flex;
    justify-content: space-between;
}

/* ==========================================================================
   VISTA DE ARTÍCULO (SINGLE POST)
   ========================================================================== */

.single-post-wrapper {
    padding: 3.5rem 0 5.5rem;
}

.post-header-container {
    max-width: var(--max-w-post);
    margin: 0 auto 2.75rem;
    text-align: left;
}

.post-kicker-tag {
    display: inline-block;
    font-family: var(--font-sans);
    font-size: 0.90rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--accent-red);
    margin-bottom: 0.85rem;
}

.post-main-title {
    font-family: var(--font-serif);
    font-size: clamp(2.1rem, 3.6vw, 2.9rem);
    font-weight: 900;
    line-height: 1.14;
    letter-spacing: -0.02em;
    margin-bottom: 1.35rem;
    color: var(--text-main);
}

.post-subtitle {
    font-size: 1.28rem;
    line-height: 1.45;
    color: var(--text-muted);
    margin-bottom: 1.75rem;
    font-style: italic;
}

.post-meta-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    font-family: var(--font-sans);
    font-size: 0.94rem;
    color: var(--text-muted);
    padding: 0.85rem 0;
    border-top: 1px solid var(--border-newspaper);
    border-bottom: 1px solid var(--border-newspaper);
}

.meta-author-box strong {
    color: var(--text-main);
}

.meta-actions-box {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.quick-share-group {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.quick-share-label {
    font-family: var(--font-sans);
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-faint);
    margin-right: 0.2rem;
}

.btn-share-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    border-radius: 2px;
    color: var(--text-muted);
    cursor: pointer;
    transition: all 0.15s ease;
    text-decoration: none;
}

.btn-share-icon:hover {
    color: #fff;
    transform: translateY(-1px);
}

.btn-share-icon.btn-wa:hover {
    background: #25D366;
    border-color: #25D366;
}

.btn-share-icon.btn-tg:hover {
    background: #229ED9;
    border-color: #229ED9;
}

.btn-share-icon.btn-x:hover {
    background: #111;
    border-color: #111;
}

.btn-share-icon.btn-copy:hover {
    background: var(--accent-red);
    border-color: var(--accent-red);
}

.btn-share-icon.copied {
    background: #059669 !important;
    border-color: #059669 !important;
    color: #fff !important;
}

.btn-print-action {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    background: var(--bg-subtle);
    border: 1px solid var(--border-newspaper);
    padding: 0.45rem 0.95rem;
    border-radius: 2px;
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--text-main);
    cursor: pointer;
    font-family: var(--font-sans);
    transition: all 0.15s ease;
}

.btn-print-action:hover {
    background: var(--text-main);
    color: #fff;
    border-color: var(--text-main);
}

/* ==========================================================================
   REPRODUCTOR EDITORIAL DE AUDIO & TTS
   ========================================================================== */

.article-audio-card {
    background: var(--bg-surface);
    border: 1px solid var(--border-strong);
    border-left: 4px solid var(--accent-red);
    padding: 1.15rem 1.4rem;
    margin: 1.75rem 0 2rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
    transition: all 0.25s ease;
}

.article-audio-card.is-playing {
    border-color: var(--accent-red);
    box-shadow: 0 4px 14px rgba(153, 27, 27, 0.08);
}

.audio-card-badge-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.85rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.audio-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-family: var(--font-sans);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--accent-red);
}

.audio-voice-badge {
    font-family: var(--font-sans);
    font-size: 0.74rem;
    font-weight: 700;
    color: var(--text-faint);
    background: var(--bg-subtle);
    padding: 0.2rem 0.5rem;
    border-radius: 2px;
    border: 1px solid var(--border-newspaper);
}

.audio-controls-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: nowrap;
}

.btn-audio-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    background: var(--accent-red);
    color: #ffffff;
    border: none;
    padding: 0.6rem 1.15rem;
    font-family: var(--font-sans);
    font-size: 0.86rem;
    font-weight: 800;
    cursor: pointer;
    border-radius: 2px;
    transition: background 0.2s ease, transform 0.1s ease;
    flex-shrink: 0;
}

.btn-audio-toggle:hover {
    background: #7f1d1d;
}

.btn-audio-toggle:active {
    transform: scale(0.98);
}

.btn-audio-icon-wrap {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.audio-progress-wrap {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    flex: 1;
    min-width: 0;
}

.audio-time {
    font-family: var(--font-mono, monospace);
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-muted);
    min-width: 38px;
    text-align: center;
}

.audio-scrub-bar {
    flex: 1;
    height: 6px;
    background: var(--border-newspaper);
    border-radius: 3px;
    position: relative;
    cursor: pointer;
    overflow: hidden;
    transition: height 0.15s ease;
}

.audio-scrub-bar:hover {
    height: 8px;
}

.audio-progress-fill {
    height: 100%;
    width: 0%;
    background: var(--accent-red);
    border-radius: 3px;
    transition: width 0.1s linear;
}

.btn-audio-speed {
    background: var(--bg-subtle);
    border: 1px solid var(--border-newspaper);
    color: var(--text-main);
    font-family: var(--font-sans);
    font-size: 0.78rem;
    font-weight: 800;
    padding: 0.45rem 0.65rem;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.btn-audio-speed:hover {
    border-color: var(--accent-red);
    color: var(--accent-red);
}

/* Ecualizador Animado */
.audio-equalizer {
    display: inline-flex;
    align-items: flex-end;
    gap: 2px;
    height: 16px;
    width: 14px;
    flex-shrink: 0;
    opacity: 0.3;
}

.audio-equalizer.active {
    opacity: 1;
}

.eq-bar {
    width: 2px;
    height: 4px;
    background: var(--accent-red);
    border-radius: 1px;
    transition: height 0.2s ease;
}

.audio-equalizer.active .eq-bar:nth-child(1) {
    animation: eqPulse 0.8s ease-in-out infinite alternate;
}
.audio-equalizer.active .eq-bar:nth-child(2) {
    animation: eqPulse 1.1s ease-in-out infinite alternate 0.2s;
}
.audio-equalizer.active .eq-bar:nth-child(3) {
    animation: eqPulse 0.9s ease-in-out infinite alternate 0.4s;
}
.audio-equalizer.active .eq-bar:nth-child(4) {
    animation: eqPulse 1.2s ease-in-out infinite alternate 0.1s;
}

@keyframes eqPulse {
    0% { height: 3px; }
    100% { height: 16px; }
}

@media (max-width: 640px) {
    .audio-controls-row {
        flex-wrap: wrap;
        gap: 0.75rem;
    }
    .audio-progress-wrap {
        order: 3;
        width: 100%;
        flex-basis: 100%;
    }
}

/* Imagen destacada en vista individual de artículo */
.post-featured-figure {
    max-width: var(--max-w-post);
    margin: 1.5rem auto 2.5rem;
    border: 1px solid var(--border-newspaper);
    background-color: var(--bg-paper);
}

.post-featured-image {
    width: 100%;
    max-height: 520px;
    object-fit: cover;
    display: block;
}

.post-featured-caption {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    color: var(--text-faint);
    line-height: 1.45;
    padding: 0.65rem 0.9rem;
    background-color: var(--bg-paper-alt);
    border-top: 1px dashed var(--border-newspaper);
    font-style: italic;
}

/* Cuerpo del Artículo */
.post-content-body {
    max-width: var(--max-w-post);
    margin: 0 auto;
    font-size: 1.25rem;
    line-height: 1.82;
    color: #262626;
}

.post-content-body p {
    margin-bottom: 1.75rem;
}

.post-content-body h2 {
    font-family: var(--font-serif);
    font-size: 1.72rem;
    font-weight: 900;
    line-height: 1.22;
    margin: 3rem 0 1rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid var(--border-strong);
    color: var(--text-main);
}

.post-content-body h3 {
    font-family: var(--font-serif);
    font-size: 1.38rem;
    font-weight: 800;
    line-height: 1.3;
    margin: 2.25rem 0 0.85rem;
    color: var(--text-main);
}

.post-content-body blockquote {
    margin: 2.5rem 0;
    padding: 1.35rem 1.85rem;
    background: var(--bg-subtle);
    border-left: 4px solid var(--accent-red);
    font-style: italic;
    font-size: 1.18rem;
    line-height: 1.65;
    color: #1c1917;
}

.post-content-body blockquote cite {
    display: block;
    margin-top: 0.85rem;
    font-family: var(--font-sans);
    font-size: 0.90rem;
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-muted);
    font-weight: 700;
}

.post-content-body ul, .post-content-body ol {
    margin: 1.5rem 0 1.85rem 1.75rem;
}

.post-content-body li {
    margin-bottom: 0.85rem;
    line-height: 1.7;
}

/* Recuadro de Acción Comunitaria (Qué hacemos en el barrio) */
.neighborhood-action-box {
    margin: 3.5rem 0;
    padding: 2.25rem;
    background: #faf7f2;
    border: 2px solid var(--accent-gold);
    border-radius: 2px;
}

.neighborhood-action-box h3 {
    font-size: 1.55rem;
    font-weight: 900;
    color: #78350f;
    margin-bottom: 1.15rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.neighborhood-action-box p {
    color: #451a03;
    margin-bottom: 1rem;
}

.neighborhood-action-box ul {
    margin: 1rem 0 0 1.25rem;
}

.neighborhood-action-box li {
    margin-bottom: 0.95rem;
    color: #451a03;
}

.neighborhood-action-box li strong {
    color: #78350f;
    font-weight: 800;
}

/* Compartir Soberano */
.post-share-footer {
    max-width: var(--max-w-post);
    margin: 4rem auto 0;
    padding: 2.25rem 2rem;
    background: var(--bg-subtle);
    border: 1px solid var(--border-newspaper);
    border-left: 4px solid var(--accent-red);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02);
}

.share-footer-inner {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.share-label-tag {
    display: inline-block;
    font-family: var(--font-sans);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--accent-red);
    margin-bottom: 0.35rem;
}

.share-footer-title {
    font-family: var(--font-serif);
    font-size: 1.45rem;
    font-weight: 700;
    color: var(--text-main);
    margin: 0 0 0.45rem 0;
    line-height: 1.25;
}

.share-footer-sub {
    font-family: var(--font-sans);
    font-size: 0.92rem;
    color: var(--text-muted);
    line-height: 1.5;
    margin: 0;
    max-width: 680px;
}

.share-buttons-group {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.btn-share {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    padding: 0.6rem 1.15rem;
    font-family: var(--font-sans);
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--text-main);
    border-radius: 2px;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.18s ease;
}

.btn-share:hover {
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.06);
}

.btn-share-wa:hover {
    background: #25D366;
    border-color: #25D366;
    color: #fff;
}

.btn-share-tg:hover {
    background: #229ED9;
    border-color: #229ED9;
    color: #fff;
}

.btn-share-x:hover {
    background: #111;
    border-color: #111;
    color: #fff;
}

.btn-share-copy:hover {
    background: var(--accent-red);
    border-color: var(--accent-red);
    color: #fff;
}

.btn-share-copy.copied {
    background: #059669 !important;
    border-color: #059669 !important;
    color: #fff !important;
}

/* ==========================================================================
   PIE DE IMPRENTA (FOOTER)
   ========================================================================== */

.site-footer {
    background: var(--bg-surface);
    border-top: 4px double var(--border-strong);
    padding: 3.5rem 0 2rem;
    margin-top: 5rem;
}

/* Pre-footer: Boletín de Trinchera */
.footer-newsletter-banner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 3rem;
    padding-bottom: 2.5rem;
    margin-bottom: 2.5rem;
    border-bottom: 1px solid var(--border-newspaper);
}

.fnb-text {
    flex: 1;
    max-width: 580px;
}

.fnb-tag {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--accent-red, #c0392b);
    margin-bottom: 0.35rem;
}

.fnb-title {
    font-family: var(--font-headline, 'Georgia', serif);
    font-size: 1.4rem;
    font-weight: 800;
    color: var(--text-primary);
    margin: 0 0 0.35rem;
    line-height: 1.25;
}

.fnb-desc {
    font-size: 0.92rem;
    line-height: 1.45;
    color: var(--text-secondary);
    margin: 0;
}

.fnb-form {
    flex: 1;
    max-width: 480px;
}

@media (max-width: 900px) {
    .footer-newsletter-banner {
        flex-direction: column;
        align-items: flex-start;
        gap: 1.5rem;
    }
    .fnb-form {
        width: 100%;
        max-width: 100%;
    }
}

.footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 3.5rem;
    padding-bottom: 2.5rem;
    border-bottom: 1px solid var(--border-newspaper);
}

.footer-brand-title {
    font-size: 1.65rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: -0.01em;
    margin-bottom: 0.65rem;
}

.footer-bio {
    font-size: 1.05rem;
    color: var(--text-muted);
    line-height: 1.65;
    max-width: 500px;
}

.footer-col-title {
    font-family: var(--font-sans);
    font-size: 0.90rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    margin-bottom: 1rem;
    color: var(--text-main);
}

.footer-links-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    font-family: var(--font-sans);
    font-size: 0.94rem;
}

.footer-links-list a {
    color: var(--text-muted);
}

.footer-links-list a:hover {
    color: var(--accent-red);
}

.footer-bottom-bar {
    padding-top: 1.75rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    font-family: var(--font-sans);
    font-size: 0.90rem;
    color: var(--text-faint);
}

/* ==========================================================================
   WIDGET: LA FRASE DEL DÍA (SOBERANÍA Y PENSAMIENTO)
   ========================================================================== */
.widget-quote-day-card {
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
    position: relative;
    border-top: 3px solid var(--accent-red);
}

.widget-quote-day-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
    border-bottom: 1px solid var(--border-newspaper);
    padding-bottom: 0.65rem;
    margin-bottom: 0.85rem;
}

.widget-quote-day-badge {
    font-family: var(--font-sans);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
    background: #fef2f2;
    color: var(--accent-red);
    border: 1px solid #fecaca;
    padding: 0.15rem 0.55rem;
    border-radius: 2px;
    letter-spacing: 0.06em;
    display: inline-block;
    width: fit-content;
    white-space: nowrap;
}

.widget-quote-day-tag {
    font-family: var(--font-serif);
    font-size: 1.2rem;
    font-weight: 900;
    text-transform: uppercase;
    color: var(--text-main);
    letter-spacing: 0.01em;
    line-height: 1.15;
    white-space: nowrap;
}

.widget-quote-day-text {
    font-family: var(--font-serif);
    font-size: 1.12rem;
    font-style: italic;
    line-height: 1.5;
    color: var(--text-main);
    margin-bottom: 0.75rem;
}

.widget-quote-day-author {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-family: var(--font-sans);
    font-size: 0.92rem;
    line-height: 1.4;
    color: var(--text-muted);
    border-top: 1px dashed var(--border-newspaper);
    padding-top: 0.75rem;
    margin-bottom: 1rem;
}

.quote-author-photo {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    object-fit: cover;
    border: 1.5px solid var(--border-newspaper);
    filter: grayscale(40%) contrast(105%);
    flex-shrink: 0;
}

.quote-author-info {
    flex: 1;
    min-width: 0;
}

.widget-quote-day-author strong {
    color: var(--text-main);
    display: block;
    font-weight: 800;
}

.widget-quote-day-author span {
    font-size: 0.85rem;
    color: var(--text-faint);
}

.widget-quote-day-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.btn-copy-quote {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: var(--bg-subtle);
    color: var(--text-main);
    border: 1px solid var(--border-newspaper);
    padding: 0.5rem 0.95rem;
    font-family: var(--font-sans);
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    cursor: pointer;
    border-radius: 2px;
    transition: all 0.2s ease;
}

.btn-copy-quote:hover {
    background: #eae6dd;
    border-color: var(--border-strong);
    color: var(--accent-red);
}

.btn-copy-quote-sm {
    padding: 0.4rem 0.75rem;
    font-size: 0.82rem;
}

.link-quotes-archive {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    font-weight: 800;
    color: var(--accent-red);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-decoration: underline;
    transition: color 0.15s ease;
}

.link-quotes-archive:hover {
    color: var(--accent-red-hover);
}

/* Puente Pedagógico en Widget de Portada */
.widget-quote-bridge {
    background: var(--bg-subtle);
    border: 1px solid var(--border-newspaper);
    border-left: 3px solid var(--accent-red);
    padding: 0.75rem 0.85rem;
    border-radius: 2px;
    margin-bottom: 0.85rem;
}

.quote-bridge-desc {
    font-family: var(--font-sans);
    font-size: 0.82rem;
    line-height: 1.45;
    color: var(--text-muted);
    margin: 0 0 0.5rem;
}

.quote-bridge-desc strong {
    color: var(--text-main);
}

.quote-bridge-links {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.badge-link-concept,
.badge-link-expediente {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: var(--font-sans);
    font-size: 0.74rem;
    padding: 3px 8px;
    border-radius: 2px;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.15s ease;
}

.badge-link-concept {
    background: rgba(184, 51, 42, 0.08);
    color: var(--accent-red);
    border: 1px solid rgba(184, 51, 42, 0.2);
}

.badge-link-concept:hover {
    background: var(--accent-red);
    color: #ffffff;
}

.badge-link-expediente {
    background: var(--bg-surface);
    color: var(--text-main);
    border: 1px solid var(--border-newspaper);
}

.badge-link-expediente:hover {
    background: var(--text-main);
    color: var(--bg-surface);
}

.btn-share-quote-wa {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: rgba(37, 211, 102, 0.08);
    color: #15803d;
    border: 1px solid rgba(37, 211, 102, 0.35);
    padding: 0.4rem 0.75rem;
    font-family: var(--font-sans);
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    text-decoration: none;
    border-radius: 2px;
    transition: all 0.2s ease;
}

.btn-share-quote-wa:hover {
    background: #25d366;
    color: #ffffff;
    border-color: #25d366;
}

/* ==========================================================================
   WIDGET: EL OBSERVATORIO DEL PODER (ANATOMÍA DE LA DOMINACIÓN)
   ========================================================================== */
.widget-power-card {
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
    border-top: 3px solid var(--border-strong);
}

.widget-power-header {
    border-bottom: 2px solid var(--border-strong);
    padding-bottom: 0.6rem;
    margin-bottom: 0.85rem;
}

.widget-power-tag {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--accent-red);
    letter-spacing: 0.08em;
    display: block;
    margin-bottom: 0.2rem;
}

.widget-power-title {
    font-family: var(--font-serif);
    font-size: 1.25rem;
    font-weight: 900;
    color: var(--text-main);
    line-height: 1.25;
}

.widget-power-intro {
    font-size: 0.98rem;
    color: var(--text-muted);
    line-height: 1.5;
    margin-bottom: 0.85rem;
}

.power-mechanisms-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.power-mechanisms-list li {
    background: var(--bg-subtle);
    border-left: 2px solid var(--accent-red);
    padding: 0.65rem 0.85rem;
    font-size: 0.94rem;
    line-height: 1.45;
}

.power-mechanisms-list strong {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    text-transform: uppercase;
    color: var(--text-main);
    display: block;
    margin-bottom: 0.2rem;
    letter-spacing: 0.03em;
}

.power-mechanisms-list span {
    color: var(--text-lead);
    font-size: 0.95rem;
}

.power-doctrina-footer {
    background: #141416;
    color: #f4f4f5;
    padding: 0.85rem;
    font-family: var(--font-serif);
    font-size: 0.95rem;
    font-style: italic;
    line-height: 1.45;
    text-align: center;
    border-radius: 2px;
}

/* ==========================================================================
   WIDGET: EL GLOSARIO DEL ENGAÑO
   ========================================================================== */
.widget-glosario-card {
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
}

.widget-glosario-header {
    border-bottom: 2px solid var(--border-strong);
    padding-bottom: 0.6rem;
    margin-bottom: 1rem;
}

.widget-glosario-tag {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--accent-red);
    letter-spacing: 0.08em;
    display: block;
    margin-bottom: 0.25rem;
}

.widget-glosario-title {
    font-family: var(--font-serif);
    font-size: 1.35rem;
    font-weight: 900;
    color: var(--text-main);
    letter-spacing: -0.01em;
}

.glosario-euphemism-box {
    background: #fef2f2;
    border-left: 3px solid var(--accent-red);
    padding: 0.75rem 0.9rem;
    margin-bottom: 0.85rem;
}

.glosario-label {
    font-family: var(--font-sans);
    font-size: 0.82rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    display: block;
    margin-bottom: 0.2rem;
}

.glosario-euphemism-box .glosario-label {
    color: var(--accent-red);
}

.glosario-euphemism-text {
    font-family: var(--font-serif);
    font-size: 1.05rem;
    font-style: italic;
    color: #450a0a;
    line-height: 1.5;
}

.glosario-autopsy-box {
    background: var(--bg-subtle);
    border-left: 3px solid var(--border-strong);
    padding: 0.75rem 0.9rem;
    margin-bottom: 0.85rem;
}

.glosario-autopsy-box .glosario-label {
    color: var(--text-main);
}

.glosario-autopsy-text {
    font-size: 1.04rem;
    line-height: 1.55;
    color: var(--text-lead);
}

.glosario-quote-box {
    font-family: var(--font-serif);
    font-size: 0.95rem;
    font-style: italic;
    color: var(--text-muted);
    border-top: 1px solid var(--border-newspaper);
    padding-top: 0.75rem;
    margin-top: 0.5rem;
    line-height: 1.5;
}

.glosario-quote-author {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    font-weight: 700;
    font-style: normal;
    text-transform: uppercase;
    color: var(--text-faint);
    display: block;
    margin-top: 0.25rem;
}

/* ==========================================================================
   SECCIÓN: LA MEMORIA VIVA (EFEMÉRIDES DE SOBERANÍA)
   ========================================================================== */
.section-memoria-viva {
    margin: 3.5rem 0;
    border-top: 2px solid var(--border-strong);
    padding-top: 2.5rem;
}

.memoria-viva-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    border-bottom: 2px solid var(--border-strong);
    padding-bottom: 0.6rem;
    margin-bottom: 2rem;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.memoria-viva-title {
    font-family: var(--font-serif);
    font-size: 1.65rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 0.01em;
    color: var(--text-main);
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.memoria-viva-subtitle {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    text-transform: uppercase;
    color: var(--text-muted);
    font-weight: 700;
    letter-spacing: 0.05em;
}

.memoria-grid-3col {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
}

.memoria-card {
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    padding: 1.75rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
    position: relative;
}

.memoria-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--accent-red);
}

.memoria-card-date {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--accent-red);
    letter-spacing: 0.06em;
    margin-bottom: 0.35rem;
}

.memoria-card-title {
    font-family: var(--font-serif);
    font-size: 1.35rem;
    font-weight: 900;
    line-height: 1.25;
    margin-bottom: 0.75rem;
    color: var(--text-main);
}

.memoria-card-body {
    font-size: 1.05rem;
    color: var(--text-lead);
    line-height: 1.55;
    margin-bottom: 1.25rem;
}

.memoria-card-lesson {
    background: var(--bg-subtle);
    border-left: 2px solid var(--border-strong);
    padding: 0.65rem 0.85rem;
    font-size: 0.95rem;
    color: var(--text-muted);
    line-height: 1.45;
}

.memoria-card-lesson strong {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    display: block;
    color: var(--text-main);
    margin-bottom: 0.2rem;
}

/* ==========================================================================
   PÁGINA DEDICADA: PENSADORES & CITAS DE SOBERANÍA (/frases)
   ========================================================================== */
.page-quotes-container {
    padding: 2.5rem 0 4.5rem;
}

.page-quotes-header {
    border-bottom: 3px double var(--border-strong);
    padding-bottom: 2rem;
    margin-bottom: 2.5rem;
}

.page-quotes-kicker-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.page-quotes-back {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--accent-red);
    letter-spacing: 0.05em;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.page-quotes-back:hover {
    color: var(--accent-red-hover);
    text-decoration: underline;
}

.page-quotes-headline {
    font-family: var(--font-serif);
    font-size: clamp(2.0rem, 3.8vw, 2.85rem);
    font-weight: 900;
    letter-spacing: -0.02em;
    line-height: 1.1;
    color: var(--text-main);
    margin-bottom: 0.85rem;
}

.page-quotes-lead {
    font-size: 1.2rem;
    line-height: 1.6;
    color: var(--text-muted);
    max-width: 900px;
}

/* Barra de Filtros e Índice Temático (/frases) */
.quotes-filter-nav {
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    padding: 1.25rem 1.5rem;
    margin-bottom: 2.25rem;
    border-radius: 2px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
}

.quotes-filter-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px dashed var(--border-newspaper);
}

.quotes-search-box {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 480px;
    display: flex;
    align-items: center;
}

.quotes-search-input {
    width: 100%;
    padding: 0.55rem 2rem 0.55rem 2.25rem;
    font-family: var(--font-sans);
    font-size: 0.88rem;
    border: 1px solid var(--border-newspaper);
    background: var(--bg-subtle);
    color: var(--text-main);
    border-radius: 2px;
    outline: none;
    transition: all 0.2s ease;
}

.quotes-search-input:focus {
    border-color: var(--accent-red);
    background: #ffffff;
    box-shadow: 0 0 0 2px rgba(192, 57, 43, 0.08);
}

.quotes-search-icon {
    position: absolute;
    left: 0.75rem;
    color: var(--text-muted);
    pointer-events: none;
}

.btn-clear-search {
    position: absolute;
    right: 0.5rem;
    background: none;
    border: none;
    font-size: 0.85rem;
    color: var(--text-muted);
    cursor: pointer;
    padding: 0.2rem 0.4rem;
    line-height: 1;
    border-radius: 50%;
}

.btn-clear-search:hover {
    color: var(--accent-red);
}

.quotes-filter-meta {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    flex-wrap: wrap;
}

.btn-jump-today {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    background: #fffbeb;
    color: #92400e;
    border: 1px solid #fde68a;
    padding: 0.45rem 0.85rem;
    font-family: var(--font-sans);
    font-size: 0.8rem;
    font-weight: 700;
    border-radius: 2px;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.15s ease;
}

.btn-jump-today:hover {
    background: #fef3c7;
    border-color: #f59e0b;
    color: #78350f;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(180, 83, 9, 0.1);
}

.jump-today-date {
    background: #fef3c7;
    color: #b45309;
    padding: 0.1rem 0.45rem;
    border-radius: 2px;
    font-size: 0.72rem;
    font-weight: 800;
}

.quotes-counter {
    font-family: var(--font-sans);
    font-size: 0.82rem;
    color: var(--text-faint);
    font-weight: 700;
    white-space: nowrap;
}

.quotes-pills-bar {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.pills-label {
    font-family: var(--font-sans);
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-faint);
    white-space: nowrap;
}

.quotes-pills-scroll {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.quote-filter-pill {
    font-family: var(--font-sans);
    font-size: 0.78rem;
    font-weight: 700;
    padding: 0.35rem 0.75rem;
    border-radius: 2px;
    border: 1px solid var(--border-newspaper);
    background: var(--bg-subtle);
    color: var(--text-secondary);
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.quote-filter-pill:hover {
    background: #ffffff;
    color: var(--accent-red);
    border-color: var(--border-strong);
}

.quote-filter-pill.active {
    background: var(--text-main);
    color: var(--bg-surface);
    border-color: var(--text-main);
    font-weight: 800;
}

/* Distintivo de Cita de Hoy en la Tarjeta */
.quote-card-today-ribbon {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: #fffbeb;
    color: #92400e;
    border: 1px solid #fde68a;
    font-family: var(--font-sans);
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.25rem 0.6rem;
    border-radius: 2px;
    margin-bottom: 0.85rem;
    align-self: flex-start;
}

.quote-card-today {
    border-top: 3px solid #d97706;
}

@keyframes pulseGolden {
    0% {
        box-shadow: 0 0 0 0 rgba(217, 119, 6, 0.45);
        border-color: #d97706;
    }
    50% {
        box-shadow: 0 0 0 8px rgba(217, 119, 6, 0);
        border-color: #d97706;
    }
    100% {
        box-shadow: 0 0 0 0 rgba(217, 119, 6, 0);
        border-color: var(--border-newspaper);
    }
}

.highlight-today-pulse {
    animation: pulseGolden 2.2s ease-out;
    border-color: #d97706 !important;
}

/* Estado Vacío de Búsqueda */
.quotes-empty-state {
    text-align: center;
    padding: 3.5rem 1.5rem;
    background: var(--bg-surface);
    border: 1px dashed var(--border-newspaper);
    margin: 2rem 0;
    border-radius: 2px;
}

.empty-state-icon {
    color: var(--text-faint);
    margin-bottom: 0.75rem;
}

.empty-state-title {
    font-family: var(--font-serif);
    font-size: 1.35rem;
    font-weight: 700;
    color: var(--text-main);
    margin-bottom: 0.5rem;
}

.empty-state-desc {
    font-family: var(--font-sans);
    font-size: 0.92rem;
    color: var(--text-muted);
    max-width: 520px;
    margin: 0 auto 1.5rem;
    line-height: 1.5;
}

.quotes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
    gap: 2rem;
}

.quote-card {
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
    position: relative;
    border-top: 3px solid var(--accent-red);
}

.quote-card-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    gap: 0.5rem;
}

.quote-category-tag {
    font-family: var(--font-sans);
    font-size: 0.85rem;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--accent-red);
    letter-spacing: 0.06em;
}

.quote-country-tag {
    font-family: var(--font-sans);
    font-size: 0.80rem;
    font-weight: 700;
    text-transform: uppercase;
    background: var(--bg-subtle);
    border: 1px solid var(--border-newspaper);
    padding: 0.15rem 0.55rem;
    border-radius: 2px;
    color: var(--text-faint);
    white-space: nowrap;
}

.quote-text {
    font-family: var(--font-serif);
    font-size: 1.25rem;
    font-style: italic;
    line-height: 1.5;
    color: var(--text-main);
    margin-bottom: 1.25rem;
}

.quote-author-block {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    border-top: 1px solid var(--border-newspaper);
    padding-top: 0.75rem;
    margin-bottom: 0.85rem;
}

.quote-author-block .quote-author-photo {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    border: 1.5px solid var(--border-newspaper);
    filter: grayscale(40%) contrast(105%);
    flex-shrink: 0;
}

.quote-author-block .quote-author-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.quote-author-name {
    font-family: var(--font-serif);
    font-size: 1.15rem;
    font-weight: 900;
    color: var(--text-main);
}

.quote-source {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    color: var(--text-muted);
    font-style: normal;
}

.quote-context-desc {
    font-size: 0.98rem;
    color: var(--text-muted);
    line-height: 1.5;
    background: var(--bg-subtle);
    border-left: 2px solid var(--border-strong);
    padding: 0.65rem 0.85rem;
    margin-bottom: 0.85rem;
}

/* Puente Pedagógico en Fichas de /frases */
.quote-bridge-box {
    background: var(--bg-subtle);
    border: 1px solid var(--border-newspaper);
    border-left: 3px solid var(--accent-red);
    padding: 0.85rem 1rem;
    border-radius: 2px;
    margin: 0.85rem 0 1.25rem;
}

.quote-bridge-label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-family: var(--font-sans);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--accent-red);
    margin-bottom: 0.35rem;
}

.quote-bridge-text {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    line-height: 1.45;
    color: var(--text-main);
    margin: 0 0 0.65rem;
}

.quote-bridge-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.quote-pill-concept,
.quote-pill-expediente {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: var(--font-sans);
    font-size: 0.76rem;
    padding: 4px 10px;
    border-radius: 2px;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.15s ease;
}

.quote-pill-concept {
    background: rgba(184, 51, 42, 0.08);
    color: var(--accent-red);
    border: 1px solid rgba(184, 51, 42, 0.2);
}

.quote-pill-concept:hover {
    background: var(--accent-red);
    color: #ffffff;
}

.quote-pill-expediente {
    background: var(--bg-surface);
    color: var(--text-main);
    border: 1px solid var(--border-newspaper);
}

.quote-pill-expediente:hover {
    background: var(--text-main);
    color: var(--bg-surface);
}

.quote-actions-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px dashed var(--border-newspaper);
    padding-top: 0.9rem;
    margin-top: 1.25rem;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.quote-social-share {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.quote-social-share .share-label {
    font-family: var(--font-sans);
    color: var(--text-faint);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    margin-right: 0.15rem;
    line-height: 1;
}

.quote-social-share .btn-share-icon {
    width: 30px;
    height: 30px;
    padding: 0;
    border-radius: 2px;
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    color: var(--text-muted);
    flex-shrink: 0;
}

/* ==========================================================================
   RESPONSIVIDAD Y MODO IMPRESIÓN
   ========================================================================== */

/* ==========================================================================
   RESPONSIVIDAD Y MODO IMPRESIÓN
   ========================================================================== */

/* Tablets en Orientación Horizontal y Pantallas Medianas (1024px) */
@media (max-width: 1024px) {
    .container {
        padding: 0 1.25rem;
    }

    .frontpage-lead-grid {
        gap: 2rem;
    }

    .section-radar-soberania {
        padding: 2rem 1.5rem;
    }

    .articles-grid-3col {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.75rem;
    }

    .memoria-grid-3col {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }
}

/* Tablets en Orientación Vertical y Laptops Compactas (900px) */
@media (max-width: 900px) {
    .header-topbar {
        grid-template-columns: 1fr;
        gap: 0.5rem;
        text-align: center;
    }

    .topbar-left, .topbar-right {
        justify-content: center;
    }

    .masthead-rules {
        white-space: normal;
    }

    .site-tagline {
        white-space: normal;
    }

    .header-nav {
        margin-top: 1rem;
        position: relative;
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }

    .nav-expedientes-list {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 0.65rem 0.25rem;
        gap: 0.5rem;
        font-size: 0.82rem;
        scrollbar-width: none;
        -ms-overflow-style: none;
        -webkit-overflow-scrolling: touch;
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    .nav-expedientes-list::-webkit-scrollbar {
        display: none;
        width: 0;
        height: 0;
    }

    .nav-expedientes-list li {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .nav-expedientes-list li a {
        display: inline-block;
        white-space: nowrap;
        padding: 0.35rem 0.75rem;
        background: var(--bg-subtle);
        border: 1px solid var(--border-newspaper);
        border-radius: 3px;
        color: var(--text-main);
        text-decoration: none;
        transition: all 0.15s ease;
    }

    .nav-expedientes-list li.active a,
    .nav-expedientes-list li a:hover {
        background: var(--accent-red);
        color: #ffffff;
        border-color: var(--accent-red);
    }

    .frontpage-lead-grid {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    .lead-article {
        padding-right: 0;
    }

    .frontpage-sidebar {
        border-left: none;
        padding-left: 0;
        border-top: 2px solid var(--border-strong);
        padding-top: 2.25rem;
        display: flex;
        flex-direction: column;
        gap: 1.75rem;
        max-width: 820px;
        margin: 0 auto;
    }

    .footer-grid {
        grid-template-columns: 1fr;
        gap: 2.25rem;
    }
}

/* Ajustes Específicos para Tablets (641px a 900px) */
@media (min-width: 641px) and (max-width: 900px) {
    .lead-second-grid {
        grid-template-columns: 1fr 1.35fr;
        gap: 1.5rem;
    }
}

/* Smartphones y Móviles (640px) */
@media (max-width: 640px) {
    .container {
        padding: 0 1rem;
    }

    /* Cabecera Móvil */
    .site-header {
        padding-top: 0;
    }

    .header-topbar {
        font-size: 0.80rem;
        padding: 0.5rem 0;
        gap: 0.35rem;
    }

    .topbar-left {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.4rem;
        text-align: center;
    }

    .badge-soberania {
        font-size: 0.76rem;
        padding: 0.15rem 0.5rem;
    }

    .topbar-center {
        font-size: 0.78rem;
        margin: 0.15rem 0;
    }

    .topbar-right {
        font-size: 0.78rem;
        justify-content: center;
        gap: 0.35rem;
        flex-wrap: wrap;
    }

    .masthead-center {
        padding: 1.25rem 0 0.85rem;
    }

    .site-title {
        font-size: clamp(1.6rem, 7.5vw, 2.35rem);
        line-height: 1.05;
        margin-bottom: 0.5rem;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .masthead-rules {
        gap: 0;
    }

    .masthead-rules::before,
    .masthead-rules::after {
        display: none;
    }

    .site-tagline {
        font-size: 0.92rem;
        line-height: 1.4;
        text-align: center;
    }

    .header-nav {
        margin-top: 0.85rem;
        width: 100%;
        max-width: 100%;
        overflow: hidden;
        position: relative;
    }

    .nav-expedientes-list {
        gap: 0.45rem;
        padding: 0.55rem 0.25rem;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }

    .nav-expedientes-list li a {
        font-size: 0.78rem;
        padding: 0.35rem 0.65rem;
    }

    /* Portada Principal Móvil */
    .frontpage-main {
        padding: 1.5rem 0 3.5rem;
    }

    .frontpage-lead-grid {
        gap: 2rem;
    }

    .lead-article {
        gap: 0.95rem;
    }

    .lead-kicker-wrap {
        flex-wrap: wrap;
        gap: 0.4rem;
    }

    .lead-title {
        font-size: clamp(1.55rem, 5.8vw, 2.05rem);
        line-height: 1.18;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    .lead-excerpt {
        font-size: 1.12rem;
        line-height: 1.55;
    }

    .lead-meta {
        flex-wrap: wrap;
        gap: 0.35rem 0.65rem;
        font-size: 0.85rem;
        padding: 0.45rem 0;
    }

    .lead-image-caption {
        font-size: 0.88rem;
        padding: 0.5rem 0 0;
    }

    /* Caja de Puntos Clave */
    .lead-keypoints-box {
        padding: 1.15rem 1rem;
    }

    .lead-keypoints-title {
        font-size: 0.85rem;
    }

    .lead-keypoints-list li {
        font-size: 0.98rem;
        padding-left: 0.65rem;
    }

    .btn-read-lead {
        width: 100%;
        justify-content: center;
        text-align: center;
        padding: 0.85rem 1.15rem;
        font-size: 0.88rem;
    }

    /* Segunda Noticia Principal Móvil (Colapsa a 1 columna) */
    .lead-second-article {
        margin-top: 1.75rem;
        padding-top: 1.5rem;
    }

    .lead-second-grid {
        grid-template-columns: 1fr;
        gap: 1.15rem;
    }

    .lead-second-thumb img {
        aspect-ratio: 16 / 9;
    }

    .lead-second-thumb-caption {
        font-size: 0.88rem;
    }

    .lead-second-title {
        font-size: 1.3rem;
        line-height: 1.25;
    }

    .lead-second-excerpt {
        font-size: 1.02rem;
    }

    .lead-second-quote-box {
        padding: 0.75rem 0.85rem;
        font-size: 0.95rem;
    }

    .btn-read-lead-sm {
        width: 100%;
        justify-content: center;
        text-align: center;
        padding: 0.75rem 1rem;
    }

    /* Documento de la Semana Móvil */
    .lead-doc-week {
        padding: 1.15rem 1rem;
        margin-top: 1.75rem;
    }

    .doc-week-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.45rem;
    }

    .doc-week-tag {
        font-size: 0.82rem;
    }

    .doc-week-stamp {
        font-size: 0.78rem;
    }

    .doc-week-title {
        font-size: 1.15rem;
    }

    .doc-week-facsimile {
        padding: 1.25rem 0.85rem 0.85rem;
        font-size: 0.88rem;
        line-height: 1.55;
        word-break: break-word;
    }

    .doc-week-facsimile::before {
        font-size: 0.68rem;
        top: -8px;
        right: auto;
        left: 10px;
    }

    .doc-week-note {
        font-size: 0.86rem;
    }

    /* Columna Lateral y Widgets Móvil */
    .frontpage-sidebar {
        display: flex;
        flex-direction: column;
        gap: 1.5rem;
        padding-top: 1.75rem;
    }

    .widget-quote-day-card,
    .widget-power-card,
    .widget-glosario-card {
        padding: 1.25rem 1rem;
    }

    .widget-quote-day-actions {
        flex-direction: column;
        align-items: stretch;
        gap: 0.65rem;
    }

    .btn-copy-quote {
        width: 100%;
        justify-content: center;
        padding: 0.65rem;
        font-size: 0.85rem;
    }

    .link-quotes-archive {
        text-align: center;
        display: block;
    }

    /* Radar de la Soberanía Móvil */
    .section-radar-soberania {
        margin: 2.25rem 0;
        padding: 1.35rem 0.85rem;
    }

    .radar-header-wrap {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.35rem;
        margin-bottom: 1.25rem;
    }

    .radar-headline-title {
        font-size: 1.35rem;
    }

    .radar-headline-subtitle {
        font-size: 0.82rem;
    }

    .radar-metrics-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .radar-metric-card {
        padding: 1.25rem 1rem;
    }

    .radar-metric-num {
        font-size: 1.45rem;
        white-space: normal;
    }

    .radar-metric-desc {
        font-size: 0.98rem;
        margin-bottom: 0.85rem;
    }

    /* Franja Manifiesto Móvil */
    .manifesto-strip {
        margin-bottom: 2.25rem;
        padding: 1.75rem 1rem;
    }

    .manifesto-quote {
        font-size: 1.15rem;
        line-height: 1.5;
    }

    .manifesto-author {
        font-size: 0.85rem;
    }

    /* Memoria Viva Móvil */
    .section-memoria-viva {
        margin: 2.25rem 0;
        padding-top: 1.75rem;
    }

    .memoria-viva-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.35rem;
        margin-bottom: 1.25rem;
    }

    .memoria-viva-title {
        font-size: 1.4rem;
    }

    .memoria-viva-subtitle {
        font-size: 0.82rem;
    }

    .memoria-grid-3col {
        grid-template-columns: 1fr;
        gap: 1.15rem;
    }

    .memoria-card {
        padding: 1.25rem 1rem;
    }

    /* Grilla de Expedientes Móvil */
    .section-expedientes-grid {
        margin-top: 2.25rem;
    }

    .section-headline-bar {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.35rem;
        margin-bottom: 1.25rem;
    }

    .section-headline-title {
        font-size: 1.4rem;
    }

    .articles-grid-3col {
        grid-template-columns: 1fr;
        gap: 1.15rem;
    }

    .article-card {
        padding: 1.25rem 1rem;
    }

    .article-card-meta {
        flex-direction: column;
        gap: 0.25rem;
    }

    /* Vista de Artículo (Single Post) Móvil */
    .single-post-wrapper {
        padding: 1.75rem 0 3.5rem;
    }

    .post-header-container {
        margin-bottom: 1.75rem;
    }

    .post-main-title {
        font-size: clamp(1.7rem, 6.5vw, 2.25rem);
        line-height: 1.2;
    }

    .post-subtitle {
        font-size: 1.15rem;
        line-height: 1.45;
        margin-bottom: 1.25rem;
    }

    .post-meta-bar {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.65rem;
        font-size: 0.88rem;
        padding: 0.65rem 0;
    }

    .btn-print-action {
        display: none;
    }

    .post-content-body {
        font-size: 1.125rem;
        line-height: 1.75;
    }

    .post-content-body h2 {
        font-size: 1.45rem;
        margin: 2rem 0 0.85rem;
    }

    .post-content-body h3 {
        font-size: 1.25rem;
        margin: 1.75rem 0 0.65rem;
    }

    .post-content-body blockquote {
        margin: 1.75rem 0;
        padding: 1rem 1.15rem;
        font-size: 1.05rem;
    }

    .neighborhood-action-box {
        padding: 1.35rem 1rem;
        margin: 2rem 0;
    }

    .neighborhood-action-box h3 {
        font-size: 1.3rem;
    }

    .post-share-footer {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
        margin-top: 2.25rem;
    }

    .share-buttons-group {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
    }

    .share-buttons-group .btn-share:last-child {
        grid-column: 1 / -1;
        justify-content: center;
    }

    /* Página de Citas (/frases) Móvil */
    .page-quotes-container {
        padding: 1.5rem 0 3rem;
    }

    .page-quotes-header {
        padding-bottom: 1.5rem;
        margin-bottom: 1.75rem;
    }

    .page-quotes-headline {
        font-size: clamp(1.65rem, 6.5vw, 2.2rem);
    }

    .page-quotes-lead {
        font-size: 1.05rem;
    }

    .quotes-filter-nav {
        padding: 1rem;
        margin-bottom: 1.5rem;
    }

    .quotes-filter-top {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .quotes-search-box {
        max-width: 100%;
        min-width: 100%;
    }

    .quotes-filter-meta {
        justify-content: space-between;
        width: 100%;
    }

    .quotes-pills-bar {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .quotes-pills-scroll {
        overflow-x: auto;
        width: 100%;
        padding-bottom: 0.35rem;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    .quotes-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }

    .quote-card {
        padding: 1.35rem 1rem;
    }

    .quote-text {
        font-size: 1.12rem;
        line-height: 1.5;
    }

    .quote-actions-bar {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        gap: 0.65rem;
        flex-wrap: wrap;
    }

    .btn-copy-quote {
        width: auto;
    }

    .quote-social-share {
        display: inline-flex;
        align-items: center;
        gap: 0.35rem;
    }

    /* Pie de Imprenta (Footer) Móvil */
    .site-footer {
        padding: 2.5rem 0 1.75rem;
        margin-top: 3.5rem;
    }

    .footer-grid {
        gap: 2rem;
    }

    .footer-bottom-bar {
        flex-direction: column;
        gap: 0.65rem;
        text-align: center;
    }
}

/* Teléfonos Móviles Ultra-Compactos (Menos de 380px) */
@media (max-width: 380px) {
    .container {
        padding: 0 0.75rem;
    }

    .quote-actions-bar {
        flex-direction: column;
        align-items: stretch;
        gap: 0.65rem;
    }

    .btn-copy-quote {
        width: 100%;
        justify-content: center;
    }

    .quote-social-share {
        justify-content: space-between;
        width: 100%;
    }

    .site-title {
        font-size: clamp(1.45rem, 7.8vw, 1.85rem);
    }

    .lead-title {
        font-size: 1.4rem;
    }
}

/* ==========================================================================
   FICHERO DE CASOS & ROTAFOLIO EDITORIAL (/fichero)
   ========================================================================== */

.fichero-page-wrapper {
    padding: 3rem 0 6rem;
    background: var(--bg-paper);
}

.fichero-header {
    text-align: center;
    max-width: 900px;
    margin: 0 auto 2.5rem;
}

.fichero-header-kicker {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 1rem;
    font-family: var(--font-sans);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--accent-red);
}

.badge-fichero {
    background: var(--bg-surface);
    border: 1px solid var(--accent-red);
    padding: 0.25rem 0.65rem;
    border-radius: 2px;
}

.fichero-date {
    color: var(--text-muted);
}

.fichero-title {
    font-family: var(--font-serif);
    font-size: clamp(2.2rem, 5vw, 3.4rem);
    font-weight: 800;
    line-height: 1.12;
    color: var(--text-main);
    margin: 0 0 1.25rem;
    letter-spacing: -0.02em;
}

.fichero-subtitle {
    font-family: var(--font-sans);
    font-size: 1.1rem;
    line-height: 1.6;
    color: var(--text-muted);
    margin: 0 auto 2rem;
}

.fichero-subtitle strong {
    color: var(--text-main);
}

/* Barra de Controles (Modo y Botón Imprimir) */
.fichero-controls-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 0.85rem 1.25rem;
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    border-radius: 3px;
    margin: 0 auto;
}

.view-switch-group {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: var(--bg-subtle);
    padding: 0.25rem;
    border-radius: 3px;
    border: 1px solid var(--border-newspaper);
}

.btn-view-mode {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    background: transparent;
    border: none;
    padding: 0.45rem 0.85rem;
    font-family: var(--font-sans);
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--text-muted);
    cursor: pointer;
    border-radius: 2px;
    transition: all 0.15s ease;
}

.btn-view-mode:hover {
    color: var(--text-main);
}

.btn-view-mode.active {
    background: var(--bg-surface);
    color: var(--accent-red);
    box-shadow: 0 1px 4px rgba(0,0,0,0.06);
}

.btn-print-gaceta {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    padding: 0.55rem 1.1rem;
    font-family: var(--font-sans);
    font-size: 0.84rem;
    font-weight: 700;
    color: var(--text-main);
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-print-gaceta:hover {
    background: var(--text-main);
    color: #fff;
    border-color: var(--text-main);
}

/* Etapa del Fichero (Rotafolio + Fichas) */
.fichero-stage {
    max-width: 1040px;
    margin: 0 auto;
}

/* Rotafolio: Lengüetas / Tabs de Casos */
.fichero-tabs-nav {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 4px;
    width: 100%;
    margin: 0;
    padding: 0;
    border-bottom: none;
    position: relative;
    z-index: 2;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.fichero-tabs-nav::-webkit-scrollbar {
    display: none;
}

.fichero-tab-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.85rem 0.5rem;
    background: var(--bg-subtle);
    border: 1px solid var(--border-newspaper);
    border-bottom: 1px solid var(--border-newspaper);
    border-radius: 4px 4px 0 0;
    font-family: var(--font-sans);
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--text-muted);
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
    position: relative;
    text-align: center;
}

.fichero-tab-btn:hover {
    background: #efefef;
    color: var(--text-main);
}

.fichero-tab-btn.active {
    background: var(--bg-surface);
    color: var(--accent-red);
    border-top: 3px solid var(--accent-red);
    border-bottom: 2px solid var(--bg-surface);
    margin-bottom: -1px;
    z-index: 3;
    box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.03);
}

.tab-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: var(--bg-paper);
    border: 1px solid var(--border-newspaper);
    border-radius: 50%;
    font-family: var(--font-mono, monospace);
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--text-muted);
}

.fichero-tab-btn.active .tab-num {
    background: var(--accent-red);
    color: #fff;
    border-color: var(--accent-red);
}

/* Área de Fichas */
.fichero-content-area {
    margin-top: 0;
    position: relative;
}

.fichero-card {
    display: none;
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    border-left: 6px solid var(--accent-red);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    padding: 2.75rem 3.25rem;
    margin-bottom: 2rem;
    border-radius: 0 0 4px 4px;
    position: relative;
    z-index: 1;
}

.fichero-card.active {
    display: block;
    animation: fcardSlideUp 0.28s ease-out;
}

@keyframes fcardSlideUp {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Cabecera de la Ficha Individual */
.fcard-meta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
    gap: 1rem;
}

.fcard-kicker {
    font-family: var(--font-sans);
    font-size: 0.8rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--accent-red);
}

.fcard-serial {
    font-family: var(--font-mono, monospace);
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--text-faint);
    background: var(--bg-subtle);
    padding: 0.2rem 0.5rem;
    border: 1px solid var(--border-newspaper);
    border-radius: 2px;
}

.fcard-title {
    font-family: var(--font-serif);
    font-size: clamp(1.8rem, 3.8vw, 2.6rem);
    font-weight: 800;
    line-height: 1.18;
    color: var(--text-main);
    margin: 0 0 0.5rem;
    letter-spacing: -0.01em;
}

.fcard-sub {
    font-family: var(--font-serif);
    font-style: italic;
    font-size: 1.15rem;
    color: var(--text-muted);
    margin: 0 0 1.75rem;
    line-height: 1.45;
}

/* Stat Callout */
.fcard-stat-callout {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    background: var(--bg-subtle);
    border: 1px solid var(--border-newspaper);
    border-left: 4px solid var(--accent-amber);
    padding: 1.15rem 1.6rem;
    margin-bottom: 2.25rem;
    border-radius: 2px;
}

.stat-callout-number {
    font-family: var(--font-sans);
    font-size: clamp(2.4rem, 4vw, 3.2rem);
    font-weight: 900;
    line-height: 1;
    color: var(--accent-red);
    flex-shrink: 0;
    letter-spacing: -0.03em;
}

.stat-callout-body {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.stat-callout-body strong {
    font-family: var(--font-sans);
    font-size: 0.95rem;
    font-weight: 800;
    color: var(--text-main);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.stat-callout-body span {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    color: var(--text-muted);
}

/* Grilla de 4 Dimensiones Analíticas */
.fcard-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.fcard-block {
    background: var(--bg-subtle);
    border: 1px solid var(--border-newspaper);
    padding: 1.4rem 1.6rem;
    border-radius: 2px;
    display: flex;
    flex-direction: column;
}

.fblock-header {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.85rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--border-newspaper);
}

.fblock-icon {
    display: inline-flex;
    color: var(--accent-red);
}

.fblock-title {
    font-family: var(--font-sans);
    font-size: 0.84rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--text-main);
    margin: 0;
}

.fblock-body {
    font-family: var(--font-serif);
    font-size: 0.96rem;
    line-height: 1.6;
    color: var(--text-main);
    margin: 0;
}

.fblock-quote {
    font-family: var(--font-serif);
    font-style: italic;
    font-size: 0.98rem;
    line-height: 1.6;
    color: var(--text-main);
    margin: 0;
    padding-left: 0.75rem;
    border-left: 3px solid var(--accent-red);
}

.fblock-quote cite {
    display: block;
    font-family: var(--font-sans);
    font-style: normal;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--text-muted);
    margin-top: 0.75rem;
}

/* Bloque Destacado de Salida Comunitaria */
.fcard-salida-section {
    background: #fafaf9;
    border: 1.5px solid #d4af37;
    border-radius: 2px;
    padding: 1.5rem 1.8rem;
    margin-bottom: 2.25rem;
}

.salida-section-header {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    color: #b45309;
    margin-bottom: 1rem;
}

.salida-title {
    font-family: var(--font-sans);
    font-size: 0.95rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #92400e;
    margin: 0;
}

.salida-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem 1.5rem;
}

.salida-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    font-family: var(--font-sans);
    font-size: 0.9rem;
    line-height: 1.5;
    color: #1f2937;
}

.salida-bullet {
    color: #b45309;
    font-weight: 900;
    flex-shrink: 0;
}

/* Barra de Acciones de la Ficha */
.fcard-actions-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    padding-top: 1.75rem;
    border-top: 1px solid var(--border-newspaper);
}

.fcard-actions-left,
.fcard-actions-right {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.btn-fcard-primary {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--accent-red);
    color: #fff;
    padding: 0.6rem 1.25rem;
    font-family: var(--font-sans);
    font-size: 0.88rem;
    font-weight: 800;
    border-radius: 2px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.btn-fcard-primary:hover {
    background: #7f1d1d;
    transform: translateY(-1px);
    box-shadow: 0 3px 8px rgba(153, 27, 27, 0.2);
}

.btn-fcard-audio {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    background: var(--bg-subtle);
    border: 1px solid var(--border-newspaper);
    color: var(--text-main);
    padding: 0.6rem 1.1rem;
    font-family: var(--font-sans);
    font-size: 0.86rem;
    font-weight: 700;
    border-radius: 2px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.btn-fcard-audio:hover {
    border-color: var(--accent-red);
    color: var(--accent-red);
}

.btn-fcard-copy {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    color: var(--text-main);
    padding: 0.6rem 1.05rem;
    font-family: var(--font-sans);
    font-size: 0.86rem;
    font-weight: 700;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-fcard-copy:hover {
    background: var(--text-main);
    color: #fff;
}

.btn-fcard-copy.copied {
    background: #059669 !important;
    border-color: #059669 !important;
    color: #fff !important;
}

.btn-fcard-print {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: var(--bg-subtle);
    border: 1px solid var(--border-newspaper);
    color: var(--text-muted);
    padding: 0.6rem 0.95rem;
    font-family: var(--font-sans);
    font-size: 0.84rem;
    font-weight: 700;
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-fcard-print:hover {
    color: var(--text-main);
    border-color: var(--text-main);
}

/* Barra de Navegación Inferior (Rotafolio) */
.fichero-nav-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem 0;
    border-top: 1px solid var(--border-newspaper);
    margin-top: 1rem;
}

.btn-nav-prev,
.btn-nav-next {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    padding: 0.65rem 1.3rem;
    font-family: var(--font-sans);
    font-size: 0.88rem;
    font-weight: 800;
    color: var(--text-main);
    border-radius: 2px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-nav-prev:hover:not(:disabled),
.btn-nav-next:hover:not(:disabled) {
    background: var(--text-main);
    color: #fff;
    border-color: var(--text-main);
}

.btn-nav-prev:disabled,
.btn-nav-next:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

.fichero-page-indicator {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--text-muted);
}

/* Modo Mosaico: Todas las Fichas Visibles */
.fichero-content-area.mode-mosaico .fichero-card {
    display: block !important;
    margin-bottom: 3.5rem;
}

/* Responsive para Pantallas Móviles */
@media (max-width: 768px) {
    .fichero-card {
        padding: 1.75rem 1.25rem;
    }

    .fcard-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .salida-list {
        grid-template-columns: 1fr;
    }

    .fcard-stat-callout {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .fcard-actions-bar {
        flex-direction: column;
        align-items: stretch;
    }

    .fcard-actions-left,
    .fcard-actions-right {
        width: 100%;
        justify-content: stretch;
    }

    .fcard-actions-left a,
    .fcard-actions-right button {
        flex: 1;
        justify-content: center;
    }

    .fichero-controls-bar {
        flex-direction: column;
        align-items: stretch;
    }

    .view-switch-group {
        width: 100%;
    }

    .btn-view-mode {
        flex: 1;
        justify-content: center;
    }

    .btn-print-gaceta {
        width: 100%;
        justify-content: center;
    }

    .fichero-tabs-nav {
        display: flex;
        overflow-x: auto;
        gap: 0.35rem;
        padding-bottom: 2px;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .fichero-tabs-nav::-webkit-scrollbar {
        display: none;
    }

    .fichero-tab-btn {
        flex: 0 0 auto;
        padding: 0.75rem 0.95rem;
    }
}

/* ==========================================================================
   BOLETÍN DE TRINCHERA (NEWSLETTER POPULAR)
   ========================================================================== */
.dossier-newsletter-box {
    margin: 3.5rem 0 2rem;
    padding: 2.2rem 2.5rem;
    background: #141414;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-left: 4px solid var(--accent-red, #c0392b);
    border-radius: 4px;
    color: #e5e5e5;
}

.dnb-content {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}

.dnb-icon {
    flex-shrink: 0;
    color: var(--accent-red, #c0392b);
    margin-top: 0.2rem;
}

.dnb-title {
    font-family: var(--font-headline, 'Georgia', serif);
    font-size: 1.45rem;
    font-weight: 700;
    color: #ffffff;
    margin: 0 0 0.4rem;
    line-height: 1.25;
}

.dnb-desc {
    font-size: 0.95rem;
    line-height: 1.5;
    color: #b0b0b0;
    margin: 0;
}

.dnb-form {
    max-width: 640px;
}

.dnb-input-group {
    display: flex;
    gap: 0.75rem;
}

.dnb-input {
    flex: 1;
    min-width: 0;
    background: #0a0a0a;
    border: 1px solid #333333;
    border-radius: 3px;
    padding: 0.75rem 1rem;
    font-size: 0.95rem;
    color: #ffffff;
    font-family: inherit;
    transition: border-color 0.2s ease;
}

.dnb-input:focus {
    outline: none;
    border-color: var(--accent-red, #c0392b);
}

.dnb-input::placeholder {
    color: #666666;
}

.dnb-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--accent-red, #c0392b);
    color: #ffffff;
    border: none;
    border-radius: 3px;
    padding: 0.75rem 1.4rem;
    font-size: 0.9rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color 0.2s ease, transform 0.1s ease;
}

.dnb-btn:hover {
    background: #d63031;
}

.dnb-btn:active {
    transform: translateY(1px);
}

.dnb-feedback {
    margin-top: 0.9rem;
    padding: 0.65rem 0.9rem;
    border-radius: 3px;
    font-size: 0.88rem;
    line-height: 1.4;
}

.dnb-feedback.success {
    background: rgba(46, 204, 113, 0.12);
    border: 1px solid rgba(46, 204, 113, 0.3);
    color: #2ecc71;
}

.dnb-feedback.error {
    background: rgba(231, 76, 60, 0.12);
    border: 1px solid rgba(231, 76, 60, 0.3);
    color: #e74c3c;
}

@media (max-width: 640px) {
    .dossier-newsletter-box {
        padding: 1.5rem 1.25rem;
    }
    .dnb-input-group {
        flex-direction: column;
    }
    .dnb-btn {
        justify-content: center;
        width: 100%;
    }
}

.print-only-masthead,
.print-only-colophon {
    display: none;
}

@media print {
    @page {
        margin: 1.2cm 1cm;
        size: A4 portrait;
    }
    body {
        background: #fff !important;
        color: #000 !important;
        font-size: 9.5pt;
        line-height: 1.35;
        font-family: "Georgia", "Times New Roman", serif !important;
    }

    .site-header, .header-nav, .post-share-footer, .site-footer, 
    .btn-print-action, .meta-actions-box, .article-audio-card, 
    .post-glossary-banner, .dossier-newsletter-box, .audio-progress-wrap, 
    .quick-share-group, .glossary-popover {
        display: none !important;
    }

    /* Cabecera periodística de combate para la gaceta impresa */
    .print-only-masthead {
        display: block !important;
        border-bottom: 2px solid #000;
        margin-bottom: 0.8rem;
        padding-bottom: 0.4rem;
        text-align: center;
    }
    .pom-row-top {
        display: flex;
        justify-content: space-between;
        font-size: 8pt;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        border-bottom: 1px solid #000;
        padding-bottom: 2px;
        margin-bottom: 4px;
    }
    .pom-title {
        font-family: "Georgia", serif;
        font-size: 24pt;
        font-weight: 900;
        letter-spacing: 0.04em;
        margin: 0;
        line-height: 1;
        text-transform: uppercase;
    }
    .pom-tagline {
        font-size: 8pt;
        font-style: italic;
        margin: 2px 0 4px;
        letter-spacing: 0.06em;
    }
    .pom-row-bottom {
        display: flex;
        justify-content: space-between;
        font-size: 7.5pt;
        font-weight: 700;
        border-top: 1px solid #000;
        padding-top: 2px;
        letter-spacing: 0.05em;
    }

    .single-post-wrapper {
        padding: 0 !important;
    }

    .post-kicker-tag {
        font-size: 8.5pt !important;
        font-weight: 800 !important;
        text-transform: uppercase;
        border: 1px solid #000 !important;
        padding: 1px 5px !important;
        display: inline-block;
        margin-bottom: 4px !important;
    }

    .post-main-title {
        font-size: 17pt !important;
        line-height: 1.15 !important;
        margin-bottom: 0.3rem !important;
        color: #000 !important;
        font-weight: 900 !important;
    }

    .post-subtitle {
        font-size: 9.5pt !important;
        line-height: 1.3 !important;
        font-style: italic;
        margin-bottom: 0.5rem !important;
        color: #222 !important;
    }

    .post-meta-bar {
        border-top: 1px solid #999;
        border-bottom: 1px solid #999;
        padding: 3px 0 !important;
        margin-bottom: 0.6rem !important;
        font-size: 8pt !important;
    }

    .post-featured-figure {
        max-width: 100% !important;
        margin: 0.4rem 0 0.6rem !important;
        break-inside: avoid;
        text-align: center;
    }

    .post-featured-image {
        max-height: 180px !important;
        filter: grayscale(100%);
    }

    .post-featured-caption {
        font-size: 7.5pt !important;
        font-style: italic;
        margin-top: 2px;
    }

    .post-content-body {
        max-width: 100% !important;
        column-count: 2;
        column-gap: 1.2cm;
        font-size: 8.5pt !important;
        line-height: 1.35 !important;
        color: #000 !important;
        text-align: justify;
        hyphens: auto;
    }

    .post-content-body h2 {
        font-size: 10.5pt !important;
        margin: 0.7rem 0 0.3rem !important;
        border-bottom: 1px solid #000;
        padding-bottom: 2px;
        break-after: avoid;
    }

    .post-content-body h3 {
        font-size: 9.5pt !important;
        margin: 0.5rem 0 0.2rem !important;
        break-after: avoid;
    }

    .post-content-body p {
        margin-bottom: 0.45rem !important;
    }

    .neighborhood-action-box {
        border: 1.5px solid #000 !important;
        background: #fdfdfd !important;
        break-inside: avoid;
        padding: 0.6rem !important;
        margin: 0.7rem 0 !important;
    }

    blockquote {
        border-left: 2.5px solid #000 !important;
        background: none !important;
        break-inside: avoid;
        padding: 0.4rem 0.6rem !important;
        font-size: 8.5pt !important;
        margin: 0.5rem 0 !important;
    }

    .print-only-colophon {
        display: block !important;
        margin-top: 1.2rem;
        padding-top: 0.5rem;
        border-top: 2px solid #000;
        text-align: center;
        break-inside: avoid;
    }
    .print-only-colophon h4 {
        font-size: 8.5pt;
        margin: 0 0 2px;
        text-transform: uppercase;
        letter-spacing: 0.06em;
    }
    .print-only-colophon p {
        font-size: 7.5pt;
        font-style: italic;
        margin: 0;
    }

    /* Impresión de Fichas de Casos / Rotafolio */
    .fichero-page-wrapper {
        padding: 0 !important;
        background: #fff !important;
    }

    .fichero-controls-bar,
    .fichero-tabs-nav,
    .fichero-nav-footer,
    .fcard-actions-bar {
        display: none !important;
    }

    .fichero-card {
        display: block !important;
        box-shadow: none !important;
        border: 1.5px solid #000 !important;
        border-left: 5px solid #000 !important;
        padding: 1.2cm 1cm !important;
        margin-bottom: 2cm !important;
        page-break-after: always;
        break-after: page;
    }

    body.print-single-card-mode .fichero-card:not(.active) {
        display: none !important;
    }
}

/* ==========================================================================
   SISTEMA DE GLOSARIO CRÍTICO, TOOLTIPS DE DESARME & PÁGINA ANALÍTICA
   ========================================================================== */

/* Término resaltado en el cuerpo de los artículos (discreto y no invasivo) */
.glossary-term {
    position: relative;
    display: inline;
    cursor: help;
    border-bottom: 1.5px dotted var(--accent-red);
    transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
    padding: 0 1px;
}

.glossary-term:hover,
.glossary-term:focus,
.glossary-term:focus-within {
    color: var(--accent-red);
    background-color: rgba(184, 51, 42, 0.07);
    outline: none;
}

/* Popover Flotante de Desarme */
.glossary-popover {
    display: none;
    position: absolute;
    bottom: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%);
    width: min(360px, 86vw);
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    border-top: 3px solid var(--accent-red);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.16);
    border-radius: 4px;
    padding: 1.15rem;
    z-index: 200;
    text-align: left;
    font-family: var(--font-sans);
    font-size: 0.85rem;
    line-height: 1.45;
    color: var(--text-main);
    cursor: default;
    pointer-events: auto;
}

.glossary-popover::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-width: 7px;
    border-style: solid;
    border-color: var(--border-newspaper) transparent transparent transparent;
}

.glossary-term:hover .glossary-popover,
.glossary-term:focus .glossary-popover,
.glossary-term:focus-within .glossary-popover {
    display: block;
    animation: popoverFadeIn 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes popoverFadeIn {
    from {
        opacity: 0;
        transform: translate(-50%, 6px);
    }
    to {
        opacity: 1;
        transform: translate(-50%, 0);
    }
}

.popover-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.45rem;
}

.popover-badge {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--accent-red);
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.popover-category {
    font-size: 0.72rem;
    color: var(--text-muted);
    font-style: italic;
}

.popover-title {
    display: block;
    font-family: var(--font-serif);
    font-size: 1.1rem;
    line-height: 1.25;
    margin-bottom: 0.65rem;
    color: var(--text-main);
}

.popover-block {
    margin-bottom: 0.55rem;
    padding: 0.5rem 0.65rem;
    border-radius: 3px;
    font-size: 0.82rem;
    line-height: 1.4;
}

.popover-block p {
    margin: 0 !important;
    font-family: var(--font-sans) !important;
    font-size: 0.82rem !important;
}

.popover-hegemonic {
    background: rgba(184, 51, 42, 0.05);
    border-left: 2px solid rgba(184, 51, 42, 0.5);
    color: var(--text-muted);
}

.popover-reality {
    background: rgba(0, 0, 0, 0.03);
    border-left: 2px solid var(--accent-red);
    color: var(--text-main);
}

.popover-lead {
    display: block;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 2px;
}

.popover-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.65rem;
    padding-top: 0.55rem;
    border-top: 1px solid var(--border-newspaper);
    font-size: 0.74rem;
}

.popover-ref {
    color: var(--text-muted);
    font-style: italic;
    max-width: 55%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.popover-link {
    color: var(--accent-red);
    font-weight: 700;
    text-decoration: none;
    transition: opacity 0.15s ease;
}

.popover-link:hover {
    text-decoration: underline;
}

/* Banner de Glosario al pie del artículo */
.post-glossary-banner {
    margin: 2.75rem 0 1.5rem;
    padding: 1.35rem 1.65rem;
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    border-left: 4px solid var(--accent-red);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.02);
}

.pg-banner-icon {
    flex-shrink: 0;
    color: var(--accent-red);
}

.pg-banner-text {
    flex-grow: 1;
}

.pg-banner-title {
    font-family: var(--font-serif);
    font-size: 1.15rem;
    margin: 0 0 0.35rem;
    color: var(--text-main);
}

.pg-banner-desc {
    margin: 0;
    font-size: 0.88rem;
    color: var(--text-muted);
    line-height: 1.5;
}

.btn-goto-glossary {
    flex-shrink: 0;
    display: inline-block;
    padding: 0.7rem 1.25rem;
    background: var(--text-main);
    color: var(--bg-surface);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.85rem;
    border-radius: 3px;
    white-space: nowrap;
    transition: background-color 0.15s ease;
}

.btn-goto-glossary:hover {
    background: var(--accent-red);
    color: #fff;
}

/* ==========================================================================
   PÁGINA DEDICADA: GLOSARIO CRÍTICO (/glosario)
   ========================================================================== */

.glosario-page-wrapper {
    padding: 2.5rem 0 5rem;
    background: var(--bg-main);
}

.glosario-header {
    max-width: 860px;
    margin: 0 auto 3rem;
    text-align: center;
}

.glosario-badge-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    font-size: 0.75rem;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.08em;
    background: rgba(184, 51, 42, 0.08);
    color: var(--accent-red);
    border: 1px solid rgba(184, 51, 42, 0.25);
    border-radius: 3px;
    margin-bottom: 1rem;
}

.glosario-main-title {
    font-family: var(--font-serif);
    font-size: clamp(2rem, 5vw, 2.85rem);
    line-height: 1.15;
    margin-bottom: 1.15rem;
    color: var(--text-main);
    font-weight: 700;
}

.glosario-lead-desc {
    font-family: var(--font-serif);
    font-size: 1.12rem;
    line-height: 1.65;
    color: var(--text-muted);
    margin-bottom: 2rem;
}

.glosario-controls-bar {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    align-items: center;
}

.glosario-search-wrap {
    position: relative;
    width: 100%;
    max-width: 580px;
}

.glosario-search-wrap .search-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--text-muted);
    pointer-events: none;
}

.glosario-search-input {
    width: 100%;
    padding: 0.85rem 1rem 0.85rem 2.6rem;
    border: 1.5px solid var(--border-newspaper);
    background: var(--bg-surface);
    border-radius: 4px;
    font-size: 0.95rem;
    font-family: var(--font-sans);
    color: var(--text-main);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.03);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.glosario-search-input:focus {
    outline: none;
    border-color: var(--accent-red);
    box-shadow: 0 0 0 3px rgba(184, 51, 42, 0.15);
}

.search-count-badge {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.72rem;
    color: var(--text-muted);
    background: var(--bg-subtle);
    padding: 2px 8px;
    border-radius: 12px;
    border: 1px solid var(--border-newspaper);
}

.glosario-category-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
}

.cat-pill {
    border: 1px solid var(--border-newspaper);
    background: var(--bg-surface);
    padding: 5px 12px;
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    border-radius: 20px;
    transition: all 0.15s ease;
    color: var(--text-main);
    font-family: var(--font-sans);
}

.cat-pill:hover {
    border-color: var(--accent-red);
    color: var(--accent-red);
}

.cat-pill.active {
    background: var(--text-main);
    color: var(--bg-surface);
    border-color: var(--text-main);
}

/* Cuadrícula de Fichas */
.glosario-cards-container {
    max-width: 980px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.glosario-card {
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    border-top: 4px solid var(--accent-red);
    border-radius: 4px;
    padding: 1.75rem 2rem;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02);
    transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease;
}

.glosario-card.card-highlight {
    border-color: var(--accent-red) !important;
    box-shadow: 0 0 0 4px rgba(184, 51, 42, 0.25) !important;
    transform: translateY(-2px);
}

.gcard-topbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.gcard-category {
    font-size: 0.75rem;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.05em;
    color: var(--accent-red);
}

.gcard-topbar-actions {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.gcard-share-wa {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.72rem;
    font-family: var(--font-sans);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #15803d;
    background: rgba(37, 211, 102, 0.08);
    border: 1px solid rgba(37, 211, 102, 0.3);
    padding: 2px 7px;
    border-radius: 3px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.gcard-share-wa:hover {
    background: #25d366;
    color: #ffffff;
    border-color: #25d366;
}

.gcard-anchor-link {
    font-size: 0.75rem;
    color: var(--text-muted);
    font-family: monospace;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 6px;
    border-radius: 3px;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.gcard-anchor-link:hover {
    background: var(--bg-subtle);
    color: var(--text-main);
}

.gcard-term-title {
    font-family: var(--font-serif);
    font-size: 1.65rem;
    line-height: 1.2;
    margin: 0 0 1.25rem;
    color: var(--text-main);
}

.gcard-comparison-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    margin-bottom: 1.25rem;
}

.gcard-hegemonic-box,
.gcard-reality-box {
    padding: 1.15rem;
    border-radius: 3px;
}

.gcard-hegemonic-box {
    background: rgba(184, 51, 42, 0.04);
    border: 1px solid rgba(184, 51, 42, 0.18);
    border-left: 3px solid rgba(184, 51, 42, 0.6);
}

.gcard-reality-box {
    background: rgba(0, 0, 0, 0.02);
    border: 1px solid var(--border-newspaper);
    border-left: 3px solid var(--accent-red);
}

.gcard-box-label {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
    margin-bottom: 0.65rem;
}

.gcard-box-label.label-reality {
    color: var(--accent-red);
}

.gcard-hegemonic-quote {
    margin: 0;
    font-style: italic;
    font-size: 0.92rem;
    line-height: 1.5;
    color: var(--text-muted);
    border: none;
    padding: 0;
}

.gcard-reality-text {
    margin: 0;
    font-size: 0.92rem;
    line-height: 1.5;
    color: var(--text-main);
    font-weight: 500;
}

.gcard-concept-body {
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid var(--border-newspaper);
}

.gcard-section-subtitle {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
    margin: 0 0 0.5rem;
    font-weight: 700;
}

.gcard-concept-body p {
    font-family: var(--font-serif);
    font-size: 1.05rem;
    line-height: 1.6;
    color: var(--text-main);
    margin: 0;
}

.gcard-quote-box {
    margin-top: 1.25rem;
    padding: 1rem 1.25rem;
    background: var(--bg-subtle);
    border-left: 3px solid var(--text-main);
    border-radius: 0 3px 3px 0;
}

.gcard-quote-text {
    margin: 0 0 0.4rem;
    font-family: var(--font-serif);
    font-style: italic;
    font-size: 0.95rem;
    line-height: 1.55;
    color: var(--text-main);
}

.gcard-quote-author {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-muted);
}

.gcard-footer-relations {
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px dashed var(--border-newspaper);
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.gcard-relations-label {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-muted);
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.gcard-relations-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.gcard-relation-link {
    display: inline-block;
    padding: 5px 12px;
    font-size: 0.8rem;
    background: var(--bg-surface);
    border: 1px solid var(--border-newspaper);
    border-radius: 3px;
    text-decoration: none;
    color: var(--text-main);
    font-weight: 500;
    transition: all 0.15s ease;
}

.gcard-relation-link:hover {
    background: var(--text-main);
    color: var(--bg-surface);
    border-color: var(--text-main);
}

.glosario-no-results {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--text-muted);
    font-family: var(--font-serif);
    font-size: 1.15rem;
}

/* Responsividad para Móviles del Glosario y Tooltips */
@media (max-width: 768px) {
    .gcard-comparison-grid {
        grid-template-columns: 1fr;
        gap: 0.85rem;
    }

    .post-glossary-banner {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .btn-goto-glossary {
        width: 100%;
        text-align: center;
    }

    .glosario-card {
        padding: 1.25rem 1rem;
    }

    .gcard-term-title {
        font-size: 1.35rem;
    }

    .glossary-popover {
        width: 88vw;
        max-width: 320px;
        padding: 1rem;
    }
}