/* ==========================================================
   Aula de Paisajes Sonoros On Demand — se apoya en /assets/styles.css (mismas variables, tipografía y botones).
   Columna derecha = índice del curso (en el lugar del menú del sitio). Verde seco solo en acentos:
   tildes #a8b48a, clase actual #c6d0a8, secundario #7c8667, línea de progreso verde sobre #5c5b57.
   ========================================================== */

.page-aula { --nav-w: clamp(290px, 25vw, 370px); }

/* ---------- carga: el contenido aparece con el mismo fundido del sitio ---------- */
.page-aula .content { transition: opacity .35s var(--ease); }
.page-aula.cargando .content [data-dinamico] { opacity: 0; }
[data-dinamico] { transition: opacity .5s var(--ease); }

/* ---------- columna derecha: índice ---------- */
.aula-nav {
  align-items: stretch; text-align: left;
  padding-left: clamp(20px, 2vw, 32px);
  border-left: 1px solid var(--line);
}
.aula-nav .brand { align-self: flex-end; text-align: right; margin-bottom: clamp(24px, 5vh, 48px); }
.aula-curso { display: block; margin-bottom: 22px; }
.aula-curso .kicker { margin: 0 0 4px; }
.aula-curso strong { display: block; font-weight: 300; font-size: 1.25rem; line-height: 1.2; color: var(--fg); }
.aula-curso:hover strong { color: var(--nav-hi); }

.indice { list-style: none; margin: 0; padding: 0 6px 24px 0; flex: 1; min-height: 0; overflow-y: auto;
  scrollbar-width: thin; scrollbar-color: var(--dim) transparent; }
.indice-mod { padding: 16px 0 10px; border-top: 1px solid var(--line); }
.indice-mod:first-child { border-top: 0; padding-top: 4px; }
.indice-mod-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin: 0 0 2px;
  font-size: .64rem; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); }
.indice-mod-head .mod-pct { color: var(--nav-lo); font-variant-numeric: tabular-nums; letter-spacing: .08em; }
.indice-mod.completo .mod-pct { color: var(--nav); }
.indice-mod-tit { margin: 0 0 8px; font-size: .88rem; font-weight: 300; color: var(--fg); line-height: 1.35; }
.indice-mod ol { list-style: none; margin: 0; padding: 0; }
.indice-mod li a {
  display: grid; grid-template-columns: 18px 1fr auto; gap: 10px; align-items: baseline;
  padding: 5px 0; font-size: .84rem; line-height: 1.35; font-weight: 300; color: var(--muted);
  transition: color .2s;
}
.indice-mod li a:hover { color: var(--fg); }
.indice-mod li a .d { font-size: .7rem; color: var(--dim); font-variant-numeric: tabular-nums; }
.indice-mod li a[aria-current="page"] { color: var(--nav-hi); }
.indice-mod li a[aria-current="page"] .d { color: var(--nav-lo); }

/* tilde por clase: círculo vacío → ✓ verde */
.check { width: 12px; height: 12px; border: 1px solid var(--dim); border-radius: 50%; display: inline-block;
  position: relative; top: 1px; transition: border-color .25s, background .25s; flex: none; }
.vista .check, .check.on { border-color: var(--nav); background: transparent; }
.vista .check::after, .check.on::after {
  content: ""; position: absolute; left: 3.5px; top: 1px; width: 3px; height: 6px;
  border: solid var(--nav); border-width: 0 1.5px 1.5px 0; transform: rotate(45deg);
}
.indice-mod li a.vista { color: var(--fg); }
.indice-mod li a[aria-current="page"] .check { border-color: var(--nav-hi); }

.aula-nav .nav-foot { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 12px; }
.aula-nav .nav-foot a { margin-left: 0; color: var(--nav-lo); }
.aula-nav .nav-foot a:hover { color: var(--nav); }
.page-aula .nav::after { opacity: .16; height: 26vh; }

