/* Academia · concursos del Estado — sistema visual v2
   Identidad propia: azul tinta institucional, dorado y fondos claros. Sin verde.
   Sin estilos en línea en el HTML (la CSP los bloquea): todo vive aquí. */
@font-face { font-family: "Manrope"; src: url("/fuentes/Manrope-variable-latin.woff2") format("woff2"); font-weight: 200 800; font-display: swap; }
@font-face { font-family: "Inter"; src: url("/fuentes/Inter-variable-latin.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }

:root {
  --tinta: #0F1E36; --tinta-prof: #0A1526; --tinta-2: #1B3358; --tinta-3: #253F6B;
  --dorado: #E0A81E; --dorado-hover: #EDB833; --dorado-osc: #8F6705; --dorado-claro: #F6D77E; --dorado-suave: #FDF3D6;
  --fondo: #F5F7FB; --papel: #FFFFFF; --linea: #E4E8F0; --linea-2: #CBD3E1;
  --texto: #18202F; --texto-2: #475467; --tenue: #667085;
  --azul: #1F4FD1; --azul-suave: #EAF0FF; --rojo: #C0352B; --rojo-suave: #FDECEA; --ambar-suave: #FFF7E0; --morado-suave: #F2ECFB;
  --radio: 14px; --radio-g: 20px; --radio-xl: 28px;
  --sombra: 0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.06);
  --sombra-2: 0 12px 32px rgba(16,24,40,.10), 0 2px 6px rgba(16,24,40,.06);
  --ancho: 1200px; --titulos: "Manrope", system-ui, sans-serif; --cuerpo: "Inter", system-ui, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@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(--texto); font: 400 16px/1.6 var(--cuerpo); overflow-x: hidden; }
img, svg, video, audio { max-width: 100%; display: block; }
a { color: var(--azul); text-underline-offset: 3px; }
a:hover { color: var(--tinta); }
h1, h2, h3, h4 { font-family: var(--titulos); color: var(--tinta); line-height: 1.15; letter-spacing: -0.02em; margin: 0 0 .5em; }
h1 { font-size: clamp(2rem, 4.6vw, 3.25rem); font-weight: 800; }
h2 { font-size: clamp(1.5rem, 3vw, 2.15rem); font-weight: 800; }
h3 { font-size: 1.15rem; font-weight: 800; }
p { margin: 0 0 1em; }
:focus-visible { outline: 3px solid var(--dorado); outline-offset: 2px; border-radius: 6px; }
.oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[hidden] { display: none !important; }
.contenedor { width: 100%; max-width: var(--ancho); margin: 0 auto; padding: 0 20px; }
.saltar { position: absolute; left: -9999px; top: 8px; background: var(--tinta); color: #fff; padding: 10px 14px; border-radius: 10px; z-index: 100; }
.saltar:focus { left: 12px; }
.btn svg, .reloj svg, .pie svg, .lista-meta svg, .detalle svg { width: 18px; height: 18px; flex: 0 0 auto; }

/* ---------- Encabezado público ---------- */
.cab { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.95); backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid var(--linea); }
.cab .contenedor { display: flex; align-items: center; gap: 18px; min-height: 70px; }
.marca { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--tinta); flex: 0 0 auto; }
.marca svg { width: 38px; height: 38px; flex: 0 0 auto; }
.marca b { font: 800 1.3rem/1 var(--titulos); letter-spacing: -0.03em; display: block; }
.marca small { font: 600 .6rem/1 var(--cuerpo); letter-spacing: .18em; color: var(--tenue); display: block; margin-top: 4px; }
.menu-escuelas { position: relative; }
.menu-escuelas > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--texto); padding: 10px 12px; border-radius: 10px; }
.menu-escuelas > summary::-webkit-details-marker { display: none; }
.menu-escuelas > summary svg { width: 16px; height: 16px; }
.menu-escuelas > summary:hover, .menu-escuelas[open] > summary { background: var(--fondo); }
.menu-escuelas .desplegable { position: absolute; left: 0; top: 50px; width: 580px; background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); box-shadow: var(--sombra-2); padding: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.menu-escuelas .desplegable a { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 12px; text-decoration: none; color: var(--texto); }
.menu-escuelas .desplegable a:hover { background: var(--fondo); }
.menu-escuelas .desplegable b { display: block; font-size: .95rem; }
.menu-escuelas .desplegable small { display: block; color: var(--tenue); font-size: .8rem; }
.menu-escuelas .desplegable .todas { grid-column: 1 / -1; justify-content: center; font-weight: 700; color: var(--azul); border-top: 1px solid var(--linea); border-radius: 0; margin-top: 6px; padding-top: 14px; }
.buscador { flex: 1; max-width: 420px; position: relative; margin: 0; }
.buscador input { width: 100%; height: 44px; border-radius: 999px; border: 1.5px solid var(--linea-2); background: var(--fondo); padding: 0 16px 0 42px; font: 500 .95rem var(--cuerpo); color: var(--texto); }
.buscador input:focus { outline: none; border-color: var(--tinta); background: var(--papel); box-shadow: 0 0 0 3px rgba(224,168,30,.3); }
.buscador svg { position: absolute; left: 14px; top: 12px; width: 20px; height: 20px; color: var(--tenue); pointer-events: none; }
.nav-der { display: flex; align-items: center; gap: 6px; margin-left: auto; }
.nav-der a.enlace { text-decoration: none; color: var(--texto); font-weight: 600; padding: 10px 12px; border-radius: 10px; white-space: nowrap; }
.nav-der a.enlace:hover, .nav-der a.enlace[aria-current="page"] { background: var(--fondo); color: var(--tinta); }
.menu-movil { display: none; }
@media (max-width: 1060px) { .buscador { display: none; } }
@media (max-width: 860px) {
  .menu-escuelas, .nav-der .enlace, .nav-der .btn-borde { display: none; }
  .menu-movil { display: block; position: relative; }
  .menu-movil summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 12px; border: 1px solid var(--linea-2); background: var(--papel); }
  .menu-movil summary::-webkit-details-marker { display: none; }
  .menu-movil summary svg { width: 22px; height: 22px; }
  .menu-movil .panel-movil { position: absolute; right: 0; top: 52px; width: min(88vw, 330px); background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); box-shadow: var(--sombra-2); padding: 10px; display: grid; }
  .menu-movil .panel-movil a { text-decoration: none; color: var(--texto); font-weight: 600; padding: 12px 14px; border-radius: 10px; }
  .menu-movil .panel-movil a:hover { background: var(--fondo); }
  .menu-movil .panel-movil .sep { height: 1px; background: var(--linea); margin: 6px 0; }
}
@media (max-width: 440px) { .nav-der .btn-primario { padding: 0 12px; font-size: .9rem; } .cab .marca small { display: none; } .cab .contenedor { gap: 10px; } }

