/* Chile Sin Maquillaje · web v4 (3-nov-2026)
   Sello: sobrio, editorial, con un toque técnico. Dos familias: Source Serif 4 (titulares) e IBM Plex Sans (texto y cifras),
   IBM Plex Mono solo para etiquetas y datos. Colores de la bandera usados con mesura: azul para acciones, rojo solo como acento. */

:root {
  /* Tema único (4-nov-2026, paleta C "Hierro y Bronce" elegida por Don Victor): 60 % negro hierro, 30 % grafito, 10 % dorado. Sin modo claro. */
  --fondo: #0b0b0c;
  --fondo-2: #111214;
  --superficie: #1a1b1f;
  --superficie-2: #2a2d33;
  --tinta: #ede7da;
  --tinta-2: #c9c2b3;
  --tinta-3: #9a958a;
  --linea: rgba(236, 230, 216, .12);
  --linea-2: rgba(236, 230, 216, .2);
  --linea-3: rgba(236, 230, 216, .32);
  --azul: #e7bc54;          /* acento dorado (enlaces y acentos); el nombre se mantiene para no tocar todo el CSS */
  --azul-bandera: #0b3b8c;
  --azul-hover: #f2d27e;
  --azul-suave: rgba(231, 188, 84, .16);
  --rojo: #e7bc54;          /* 4-nov: el acento único pasa a dorado; el rojo de la bandera queda solo en la franja */
  --rojo-bandera: #c8102e;
  --blanco-btn: #0b0b0c;
  --sombra: 0 1px 0 rgba(236, 230, 216, .04) inset, 0 24px 48px -28px rgba(0, 0, 0, .8);
  --grano: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='1 0 0 0 0 1 0 0 0 0 1 0 0 0 0 0 0 0 0 .07'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
  --trama: repeating-linear-gradient(0deg, rgba(255,255,255,.028) 0 1px, transparent 1px 3px), repeating-linear-gradient(90deg, rgba(0,0,0,.10) 0 1px, transparent 1px 4px);
  --serif: "Newsreader", "Source Serif 4", "Iowan Old Style", Georgia, serif;
  --sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --chico: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --ancho: 1180px;
  --margen: clamp(16px, 4vw, 40px);
  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 80px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
body { margin: 0; background: var(--fondo); color: var(--tinta); font-family: var(--sans); font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow-x: hidden; font-feature-settings: "tnum" 0; }
img { max-width: 100%; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 600; letter-spacing: -.012em; line-height: 1.12; margin: 0; text-wrap: balance; font-optical-sizing: auto; }
p { margin: 0 0 1em; }
.envoltura { max-width: var(--ancho); margin: 0 auto; padding: 0 var(--margen); }
.num { font-variant-numeric: tabular-nums; }
.salto { position: absolute; left: -999px; top: 8px; background: var(--azul); color: var(--blanco-btn); padding: 8px 12px; z-index: 99; }
.salto:focus { left: 8px; }
:focus-visible { outline: 2px solid var(--azul); outline-offset: 3px; }

/* Franja de bandera */
.franja { height: 3px; display: grid; grid-template-columns: 1fr 2fr; }
.franja i { background: var(--azul); }
.franja b { background: var(--rojo); }

/* Cabecera */
.cabecera { position: sticky; top: 0; z-index: 30; background: color-mix(in srgb, var(--fondo) 92%, transparent); backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--linea); }
.cabecera .envoltura { display: flex; align-items: center; gap: 24px; height: 64px; }
.marca { display: flex; align-items: center; gap: 12px; text-decoration: none; flex-shrink: 0; }
.marca img { height: 34px; width: auto; border-radius: 2px; }
.marca span { font-family: var(--mono); font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-3); border-left: 1px solid var(--linea-2); padding-left: 12px; line-height: 1.3; }
.menu { display: flex; gap: 22px; margin-left: auto; font-size: .88rem; font-weight: 500; }
.menu a { text-decoration: none; color: var(--tinta-2); padding: 6px 0; border-bottom: 1px solid transparent; transition: color .2s, border-color .2s; white-space: nowrap; }
.menu a:hover, .menu a[aria-current="page"] { color: var(--tinta); border-bottom-color: var(--rojo); }
.acciones { display: flex; align-items: center; gap: 10px; }
.menu-movil { display: none; position: relative; }
.menu-movil summary { list-style: none; cursor: pointer; width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid var(--linea-2); border-radius: 50%; color: var(--tinta-2); }
.menu-movil summary::-webkit-details-marker { display: none; }
.menu-movil nav { position: absolute; right: 0; top: 46px; background: var(--superficie); border: 1px solid var(--linea); box-shadow: var(--sombra); padding: 8px; min-width: 220px; display: grid; }
.menu-movil nav a { text-decoration: none; padding: 10px 12px; font-size: .95rem; border-radius: 4px; }
.menu-movil nav a:hover { background: var(--superficie-2); }
@media (max-width: 1020px) { .menu { display: none; } .menu-movil { display: block; } .acciones { margin-left: auto; } }
@media (max-width: 520px) { .marca span { display: none; } .acciones .btn { display: none; } }

/* Botones */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; font: 600 .9rem/1 var(--sans); letter-spacing: .01em; text-decoration: none; padding: 14px 22px; border-radius: 4px; border: 1px solid transparent; cursor: pointer; transition: background .2s, color .2s, border-color .2s; text-align: center; }
.btn-primario { background: var(--azul); color: var(--blanco-btn); }
.btn-primario:hover { background: var(--azul-hover); }
.btn-borde { border-color: var(--linea-2); color: var(--tinta); background: transparent; }
.btn-borde:hover { border-color: var(--tinta); }
.btn-chico { padding: 10px 16px; font-size: .84rem; }
.btn[aria-disabled="true"], .btn:disabled { opacity: .55; cursor: not-allowed; }
.btn svg { width: 16px; height: 16px; flex-shrink: 0; }
.enlace { color: var(--azul); text-decoration: none; font-weight: 600; font-size: .92rem; border-bottom: 1px solid color-mix(in srgb, var(--azul) 35%, transparent); }
.enlace:hover { border-bottom-color: var(--azul); }

/* Secciones */
.seccion { padding: clamp(64px, 9vw, 112px) 0; border-top: 1px solid var(--linea); }
.seccion.alterna { background: var(--superficie); }
.rotulo { display: flex; align-items: center; gap: 12px; font-family: var(--mono); font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--tinta-3); margin-bottom: 18px; }
.rotulo b { color: var(--rojo); font-weight: 500; }
.rotulo::after { content: ""; flex: 0 0 40px; height: 1px; background: var(--linea-2); }
.cabeza { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 24px 64px; align-items: end; margin-bottom: clamp(32px, 5vw, 56px); }
.cabeza h2 { font-size: clamp(1.9rem, 3.6vw, 2.9rem); }
.cabeza p { color: var(--tinta-2); margin: 0; max-width: 52ch; }
@media (max-width: 820px) { .cabeza { grid-template-columns: minmax(0, 1fr); } }
.nota { font-size: .82rem; color: var(--tinta-3); }
.nota-mono { font-family: var(--mono); font-size: .72rem; letter-spacing: .04em; color: var(--tinta-3); }