/* ---------- franja de foto (aula, ¡Listo!) — v0.6: foto de Pablo, sin video: acá el foco es la clase ---------- */
.aula-hero {
  position: relative; min-height: clamp(300px, 46vh, 460px);
  margin: 0 calc(-1 * var(--pad));
  background: #000 url("../img/v2/montana-cielo-1600.jpg") 50% 100% / cover no-repeat;
  display: flex; align-items: flex-end;
  padding: 0 var(--pad) clamp(28px, 5vh, 48px);
}
.aula-hero::before { content: ""; position: absolute; inset: 0;
  background: linear-gradient(0deg, #000 0%, rgba(0,0,0,.35) 30%, rgba(0,0,0,.08) 70%, rgba(0,0,0,.25) 100%); }
.aula-hero > * { position: relative; }
.aula-hero h1 { margin: 0; font-size: clamp(2.4rem, 5vw, 4.4rem); }
.aula-hero .kicker { margin-bottom: 1rem; }
.aula-hero .hero-credit { position: absolute; left: auto; right: var(--pad); bottom: 14px; }

/* ---------- estado y «Continuar» ---------- */
.aula-estado { padding: clamp(28px, 5vh, 44px) 0 clamp(56px, 9vh, 90px); }
.barra { height: 2px; background: var(--dim); position: relative; overflow: hidden; max-width: 720px; }
.barra > span { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--nav); transition: width .8s var(--ease); }
.progreso-txt { margin: 12px 0 0; font-size: .8rem; letter-spacing: .04em; color: var(--muted); font-variant-numeric: tabular-nums; }
.progreso-txt strong { color: var(--fg); font-weight: 700; }
.continuar { margin-top: 2rem; }
.continuar .t { font-weight: 400; letter-spacing: .06em; text-transform: none; font-size: .95rem; }
.continuar .t1 { font-weight: 400; }

/* ---------- módulos (inicio del aula) ---------- */
.modulos { list-style: none; margin: 0; padding: 0; }
.modulo { display: grid; grid-template-columns: 64px 1fr; gap: 8px clamp(16px, 3vw, 40px); padding: 34px 0; border-top: 1px solid var(--line); }
.modulo .num { font-size: .7rem; font-weight: 700; letter-spacing: .22em; color: var(--muted); padding-top: .7em; }
.modulo h2 { font-size: clamp(1.4rem, 2.2vw, 1.9rem); margin-bottom: .5rem; }
.modulo .mod-num { display: block; font-size: .64rem; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: var(--muted); margin-bottom: .6rem; }
.modulo .barra { max-width: 280px; margin-top: 1.2rem; }
.modulo .progreso-txt { margin-top: 8px; }
.modulo .actions { margin-top: 1.2rem; }

.nota-dev { border: 1px dashed var(--note); color: var(--note); font-size: .85rem; line-height: 1.55; padding: 14px 18px; margin: 1.4rem 0; max-width: 62ch; }
.placeholder-aviso { color: var(--note); font-size: .78rem; border: 1px dashed var(--note); padding: 10px 14px; max-width: 62ch; margin: 0 0 2rem; }

/* ---------- página de clase ---------- */
.aula-clase { padding-top: clamp(84px, 12vh, 120px); padding-bottom: 100px; }
.aula-clase .kicker a:hover { color: var(--fg); }
.player-marco { position: relative; width: 100%; max-width: 1100px; aspect-ratio: 16 / 9; background: #0b0b0a; border: 1px solid var(--line); overflow: hidden; }
.player-marco video, .player-marco iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #000; }
.player-estado { position: absolute; inset: 0; display: grid; place-items: center; text-align: center; padding: 24px;
  color: var(--muted); font-size: .9rem; pointer-events: none; transition: opacity .4s; }
.player-marco.listo .player-estado { opacity: 0; }
/* marca de agua tenue con el mail del alumno (disuasión, propuesta §2) */
.marca-agua { position: absolute; right: 14px; top: 12px; z-index: 2; pointer-events: none; user-select: none;
  font-size: .68rem; letter-spacing: .08em; color: rgba(236,235,230,.22); text-shadow: 0 0 4px rgba(0,0,0,.6); }

.clase-info { max-width: 1100px; padding-top: clamp(28px, 4vh, 40px); display: grid; grid-template-columns: 1fr auto; gap: 8px 40px; align-items: start; }
.clase-info h1 { font-size: clamp(1.8rem, 3vw, 2.6rem); margin-bottom: .6rem; }
.clase-info .meta { font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); font-weight: 700; margin-bottom: 1.2rem; }
.clase-info .desc { max-width: 60ch; font-weight: 300; }
.clase-acciones { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; padding-top: .5rem; }
.btn.visto { background: transparent; color: var(--fg); cursor: pointer; font-family: inherit; border-color: var(--line); }
.btn.visto:hover { border-color: var(--nav); background: transparent; color: var(--nav-hi); }
.btn.visto[aria-pressed="true"] { border-color: var(--nav); color: var(--nav); }
.btn.visto .check { width: 14px; height: 14px; top: 0; }
.btn.visto .check::after { left: 4.5px; top: 1.5px; }
.guardado { min-height: 1.4em; font-size: .72rem; letter-spacing: .06em; color: var(--nav-lo); }
.clase-nav { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: 20px; margin-top: 2.6rem; padding-top: 1.6rem; border-top: 1px solid var(--line); }
.link.prev::after { content: none; }
.link.prev::before { content: "← "; }
.link[aria-disabled="true"] { visibility: hidden; }

/* ---------- acceso / checkout / ¡Listo! ---------- */
.aviso-acceso { max-width: 60ch; }
.respuesta { min-height: 1.6em; color: var(--nav); font-size: .9rem; }
.respuesta.error { color: #d8a48f; }
.form input[type="email"], .form input[type="text"] { font-size: 1.05rem; }

.checkout { border: 1px solid var(--fg); padding: clamp(28px, 4vw, 52px); display: grid; grid-template-columns: 1fr 1fr; gap: 32px clamp(32px, 5vw, 72px); }
.checkout .amount { font-size: clamp(1.9rem, 3.2vw, 2.8rem); font-weight: 300; line-height: 1; margin: 0 0 .6rem; }
.checkout .amount small { font-size: .45em; color: var(--muted); letter-spacing: .04em; }
.checkout .form { max-width: none; gap: 18px; }
.form label.consent { display: grid; margin: 0; text-transform: none; letter-spacing: 0; font-weight: 300; grid-template-columns: 20px 1fr; gap: 12px; align-items: start; font-size: .86rem; line-height: 1.55; color: var(--muted); cursor: pointer; }
.consent input { appearance: none; -webkit-appearance: none; width: 16px; height: 16px; margin: 3px 0 0; border: 1px solid var(--muted); background: transparent; cursor: pointer; display: grid; place-items: center; }
.consent input:checked { border-color: var(--nav); }
.consent input:checked::after { content: ""; width: 4px; height: 8px; border: solid var(--nav); border-width: 0 1.5px 1.5px 0; transform: translate(0, -1px) rotate(45deg); }
.consent input:focus-visible { outline: 1px solid var(--fg); outline-offset: 2px; }
.consent a { color: var(--nav); border-bottom: 1px solid rgba(168,180,138,.35); }
.pagar { display: grid; gap: 12px; margin-top: 8px; }
.btn-pago { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 17px 22px; cursor: pointer; font-family: inherit;
  font-size: .74rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; border: 1px solid var(--fg); transition: background .25s, color .25s, border-color .25s; }
.btn-pago .m { font-weight: 400; letter-spacing: .06em; text-transform: none; font-size: .95rem; }
.btn-pago.mp { background: var(--fg); color: var(--bg); }
.btn-pago.mp:hover { background: transparent; color: var(--fg); }
/* PayPal: su Smart Button solo permite pocos estilos; reservamos el lugar con su variante negra */
.btn-pago.paypal { background: #000; color: var(--fg); border-color: var(--dim); }
.btn-pago.paypal:hover { border-color: var(--fg); }
.btn-pago .pp { font-style: italic; font-weight: 800; letter-spacing: 0; text-transform: none; font-size: 1.05rem; }
.nota-preview { font-size: .8rem; color: var(--note); margin: 6px 0 0; min-height: 1.4em; }
.medios { font-size: .8rem; color: var(--muted); margin: 0; }

.listo-cuerpo { padding: clamp(36px, 6vh, 60px) 0 clamp(80px, 12vh, 140px); }
.listo-cuerpo .lede { max-width: 40ch; }
.btn.grande { padding: 20px 34px; font-size: .8rem; }

/* ---------- módulos próximos (no se pueden abrir; no cuentan en el %) ---------- */
.indice-mod.proximo { padding: 12px 0 8px; }
.indice-mod.proximo .indice-mod-head, .indice-mod.proximo .mod-pct { color: var(--dim); }
.indice-mod.proximo .mod-pct { letter-spacing: .14em; }
.indice-nota { margin: 8px 0 0; font-size: .74rem; color: var(--nav-lo); }
.modulo.proximo h2 { color: var(--dim); }
.modulo.proximo .mod-num { color: var(--dim); }
.proximos-nota { font-size: .85rem; font-weight: 300; color: var(--nav-lo); max-width: 62ch; margin: 0 0 1.6rem; }
.en-camino { color: var(--nav-lo); }

/* ---------- ejercicio (clase 1.4): consigna + tres columnas de notas privadas ---------- */
.ejercicio { grid-column: 1 / -1; margin-top: clamp(40px, 6vh, 64px); padding-top: clamp(28px, 4vh, 40px); border-top: 1px solid var(--line); }
.ejercicio .consigna { max-width: 62ch; }
.ejercicio .consigna p { font-weight: 300; font-size: 1.05rem; margin-bottom: .6em; }
.ejercicio .consigna p:first-child { font-size: clamp(1.2rem, 1.8vw, 1.45rem); line-height: 1.45; color: var(--fg); }
.columnas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 1.6rem; border-top: 1px solid var(--line); }
.columnas .col { padding: 20px 20px 0 0; display: flex; flex-direction: column; }
.columnas .col + .col { padding-left: 20px; border-left: 1px solid var(--line); }
.columnas label { font-size: .66rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--nav); line-height: 1.5; margin-bottom: 8px; min-height: 3em; }
.columnas .ayuda { font-size: .78rem; color: var(--muted); margin: -4px 0 8px; }
.columnas textarea { flex: 1; width: 100%; min-height: 170px; resize: vertical; background: transparent; color: var(--fg);
  font: 300 .95rem/1.6 "Mulish", system-ui, sans-serif; border: 0; border-bottom: 1px solid var(--line); padding: 4px 0 12px; outline: none; transition: border-color .2s; }
.columnas textarea:focus { border-color: var(--nav); }
.notas-estado { margin: 14px 0 0; font-size: .74rem; letter-spacing: .04em; color: var(--nav-lo); min-height: 1.4em; }
.proximo-teaser { grid-column: 1 / -1; margin-top: clamp(36px, 5vh, 52px); padding: 20px 24px; border: 1px solid var(--line); max-width: 62ch; }
.proximo-teaser .kicker { margin-bottom: .6rem; color: var(--nav-lo); }
.proximo-teaser p:last-child { margin: 0; font-weight: 300; }

/* ---------- móvil ---------- */
@media (max-width: 900px) {
  .page-aula { --nav-w: 0px; }
  .aula-nav { border-left: 0; padding: 22px var(--pad) 28px; }
  .aula-nav .brand { align-self: flex-start; text-align: left; margin-bottom: 28px; }
  .indice-mod li a { font-size: .95rem; padding: 8px 0; }
  .aula-hero { margin: 0 calc(-1 * var(--pad)); background-position: 8% 60%; min-height: 62vh; }
  .aula-hero .hero-credit { right: auto; left: var(--pad); bottom: 10px; }
  .aula-clase { padding-top: 76px; }
  .player-marco { margin: 0 calc(-1 * var(--pad)); width: auto; border-left: 0; border-right: 0; }
  .clase-info { grid-template-columns: 1fr; }
  .clase-acciones { align-items: flex-start; }
  .modulo { grid-template-columns: 1fr; }
  .modulo .num { padding-top: 0; }
  .checkout { grid-template-columns: 1fr; }
  .columnas { grid-template-columns: 1fr; }
  .columnas .col + .col { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); margin-top: 18px; }
  .columnas label { min-height: 0; }
  .columnas textarea { min-height: 120px; height: 132px; }
  .continuar { display: flex; width: 100%; }
  .continuar .t1 { display: block; font-size: .64rem; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; margin-bottom: 6px; }
  .continuar .sep { display: none; }
}