/* ---------- Botones ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 20px; border-radius: 12px; border: 1.5px solid transparent; font: 700 .96rem/1 var(--cuerpo); text-decoration: none; cursor: pointer; transition: background-color .15s, border-color .15s, transform .1s, box-shadow .15s; white-space: nowrap; }
.btn:active { transform: translateY(1px); }
.btn-primario { background: var(--dorado); color: var(--tinta-prof); }
.btn-primario:hover { background: var(--dorado-hover); color: var(--tinta-prof); box-shadow: 0 6px 16px rgba(224,168,30,.35); }
.btn-oscuro { background: var(--tinta); color: #fff; }
.btn-oscuro:hover { background: var(--tinta-2); color: #fff; }
.btn-borde { background: var(--papel); color: var(--tinta); border-color: var(--linea-2); }
.btn-borde:hover { border-color: var(--tinta); color: var(--tinta); }
.btn-claro { background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.35); }
.btn-claro:hover { background: rgba(255,255,255,.16); color: #fff; }
.btn-peligro { background: var(--papel); color: var(--rojo); border-color: #F1C1BC; }
.btn-peligro:hover { border-color: var(--rojo); color: var(--rojo); }
.btn-chico { min-height: 38px; padding: 0 14px; font-size: .87rem; border-radius: 10px; }
.btn-grande { min-height: 54px; padding: 0 26px; font-size: 1.02rem; border-radius: 14px; }
.btn[disabled], .btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.btn-bloque { width: 100%; }

/* ---------- Portada de inicio ---------- */
.portada { position: relative; overflow: hidden; color: #D6DEEA; padding: 76px 0 64px;
  background: radial-gradient(800px 480px at 90% -10%, rgba(224,168,30,.22), transparent 60%), radial-gradient(900px 600px at 0% 120%, rgba(31,79,209,.35), transparent 60%), linear-gradient(160deg, var(--tinta) 0%, var(--tinta-prof) 100%); }