/* Portada */
.portada { padding: clamp(40px, 7vw, 88px) 0 clamp(56px, 8vw, 96px); position: relative; overflow: hidden; }
.portada::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .55;
  background-image: linear-gradient(var(--linea) 1px, transparent 1px), linear-gradient(90deg, var(--linea) 1px, transparent 1px);
  background-size: 64px 64px; mask-image: radial-gradient(ellipse 70% 60% at 80% 20%, #000 0%, transparent 70%); -webkit-mask-image: radial-gradient(ellipse 70% 60% at 80% 20%, #000 0%, transparent 70%); }
.portada .envoltura { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: clamp(32px, 5vw, 72px); align-items: center; }
.portada h1 { font-size: clamp(2.3rem, 5.2vw, 4.1rem); line-height: 1.04; margin: 0 0 20px; }
.portada .bajada { font-size: clamp(1.02rem, 1.4vw, 1.14rem); color: var(--tinta-2); max-width: 46ch; margin-bottom: 30px; }
.portada .botones { display: flex; flex-wrap: wrap; gap: 12px; }
.vivo { display: inline-flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-2); margin-bottom: 22px; }
.vivo::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--rojo); box-shadow: 0 0 0 4px color-mix(in srgb, var(--rojo) 18%, transparent); }
@media (max-width: 900px) { .portada .envoltura { grid-template-columns: minmax(0, 1fr); } }

.video { position: relative; aspect-ratio: 16 / 9; background: #05080f; border-radius: 6px; overflow: hidden; box-shadow: var(--sombra); border: 1px solid var(--linea); }
.video img, .video iframe { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border: 0; }
.video button { position: absolute; inset: 0; width: 100%; border: 0; background: linear-gradient(180deg, rgba(5,8,15,0) 45%, rgba(5,8,15,.82) 100%); cursor: pointer; color: #fff; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; padding: clamp(14px, 3vw, 24px); text-align: left; font: inherit; }
.video .play { width: 54px; height: 54px; border-radius: 50%; background: rgba(255,255,255,.96); color: #0b3b8c; display: grid; place-items: center; flex-shrink: 0; transition: transform .2s; }
.video button:hover .play { transform: scale(1.06); }
.video .play svg { width: 18px; height: 18px; margin-left: 3px; }
.video .titulo-v { font-family: var(--serif); font-size: clamp(1rem, 2vw, 1.35rem); font-weight: 600; line-height: 1.2; max-width: 32ch; }
.ficha-doc { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 14px; }

/* Cifras */
.cifras { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--linea); border-bottom: 1px solid var(--linea); }
.cifra { padding: 22px 20px 22px 0; }
.cifra + .cifra { padding-left: 20px; border-left: 1px solid var(--linea); }
.cifra b { display: block; font-family: var(--sans); font-weight: 500; font-size: clamp(1.6rem, 3vw, 2.3rem); letter-spacing: -.02em; line-height: 1; font-variant-numeric: tabular-nums; }
.cifra span { display: block; font-size: .84rem; color: var(--tinta-2); margin-top: 8px; }
.cifra small { display: block; font-family: var(--mono); font-size: .68rem; color: var(--tinta-3); margin-top: 4px; letter-spacing: .04em; }
@media (max-width: 760px) { .cifras { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cifra:nth-child(3) { padding-left: 0; border-left: 0; } .cifra:nth-child(n+3) { border-top: 1px solid var(--linea); } }

/* Votaciones */
.voto-marco { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 48px); align-items: start; }
@media (max-width: 900px) { .voto-marco { grid-template-columns: minmax(0, 1fr); } }
.tarjeta { background: var(--superficie); border: 1px solid var(--linea); border-radius: 6px; padding: clamp(20px, 3.4vw, 36px); box-shadow: var(--sombra); }
.seccion.alterna .tarjeta { background: var(--fondo); }
.estado { display: inline-flex; align-items: center; gap: 8px; font-family: var(--mono); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; padding: 5px 10px; border: 1px solid var(--linea-2); border-radius: 999px; color: var(--tinta-2); }
.estado.abierta::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--rojo); }
.voto-pregunta { font-size: clamp(1.4rem, 2.6vw, 2rem); margin: 16px 0 6px; }
.voto-plazo { color: var(--tinta-3); font-size: .86rem; margin-bottom: 22px; }
.opciones { display: grid; gap: 8px; margin: 0; padding: 0; border: 0; }
.opcion { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid var(--linea); border-radius: 4px; cursor: pointer; transition: border-color .2s, background .2s; background: var(--superficie); }
.seccion.alterna .opcion { background: var(--fondo); }
.opcion:hover { border-color: var(--linea-2); }
.opcion input { appearance: none; -webkit-appearance: none; width: 18px; height: 18px; border: 1.5px solid var(--linea-2); border-radius: 50%; margin: 0; flex-shrink: 0; display: grid; place-items: center; }
.opcion input::after { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--azul); transform: scale(0); transition: transform .15s; }
.opcion input:checked { border-color: var(--azul); }
.opcion input:checked::after { transform: scale(1); }
.opcion:has(input:checked) { border-color: var(--azul); background: var(--azul-suave); }
.opcion .nom { font-weight: 600; }
.opcion .det { color: var(--tinta-3); font-size: .84rem; margin-left: auto; text-align: right; }
.voto-pie { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin-top: 20px; }
.trampa { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.barras { display: grid; gap: 14px; margin-top: 8px; }
.barra .fila { display: flex; justify-content: space-between; gap: 12px; font-size: .94rem; margin-bottom: 6px; }
.barra .fila b { font-weight: 600; }
.barra .fila span { font-family: var(--mono); font-size: .84rem; color: var(--tinta-2); white-space: nowrap; }
.barra .pista { height: 6px; background: var(--superficie-2); border-radius: 3px; overflow: hidden; }
.barra .pista i { display: block; height: 100%; width: 0; background: var(--tinta-3); border-radius: 3px; transition: width .9s cubic-bezier(.2, .7, .2, 1); }
.barra.lider .pista i { background: var(--azul); }
.barra.mio .fila b::after { content: "Tu voto"; font-family: var(--mono); font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; color: var(--rojo); border: 1px solid currentColor; border-radius: 999px; padding: 2px 7px; margin-left: 10px; vertical-align: 2px; }
.lista-votos { list-style: none; margin: 0; padding: 0; }
.lista-votos li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--linea); }
.lista-votos li:first-child { border-top: 1px solid var(--linea); }
.lista-votos .n { font-family: var(--mono); font-size: .72rem; color: var(--tinta-3); }
.lista-votos .p { font-family: var(--serif); font-size: 1.04rem; font-weight: 600; line-height: 1.3; }
.lista-votos .f { display: block; font-family: var(--mono); font-size: .7rem; font-weight: 400; color: var(--tinta-3); margin-top: 4px; }
.lista-votos button { background: none; border: 0; padding: 0; color: var(--azul); font: 600 .82rem var(--sans); cursor: pointer; white-space: nowrap; }
.subtitulo { font-family: var(--mono); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-3); margin: 0 0 12px; font-weight: 500; }