/* ---------- v0.6: dirección A + contención de B ---------- */
/* el saludo va en caja negra sobre la foto, como en el sitio */
.aula-hero > div:not(.nota-dev), .aula-hero .aula-hero-box { background: #000; padding: clamp(22px, 2.6vw, 36px) clamp(24px, 3vw, 44px) clamp(18px, 2vw, 28px); margin-left: calc(-1 * clamp(24px, 3vw, 44px)); }
.aula-hero h1 { font-weight: 200; }
.aula-hero .kicker { color: var(--nav); }
.aula-hero .hero-credit { background: #000; padding: 4px 8px; }
.player-marco { border-top: 1px solid var(--nav); }
@media (max-width: 900px) { .aula-hero > div:not(.nota-dev) { margin-left: 0; } }
/* v0.6: en el celular el crédito del sitio va arriba a la derecha; en el aula, abajo y chico */
@media (max-width: 900px) { .aula-hero .hero-credit { top: auto !important; left: auto !important; right: var(--pad) !important; bottom: 10px !important; width: auto; height: auto; } }

/* ==========================================================
   v0.7 · Módulos 2–4 (guiones de Pablo): video en preparación, tarjeta de pausa, descargas, referencias
   ========================================================== */
.columnas { grid-template-columns: repeat(var(--cols, 3), 1fr); }
.columnas[style*="--cols:1"] { max-width: 62ch; }
.columnas input[type="text"], .pausa-campo input[type="text"] { width: 100%; background: transparent; color: var(--fg);
  font: 300 1rem/1.5 "Mulish", system-ui, sans-serif; border: 0; border-bottom: 1px solid var(--line); padding: 6px 0 10px; outline: none; transition: border-color .2s; }
.columnas input[type="text"]:focus, .pausa-campo input:focus, .pausa-campo textarea:focus { border-color: var(--nav); }
.columnas input::placeholder, .pausa-campo input::placeholder { color: var(--dim); }
.ej-ayuda { max-width: 62ch; font-size: .86rem; color: var(--muted); margin: .4rem 0 0; }

/* --- «Video en preparación»: estado calmo, no un error --- */
.punto { display: inline-block; width: 7px; height: 7px; border-radius: 50%; border: 1px solid var(--nav-lo); margin-right: 10px; position: relative; top: -1px; }
.estado-prep { font-size: .66rem; font-weight: 800; letter-spacing: .22em; text-transform: uppercase; color: var(--nav-lo); margin: .9rem 0 0; }
.clase-acciones .estado-prep { margin: 0; padding: 14px 0; }
.player-marco.pendiente { display: grid; place-items: center; border-top-color: var(--nav-lo);
  background: radial-gradient(120% 90% at 50% 100%, #12130f 0%, #0b0b0a 60%); }
.player-pendiente { text-align: center; padding: 24px; max-width: 46ch; }
.player-pendiente .kicker { color: var(--nav); margin-bottom: 1.1rem; }
.player-pendiente .pp-t { font-size: clamp(1.25rem, 2.2vw, 1.7rem); font-weight: 200; color: var(--fg); margin: 0 0 .7rem; }
.player-pendiente .pp-s { font-size: .86rem; color: var(--muted); margin: 0; line-height: 1.6; }
.player-marco.sin-video .player-estado { opacity: 1; }
.player-marco.sin-video .player-estado .kicker { color: var(--nav); margin: 0 0 .6rem; display: inline-block; }

.indice-mod li a.pendiente .check { border-style: dashed; border-color: var(--dim); }
.indice-mod li a.pendiente { color: var(--muted); }
.indice-mod.en-prep .mod-pct { color: var(--dim); letter-spacing: .14em; }
.modulo.en-prep .mod-descargas, .modulo .mod-descargas { font-size: .82rem; color: var(--muted); margin: .5rem 0 0; }

/* --- Tarjeta de pausa (2.3 KMRU, 3.2 los siete audios): un corte, un respiro. Negro, línea verde, mucho aire --- */
.pausa { grid-column: 1 / -1; margin-top: clamp(40px, 6vh, 64px); max-width: 1100px;
  background: #070706; border: 1px solid var(--line); border-top: 1px solid var(--nav);
  padding: clamp(28px, 4vw, 56px) clamp(24px, 4.5vw, 64px) clamp(26px, 3.5vw, 44px); }
.pausa-cabeza { display: flex; gap: 22px; align-items: center; margin-bottom: clamp(20px, 3vh, 30px); }
.pausa-icono { display: inline-flex; gap: 6px; padding: 14px 15px; border: 1px solid var(--nav-lo); border-radius: 50%; flex: none; }
.pausa-icono i { display: block; width: 3px; height: 16px; background: var(--nav); }
.pausa .kicker { color: var(--nav); margin: 0 0 .35rem; }
.pausa-obra { margin: 0; font-size: clamp(1.6rem, 3.2vw, 2.6rem); font-weight: 200; line-height: 1.12; color: var(--fg); }
.pausa-obra em { font-style: italic; font-weight: 200; }
.pausa-intro { max-width: 60ch; }
.pausa-intro p { margin: 0 0 .35em; font-weight: 300; font-size: 1.05rem; color: var(--fg); }
.pausa-intro p + p { color: var(--muted); }
.pausa-ancla { margin: 1rem 0 0; font-size: .9rem; }
.pausa-pasos { list-style: none; margin: clamp(24px, 3.5vh, 36px) 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--line); }
.pausa-pasos.uno { grid-template-columns: 1fr; max-width: 70ch; }
.pausa-pasos > li { display: grid; grid-template-columns: 54px 1fr; gap: 0 14px; padding: 24px 28px 6px 0; }
.pausa-pasos > li + li { padding-left: 28px; border-left: 1px solid var(--line); }
.pausa-pasos .n { font-size: 2.6rem; font-weight: 200; line-height: 1; color: var(--nav-lo); font-variant-numeric: tabular-nums; }
.pausa-pasos h3 { font-size: .7rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--nav); margin: .4rem 0 .7rem; line-height: 1.5; }
.pausa-pasos p { margin: 0; font-size: .95rem; font-weight: 300; line-height: 1.65; color: var(--muted); }
.pausa-campo { margin-top: 18px; }
.pausa-campo label { display: block; font-size: .62rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); margin: 0 0 6px; }
.pausa-campo .ayuda { font-size: .78rem; color: var(--dim); margin: -2px 0 4px; }
.pausa-campo textarea { width: 100%; min-height: 120px; resize: vertical; background: transparent; color: var(--fg);
  font: 300 .95rem/1.6 "Mulish", system-ui, sans-serif; border: 0; border-bottom: 1px solid var(--line); padding: 4px 0 10px; outline: none; transition: border-color .2s; }
.pausa-pasos > li .pausa-campo { margin-top: 22px; }
.pausa-campos { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 clamp(24px, 3vw, 44px); margin-top: 10px; max-width: 900px; }
.pausa-campos .pausa-campo:last-child { grid-column: 1 / -1; }
.pausa .notas-estado { margin-top: 18px; }
.pausa-cierre { display: flex; align-items: center; justify-content: space-between; gap: 18px 32px; flex-wrap: wrap;
  margin-top: clamp(26px, 4vh, 40px); padding-top: clamp(20px, 3vh, 28px); border-top: 1px solid var(--line); }
.pausa-cierre p { margin: 0; font-size: 1.05rem; font-weight: 300; font-style: italic; color: var(--fg); }

/* --- La frase (4.3) y listas de referencia (4.4) --- */
.frase-card { grid-column: 1 / -1; margin: clamp(36px, 5vh, 56px) 0 0; padding: clamp(26px, 3.5vw, 44px) clamp(24px, 4vw, 56px); background: #000; border-left: 2px solid var(--nav); max-width: 900px; }
.frase-card .kicker { color: var(--nav); margin-bottom: .8rem; }
.frase-card blockquote { margin: 0; font-size: clamp(1.3rem, 2.4vw, 1.9rem); font-weight: 200; line-height: 1.4; color: var(--fg); }
.lista-ref { grid-column: 1 / -1; margin-top: clamp(32px, 5vh, 48px); max-width: 62ch; }
.lista-ref .kicker { color: var(--nav-lo); margin-bottom: .8rem; }
.lista-ref ul { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.lista-ref li { padding: 12px 0; border-bottom: 1px solid var(--line); font-weight: 300; font-size: .95rem; }

/* --- Lo que anotaste en otra clase (solo lectura) --- */
.referencia { grid-column: 1 / -1; margin-top: clamp(36px, 5vh, 52px); padding: 22px 26px; border: 1px solid var(--line); max-width: 900px; }
.referencia .kicker { color: var(--nav-lo); margin-bottom: .9rem; }
.referencia dl { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px 28px; }
.referencia dt { font-size: .62rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); margin-bottom: 4px; line-height: 1.5; }
.referencia dd { margin: 0; font-weight: 300; font-size: .95rem; white-space: pre-line; color: var(--fg); }
.referencia dd.vacio { color: var(--dim); }
.referencia.sin-notas dl { display: none; }
.ref-vacia { margin: 0; font-size: .9rem; color: var(--muted); }
.ref-link { margin: 14px 0 0; font-size: .85rem; }

/* --- Descargas (Módulo 3) --- */
.descargas { grid-column: 1 / -1; margin-top: clamp(44px, 6vh, 70px); padding-top: clamp(28px, 4vh, 40px); border-top: 1px solid var(--line); scroll-margin-top: 90px; }
.descargas .kicker { color: var(--nav); }
.descargas-bajada { max-width: 62ch; font-weight: 300; font-size: 1.05rem; margin: -0.6rem 0 1.6rem; }
.descargas-grupos { display: grid; grid-template-columns: 1.15fr 1fr; gap: 0 clamp(28px, 4vw, 64px); max-width: 1100px; }
.descargas h3 { font-size: .66rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); margin: 0 0 .4rem; }
.descargas ul { list-style: none; margin: 0 0 24px; padding: 0; border-top: 1px solid var(--line); }
.descarga > a, .descarga.pendiente { display: grid; grid-template-columns: 1fr auto auto; gap: 4px 18px; align-items: baseline; padding: 13px 0; border-bottom: 1px solid var(--line); }
.descarga .nom { font-weight: 300; font-size: .98rem; color: var(--fg); }
.descarga .det { display: block; font-size: .76rem; color: var(--muted); margin-top: 2px; }
.descarga .tipo { font-size: .66rem; font-weight: 700; letter-spacing: .16em; color: var(--muted); }
.descarga .estado { font-size: .66rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; color: var(--nav); min-width: 9.5em; text-align: right; }
.descarga > a:hover .nom, .descarga > a:hover .estado { color: var(--nav-hi); }
.descarga > a .estado::after { content: " ↓"; }
.descarga.pendiente .nom { color: var(--muted); }
.descarga.pendiente .estado { color: var(--dim); font-weight: 700; }
.descargas-nota { max-width: 62ch; font-size: .86rem; color: var(--muted); margin: 0; }

@media (max-width: 900px) {
  .columnas { grid-template-columns: 1fr; }
  .pausa { margin-left: calc(-1 * var(--pad)); margin-right: calc(-1 * var(--pad)); border-left: 0; border-right: 0; padding: 30px var(--pad) 28px; }
  .pausa-cabeza { gap: 16px; }
  .pausa-pasos { grid-template-columns: 1fr; }
  .pausa-pasos > li { grid-template-columns: 40px 1fr; padding: 22px 0 6px; }
  .pausa-pasos > li + li { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); margin-top: 16px; }
  .pausa-pasos .n { font-size: 2rem; }
  .pausa-campos { grid-template-columns: 1fr; }
  .pausa-cierre { flex-direction: column; align-items: stretch; }
  .pausa-cierre .btn { text-align: center; }
  .descargas-grupos { grid-template-columns: 1fr; }
  .descarga > a, .descarga.pendiente { grid-template-columns: 1fr auto; }
  .descarga .tipo { display: none; }
  .descarga .estado { min-width: 0; }
}
/* el índice ahora es largo: sin la onda decorativa encima de las clases */
.page-aula .nav::after { display: none; }
.sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.pausa-campo textarea::placeholder { color: var(--dim); font-style: italic; }
.indice-mod li a.pendiente[aria-current="page"] { color: var(--nav-hi); }
.indice-mod li a.pendiente[aria-current="page"] .check { border-color: var(--nav-hi); }
/* nota breve de Pablo dentro del texto de la clase (3.3) */
.nota-pablo { max-width: 60ch; margin: 1.2rem 0 0; padding: 4px 0 4px 18px; border-left: 1px solid var(--nav); font-weight: 300; font-style: italic; color: var(--fg); line-height: 1.65; }