.portada::before { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px); background-size: 44px 44px; -webkit-mask-image: linear-gradient(to bottom, #000, transparent 85%); mask-image: linear-gradient(to bottom, #000, transparent 85%); pointer-events: none; }
.portada .contenedor { position: relative; }
.portada h1 { color: #fff; max-width: 860px; }
.portada h1 em { font-style: normal; color: var(--dorado); }
.portada .lead { font-size: 1.15rem; max-width: 660px; color: #C2CCDC; }
.buscador-grande { display: flex; gap: 8px; max-width: 640px; background: #fff; border-radius: 18px; padding: 8px; margin-top: 28px; box-shadow: 0 20px 40px rgba(0,0,0,.25); }
.buscador-grande input { flex: 1; min-width: 0; border: 0; font: 500 1.02rem var(--cuerpo); padding: 0 12px; color: var(--texto); background: transparent; }
.buscador-grande input:focus { outline: none; }
.populares { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 16px; font-size: .9rem; color: #A9B4C6; }
.populares a { color: #E6ECF5; text-decoration: none; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; padding: 6px 12px; font-weight: 600; }
.populares a:hover { background: rgba(255,255,255,.1); color: #fff; }
.etiqueta { display: inline-flex; align-items: center; gap: 8px; font: 700 .74rem/1 var(--cuerpo); letter-spacing: .14em; text-transform: uppercase; color: var(--dorado-claro); background: rgba(224,168,30,.12); border: 1px solid rgba(246,215,126,.35); padding: 8px 12px; border-radius: 999px; margin-bottom: 18px; }
.cifras { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; margin-top: 40px; max-width: 900px; }
.cifra { border: 1px solid rgba(255,255,255,.12); border-radius: var(--radio); padding: 16px; background: rgba(255,255,255,.04); }
.cifra b { display: block; font: 800 1.7rem/1 var(--titulos); color: #fff; }
.cifra span { font-size: .86rem; color: #A9B4C6; }
@media (max-width: 720px) { .cifras { grid-template-columns: repeat(2, minmax(0,1fr)); } .portada { padding: 48px 0 44px; } .buscador-grande .btn { padding: 0 14px; } }

/* ---------- Secciones ---------- */
.seccion { padding: 72px 0; }
.seccion.blanca { background: var(--papel); border-top: 1px solid var(--linea); border-bottom: 1px solid var(--linea); }
.intro { max-width: 720px; margin-bottom: 30px; }
.intro p { color: var(--texto-2); font-size: 1.05rem; }
.intro-fila { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 26px; flex-wrap: wrap; }
.intro-fila h2 { margin: 0; }
.sobre { font: 700 .76rem/1 var(--cuerpo); letter-spacing: .14em; text-transform: uppercase; color: var(--dorado-osc); margin-bottom: 12px; display: block; }
.rejilla { display: grid; gap: 18px; grid-template-columns: repeat(3, minmax(0,1fr)); }
.rejilla.dos { grid-template-columns: repeat(2, minmax(0,1fr)); }
.rejilla.cuatro { grid-template-columns: repeat(4, minmax(0,1fr)); }
.rejilla > * { min-width: 0; }
@media (max-width: 980px) { .rejilla, .rejilla.cuatro { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 640px) { .rejilla, .rejilla.dos, .rejilla.cuatro { grid-template-columns: 1fr; } .seccion { padding: 52px 0; } }
.tarjeta { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); padding: 24px; box-shadow: var(--sombra); min-width: 0; }
.tarjeta h3 { margin-bottom: 8px; }
.tarjeta p { color: var(--texto-2); font-size: .97rem; }
.icono-cir { width: 48px; height: 48px; border-radius: 14px; background: var(--dorado-suave); color: var(--dorado-osc); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 14px; }
.icono-cir svg { width: 24px; height: 24px; }
.icono-cir.azul { background: var(--azul-suave); color: var(--azul); }
.icono-cir.morado { background: var(--morado-suave); color: #6D28D9; }

/* ---------- Escuelas ---------- */
.emblema { width: 52px; height: 52px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; flex: 0 0 auto; box-shadow: inset 0 0 0 3px rgba(255,255,255,.22); }
.emblema svg { width: 26px; height: 26px; }
.emblema.chico { width: 38px; height: 38px; } .emblema.chico svg { width: 19px; height: 19px; }
.emblema.grande { width: 76px; height: 76px; } .emblema.grande svg { width: 38px; height: 38px; }
.escuela-card { display: flex; align-items: center; gap: 14px; padding: 18px; background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); text-decoration: none; color: var(--texto); transition: transform .15s, box-shadow .15s, border-color .15s; min-height: 92px; }
a.escuela-card:hover { transform: translateY(-2px); box-shadow: var(--sombra-2); border-color: var(--linea-2); color: var(--texto); }
.escuela-card .txt { flex: 1; min-width: 0; }
.escuela-card b { display: block; font: 800 1.05rem/1.25 var(--titulos); color: var(--tinta); }
.escuela-card small { display: block; color: var(--tenue); font-size: .84rem; margin-top: 2px; }
.escuela-card.inactiva .emblema { filter: saturate(.55); opacity: .8; }
.estado { display: inline-flex; align-items: center; gap: 6px; font: 700 .72rem/1 var(--cuerpo); padding: 6px 10px; border-radius: 999px; background: var(--dorado-suave); color: #7A5806; white-space: nowrap; }
.estado.gris { background: #EEF1F6; color: var(--tenue); }
.estado.azul { background: var(--azul-suave); color: var(--azul); }
.estado .punto { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.sin-resultados { padding: 30px; text-align: center; color: var(--texto-2); }

/* Tarjeta de programa con portada */
.curso-card { display: flex; flex-direction: column; background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); overflow: hidden; text-decoration: none; color: var(--texto); transition: transform .15s, box-shadow .15s; box-shadow: var(--sombra); min-width: 0; }
a.curso-card:hover { transform: translateY(-3px); box-shadow: var(--sombra-2); color: var(--texto); }
.portadilla { position: relative; height: 150px; display: flex; align-items: center; justify-content: center; overflow: hidden; color: #fff; }
.portadilla::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(255,255,255,.16) 1.5px, transparent 1.5px); background-size: 18px 18px; }
.portadilla::after { content: ""; position: absolute; width: 260px; height: 260px; border-radius: 50%; right: -80px; top: -90px; background: rgba(255,255,255,.12); }
.portadilla .emblema { position: relative; z-index: 1; width: 72px; height: 72px; background: rgba(255,255,255,.16); }
.portadilla .emblema svg { width: 36px; height: 36px; }
.portadilla .sello { position: absolute; left: 14px; top: 14px; z-index: 1; }
.curso-card .cuerpo { padding: 18px 20px 20px; display: flex; flex-direction: column; flex: 1; }
.curso-card .escuela-tag { font: 700 .74rem/1 var(--cuerpo); letter-spacing: .08em; text-transform: uppercase; color: var(--tenue); margin-bottom: 8px; }
.curso-card h3 { font-size: 1.12rem; margin-bottom: 6px; }
.curso-card p { color: var(--texto-2); font-size: .93rem; margin-bottom: 12px; }
.lista-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .85rem; color: var(--texto-2); list-style: none; padding: 0; margin: 0 0 14px; }
.lista-meta li { display: inline-flex; align-items: center; gap: 6px; }
.curso-card .pie { margin-top: auto; padding-top: 14px; border-top: 1px solid var(--linea); display: flex; align-items: center; justify-content: space-between; gap: 10px; font-weight: 700; color: var(--tinta); }
.precio-desde { font: 800 1.05rem/1.1 var(--titulos); color: var(--tinta); }
.precio-desde small { display: block; font: 500 .74rem/1.3 var(--cuerpo); color: var(--tenue); }

/* ---------- Ficha de convocatoria ---------- */
.migas { font-size: .88rem; color: var(--tenue); margin-bottom: 14px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.migas a { color: var(--tenue); text-decoration: none; }
.migas a:hover { color: var(--tinta); text-decoration: underline; }
.curso-hero { background: radial-gradient(700px 400px at 95% 0%, rgba(224,168,30,.18), transparent 60%), linear-gradient(160deg, var(--tinta) 0%, var(--tinta-prof) 100%); color: #C9D2E0; padding: 36px 0 48px; }
.curso-hero .migas, .curso-hero .migas a { color: #9FAEC4; }
.curso-hero .migas a:hover { color: #fff; }
.curso-hero h1 { color: #fff; font-size: clamp(1.9rem, 4vw, 2.9rem); max-width: 760px; }
.curso-hero .sub { font-size: 1.1rem; color: #C9D2E0; max-width: 700px; }
.fila-emblema { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; flex-wrap: wrap; }
.fila-emblema > span { font-weight: 700; color: #E6ECF5; }
.ficha { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 32px; align-items: start; }
.ficha > * { min-width: 0; }
.ficha .lateral { position: sticky; top: 90px; margin-top: -150px; }
@media (max-width: 980px) { .ficha { grid-template-columns: 1fr; } .ficha .lateral { position: static; margin-top: 0; order: -1; } }
.compra-card { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); box-shadow: var(--sombra-2); overflow: hidden; }
.compra-card .portadilla { height: 120px; }
.compra-card .dentro { padding: 22px; }
.compra-card .precio { font: 800 1.9rem/1.1 var(--titulos); color: var(--tinta); }
.compra-card .precio small { display: block; font: 500 .85rem/1.3 var(--cuerpo); color: var(--tenue); margin-top: 4px; }
.compra-card ul { list-style: none; padding: 0; margin: 16px 0 0; display: grid; gap: 10px; font-size: .93rem; color: var(--texto-2); }
.compra-card li { display: flex; gap: 10px; align-items: flex-start; }
.compra-card li svg { width: 18px; height: 18px; color: var(--dorado-osc); flex: 0 0 auto; margin-top: 2px; }
.detalles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); margin-top: 28px; box-shadow: var(--sombra); }
.detalle { padding: 18px; border-right: 1px solid var(--linea); }
.detalle:last-child { border-right: 0; }
.detalle svg { color: var(--dorado-osc); margin-bottom: 6px; }
.detalle b { display: block; font: 800 1.12rem/1.2 var(--titulos); color: var(--tinta); }
.detalle span { font-size: .86rem; color: var(--tenue); }
@media (max-width: 720px) { .detalles { grid-template-columns: repeat(2, minmax(0, 1fr)); } .detalle:nth-child(2) { border-right: 0; } .detalle:nth-child(-n+2) { border-bottom: 1px solid var(--linea); } }
.bloque { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); padding: 26px; margin-top: 22px; }
.bloque h2 { font-size: 1.4rem; }
@media (max-width: 520px) { .bloque { padding: 20px; } }
.logros { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 24px; list-style: none; padding: 0; margin: 0; }
.logros li { display: flex; gap: 10px; align-items: flex-start; color: var(--texto-2); }
.logros li svg { width: 20px; height: 20px; color: var(--azul); flex: 0 0 auto; margin-top: 2px; }
@media (max-width: 640px) { .logros { grid-template-columns: 1fr; } }
.chips-temas { display: flex; flex-wrap: wrap; gap: 8px; }
.chips-temas span { background: #EEF2F8; color: var(--texto); border-radius: 999px; padding: 8px 14px; font-size: .88rem; font-weight: 600; }
.temario-pub details { border: 1px solid var(--linea); border-radius: var(--radio); margin-bottom: 8px; background: var(--papel); }
.temario-pub summary { cursor: pointer; list-style: none; padding: 16px 18px; display: flex; justify-content: space-between; gap: 12px; font-weight: 700; color: var(--tinta); }
.temario-pub summary::-webkit-details-marker { display: none; }
.temario-pub summary span { color: var(--tenue); font-weight: 500; font-size: .88rem; white-space: nowrap; }
.temario-pub ul { margin: 0; padding: 0 18px 16px 38px; color: var(--texto-2); font-size: .94rem; display: grid; gap: 6px; }
.barra-inscripcion { display: none; }
@media (max-width: 980px) {
  .barra-inscripcion { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; background: var(--papel); border-top: 1px solid var(--linea); padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); align-items: center; justify-content: space-between; gap: 12px; box-shadow: 0 -6px 20px rgba(16,24,40,.08); }
  .barra-inscripcion b { font: 800 1rem var(--titulos); color: var(--tinta); }
  .con-barra .pie-sitio { padding-bottom: 96px; }
}

/* Listas */
.lista-check { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.lista-check li { position: relative; padding-left: 30px; }
.lista-check li::before { content: ""; position: absolute; left: 0; top: .32em; width: 18px; height: 18px; border-radius: 6px; background: var(--dorado-suave) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238F6705' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/13px no-repeat; }
.lista-clara li { color: #DCE3EE; }
.lista-opciones { list-style: none; padding: 0; margin: 0 0 12px; display: grid; gap: 6px; }
.lista-modulos { padding-left: 1.4em; display: grid; gap: 6px; margin: 0; }
.lista-modulos li::marker { color: var(--dorado-osc); font-weight: 800; }

/* Pasos */
.pasos { counter-reset: paso; display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0,1fr)); }
.paso { position: relative; padding: 22px; border-radius: var(--radio-g); background: var(--papel); border: 1px solid var(--linea); }
.paso::before { counter-increment: paso; content: counter(paso); display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 12px; background: var(--tinta); color: var(--dorado-claro); font: 800 1rem/1 var(--titulos); margin-bottom: 12px; }
.paso p { color: var(--texto-2); margin: 0; font-size: .95rem; }
@media (max-width: 980px) { .pasos { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 560px) { .pasos { grid-template-columns: 1fr; } }

/* Preguntas frecuentes */
.faq { display: grid; gap: 10px; max-width: 860px; }
.faq details { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio); padding: 0 18px; }
.faq summary { cursor: pointer; list-style: none; font: 700 1.02rem/1.4 var(--titulos); color: var(--tinta); padding: 16px 30px 16px 0; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 0; top: 12px; font-size: 1.4rem; color: var(--dorado-osc); }
.faq details[open] summary::after { content: "–"; }
.faq details p { color: var(--texto-2); }

/* Llamado */
.llamado { background: linear-gradient(135deg, var(--tinta) 0%, var(--tinta-3) 100%); color: #D6DEEA; border-radius: var(--radio-xl); padding: 44px; display: grid; grid-template-columns: 1.4fr 1fr; gap: 24px; align-items: center; position: relative; overflow: hidden; }
.llamado::after { content: ""; position: absolute; width: 320px; height: 320px; border-radius: 50%; right: -100px; bottom: -160px; background: rgba(224,168,30,.18); pointer-events: none; }
.llamado h2 { color: #fff; }
.llamado .acciones { display: flex; flex-wrap: wrap; gap: 12px; justify-content: flex-end; position: relative; z-index: 1; }
@media (max-width: 760px) { .llamado { grid-template-columns: 1fr; padding: 28px; } .llamado .acciones { justify-content: flex-start; } }

/* Avisos */
.aviso { border-radius: var(--radio); padding: 14px 16px; border: 1px solid var(--linea); background: var(--papel); font-size: .95rem; }
.aviso.dorado { background: var(--ambar-suave); border-color: #F0DB9E; color: #5B4405; }
.aviso.rojo { background: var(--rojo-suave); border-color: #F3C4BE; color: #7A1A12; }
.aviso.azul { background: var(--azul-suave); border-color: #C9D6EE; color: #1E3766; }
.aviso p:last-child { margin: 0; }
.temario { display: grid; gap: 10px; }
.tema { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 14px 16px; border: 1px solid var(--linea); border-radius: var(--radio); background: var(--papel); }
.tema b { color: var(--tinta); }
.tema span { color: var(--tenue); font-size: .9rem; }

/* ---------- Planes ---------- */
.planes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; align-items: stretch; }
.plan { background: var(--papel); border: 1.5px solid var(--linea); border-radius: var(--radio-xl); padding: 26px; display: flex; flex-direction: column; position: relative; min-width: 0; }
.plan.destacado { border-color: var(--dorado); box-shadow: 0 16px 40px rgba(224,168,30,.18); }
.plan .cinta { position: absolute; top: -12px; left: 24px; background: var(--dorado); color: var(--tinta-prof); font: 800 .72rem/1 var(--cuerpo); letter-spacing: .06em; text-transform: uppercase; padding: 7px 10px; border-radius: 999px; }
.plan h3 { font-size: 1.2rem; }
.plan .precio { font: 800 2.05rem/1 var(--titulos); color: var(--tinta); margin: 10px 0 4px; }
.plan .precio small { font: 500 .9rem var(--cuerpo); color: var(--tenue); }
.plan .vigencia { color: var(--tenue); font-size: .9rem; }
.plan ul { list-style: none; padding: 0; margin: 18px 0 22px; display: grid; gap: 10px; font-size: .94rem; color: var(--texto-2); }
.plan li { display: flex; gap: 10px; align-items: flex-start; }
.plan li svg { width: 18px; height: 18px; color: var(--dorado-osc); flex: 0 0 auto; margin-top: 2px; }
.plan .btn { margin-top: auto; }

/* ---------- Inscripción y pago ---------- */
.inscripcion { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 28px; align-items: start; }
.inscripcion > * { min-width: 0; }
@media (max-width: 960px) { .inscripcion { grid-template-columns: 1fr; } }
.pasos-insc { display: flex; gap: 8px; margin-bottom: 22px; flex-wrap: wrap; }
.pasos-insc span { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: .88rem; color: var(--tenue); background: var(--papel); border: 1px solid var(--linea); border-radius: 999px; padding: 8px 14px; }
.pasos-insc span[aria-current="step"] { color: var(--tinta); border-color: var(--tinta); }
.pasos-insc span.listo { color: var(--azul); border-color: #C9D6EE; background: var(--azul-suave); }
.opcion-plan { display: flex; gap: 14px; align-items: flex-start; width: 100%; text-align: left; padding: 16px; border: 1.5px solid var(--linea-2); border-radius: var(--radio); background: var(--papel); cursor: pointer; font: inherit; color: var(--texto); margin-bottom: 10px; }
.opcion-plan:hover { border-color: var(--tinta); }
.opcion-plan[aria-pressed="true"] { border-color: var(--tinta); box-shadow: 0 0 0 3px rgba(224,168,30,.3); }
.opcion-plan .radio { width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--linea-2); flex: 0 0 auto; margin-top: 2px; }
.opcion-plan[aria-pressed="true"] .radio { border: 6px solid var(--tinta); }
.opcion-plan .txt { flex: 1; min-width: 0; }
.opcion-plan b { display: block; color: var(--tinta); }
.opcion-plan small { color: var(--tenue); }
.opcion-plan .valor { font: 800 1.05rem var(--titulos); color: var(--tinta); white-space: nowrap; }
.metodos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 560px) { .metodos { grid-template-columns: 1fr; } }
.pago-qr { display: grid; grid-template-columns: 200px 1fr; gap: 18px; align-items: start; background: var(--fondo); border: 1px solid var(--linea); border-radius: var(--radio-g); padding: 18px; }
.pago-qr img { width: 200px; height: 200px; object-fit: contain; background: #fff; border-radius: 12px; border: 1px solid var(--linea); }
@media (max-width: 560px) { .pago-qr { grid-template-columns: 1fr; } .pago-qr img { margin: 0 auto; } }
.referencia { display: inline-flex; align-items: center; gap: 10px; font: 800 1.35rem/1 var(--titulos); letter-spacing: .06em; color: var(--tinta); background: var(--dorado-suave); border: 1.5px dashed var(--dorado); padding: 10px 16px; border-radius: 12px; }
.resumen-pedido { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); padding: 22px; position: sticky; top: 90px; }
.resumen-pedido .linea-total { display: flex; justify-content: space-between; font: 800 1.2rem var(--titulos); color: var(--tinta); border-top: 1px solid var(--linea); padding-top: 14px; margin-top: 14px; }

/* ---------- Pie ---------- */
.pie-sitio { background: var(--tinta-prof); color: #A9B4C6; padding: 52px 0 calc(32px + env(safe-area-inset-bottom)); font-size: .93rem; }
.pie-sitio .cols { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 28px; }
.pie-sitio h4 { color: #fff; font-size: .95rem; margin-bottom: 12px; }
.pie-sitio a { color: #DCE3EE; text-decoration: none; display: inline-block; padding: 4px 0; }
.pie-sitio a:hover { color: var(--dorado-claro); }
.pie-sitio .marca { color: #fff; }
.pie-sitio .marca small { color: var(--dorado-claro); }
.pie-sitio .legal { border-top: 1px solid rgba(255,255,255,.1); margin-top: 32px; padding-top: 20px; font-size: .84rem; color: #8E9AAE; }
@media (max-width: 860px) { .pie-sitio .cols { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .pie-sitio .cols { grid-template-columns: 1fr; } }

/* ---------- Formularios ---------- */
.formulario { display: grid; gap: 16px; }
.campo label { display: block; font-weight: 700; color: var(--tinta); margin-bottom: 6px; font-size: .95rem; }
.campo input, .campo select, .campo textarea { width: 100%; min-height: 48px; border: 1.5px solid var(--linea-2); border-radius: 12px; padding: 10px 14px; font: 500 1rem/1.4 var(--cuerpo); color: var(--texto); background: var(--papel); }
.campo textarea { min-height: 96px; resize: vertical; }
.campo input:focus, .campo select:focus, .campo textarea:focus { outline: none; border-color: var(--tinta); box-shadow: 0 0 0 3px rgba(224,168,30,.3); }
.campo .ayuda { font-size: .85rem; color: var(--tenue); margin-top: 6px; }
.dos-campos { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 560px) { .dos-campos { grid-template-columns: 1fr; } }
.clave { position: relative; }
.clave input { padding-right: 76px; }
.clave button { position: absolute; right: 6px; top: 6px; height: 36px; padding: 0 10px; border: 0; background: transparent; color: var(--azul); font-weight: 700; cursor: pointer; border-radius: 8px; }
.casillas { display: grid; gap: 8px; }
.casillas label { display: flex; align-items: flex-start; gap: 10px; font-weight: 600; min-height: 40px; color: var(--texto); font-size: .94rem; }
.casillas input { width: 20px; height: 20px; accent-color: var(--tinta); flex: 0 0 auto; margin-top: 1px; }

/* ---------- Ingreso ---------- */
.acceso { min-height: calc(100vh - 71px); display: grid; grid-template-columns: 1fr 1fr; }
.acceso .lado { background: radial-gradient(700px 420px at 80% 10%, rgba(224,168,30,.2), transparent 60%), linear-gradient(160deg, var(--tinta) 0%, var(--tinta-prof) 100%); color: #C9D2E0; padding: 64px 48px; display: flex; flex-direction: column; justify-content: center; }
.acceso .lado h1 { color: #fff; font-size: clamp(1.8rem, 3.4vw, 2.6rem); }
.acceso .caja { padding: 48px 24px; display: flex; align-items: center; justify-content: center; background: var(--papel); }
.acceso .caja > div { width: 100%; max-width: 420px; }
@media (max-width: 860px) { .acceso { grid-template-columns: 1fr; } .acceso .lado { padding: 32px 20px; } .acceso .lado .lista-check { display: none; } }

/* ---------- Campus ---------- */
.campus-cab { background: var(--tinta); color: #DCE3EE; position: sticky; top: 0; z-index: 45; }
.campus-cab .contenedor { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 64px; }
.campus-cab .marca { color: #fff; }
.campus-cab .marca small { color: var(--dorado-claro); }
.campus-cab nav { display: flex; align-items: center; gap: 2px; }
.campus-cab nav a, .campus-cab nav button { color: #C9D2E0; text-decoration: none; font: 600 .93rem/1 var(--cuerpo); padding: 10px 12px; border-radius: 10px; background: transparent; border: 0; cursor: pointer; min-height: 40px; white-space: nowrap; display: inline-flex; align-items: center; }
.campus-cab nav a:hover, .campus-cab nav button:hover, .campus-cab nav a[aria-current="page"] { background: rgba(255,255,255,.1); color: #fff; }
@media (max-width: 640px) { .campus-cab .marca small { display: none; } .campus-cab nav a.solo-escritorio { display: none; } }
@media (max-width: 520px) { .campus-cab .marca span { display: none; } .campus-cab nav a, .campus-cab nav button { padding: 10px 9px; font-size: .88rem; } }
.campus { padding: 30px 0 80px; }
.saludo { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 22px; }
.saludo h1 { font-size: clamp(1.7rem, 3.6vw, 2.4rem); margin-bottom: 4px; }
.saludo p { margin: 0; color: var(--texto-2); }
.continuar { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 18px; align-items: center; background: linear-gradient(135deg, var(--tinta) 0%, var(--tinta-3) 100%); color: #D6DEEA; border-radius: var(--radio-g); padding: 22px; margin-bottom: 8px; }
.continuar h2 { color: #fff; font-size: 1.25rem; margin: 4px 0 8px; }
.continuar .sobre { color: var(--dorado-claro); margin: 0; }
.continuar .barra { background: rgba(255,255,255,.15); }
.continuar p { color: #AEB9CB; margin: 6px 0 0; font-size: .9rem; }
@media (max-width: 720px) { .continuar { grid-template-columns: 1fr; } .continuar .emblema { display: none; } }
.barra { height: 8px; background: #E6EAF2; border-radius: 999px; overflow: hidden; }
.barra > i { display: block; height: 100%; width: 0; background: var(--dorado); border-radius: 999px; transition: width .4s; }
.titulo-seccion { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 30px 0 14px; }
.titulo-seccion h2 { font-size: 1.3rem; margin: 0; }
.rendimiento { display: grid; grid-template-columns: 1.3fr 1fr; gap: 18px; }
.rendimiento > * { min-width: 0; }
@media (max-width: 860px) { .rendimiento { grid-template-columns: 1fr; } }
.barras-area { display: grid; gap: 10px; }
.barra-area { display: grid; grid-template-columns: 180px minmax(0, 1fr) 48px; gap: 10px; align-items: center; font-size: .9rem; }
.barra-area .barra { height: 10px; }
.barra-area .barra > i.baja { background: var(--rojo); }
.barra-area .barra > i.alta { background: var(--azul); }
.barra-area b { text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 520px) { .barra-area { grid-template-columns: 1fr 44px; } .barra-area .barra { grid-column: 1 / -1; grid-row: 2; } }
.recomendacion { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1px solid var(--linea); border-radius: var(--radio); background: var(--papel); margin-bottom: 10px; text-decoration: none; color: var(--texto); }
.recomendacion:hover { border-color: var(--linea-2); box-shadow: var(--sombra); color: var(--texto); }
.recomendacion .icono-cir { margin: 0; width: 40px; height: 40px; flex: 0 0 auto; }
.recomendacion b { display: block; color: var(--tinta); }
.recomendacion span { font-size: .88rem; color: var(--tenue); }
.mini-grafica { display: flex; align-items: flex-end; gap: 6px; height: 96px; padding-top: 8px; }
.mini-grafica i { flex: 1; background: #D9E2F5; border-radius: 6px 6px 2px 2px; min-height: 4px; }
.mini-grafica i.ultima { background: var(--dorado); }

/* Aula: índice lateral + contenido */
.aula { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 22px; align-items: start; }
.aula > * { min-width: 0; }
.indice { position: sticky; top: 84px; max-height: calc(100vh - 100px); overflow: auto; background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); padding: 12px; }
.indice h3 { font-size: .95rem; padding: 6px 8px; margin: 0; }
.indice .mod { font: 700 .72rem/1.3 var(--cuerpo); letter-spacing: .08em; text-transform: uppercase; color: var(--tenue); padding: 12px 8px 4px; }
.indice a { display: flex; gap: 8px; align-items: flex-start; padding: 8px; border-radius: 10px; text-decoration: none; color: var(--texto-2); font-size: .88rem; line-height: 1.35; }
.indice a:hover { background: var(--fondo); color: var(--tinta); }
.indice a[aria-current="page"] { background: var(--dorado-suave); color: var(--tinta); font-weight: 700; }
.indice .marca-hecha { width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--linea-2); flex: 0 0 auto; margin-top: 1px; }
.indice .marca-hecha.si { background: var(--tinta); border-color: var(--tinta); }
@media (max-width: 980px) { .aula { grid-template-columns: 1fr; } .indice { position: static; max-height: 340px; order: 2; } }

.curso-cab { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); overflow: hidden; display: grid; grid-template-columns: 200px minmax(0, 1fr) 280px; align-items: stretch; box-shadow: var(--sombra); margin-bottom: 24px; }
.curso-cab .portadilla { height: auto; min-height: 150px; }
.curso-cab .info { padding: 24px; min-width: 0; }
.curso-cab .info h1 { font-size: clamp(1.5rem, 3vw, 2.1rem); }
.curso-cab .meta { color: var(--tenue); font-size: .92rem; margin: 0; }
.curso-cab .avance { padding: 24px; border-left: 1px solid var(--linea); display: flex; flex-direction: column; justify-content: center; }
@media (max-width: 980px) { .curso-cab { grid-template-columns: 1fr; } .curso-cab .portadilla { min-height: 100px; } .curso-cab .avance { border-left: 0; border-top: 1px solid var(--linea); } }
.modulo { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); margin-bottom: 12px; overflow: hidden; }
.modulo > summary { list-style: none; cursor: pointer; padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.modulo > summary::-webkit-details-marker { display: none; }
.modulo > summary h3 { margin: 0; font-size: 1.05rem; }
.modulo > summary .cuenta { font-size: .85rem; color: var(--tenue); white-space: nowrap; }
.modulo > summary .num { width: 34px; height: 34px; flex: 0 0 auto; border-radius: 10px; background: var(--fondo); border: 1px solid var(--linea); display: inline-flex; align-items: center; justify-content: center; font: 800 .9rem/1 var(--titulos); color: var(--tinta); }
.modulo > summary .izq { display: flex; align-items: center; gap: 12px; min-width: 0; }
.lecciones { list-style: none; margin: 0; padding: 0 12px 12px; display: grid; gap: 6px; }
.leccion { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 12px; text-decoration: none; color: var(--texto); border: 1px solid transparent; min-height: 56px; }
.leccion:hover { background: var(--fondo); border-color: var(--linea); color: var(--tinta); }
.leccion .tipo { width: 36px; height: 36px; flex: 0 0 auto; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: var(--azul-suave); color: var(--azul); }
.leccion .tipo svg { width: 19px; height: 19px; }
.leccion .tipo.simulacro { background: var(--dorado-suave); color: var(--dorado-osc); }
.leccion .tipo.podcast { background: var(--morado-suave); color: #5B2D8E; }
.leccion .txt { flex: 1; min-width: 0; }
.leccion .txt b { display: block; font-weight: 700; font-size: .97rem; }
.leccion .txt span { display: block; font-size: .84rem; color: var(--tenue); }
.leccion .estado { flex: 0 0 auto; background: none; padding: 0; }
.hecho { display: inline-flex; width: 26px; height: 26px; border-radius: 50%; align-items: center; justify-content: center; background: var(--tinta); color: var(--dorado-claro); }
.hecho svg { width: 15px; height: 15px; }
.pendiente { display: inline-flex; width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--linea-2); }
@media (max-width: 520px) { .lecciones { padding: 0 6px 8px; } .leccion { padding: 10px 8px; gap: 10px; } }

.panel { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); padding: 24px; box-shadow: var(--sombra); margin-bottom: 18px; min-width: 0; }
.panel h2 { font-size: 1.3rem; }
@media (max-width: 520px) { .panel { padding: 18px; } }
.vacio { text-align: center; padding: 40px 20px; color: var(--texto-2); }
.cargando { display: flex; align-items: center; gap: 12px; color: var(--tenue); padding: 24px 0; }
.cargando::before { content: ""; width: 20px; height: 20px; border-radius: 50%; border: 3px solid var(--linea-2); border-top-color: var(--dorado); animation: girar .8s linear infinite; }
@keyframes girar { to { transform: rotate(360deg); } }

/* Documentos */
.docs { display: grid; gap: 10px; }
.doc { display: flex; align-items: center; gap: 14px; padding: 14px; border: 1px solid var(--linea); border-radius: var(--radio); background: var(--papel); }
.doc .ico { width: 42px; height: 42px; flex: 0 0 auto; border-radius: 10px; background: var(--rojo-suave); color: var(--rojo); display: inline-flex; align-items: center; justify-content: center; font: 800 .7rem/1 var(--cuerpo); }
.doc .txt { flex: 1; min-width: 0; }
.doc .txt b { display: block; overflow-wrap: anywhere; }
.doc .txt span { font-size: .85rem; color: var(--tenue); }
.doc .acciones { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
@media (max-width: 560px) { .doc { flex-wrap: wrap; } .doc .acciones { width: 100%; } .doc .acciones .btn { flex: 1; } }
.lectura { max-width: 760px; }
.lectura h2 { font-size: 1.35rem; margin-top: 1.4em; }
.lectura li { margin-bottom: .4em; }

/* ---------- Podcast ---------- */
.reproductor { display: grid; grid-template-columns: 1.35fr 1fr; gap: 18px; }
.reproductor > * { min-width: 0; }
@media (max-width: 1180px) { .reproductor { grid-template-columns: 1fr; } }
.diapositiva { position: relative; aspect-ratio: 16 / 9; border-radius: var(--radio-g); background: radial-gradient(700px 400px at 85% 10%, rgba(224,168,30,.2), transparent 60%), linear-gradient(160deg, var(--tinta) 0%, var(--tinta-prof) 100%); color: #E6ECF5; padding: clamp(16px, 4vw, 36px); display: flex; flex-direction: column; }
.diapositiva .serie { font: 700 clamp(.6rem, 1.4vw, .78rem)/1.3 var(--cuerpo); letter-spacing: .12em; text-transform: uppercase; color: var(--dorado-claro); }
.diapositiva .n { font-size: clamp(.7rem, 1.4vw, .85rem); color: #9FB0C8; margin-top: 2px; }
.diapositiva h3 { color: #fff; font-size: clamp(1.1rem, 3vw, 1.9rem); margin: auto 0 10px; }
.diapositiva h3::after { content: ""; display: block; width: 70px; height: 4px; border-radius: 4px; background: var(--dorado); margin-top: 12px; }
.diapositiva ul { margin: 0 0 auto; padding-left: 1.1em; font-size: clamp(.78rem, 1.8vw, 1.02rem); line-height: 1.45; }
.diapositiva ul li::marker { color: var(--dorado); }
.diapositiva .norma { color: var(--dorado-claro); font-weight: 700; font-size: clamp(.72rem, 1.5vw, .92rem); margin-top: 10px; }
.controles { margin-top: 14px; }
.controles audio { width: 100%; }
.velocidades { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.velocidades button { min-height: 36px; padding: 0 12px; border-radius: 999px; border: 1.5px solid var(--linea-2); background: var(--papel); font: 700 .85rem/1 var(--cuerpo); color: var(--texto); cursor: pointer; }
.velocidades button[aria-pressed="true"] { background: var(--tinta); color: #fff; border-color: var(--tinta); }
.capitulos, .transcripcion { max-height: 520px; overflow: auto; }
.capitulos button { display: flex; width: 100%; text-align: left; gap: 10px; align-items: baseline; padding: 10px 12px; border: 0; border-radius: 10px; background: transparent; cursor: pointer; font: 600 .92rem/1.35 var(--cuerpo); color: var(--texto); }
.capitulos button:hover { background: var(--fondo); }
.capitulos button[aria-current="true"] { background: var(--dorado-suave); color: var(--tinta); }
.capitulos button time { font-variant-numeric: tabular-nums; color: var(--tenue); font-size: .82rem; min-width: 44px; }
.pestanas { display: flex; gap: 6px; border-bottom: 1px solid var(--linea); margin-bottom: 10px; overflow-x: auto; scrollbar-width: none; }
.pestanas button { border: 0; background: transparent; padding: 10px 12px; font: 700 .92rem/1 var(--cuerpo); color: var(--tenue); cursor: pointer; border-bottom: 3px solid transparent; min-height: 44px; white-space: nowrap; flex: 0 0 auto; }
.pestanas button[aria-selected="true"] { color: var(--tinta); border-bottom-color: var(--dorado); }
.transcripcion p { margin: 0; padding: 6px 8px; border-radius: 8px; cursor: pointer; font-size: .93rem; color: var(--texto-2); }
.transcripcion p:hover { background: var(--fondo); }
.transcripcion p.activa { background: var(--dorado-suave); color: var(--tinta); }
.correccion { border-left: 4px solid var(--rojo); background: var(--rojo-suave); border-radius: 10px; padding: 10px 12px; margin: 8px 0; font-size: .92rem; }
.correccion b { color: var(--rojo); }

/* ---------- Examen y práctica ---------- */
.examen { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 20px; align-items: start; }
.examen > * { min-width: 0; }
@media (max-width: 960px) { .examen { grid-template-columns: 1fr; } }
.examen-barra { position: sticky; top: 0; z-index: 46; background: var(--papel); border-bottom: 1px solid var(--linea); box-shadow: var(--sombra); }
.examen-barra .contenedor { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 58px; }
.reloj { font: 800 1.05rem/1 var(--titulos); font-variant-numeric: tabular-nums; color: var(--tinta); display: inline-flex; align-items: center; gap: 8px; }
.reloj.alerta { color: var(--rojo); }
.pregunta { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); padding: clamp(18px, 3vw, 28px); box-shadow: var(--sombra); }
.pregunta .encabezado { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 14px; font-size: .86rem; color: var(--tenue); }
.insignia { display: inline-flex; align-items: center; gap: 6px; font: 700 .72rem/1 var(--cuerpo); letter-spacing: .02em; padding: 6px 10px; border-radius: 999px; background: var(--dorado-suave); color: #7A5806; white-space: nowrap; }
.insignia.gris { background: #EEF1F6; color: var(--tenue); }
.insignia.azul { background: var(--azul-suave); color: var(--azul); }
.insignia.roja { background: var(--rojo-suave); color: var(--rojo); }
.caso { background: var(--fondo); border: 1px solid var(--linea); border-radius: var(--radio); padding: 14px 16px; margin-bottom: 16px; font-size: .95rem; }
.caso b { display: block; color: var(--tinta); margin-bottom: 4px; font-family: var(--titulos); }
.enunciado { font: 600 1.1rem/1.5 var(--cuerpo); color: var(--texto); margin-bottom: 16px; }
.opciones { display: grid; gap: 10px; }
.opcion { display: flex; align-items: flex-start; gap: 12px; width: 100%; text-align: left; padding: 14px; border: 1.5px solid var(--linea-2); border-radius: 14px; background: var(--papel); cursor: pointer; font: 500 1rem/1.45 var(--cuerpo); color: var(--texto); min-height: 54px; transition: border-color .12s, background-color .12s; }
.opcion:hover { border-color: var(--tinta); }
.opcion .letra { width: 30px; height: 30px; flex: 0 0 auto; border-radius: 9px; border: 1.5px solid var(--linea-2); display: inline-flex; align-items: center; justify-content: center; font: 800 .9rem/1 var(--titulos); color: var(--tinta); background: var(--fondo); }
.opcion[aria-pressed="true"] { border-color: var(--tinta); background: #F1F4FA; }
.opcion[aria-pressed="true"] .letra { background: var(--tinta); color: var(--dorado-claro); border-color: var(--tinta); }
.opcion.correcta { border-color: var(--azul); background: var(--azul-suave); }
.opcion.correcta .letra { background: var(--azul); color: #fff; border-color: var(--azul); }
.opcion.incorrecta { border-color: var(--rojo); background: var(--rojo-suave); }
.opcion.incorrecta .letra { background: var(--rojo); color: #fff; border-color: var(--rojo); }
.opcion[disabled] { cursor: default; }
.navegacion { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 18px; flex-wrap: wrap; }
.paleta { display: grid; grid-template-columns: repeat(auto-fill, minmax(38px, 1fr)); gap: 6px; }
.paleta-titulo { grid-column: 1 / -1; margin-top: 6px; }
.paleta button { min-height: 38px; border-radius: 9px; border: 1.5px solid var(--linea-2); background: var(--papel); font: 700 .8rem/1 var(--cuerpo); color: var(--texto-2); cursor: pointer; }
.paleta button.respondida { background: var(--tinta); color: #fff; border-color: var(--tinta); }
.paleta button.marcada { border-color: var(--dorado); box-shadow: inset 0 0 0 2px var(--dorado); }
.paleta button[aria-current="true"] { outline: 3px solid var(--dorado); outline-offset: 1px; }
.paleta button.bien { background: var(--azul); color: #fff; border-color: var(--azul); }
.paleta button.mal { background: var(--rojo); color: #fff; border-color: var(--rojo); }
.leyenda { display: flex; flex-wrap: wrap; gap: 12px; font-size: .8rem; color: var(--tenue); margin-top: 10px; }
.leyenda i { display: inline-block; width: 12px; height: 12px; border-radius: 4px; margin-right: 5px; vertical-align: -1px; border: 1.5px solid var(--linea-2); }
.leyenda i.r { background: var(--tinta); border-color: var(--tinta); } .leyenda i.m { box-shadow: inset 0 0 0 2px var(--dorado); border-color: var(--dorado); }
.leyenda i.bien-l { background: var(--azul); border-color: var(--azul); } .leyenda i.mal-l { background: var(--rojo); border-color: var(--rojo); }
.explicacion { margin-top: 16px; border-radius: var(--radio); padding: 16px; background: var(--fondo); border: 1px solid var(--linea); font-size: .96rem; }
.explicacion h4 { font-size: 1rem; margin-bottom: 6px; }
.explicacion .fuente { border-left: 3px solid var(--dorado); padding: 8px 12px; margin: 10px 0 0; background: var(--papel); border-radius: 0 10px 10px 0; font-size: .9rem; }
.explicacion .fuente q { font-style: italic; color: var(--texto-2); }
.descartes { margin: 8px 0 0; padding-left: 1.1em; color: var(--texto-2); font-size: .92rem; }
.resultado-cab { display: grid; grid-template-columns: 220px 1fr; gap: 24px; align-items: center; }
@media (max-width: 700px) { .resultado-cab { grid-template-columns: 1fr; } }
.anillo { width: 180px; height: 180px; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(var(--dorado) calc(var(--p, 0) * 1%), #E6EAF2 0); margin: 0 auto; }
.anillo > div { width: 140px; height: 140px; border-radius: 50%; background: var(--papel); display: grid; place-items: center; text-align: center; }
.anillo b { font: 800 2.2rem/1 var(--titulos); color: var(--tinta); display: block; }
.anillo span { font-size: .8rem; color: var(--tenue); }
.tabla { width: 100%; border-collapse: collapse; font-size: .94rem; }
.tabla th, .tabla td { text-align: left; padding: 10px 8px; border-bottom: 1px solid var(--linea); vertical-align: top; }
.tabla th { font-size: .76rem; text-transform: uppercase; letter-spacing: .08em; color: var(--tenue); }
.tabla td:last-child, .tabla th:last-child { white-space: nowrap; }
.tabla .chips .insignia { white-space: normal; }
.tabla-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.filtros { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.filtros button { min-height: 38px; padding: 0 14px; border-radius: 999px; border: 1.5px solid var(--linea-2); background: var(--papel); font: 700 .85rem/1 var(--cuerpo); color: var(--texto); cursor: pointer; }
.filtros button[aria-pressed="true"] { background: var(--tinta); color: #fff; border-color: var(--tinta); }

/* Diálogo y aviso flotante */
dialog { border: 0; border-radius: var(--radio-g); padding: 0; max-width: min(520px, calc(100vw - 32px)); box-shadow: 0 24px 60px rgba(10,21,38,.35); }
dialog::backdrop { background: rgba(10,21,38,.55); }
dialog .dentro { padding: 24px; }
dialog .acciones { display: flex; justify-content: flex-end; gap: 10px; flex-wrap: wrap; margin-top: 18px; }
.toast { position: fixed; left: 50%; bottom: calc(20px + env(safe-area-inset-bottom)); transform: translateX(-50%) translateY(140%); background: var(--tinta); color: #fff; padding: 12px 18px; border-radius: 12px; font-weight: 600; box-shadow: var(--sombra-2); z-index: 90; transition: transform .25s; max-width: calc(100vw - 32px); pointer-events: none; }
.toast.visible { transform: translateX(-50%) translateY(0); }
.toast:not(.visible) { visibility: hidden; transition: transform .25s, visibility 0s .25s; }

/* Administración */
.admin-tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 18px; }
.admin-tabs button { min-height: 42px; padding: 0 16px; border-radius: 12px; border: 1.5px solid var(--linea-2); background: var(--papel); font: 700 .92rem/1 var(--cuerpo); color: var(--texto); cursor: pointer; display: inline-flex; align-items: center; gap: 8px; }
.admin-tabs button[aria-selected="true"] { background: var(--tinta); color: #fff; border-color: var(--tinta); }
.admin-tabs .contador { background: var(--dorado); color: var(--tinta-prof); border-radius: 999px; padding: 2px 8px; font-size: .75rem; }
.admin-rejilla { display: grid; grid-template-columns: 380px minmax(0, 1fr); gap: 18px; align-items: start; }
.admin-rejilla > div { min-width: 0; }
@media (max-width: 1000px) { .admin-rejilla { grid-template-columns: 1fr; } }
.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.kpi { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--radio-g); padding: 18px; }
.kpi b { display: block; font: 800 1.8rem/1 var(--titulos); color: var(--tinta); }
.kpi span { font-size: .86rem; color: var(--tenue); }
@media (max-width: 760px) { .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.mensaje-listo { white-space: pre-wrap; background: var(--fondo); border: 1px dashed var(--linea-2); border-radius: var(--radio); padding: 14px; font-size: .93rem; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.acciones-fila { display: flex; flex-wrap: wrap; gap: 6px; }
.subida { border: 2px dashed var(--linea-2); border-radius: var(--radio-g); padding: 22px; text-align: center; background: var(--fondo); }
.vista-qr { width: 160px; height: 160px; object-fit: contain; border: 1px solid var(--linea); border-radius: 12px; background: #fff; }

/* 404 */
.error-404 { min-height: 70vh; display: grid; place-items: center; text-align: center; padding: 40px 20px; }
.error-404 .numero { font: 800 clamp(5rem, 18vw, 9rem)/1 var(--titulos); color: var(--dorado); letter-spacing: -0.04em; }

/* Utilidades */
.espacio-arriba { margin-top: 16px; }
.espacio-arriba-sm { margin-top: 8px; }
.nota-centro { text-align: center; margin: 28px 0 0; color: var(--texto-2); }
.revelar { margin-top: 8px; }
.revelar summary { cursor: pointer; font-weight: 700; color: var(--azul); min-height: 40px; display: flex; align-items: center; }
.cita { border-left: 3px solid var(--dorado); padding-left: 12px; font-size: .92rem; color: var(--texto-2); }
.tenue { color: var(--tenue); }
.acciones-centro { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 20px; }
.fila { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.entre { justify-content: space-between; }
.chico { font-size: .86rem; }
.grande { font-size: 1.1rem; }
.sin-margen { margin: 0; }

@media print { .cab, .pie-sitio, .campus-cab, .examen-barra, .navegacion, .barra-inscripcion { display: none !important; } body { background: #fff; } }
dialog { max-height: calc(100vh - 32px); overflow: auto; }
/* Tarjetas de escuela en vertical (caben bien en 4 columnas) */
.escuela-card { flex-direction: column; align-items: flex-start; gap: 12px; min-height: 176px; }
.escuela-card .txt { flex: 0 0 auto; }
.escuela-card .estado { margin-top: auto; }
@media (max-width: 640px) { .escuela-card { flex-direction: row; align-items: center; min-height: 0; } .escuela-card .txt { flex: 1; } .escuela-card .estado { margin-top: 0; } }
.fila-emblema > .estado { color: #7A5806; }
.fila-emblema > .estado.gris { color: var(--tenue); }