/* Tienda */
.libros { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(16px, 2.4vw, 28px); }
.libro { display: flex; flex-direction: column; }
.libro .tapa { aspect-ratio: 2 / 3; border-radius: 3px; overflow: hidden; background: #000; box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 12px 28px rgba(13,22,38,.14); }
.libro .tapa img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.libro:hover .tapa img { transform: scale(1.02); }
.libro h3 { font-size: 1.05rem; margin: 14px 0 2px; }
.libro .serie { font-family: var(--mono); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--tinta-3); }
.precio { margin: 10px 0 12px; }
.precio b { font-size: 1.2rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.precio small { display: block; font-size: .74rem; color: var(--tinta-3); }
.libro .btn { margin-top: auto; width: 100%; }
.ancla { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: center; margin-top: clamp(32px, 4vw, 48px); padding: clamp(20px, 3vw, 32px); border: 1px solid var(--linea-2); border-radius: 6px; }
.ancla h3 { font-size: clamp(1.3rem, 2.4vw, 1.7rem); }
.ancla p { color: var(--tinta-2); margin: 6px 0 0; }
.ancla .precio { margin: 0 0 10px; text-align: right; }
@media (max-width: 640px) { .libros { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.garantias { display: flex; flex-wrap: wrap; gap: 8px 28px; margin-top: 24px; font-size: .84rem; color: var(--tinta-2); }
.garantias span::before { content: "—"; color: var(--rojo); margin-right: 8px; }

/* Membresías */
.planes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 900px) { .planes { grid-template-columns: minmax(0, 1fr); } }
.plan { display: flex; flex-direction: column; background: var(--superficie); border: 1px solid var(--linea); border-radius: 6px; padding: 26px; }
.seccion.alterna .plan { background: var(--fondo); }
.plan.destacado { border-color: var(--azul); box-shadow: 0 0 0 1px var(--azul) inset; }
.plan .canal { font-family: var(--mono); font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-3); }
.plan h3 { font-size: 1.4rem; margin: 10px 0 4px; }
.plan .monto { font-size: 1.9rem; font-weight: 500; letter-spacing: -.02em; font-variant-numeric: tabular-nums; margin: 12px 0 0; }
.plan .monto small { font-size: .88rem; color: var(--tinta-3); font-weight: 400; letter-spacing: 0; }
.plan .alt { font-size: .86rem; color: var(--tinta-2); margin-top: 4px; }
.plan ul { list-style: none; padding: 0; margin: 20px 0 24px; display: grid; gap: 10px; font-size: .93rem; color: var(--tinta-2); }
.plan li { padding-left: 22px; position: relative; }
.plan li::before { content: ""; position: absolute; left: 0; top: .62em; width: 10px; height: 1.5px; background: var(--azul); }
.plan .btn { margin-top: auto; }
.niveles { display: grid; gap: 0; margin: 18px 0 22px; border-top: 1px solid var(--linea); }
.nivel { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; padding: 12px 0; border-bottom: 1px solid var(--linea); }
.nivel b { font-weight: 600; font-size: .95rem; }
.nivel span { font-variant-numeric: tabular-nums; font-weight: 500; }
.nivel small { grid-column: 1 / -1; color: var(--tinta-3); font-size: .82rem; }
.sello-plan { align-self: flex-start; font-family: var(--mono); font-size: .64rem; letter-spacing: .12em; text-transform: uppercase; color: var(--blanco-btn); background: var(--azul); padding: 4px 8px; border-radius: 3px; margin-bottom: 12px; }

/* Anúnciate (resumen y página) */
.segmentos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 820px) { .segmentos { grid-template-columns: minmax(0, 1fr); } }
.segmento { display: flex; flex-direction: column; border: 1px solid var(--linea); border-radius: 6px; padding: clamp(22px, 3vw, 32px); background: var(--superficie); }
.seccion.alterna .segmento { background: var(--fondo); }
.segmento .letra { font-family: var(--mono); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--rojo); }
.segmento h3 { font-size: clamp(1.35rem, 2.4vw, 1.75rem); margin: 10px 0 10px; }
.segmento p { color: var(--tinta-2); }
.segmento .botones { margin-top: auto; display: flex; flex-wrap: wrap; gap: 10px; padding-top: 12px; }

/* Muro de miembros */
.muro { columns: 4 200px; column-gap: 32px; margin: 0; padding: 0; list-style: none; }
.muro li { break-inside: avoid; padding: 9px 0; border-bottom: 1px solid var(--linea); font-family: var(--serif); font-size: 1.04rem; display: flex; justify-content: space-between; gap: 10px; }
.muro li small { font-family: var(--mono); font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; color: var(--tinta-3); align-self: center; white-space: nowrap; }
.muro-cabeza { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 18px; }

/* Documentales */
.docs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 2.6vw, 32px) clamp(16px, 2.2vw, 28px); }
@media (max-width: 900px) { .docs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .docs { grid-template-columns: minmax(0, 1fr); } }
.doc { text-decoration: none; display: block; }
.doc .mini { aspect-ratio: 16 / 9; border-radius: 4px; overflow: hidden; background: var(--superficie-2); border: 1px solid var(--linea); }
.doc .mini img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.doc:hover .mini img { transform: scale(1.03); }
.doc .meta { display: flex; gap: 12px; margin: 12px 0 6px; font-family: var(--mono); font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; color: var(--tinta-3); }
.doc .meta b { color: var(--rojo); font-weight: 500; }
.doc h3 { font-size: 1.08rem; line-height: 1.3; }
.doc:hover h3 { color: var(--azul); }
.filtros { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 28px; }
.filtros button { font: 500 .84rem var(--sans); padding: 8px 14px; border-radius: 999px; border: 1px solid var(--linea-2); background: transparent; color: var(--tinta-2); cursor: pointer; }
.filtros button[aria-pressed="true"] { background: var(--tinta); color: var(--fondo); border-color: var(--tinta); }

/* Contacto */
.contactos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--linea); }
@media (max-width: 820px) { .contactos { grid-template-columns: minmax(0, 1fr); } }
.contacto { padding: 24px 24px 24px 0; border-bottom: 1px solid var(--linea); }
@media (min-width: 821px) { .contacto + .contacto { padding-left: 24px; border-left: 1px solid var(--linea); } }
.contacto h3 { font-size: 1.15rem; margin-bottom: 8px; }
.contacto p { color: var(--tinta-2); font-size: .93rem; }
.correo { font-family: var(--mono); font-size: .82rem; word-break: break-all; color: var(--tinta); }
.alternativas { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 14px; font-size: .8rem; color: var(--tinta-3); }
.alternativas a, .alternativas button { color: var(--tinta-2); background: none; border: 0; padding: 0; font: inherit; cursor: pointer; text-decoration: underline; text-decoration-color: var(--linea-2); text-underline-offset: 3px; }
.alternativas a:hover, .alternativas button:hover { color: var(--tinta); }
.redes { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 32px; }

/* Pie */
.pie { border-top: 1px solid var(--linea); padding: 40px 0 56px; font-size: .84rem; color: var(--tinta-3); }
.pie .envoltura { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px; align-items: start; }
.pie nav { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.pie a { text-decoration: none; color: var(--tinta-2); }
.pie a:hover { color: var(--tinta); }
@media (max-width: 700px) { .pie .envoltura { grid-template-columns: minmax(0, 1fr); } }

/* Página Anúnciate */
.hero-pagina { padding: clamp(48px, 8vw, 96px) 0 clamp(40px, 6vw, 64px); }
.hero-pagina h1 { font-size: clamp(2.2rem, 5vw, 3.8rem); max-width: 18ch; margin-bottom: 18px; }
.hero-pagina .bajada { font-size: clamp(1.02rem, 1.4vw, 1.15rem); color: var(--tinta-2); max-width: 60ch; }
.indice-pagina { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.tabla { width: 100%; border-collapse: collapse; font-size: .92rem; }
.tabla-marco { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--linea); border-radius: 6px; background: var(--superficie); }
.tabla th, .tabla td { padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--linea); white-space: nowrap; }
.tabla thead th { font-family: var(--mono); font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--tinta-3); font-weight: 500; background: var(--superficie-2); }
.tabla td { font-variant-numeric: tabular-nums; }
.tabla tbody th { font-weight: 600; }
.tabla tr:last-child td, .tabla tr:last-child th { border-bottom: 0; }
.perfil { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 24px; }
@media (max-width: 820px) { .perfil { grid-template-columns: minmax(0, 1fr); } }
.perfil div { border-top: 2px solid var(--tinta); padding-top: 14px; }
.perfil b { display: block; font-size: 1.6rem; font-weight: 500; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.perfil span { color: var(--tinta-2); font-size: .9rem; }
.formatos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--linea); border-left: 1px solid var(--linea); }
@media (max-width: 900px) { .formatos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .formatos { grid-template-columns: minmax(0, 1fr); } }
.formato { padding: 24px; border-right: 1px solid var(--linea); border-bottom: 1px solid var(--linea); }
.formato .n { font-family: var(--mono); font-size: .7rem; color: var(--tinta-3); }
.formato h3 { font-size: 1.14rem; margin: 10px 0 8px; }
.formato p { color: var(--tinta-2); font-size: .92rem; margin: 0; }
.formato .dato { display: inline-block; margin-top: 12px; font-family: var(--mono); font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; color: var(--azul); }
.paquetes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
@media (max-width: 1000px) { .paquetes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .paquetes { grid-template-columns: minmax(0, 1fr); } }
.paquete { border: 1px solid var(--linea); border-radius: 6px; padding: 22px; background: var(--superficie); display: flex; flex-direction: column; }
.paquete.anual { border-color: var(--azul); box-shadow: 0 0 0 1px var(--azul) inset; }
.paquete .tipo { font-family: var(--mono); font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; color: var(--tinta-3); }
.paquete.anual .tipo { color: var(--azul); }
.paquete h3 { font-size: 1.2rem; margin: 8px 0 12px; }
.paquete ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: .89rem; color: var(--tinta-2); }
.paquete li { padding-left: 18px; position: relative; }
.paquete li::before { content: ""; position: absolute; left: 0; top: .66em; width: 8px; height: 1.5px; background: var(--tinta-3); }
.aviso { border: 1px solid var(--linea-2); border-left: 3px solid var(--rojo); border-radius: 4px; padding: clamp(18px, 3vw, 28px); background: var(--superficie); }
.aviso h3 { font-size: 1.2rem; margin-bottom: 10px; }
.aviso p, .aviso li { color: var(--tinta-2); font-size: .93rem; }
.aviso ul { padding-left: 18px; margin: 0 0 12px; display: grid; gap: 6px; }
.reglas { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 48px; }
@media (max-width: 820px) { .reglas { grid-template-columns: minmax(0, 1fr); } }
.reglas h3 { font-size: 1.1rem; margin-bottom: 8px; }
.reglas ul { margin: 0; padding-left: 18px; color: var(--tinta-2); font-size: .93rem; display: grid; gap: 6px; }
.cierre { text-align: left; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: center; }
@media (max-width: 760px) { .cierre { grid-template-columns: minmax(0, 1fr); } }
.cierre h2 { font-size: clamp(1.8rem, 3.4vw, 2.6rem); }
.cierre .botones { display: flex; flex-wrap: wrap; gap: 10px; }

@media (max-width: 1100px) { .libros { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.tapa.pack { display: flex; flex-direction: column; justify-content: flex-end; gap: 8px; padding: 18px; background: linear-gradient(160deg, #0b3b8c 0%, #071a3d 70%); color: #fff; position: relative; }
.tapa.pack::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: #c8102e; }
.tapa.pack .nota-mono { color: rgba(255,255,255,.7); }
.tapa.pack b { font-family: var(--serif); font-size: 1.5rem; font-weight: 600; line-height: 1.1; }
.tapa.pack span:last-child { font-size: .82rem; color: rgba(255,255,255,.8); padding-bottom: 6px; }
@media (max-width: 640px) { .libros { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .opcion { flex-wrap: wrap; row-gap: 2px; } .opcion .det { flex-basis: 100%; margin-left: 32px; text-align: left; } }

/* =====================================================================
   BIBLIOTECA MINIMALISTA (4-nov-2026)
   Una sola familia: Newsreader 400/500 y cursiva (títulos y texto; Libre Caslon no trae peso 500) + system-ui para lo chico.
   Paleta: noche #111214 · papel #f4f1ea · rojo #b3121a · azul #0b2a5b · marfil #ece6d8. Sin dorado.
   Telas por colección hechas en CSS (trama + grano SVG en línea), sin imágenes externas.
   ===================================================================== */
.bl {
  --b-fondo: transparent; --b-papel: #16181d; --b-tinta: #ece6d8; --b-tinta-2: #c9c2b3; --b-tinta-3: #9a958a;
  --b-linea: rgba(236,230,216,.14); --b-rojo: #d9434a; --b-azul: #0b2a5b; --b-marfil: #ece6d8; --b-noche: #111214;
  --b-boton: #ece6d8; --b-boton-tinta: #111214;
  --caslon: "Newsreader", "Iowan Old Style", Georgia, serif;
  --chico: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --sombra-libro: 0 2px 4px rgba(0,0,0,.4), 0 30px 54px -22px rgba(0,0,0,.85);
  --sombra-honda: 0 46px 90px -34px rgba(0,0,0,.78), 0 6px 14px -6px rgba(0,0,0,.4);
  background: var(--b-fondo); color: var(--b-tinta); font-family: var(--caslon);
}
.bl h1, .bl h2, .bl h3 { font-family: var(--caslon); font-weight: 500; letter-spacing: .01em; line-height: 1.16; }
.bl p { text-wrap: pretty; }
.seccion.bl { border-top: 1px solid var(--b-linea); }

/* Telas */
.tela { --t: #111214; background-color: var(--t);
  background-image:
    var(--grano),
    var(--trama),
    radial-gradient(120% 90% at 16% 0%, rgba(236,230,216,.09), transparent 58%),
    radial-gradient(140% 120% at 50% 125%, rgba(0,0,0,.42), transparent 62%);
}
.tela-noche { --t: #111214; }
.tela-historia { --t: #0b2a5b; }
.tela-denuncias { --t: #5a1016; }
.tela-instituciones { --t: #3a3d43; }

/* Bandas oscuras (siempre noche/tela, en ambos temas) */
.bl-banda { --b-tinta: #ece6d8; --b-tinta-2: #c9c2b3; --b-tinta-3: #9a958a; --b-linea: rgba(236,230,216,.16);
  --b-boton: #ece6d8; --b-boton-tinta: #111214; --b-rojo: #d9434a; color: var(--b-tinta); }
.seccion.bl-banda { border-top: 0; }

/* Etiquetas en versalitas */
.bl-vers { display: block; margin: 0 0 18px; font: 500 .72rem/1.4 var(--chico); letter-spacing: .22em; text-transform: uppercase; color: var(--b-tinta-3); }
.bl-vers b { color: var(--b-rojo); font-weight: 600; }
.bl-vers::before { content: ""; display: inline-block; vertical-align: middle; width: 28px; height: 1px; margin: -2px 12px 0 0; background: var(--b-rojo); }
.bl-vers b { margin-right: 6px; }
.bl-vers.sin-raya::before { display: none; }

/* Cabeceras de sección */
.bl-cabeza { max-width: 760px; margin-bottom: clamp(36px, 5vw, 64px); }
.bl-cabeza h2 { font-size: clamp(1.6rem, 3.2vw, 2.35rem); text-transform: uppercase; letter-spacing: .1em; }
.bl-gancho { font-style: italic; font-size: clamp(1.1rem, 1.9vw, 1.35rem); line-height: 1.45; color: var(--b-tinta-2); margin: 14px 0 0; }
.bl-texto { font-size: 1.06rem; line-height: 1.7; color: var(--b-tinta-2); max-width: 60ch; }

/* Botones */
.bl-boton { display: inline-flex; align-items: center; justify-content: center; gap: .7em; min-height: 52px; padding: 14px 26px; background: var(--b-boton); color: var(--b-boton-tinta); border: 1px solid var(--b-boton); border-radius: 0; text-decoration: none; font: 500 .8rem/1.3 var(--chico); letter-spacing: .16em; text-transform: uppercase; text-align: center; transition: background-color .3s, color .3s; cursor: pointer; }
.bl-boton:hover { background: transparent; color: var(--b-tinta); }
.bl-boton i { font-style: normal; font-family: Georgia, serif; letter-spacing: 0; font-size: 1.05rem; transition: transform .3s; }
.bl-boton:hover i { transform: translateX(4px); }
.bl-boton--linea { background: transparent; color: var(--b-tinta); border-color: var(--b-linea); }
.bl-boton--linea:hover { border-color: var(--b-tinta); }
.bl-boton--ancho { width: 100%; }
.bl-enlace { font: 500 .8rem/1.4 var(--chico); letter-spacing: .14em; text-transform: uppercase; color: var(--b-tinta); text-decoration: underline; text-decoration-color: var(--b-rojo); text-underline-offset: 6px; }
.bl .aviso-flow { font-family: var(--chico); color: var(--b-tinta-3); margin: 10px 0 0; }

/* Tapas */
.bl-tapa { position: relative; display: block; aspect-ratio: 2 / 3; overflow: hidden; box-shadow: var(--sombra-libro); background: #111214; }
.bl-tapa img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s cubic-bezier(.2,.7,.2,1); }
a.bl-tapa:hover img { transform: scale(1.03); }
.bl-tipo { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: space-between; padding: 12% 10% 10%; color: #ece6d8; text-align: center; }
.bl-tipo::after { content: ""; position: absolute; inset: 7px; border: 1px solid rgba(236,230,216,.22); pointer-events: none; }
.bl-tipo i { font: 500 .62rem/1.3 var(--chico); font-style: normal; letter-spacing: .26em; text-transform: uppercase; color: rgba(236,230,216,.7); }
.bl-tipo b { font-family: var(--caslon); font-weight: 500; font-size: clamp(1.05rem, 2.1vw, 1.55rem); line-height: 1.15; letter-spacing: .06em; text-transform: uppercase; text-wrap: balance; }
.bl-tipo b::after { content: ""; display: block; width: 28px; height: 1px; background: #d9434a; margin: 14px auto 0; }
.bl-tipo em { font: italic 400 .78rem/1.3 var(--caslon); color: rgba(236,230,216,.75); }

/* Estante (página /biblioteca/) */
.bl-estante { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(48px, 6vw, 80px) clamp(24px, 3.4vw, 48px); }
.bl-libro { display: flex; flex-direction: column; min-width: 0; }
.bl-libro .bl-tapa { margin-bottom: 26px; }
.bl-libro .bl-vers { margin-bottom: 10px; font-size: .66rem; letter-spacing: .2em; }
.bl-libro .bl-vers::before { width: 16px; margin-right: 8px; }
.bl-libro h3 { font-size: 1.28rem; letter-spacing: .03em; }
.bl-libro .bl-gancho { font-size: 1rem; margin: 8px 0 0; }
.bl-precio { margin: 16px 0 18px; font: 400 .86rem/1.4 var(--chico); color: var(--b-tinta-3); font-variant-numeric: tabular-nums; }
.bl-precio b { display: block; margin-bottom: 2px; font-family: var(--caslon); font-weight: 500; font-size: 1.18rem; color: var(--b-tinta); letter-spacing: .02em; font-variant-numeric: lining-nums tabular-nums; }
.bl-libro .bl-boton { margin-top: auto; min-height: 46px; padding: 12px 18px; font-size: .74rem; }
@media (max-width: 1000px) { .bl-estante { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .bl-estante { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) {
  .bl-estante { grid-template-columns: minmax(0, 1fr); gap: 56px; }
  .bl-estante .bl-libro .bl-tapa { width: 64%; margin: 0 auto 26px; }
}

/* Estante corto (portada) */
.bl-mini { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 40px clamp(18px, 2.4vw, 32px); }
.bl-mini .bl-libro h3 { font-size: 1rem; letter-spacing: .04em; margin-top: 2px; }
.bl-mini .bl-libro .bl-tapa { margin-bottom: 18px; }
.bl-mini .bl-precio { margin: 6px 0 0; font-size: .8rem; }
.bl-mini .bl-precio b { font-size: .98rem; }
.bl-mini .bl-tipo b { font-size: clamp(.95rem, 1.5vw, 1.2rem); }
.bl-mini .bl-vers { font-size: .6rem; letter-spacing: .14em; }
@media (max-width: 1000px) { .bl-mini { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .bl-mini { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding-inline: var(--margen); gap: 20px; padding: 6px var(--margen) 34px; margin: 0 calc(-1 * var(--margen)); scrollbar-width: none; }
  .bl-mini::-webkit-scrollbar { display: none; }
  .bl-mini .bl-libro { flex: 0 0 58%; scroll-snap-align: start; }
}
.bl-fila { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 40px; align-items: center; margin-top: clamp(48px, 6vw, 72px); padding-top: 32px; border-top: 1px solid var(--b-linea); }
.bl-fila .bl-precio { margin: 6px 0 0; }
.bl-fila .bl-precio b { font-size: clamp(1.6rem, 3vw, 2.1rem); }
.bl-fila h3 { font-size: clamp(1.25rem, 2.2vw, 1.6rem); text-transform: uppercase; letter-spacing: .1em; }
.bl-fila .botones { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 760px) { .bl-fila { grid-template-columns: minmax(0, 1fr); } .bl-fila .bl-boton { width: 100%; } }
.bl-garantias { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 28px 0 0; font: 400 .82rem/1.5 var(--chico); color: var(--b-tinta-3); }

/* Membresías */
.bl-niveles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--b-linea); }
.bl-nivel { display: flex; flex-direction: column; padding: 36px clamp(18px, 2.2vw, 30px) 8px; min-width: 0; }
.bl-nivel + .bl-nivel { border-left: 1px solid var(--b-linea); }
.bl-nivel:first-child { padding-left: 0; }
.bl-nivel:last-child { padding-right: 0; }
.bl-nivel h3 { font-size: clamp(1.15rem, 1.8vw, 1.4rem); text-transform: uppercase; letter-spacing: .1em; min-height: 2.32em; }
.bl-nivel .bl-gancho { font-size: 1rem; margin: 6px 0 0; min-height: 2.9em; }
.bl-monto { margin: 22px 0 0; font: 500 clamp(2rem, 3.4vw, 2.6rem)/1 var(--caslon); letter-spacing: .01em; font-variant-numeric: lining-nums tabular-nums; }
.bl-monto small { display: block; margin-top: 8px; font: 400 .78rem/1.3 var(--chico); letter-spacing: .14em; text-transform: uppercase; color: var(--b-tinta-3); }
.bl-nivel ul { list-style: none; padding: 0; margin: 26px 0 30px; display: grid; gap: 12px; font-size: .98rem; line-height: 1.5; color: var(--b-tinta-2); }
.bl-nivel li { position: relative; padding-left: 20px; }
.bl-nivel li::before { content: ""; position: absolute; left: 0; top: .78em; width: 10px; height: 1px; background: var(--b-rojo); }
.bl-nivel .bl-boton { margin-top: auto; }
.bl-nivel.alto { position: relative; }
.bl-nivel.alto::before { content: ""; position: absolute; top: -1px; left: clamp(18px, 2.2vw, 30px); right: 0; height: 2px; background: var(--b-rojo); }
.bl-nota { margin: 36px 0 0; font: 400 .84rem/1.6 var(--chico); color: var(--b-tinta-3); max-width: 70ch; }
.bl-nota a { color: var(--b-tinta-2); text-underline-offset: 4px; }
@media (max-width: 1000px) {
  .bl-niveles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bl-nivel:nth-child(3) { border-left: 0; padding-left: 0; }
  .bl-nivel:nth-child(2) { padding-right: 0; }
  .bl-nivel:nth-child(n+3) { border-top: 1px solid var(--b-linea); }
  .bl-nivel { padding-bottom: 36px; }
}
@media (max-width: 600px) {
  .bl-niveles { grid-template-columns: minmax(0, 1fr); }
  .bl-nivel, .bl-nivel:nth-child(n) { padding: 32px 0; border-left: 0; }
  .bl-nivel + .bl-nivel { border-top: 1px solid var(--b-linea); }
  .bl-nivel .bl-gancho, .bl-nivel h3 { min-height: 0; }
  .bl-nivel.alto::before { left: 0; }
  .bl-nivel .bl-boton { width: 100%; }
}

/* Página /biblioteca/ */
.bl-pagina { overflow-x: clip; }
.bl-heroe { padding: clamp(64px, 9vw, 120px) 0 clamp(72px, 9vw, 120px); }
.bl-heroe .envoltura { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px clamp(40px, 6vw, 96px); align-items: center; }
.bl-heroe h1 { font-size: clamp(2.4rem, 5.6vw, 4.4rem); line-height: 1.04; letter-spacing: .005em; }
.bl-heroe h1 span { display: block; }
.bl-heroe h1 span + span { font-style: italic; font-weight: 400; font-size: .56em; line-height: 1.25; color: var(--b-tinta-2); margin-top: 18px; letter-spacing: 0; }
.bl-heroe .bl-texto { margin: 26px 0 34px; }
.bl-heroe .botones { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 28px; }
.bl-abanico { position: relative; height: clamp(340px, 40vw, 500px); }
.bl-abanico .bl-tapa { position: absolute; top: 50%; left: 50%; width: 46%; box-shadow: var(--sombra-honda); }
.bl-abanico .bl-tapa:nth-child(1) { transform: translate(-112%, -46%) rotate(-5deg); }
.bl-abanico .bl-tapa:nth-child(2) { transform: translate(12%, -46%) rotate(5deg); }
.bl-abanico .bl-tapa:nth-child(3) { transform: translate(-50%, -52%); z-index: 2; }
@media (max-width: 860px) {
  .bl-heroe .envoltura { grid-template-columns: minmax(0, 1fr); }
  .bl-abanico { height: 82vw; max-height: 440px; order: -1; }
  .bl-abanico .bl-tapa { width: min(38%, 220px); }
}
@media (max-width: 560px) { .bl-heroe .bl-boton { width: 100%; } .bl-heroe .botones { flex-direction: column; align-items: stretch; text-align: center; } }

.bl-seccion { padding: clamp(80px, 10vw, 136px) 0; }
.bl-seccion + .bl-seccion:not(.bl-banda) { border-top: 1px solid var(--b-linea); }

/* Colecciones */
.bl-coleccion { padding: clamp(80px, 10vw, 132px) 0; }
.bl-coleccion .envoltura { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 48px clamp(40px, 7vw, 112px); align-items: center; }
.bl-coleccion:nth-of-type(even) .bl-estuche { order: 2; }
.bl-estuche { position: relative; display: flex; justify-content: center; align-items: flex-end; padding: 20px 0; }
.bl-estuche .bl-tapa { width: 34%; flex: none; box-shadow: var(--sombra-honda); }
.bl-estuche .bl-tapa + .bl-tapa { margin-left: -12%; }
.bl-estuche .bl-tipo i { display: none; }
.bl-estuche .bl-tipo { justify-content: center; gap: 12px; }
.bl-estuche .bl-tipo b { font-size: clamp(.8rem, 1.3vw, 1.05rem); }
.bl-estuche .bl-tapa:nth-child(odd) { transform: translateY(-14px); }
.bl-estuche .bl-tapa:nth-child(1) { z-index: 4; } .bl-estuche .bl-tapa:nth-child(2) { z-index: 3; }
.bl-estuche .bl-tapa:nth-child(3) { z-index: 2; } .bl-estuche .bl-tapa:nth-child(4) { z-index: 1; }
.bl-coleccion h2 { font-size: clamp(1.9rem, 3.8vw, 2.9rem); text-transform: uppercase; letter-spacing: .1em; }
.bl-indice { list-style: none; margin: 30px 0 0; padding: 0; border-top: 1px solid var(--b-linea); }
.bl-indice li { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 12px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--b-linea); }
.bl-indice span { font: 500 .7rem/1 var(--chico); letter-spacing: .18em; color: var(--b-tinta-3); }
.bl-indice a { font-size: 1.08rem; text-decoration: none; }
.bl-indice a:hover { text-decoration: underline; text-decoration-color: var(--b-rojo); text-underline-offset: 5px; }
.bl-indice small { font: 400 .8rem/1 var(--chico); color: var(--b-tinta-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 860px) {
  .bl-coleccion .envoltura { grid-template-columns: minmax(0, 1fr); }
  .bl-coleccion:nth-of-type(even) .bl-estuche { order: 0; }
}

/* Oferta completa */
.bl-oferta .envoltura { max-width: 860px; text-align: center; }
.bl-oferta .bl-vers::after { content: ""; display: inline-block; vertical-align: middle; width: 28px; height: 1px; margin: -2px 0 0 12px; background: var(--b-rojo); }
.bl-oferta h2 { font-size: clamp(2rem, 4.4vw, 3.3rem); text-transform: uppercase; letter-spacing: .12em; }
.bl-oferta .bl-gancho { max-width: 34em; margin-left: auto; margin-right: auto; }
.bl-oferta .bl-monto { font-size: clamp(3rem, 7vw, 4.6rem); margin: 40px 0 0; }
.bl-oferta .bl-monto small { margin-top: 14px; }
.bl-oferta .bl-boton { margin-top: 36px; min-width: min(100%, 380px); }
@media (max-width: 560px) { .bl-oferta .bl-boton { width: 100%; letter-spacing: .1em; padding: 14px 16px; } }
.bl-lomos { display: flex; justify-content: center; gap: 6px; margin: 44px auto 0; height: 92px; align-items: flex-end; }
.bl-lomos i { width: 14px; background: var(--t, #0b2a5b); box-shadow: inset -3px 0 0 rgba(0,0,0,.25), inset 1px 0 0 rgba(255,255,255,.08); }
.bl-lomos i:nth-child(3n+1) { height: 100%; } .bl-lomos i:nth-child(3n+2) { height: 88%; } .bl-lomos i:nth-child(3n) { height: 94%; }
.bl-oferta .bl-garantias { justify-content: center; margin-top: 30px; }

/* Preguntas frecuentes */
.bl-faq { max-width: 780px; border-top: 1px solid var(--b-tinta); }
.bl-faq details { border-bottom: 1px solid var(--b-linea); }
.bl-faq summary { list-style: none; cursor: pointer; padding: 22px 44px 22px 0; position: relative; font-size: 1.12rem; font-weight: 500; line-height: 1.4; }
.bl-faq summary::-webkit-details-marker { display: none; }
.bl-faq summary::after { content: ""; position: absolute; right: 10px; top: 50%; width: 9px; height: 9px; border: solid var(--b-rojo); border-width: 0 1.5px 1.5px 0; transform: translateY(-70%) rotate(45deg); transition: transform .3s; }
.bl-faq details[open] summary::after { transform: translateY(-25%) rotate(-135deg); }
.bl-faq .resp { padding: 0 0 24px; color: var(--b-tinta-2); font-size: 1.02rem; line-height: 1.7; }
.bl-faq .resp p { margin: 0; }

/* =====================================================================
   TEMA ÚNICO CARBÓN (4-nov-2026)
   Todo el sitio en el lenguaje de la banda de membresías: carbón con tela, tinta crema, acento rojo,
   títulos serif con más cuerpo y versalitas. Capas: fondo #0b0c0f · tela #111214 · superficie #16181d.
   ===================================================================== */
html { background: var(--fondo); }
body { background: var(--grano), var(--fondo); color: var(--tinta); }
::selection { background: rgba(217, 67, 74, .45); color: #fff; }
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 500; letter-spacing: -.005em; }
:focus-visible { outline-color: var(--tinta); }
.franja { height: 4px; }
.franja i { background: var(--azul-bandera); }
.franja b { background: var(--rojo-bandera); }

/* Capas: secciones alternas con tela, superficies un poco más claras */
.seccion { padding: clamp(56px, 7vw, 92px) 0; border-top: 1px solid var(--linea); }
.seccion.alterna, .seccion.bl:not(.bl-banda) + .seccion.alterna {
  background-color: var(--fondo-2);
  background-image: var(--grano), var(--trama),
    radial-gradient(120% 90% at 16% 0%, rgba(236,230,216,.07), transparent 58%),
    radial-gradient(140% 120% at 50% 125%, rgba(0,0,0,.42), transparent 62%);
}
.seccion.bl { background: transparent; }
.bl.bl-pagina { background: transparent; }

.tarjeta, .plan, .segmento, .paquete, .aviso, .tabla-marco, .fundador, .menu-movil nav,
.seccion.alterna .tarjeta, .seccion.alterna .plan, .seccion.alterna .segmento {
  background-color: var(--superficie);
  background-image: var(--grano), linear-gradient(180deg, rgba(236,230,216,.045), rgba(236,230,216,0) 42%);
  border: 1px solid var(--linea-2); border-radius: 2px; box-shadow: var(--sombra);
}
.aviso { border-left: 3px solid var(--rojo); }
.fundador { border-color: var(--rojo) !important; border-radius: 2px !important; box-shadow: 0 0 0 1px rgba(217,67,74,.25) inset, var(--sombra); }
.fundador .rotulo b { color: var(--rojo); }

/* Cabecera */
.cabecera { background: color-mix(in srgb, var(--fondo) 88%, transparent); border-bottom: 1px solid var(--linea-2); }
.marca span { color: var(--tinta-3); border-left-color: var(--linea-2); }
.menu a { color: var(--tinta-2); font-family: var(--chico); font-size: .76rem; letter-spacing: .14em; text-transform: uppercase; }
.menu a:hover, .menu a[aria-current="page"] { color: var(--tinta); border-bottom-color: var(--rojo); }
.menu-movil summary { border-color: var(--linea-3); color: var(--tinta); }
.menu-movil nav a:hover { background: var(--superficie-2); }

/* Botones: crema sobre carbón (como la banda) y borde crema */
.btn { border-radius: 0; font: 500 .78rem/1.3 var(--chico); letter-spacing: .14em; text-transform: uppercase; padding: 15px 24px; }
.btn-chico { padding: 11px 16px; font-size: .72rem; }
.btn-primario { background: var(--tinta); color: #111214; border-color: var(--tinta); }
.btn-primario:hover { background: transparent; color: var(--tinta); border-color: var(--tinta); }
.btn-borde { border-color: var(--linea-3); color: var(--tinta); }
.btn-borde:hover { border-color: var(--tinta); background: rgba(236,230,216,.04); }
.enlace { color: var(--tinta); border-bottom: 1px solid var(--rojo); }
.enlace:hover { color: #fff; border-bottom-color: var(--tinta); }

/* Rótulos en versalitas con raya roja (mismo gesto que .bl-vers) */
.rotulo { font: 500 .72rem/1.4 var(--chico); letter-spacing: .22em; color: var(--tinta-3); margin-bottom: 16px; }
.rotulo::after { display: none; }
.rotulo::before { content: ""; flex: 0 0 28px; height: 1px; background: var(--rojo); }
.rotulo b { color: var(--rojo); font-weight: 600; }
.subtitulo, .nota-mono, .plan .canal, .paquete .tipo, .formato .n, .lista-votos .n, .estado { font-family: var(--chico); letter-spacing: .18em; }

/* Títulos con más cuerpo */
.cabeza { margin-bottom: clamp(28px, 4vw, 44px); gap: 18px 56px; }
.cabeza h2 { font-size: clamp(2.1rem, 4.4vw, 3.5rem); font-weight: 500; line-height: 1.04; letter-spacing: -.012em; }
.cabeza p { color: var(--tinta-2); font-size: 1.04rem; }
.portada { padding: clamp(40px, 6vw, 80px) 0 clamp(48px, 6vw, 72px);
  background-image: radial-gradient(70% 80% at 85% 10%, rgba(11,59,140,.20), transparent 60%), radial-gradient(60% 70% at 0% 100%, rgba(200,16,46,.10), transparent 60%); }
.portada::before { opacity: .7; }
.portada h1 { font-size: clamp(2.6rem, 6vw, 4.8rem); font-weight: 500; line-height: 1; letter-spacing: -.02em; }
.portada .bajada, .hero-pagina .bajada { color: var(--tinta-2); }
.vivo { font-family: var(--chico); letter-spacing: .22em; color: var(--tinta-2); }
.hero-pagina { padding: clamp(48px, 7vw, 88px) 0 clamp(40px, 5vw, 60px);
  background-image: radial-gradient(70% 80% at 90% 0%, rgba(11,59,140,.18), transparent 60%); }
.hero-pagina h1 { font-size: clamp(2.5rem, 5.6vw, 4.4rem); font-weight: 500; line-height: 1.02; letter-spacing: -.018em; max-width: 19ch; }
.cierre h2 { font-size: clamp(2rem, 3.8vw, 3rem); }
.video { border: 1px solid var(--linea-3); border-radius: 2px; outline: 1px solid var(--linea); outline-offset: 4px; box-shadow: 0 40px 80px -40px rgba(0,0,0,.9); }

/* Cifras */
.cifras { border-top: 1px solid var(--linea-3); border-bottom: 1px solid var(--linea-2); }
.cifra + .cifra, .cifra:nth-child(n+3) { border-color: var(--linea-2); }
.cifra b { font-family: var(--serif); font-weight: 500; font-size: clamp(2rem, 3.8vw, 3rem); letter-spacing: -.01em; font-variant-numeric: lining-nums tabular-nums; }
.cifra span { color: var(--tinta-2); }
.perfil div { border-top: 2px solid var(--rojo); }
.perfil b { font-family: var(--serif); font-weight: 500; font-size: clamp(2rem, 3.4vw, 2.6rem); }

/* Votaciones */
.opcion, .seccion.alterna .opcion { background: rgba(236,230,216,.025); border-color: var(--linea-2); border-radius: 0; }
.opcion:hover { border-color: var(--linea-3); background: rgba(236,230,216,.05); }
.opcion input { border-color: var(--linea-3); }
.opcion input::after { background: var(--rojo); }
.opcion input:checked { border-color: var(--rojo); }
.opcion:has(input:checked) { border-color: var(--rojo); background: rgba(217,67,74,.10); }
.voto-pregunta { font-size: clamp(1.6rem, 3vw, 2.3rem); font-weight: 500; }
.estado { border-color: var(--linea-3); color: var(--tinta-2); }
.barra .pista { background: rgba(236,230,216,.08); border-radius: 0; }
.barra .pista i { background: var(--tinta-3); border-radius: 0; }
.barra.lider .pista i { background: var(--rojo); }
.lista-votos li, .lista-votos li:first-child { border-color: var(--linea-2); }
.lista-votos .p { font-weight: 500; font-size: 1.12rem; }
.lista-votos button { color: var(--tinta); font: 500 .72rem var(--chico); letter-spacing: .14em; text-transform: uppercase; border-bottom: 1px solid var(--rojo); padding-bottom: 2px; }

/* Anúnciate, formatos, paquetes */
.segmento .letra { font-family: var(--chico); letter-spacing: .2em; }
.segmento h3, .paquete h3 { font-weight: 500; }
.segmento h3 { font-size: clamp(1.5rem, 2.6vw, 2rem); }
.formatos { border-color: var(--linea-2); background: var(--grano), rgba(22,24,29,.6); }
.formato { border-color: var(--linea-2); }
.formato h3 { font-size: 1.3rem; font-weight: 500; }
.formato .n { color: var(--rojo); }
.formato .dato { color: var(--tinta-2); font-family: var(--chico); letter-spacing: .16em; border-top: 1px solid var(--linea-2); padding-top: 10px; }
.paquete h3 { font-size: 1.35rem; }
.paquete li::before { background: var(--rojo); }
.paquete.anual, .plan.destacado { border-color: var(--rojo); box-shadow: 0 0 0 1px rgba(217,67,74,.35) inset, var(--sombra); }
.paquete.anual .tipo { color: var(--rojo); }
.tabla th, .tabla td { border-bottom-color: var(--linea); }
.tabla thead th { background: rgba(236,230,216,.05); color: var(--tinta-3); font-family: var(--chico); letter-spacing: .18em; }
.tabla tbody th { font-family: var(--serif); font-weight: 500; font-size: 1.02rem; }
.reglas h3 { font-size: 1.3rem; font-weight: 500; padding-bottom: 10px; border-bottom: 1px solid var(--linea-2); margin-bottom: 12px; }
.reglas h3::before { content: ""; display: inline-block; width: 18px; height: 1px; background: var(--rojo); vertical-align: middle; margin: -3px 10px 0 0; }

/* Muralla, documentales, contacto, pie */
.muro li { border-bottom-color: var(--linea-2); font-size: 1.1rem; }
.doc .mini { border: 1px solid var(--linea-2); border-radius: 0; background: var(--superficie); }
.doc h3 { font-size: 1.16rem; font-weight: 500; }
.doc:hover h3 { color: #fff; text-decoration: underline; text-decoration-color: var(--rojo); text-underline-offset: 5px; }
.doc .meta { font-family: var(--chico); letter-spacing: .14em; }
.filtros button { border-radius: 0; border-color: var(--linea-3); color: var(--tinta-2); font: 500 .72rem var(--chico); letter-spacing: .14em; text-transform: uppercase; }
.filtros button[aria-pressed="true"] { background: var(--tinta); color: #111214; border-color: var(--tinta); }
.contactos { border-top-color: var(--linea-3); }
.contacto { border-bottom-color: var(--linea-2); }
@media (min-width: 821px) { .contacto + .contacto { border-left-color: var(--linea-2); } }
.contacto h3 { font-size: 1.4rem; font-weight: 500; }
.alternativas a, .alternativas button { text-decoration-color: var(--rojo); }
.pie { border-top: 1px solid var(--linea-2); background: var(--grano), #08090b; color: var(--tinta-3); padding: 44px 0 52px; }
.pie a { color: var(--tinta-2); font-family: var(--chico); font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; }

/* Biblioteca: menos aire, más cuerpo */
.bl-cabeza { margin-bottom: clamp(32px, 4vw, 52px); }
.bl-cabeza h2 { font-size: clamp(2rem, 4.2vw, 3.2rem); }
.bl-seccion { padding: clamp(64px, 8vw, 104px) 0; }
.bl-coleccion { padding: clamp(64px, 8vw, 104px) 0; }
.bl-heroe { padding: clamp(56px, 8vw, 104px) 0 clamp(60px, 8vw, 104px); }
.bl-seccion + .bl-seccion:not(.bl-banda), .bl-heroe + .bl-seccion { border-top: 1px solid var(--b-linea); }
.bl-fila { margin-top: clamp(40px, 5vw, 60px); }
.bl-fila, .bl-niveles, .bl-indice { border-top-color: var(--linea-3); }
.bl-faq { border-top-color: var(--linea-3); }
.bl-faq details { border-bottom-color: var(--linea-2); }
.bl-libro .bl-tapa { outline: 1px solid rgba(236,230,216,.14); outline-offset: 4px; }

/* Tapa fotográfica 1:1 (mockups WEBP con fondo oscuro incluido). Uso: class="bl-tapa bl-tapa--foto" */
.bl-tapa--foto { aspect-ratio: 1 / 1; background: #111214; box-shadow: none; outline: 1px solid rgba(236,230,216,.22); outline-offset: 4px; transition: outline-color .6s; }
.bl-tapa--foto img { object-fit: cover; transform: scale(1); transition: transform 2.4s cubic-bezier(.16,.8,.2,1); will-change: transform; }
.bl-tapa--foto:hover, .bl-libro:hover .bl-tapa--foto { outline-color: rgba(236,230,216,.45); }
.bl-tapa--foto:hover img, .bl-libro:hover .bl-tapa--foto img { transform: scale(1.06); }
.bl-estante .bl-tapa--foto, .bl-mini .bl-tapa--foto { margin-bottom: 30px; }
@media (max-width: 560px) { .bl-estante .bl-libro .bl-tapa--foto { width: 86%; } }
.doc .mini { background: var(--grano), var(--trama), #111214; }
.portada h1 { font-size: clamp(2.5rem, 5.4vw, 4.4rem); }
/* Anúnciate: los 5 paquetes de pymes en una sola fila en escritorio (sin tarjeta huérfana) */
@media (min-width: 1100px) { #pymes .paquetes { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; gap: 12px; } #pymes .paquete { padding: 20px 18px; } }
@media (min-width: 561px) and (max-width: 1099px) { #pymes .paquetes { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } #pymes .paquete.anual { grid-column: 1 / -1; } }

/* ===== Manual de marca "Hierro y Bronce" (4-nov-2026, aprobado por Don Victor) =====
   60 % negro hierro · 30 % grafito + hueso · 10 % dorado. El dorado va SOLO en botones principales, cifras y palabras clave.
   El rojo y el azul de la bandera quedan solo en la franja de arriba. */
.btn-primario, .bl-boton { background: var(--azul); color: var(--hierro-tinta, #0b0b0c); border-color: var(--azul); }
.btn-primario:hover, .bl-boton:hover { background: var(--azul-hover); color: #0b0b0c; border-color: var(--azul-hover); }
.cifra b { color: var(--azul); }
.portada { background-image: radial-gradient(70% 80% at 85% 10%, rgba(231,188,84,.11), transparent 60%); }
.hero-pagina { background-image: radial-gradient(70% 80% at 90% 0%, rgba(231,188,84,.09), transparent 60%); }
::selection { background: rgba(231,188,84,.4); color: #0b0b0c; }
.fundador { box-shadow: 0 0 0 1px rgba(231,188,84,.25) inset, var(--sombra); }
.opcion:has(input:checked) { background: rgba(231,188,84,.10); }
.paquete.anual, .plan.destacado { box-shadow: 0 0 0 1px rgba(231,188,84,.35) inset, var(--sombra); }
.tapa.pack { background: linear-gradient(160deg, #2a2d33 0%, #111214 70%); }
.bl, .bl-banda { --b-rojo: #e7bc54; --b-papel: #1a1b1f; --b-boton: #e7bc54; --b-boton-tinta: #0b0b0c; --b-tinta: #ede7da; }