/* ==========================================================================
   Portal Licencia Panamá — hoja de estilos completa
   Armado por herramientas/unir.py desde: base.css + componentes.css + portal.css + paginas.css + ux.css
   Version: 2.42 2026-10-21
   No editar este archivo a mano: edite las fuentes y vuelva a unir.
   Orden del CSS: 1) base (variables y estructura) 2) componentes 3) portal
   ========================================================================== */

/* ---------- base.css ---------- */
/* ============================================================================
   Portal Licencia Panamá — BASE
   Tokens de diseño, reinicio, tipografía, contenedor 1300 px, accesibilidad y
   utilidades. Es el cimiento de TODAS las páginas del portal.
   Prefijo único: lc-  ·  Sin dependencias externas.
   ========================================================================== */

/* ── 1. Tokens ───────────────────────────────────────────────────────────── */
:root {
	/* Marca */
	--lc-rojo: #c0281c;
	--lc-rojo-osc: #9e1f15;
	--lc-rojo-claro: #fdecea;
	--lc-azul: #12315c;
	--lc-azul-claro: #1a5298;
	--lc-azul-suave: #eef3fa;

	/* Neutros */
	--lc-tinta: #111827;
	--lc-tinta-2: #374151;
	--lc-gris: #5b6472;
	--lc-gris-claro: #8b93a1;
	--lc-linea: #e5e7eb;
	--lc-linea-fuerte: #cbd5e1;
	--lc-suave: #f6f7f9;
	--lc-suave-2: #eef0f4;
	--lc-blanco: #ffffff;

	/* Estados */
	--lc-ok: #047857;
	--lc-ok-suave: #e7f6f0;
	--lc-aviso: #b45309;
	--lc-aviso-suave: #fff7e6;
	--lc-error: #b91c1c;
	--lc-error-suave: #fdecec;

	/* Semántica de superficie */
	--lc-fondo: var(--lc-blanco);
	--lc-fondo-pagina: var(--lc-suave);
	--lc-superficie: var(--lc-blanco);
	--lc-superficie-2: var(--lc-suave);
	--lc-texto: var(--lc-tinta);
	--lc-texto-suave: var(--lc-gris);
	--lc-borde: var(--lc-linea);
	--lc-acento: var(--lc-rojo);
	--lc-acento-fondo: var(--lc-rojo);
	--lc-acento-fondo-hover: var(--lc-rojo-osc);
	--lc-acento-texto: #ffffff;
	--lc-enlace: var(--lc-azul-claro);

	/* Medidas */
	--lc-contenedor: 1300px;      /* escritorio: el ancho pedido */
	--lc-contenedor-estrecho: 780px;  /* lectura larga (manuales, artículos) */
	--lc-contenedor-ancho: 1440px;    /* piezas a sangre cuando haga falta */
	--lc-gutter: clamp(16px, 4vw, 32px);
	--lc-alto-cabecera: 72px;   /* la usan las barras pegajosas y los enlaces con # */

	/* Espaciado (escala de 4 px) */
	--lc-1: 4px;  --lc-2: 8px;  --lc-3: 12px; --lc-4: 16px; --lc-5: 24px;
	--lc-6: 32px; --lc-7: 48px; --lc-8: 64px; --lc-9: 96px;

	/* Tipografía */
	--lc-fuente: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--lc-fuente-titulo: var(--lc-fuente);
	--lc-fuente-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	--lc-tam-base: clamp(16px, 0.55vw + 15px, 17.5px);
	--lc-interlinea: 1.65;
	--lc-medida: 72ch;            /* ancho cómodo de lectura */

	/* Formas y sombras */
	--lc-radio: 12px;
	--lc-radio-sm: 8px;
	--lc-radio-pill: 999px;
	--lc-sombra-sm: 0 1px 2px rgba(16, 24, 40, .06);
	--lc-sombra: 0 6px 20px rgba(16, 24, 40, .10);
	--lc-sombra-lg: 0 18px 44px rgba(16, 24, 40, .14);

	/* Movimiento y capas */
	--lc-transicion: .2s ease;
	--lc-z-cabecera: 100;
	--lc-z-menu: 110;
	--lc-z-flotante: 120;
	--lc-z-modal: 200;

	/* Esquema de color para los controles del navegador */
	color-scheme: light;
}

/* ── 2. Modo oscuro ──────────────────────────────────────────────────────── */
/* Se activa con la clase en <html>: .lc-oscuro (elegido) o .lc-auto (sistema). */
html.lc-oscuro,
html.lc-auto {
	color-scheme: light;
}
html.lc-oscuro {
	--lc-fondo: #0f172a;
	--lc-fondo-pagina: #0f172a;
	--lc-superficie: #16213c;
	--lc-superficie-2: #1d2947;
	--lc-suave: #1d2947;
	--lc-suave-2: #24314f;
	--lc-texto: #e8ecf5;
	--lc-texto-suave: #a9b7d0;
	--lc-gris: #a9b7d0;
	--lc-tinta: #f1f4fa;
	--lc-tinta-2: #dbe2ee;
	--lc-borde: #2c3a5c;
	--lc-linea: #2c3a5c;
	--lc-linea-fuerte: #3c4d75;
	--lc-blanco: #16213c;
	--lc-azul-suave: #1b2b4d;
	--lc-acento: #ff5a4d;
	--lc-enlace: #7fb4ff;
	color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
	html.lc-auto {
		--lc-fondo: #0f172a; --lc-fondo-pagina: #0f172a; --lc-superficie: #16213c;
		--lc-superficie-2: #1d2947; --lc-suave: #1d2947; --lc-suave-2: #24314f;
		--lc-texto: #e8ecf5; --lc-texto-suave: #a9b7d0; --lc-gris: #a9b7d0;
		--lc-tinta: #f1f4fa; --lc-tinta-2: #dbe2ee; --lc-borde: #2c3a5c; --lc-linea: #2c3a5c;
		--lc-linea-fuerte: #3c4d75; --lc-blanco: #16213c; --lc-azul-suave: #1b2b4d;
		--lc-acento: #ff5a4d; --lc-enlace: #7fb4ff;
		color-scheme: dark;
	}
}

/* ── 3. Reinicio ─────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 84px; overflow-x: clip; }
body {
	margin: 0;
	background: var(--lc-fondo-pagina);
	color: var(--lc-texto);
	font-family: var(--lc-fuente);
	font-size: var(--lc-tam-base);
	line-height: var(--lc-interlinea);
	-webkit-font-smoothing: antialiased;
	/* Sin overflow-x en el cuerpo: dentro de Bricks abre un segundo
	   contenedor de scroll y el contenido queda con un hueco a la derecha. */
}
img, svg, video, canvas { max-width: 100%; height: auto; display: block; }
img { border-style: none; }
figure { margin: 0; }
hr { border: 0; border-top: 1px solid var(--lc-borde); margin: var(--lc-6) 0; }
[hidden] { display: none !important; }
::selection { background: var(--lc-rojo); color: #fff; }

/* ── 4. Tipografía ───────────────────────────────────────────────────────── */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--lc-fuente-titulo);
	color: var(--lc-tinta);
	line-height: 1.2;
	margin: 0 0 var(--lc-3);
	text-wrap: balance;
	font-weight: 800;
	letter-spacing: -.01em;
}
h1 { font-size: clamp(28px, 4.2vw, 46px); }
h2 { font-size: clamp(23px, 2.6vw, 33px); }
h3 { font-size: clamp(19px, 1.8vw, 24px); }
h4 { font-size: clamp(17px, 1.2vw, 20px); font-weight: 700; }
h5, h6 { font-size: 1rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--lc-gris); }
p { margin: 0 0 var(--lc-4); }
p, li { max-width: var(--lc-medida); }
small, .lc-pequeno { font-size: .875em; }
strong, b { font-weight: 700; color: var(--lc-tinta); }
a { color: var(--lc-enlace); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { color: var(--lc-acento); }
blockquote {
	margin: var(--lc-5) 0; padding: var(--lc-4) var(--lc-5);
	background: var(--lc-superficie-2); border-left: 4px solid var(--lc-acento);
	border-radius: 0 var(--lc-radio-sm) var(--lc-radio-sm) 0;
}
blockquote > :last-child { margin-bottom: 0; }
code, pre, kbd { font-family: var(--lc-fuente-mono); font-size: .92em; }
code { background: var(--lc-superficie-2); padding: .15em .4em; border-radius: 4px; }
pre { background: var(--lc-azul); color: #e8ecf5; padding: var(--lc-4); border-radius: var(--lc-radio-sm); overflow: auto; }
ul, ol { padding-left: 1.3em; }
li { margin: .3em 0; }
table { width: 100%; border-collapse: collapse; font-size: .95em; }
th, td { border: 1px solid var(--lc-borde); padding: 10px 12px; text-align: left; }
th { background: var(--lc-superficie-2); font-weight: 700; }

/* ── 5. Contenedor (1300 px) y retículas ─────────────────────────────────── */
.lc-contenedor {
	width: 100%; max-width: var(--lc-contenedor);
	margin-inline: auto; padding-inline: var(--lc-gutter);
}
.lc-contenedor--estrecho { max-width: var(--lc-contenedor-estrecho); }
.lc-contenedor--ancho { max-width: var(--lc-contenedor-ancho); }
.lc-seccion { padding-block: clamp(32px, 5vw, 64px); }
.lc-seccion--suave { background: var(--lc-superficie-2); }
.lc-seccion--marca { background: var(--lc-azul); color: #fff; }
.lc-seccion--marca h1, .lc-seccion--marca h2, .lc-seccion--marca h3 { color: #fff; }

.lc-rejilla { display: grid; gap: var(--lc-5); }
.lc-rejilla--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); }
.lc-rejilla--3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr)); }
.lc-rejilla--4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); }
.lc-lateral { display: grid; gap: var(--lc-6); grid-template-columns: minmax(0, 1fr) 320px; align-items: start; }
@media (max-width: 1024px) { .lc-lateral { grid-template-columns: 1fr; } }
.lc-pila > * + * { margin-top: var(--lc-4); }
.lc-fila { display: flex; flex-wrap: wrap; gap: var(--lc-4); align-items: center; }
.lc-fila--entre { justify-content: space-between; }

/* ── 6. Accesibilidad ────────────────────────────────────────────────────── */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--lc-azul-claro);
	outline-offset: 2px;
	border-radius: 4px;
}
html.lc-oscuro :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline-color: var(--lc-acento); }

.lc-sr {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); white-space: nowrap; border: 0;
}
.lc-sr:focus, .lc-sr-foco:focus {
	position: fixed !important; top: 12px; left: 12px; z-index: var(--lc-z-modal);
	width: auto; height: auto; clip: auto; clip-path: none; margin: 0;
	padding: 12px 18px; background: var(--lc-blanco); color: var(--lc-texto);
	border: 3px solid var(--lc-azul-claro); border-radius: var(--lc-radio-sm);
	font-weight: 700; text-decoration: none; box-shadow: var(--lc-sombra);
}
/* Zonas táctiles cómodas (44 px) sin deformar la pieza */
.lc-btn, .lc-chip, .lc-tab, button, [role="button"], input[type="submit"], input[type="button"] {
	min-height: 44px;
}
.lc-icono-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important;
		transition-duration: .001ms !important; scroll-behavior: auto !important; }
	html { scroll-behavior: auto; }
}
html.lc-alto-contraste { --lc-texto-suave: #3f4756; --lc-gris: #3f4756; --lc-borde: #9aa3b2; }

/* ── 7. Utilidades ───────────────────────────────────────────────────────── */
.lc-oculto { display: none !important; }
@media (max-width: 860px) { .lc-solo-escritorio { display: none !important; } }
@media (min-width: 861px) { .lc-solo-movil { display: none !important; } }
.lc-centrado { text-align: center; }
.lc-centrado > p, .lc-centrado > ul, .lc-centrado > ol { margin-inline: auto; }
.lc-sin-lista { list-style: none; padding: 0; margin: 0; }
.lc-mt-0 { margin-top: 0 !important; }
.lc-mb-0 { margin-bottom: 0 !important; }
.lc-mb-4 { margin-bottom: var(--lc-4); }
.lc-mb-6 { margin-bottom: var(--lc-6); }
.lc-texto-suave { color: var(--lc-texto-suave); }
.lc-etiqueta-seccion {
	display: inline-block; font-size: .78rem; font-weight: 800; letter-spacing: .12em;
	text-transform: uppercase; color: var(--lc-acento); margin-bottom: var(--lc-2);
}
.lc-ancla { scroll-margin-top: 96px; }   /* que los enlaces con # no queden bajo la cabecera */
.lc-sin-js .lc-necesita-js { display: none !important; }

/* ── 8. Impresión (manuales y guías) ─────────────────────────────────────── */
@media print {
	.lc-cabecera, .lc-pie, .lc-flotante, .lc-barra-progreso, .lc-migas, .lc-acciones { display: none !important; }
	body { background: #fff; color: #000; font-size: 11pt; }
	a { color: #000; text-decoration: underline; }
	.lc-contenedor { max-width: none; padding: 0; }
}

/* ==========================================================================
   MODO OSCURO — ajustes finos
   Los tonos de marca están pensados para fondo blanco: sobre fondo oscuro hay
   que aclarar los que se usan como TEXTO y dejar oscuro el que se usa como
   FONDO de botón (para que el texto blanco siga leyéndose).
   ========================================================================== */
html.lc-oscuro {
	--lc-acento: #ff8b80;
	--lc-acento-fondo: #b8271b;
	--lc-acento-fondo-hover: #9e1f15;
	--lc-azul-claro: #8fbcff;
	--lc-azul: #1b3a6b;
	--lc-rojo-claro: #3a1d1b;
	--lc-ok: #5ee0a8;
	--lc-ok-suave: #10322a;
	--lc-error: #ff9a8f;
	--lc-error-suave: #3a1a1c;
	--lc-aviso: #ffc266;
	--lc-aviso-suave: #3a2a12;
}
@media (prefers-color-scheme: dark) {
	html.lc-auto {
		--lc-acento: #ff8b80;
		--lc-acento-fondo: #b8271b;
		--lc-acento-fondo-hover: #9e1f15;
		--lc-azul-claro: #8fbcff;
		--lc-azul: #1b3a6b;
		--lc-rojo-claro: #3a1d1b;
		--lc-ok: #5ee0a8;
		--lc-ok-suave: #10322a;
		--lc-error: #ff9a8f;
		--lc-error-suave: #3a1a1c;
		--lc-aviso: #ffc266;
		--lc-aviso-suave: #3a2a12;
	}
}

/* ---------- componentes.css ---------- */
/* ============================================================================
   Portal Licencia Panamá — COMPONENTES
   Piezas reutilizables: botones, tarjetas, avisos, acordeones, formularios,
   exámenes (el corazón del sitio), progreso y estados vacíos.
   ========================================================================== */

/* ── Botones ─────────────────────────────────────────────────────────────── */
.lc-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: var(--lc-2);
	padding: 12px 20px; border: 1px solid transparent; border-radius: var(--lc-radio-pill);
	font: inherit; font-weight: 700; line-height: 1.1; text-decoration: none; cursor: pointer;
	transition: transform var(--lc-transicion), box-shadow var(--lc-transicion), background var(--lc-transicion), color var(--lc-transicion);
	background: var(--lc-acento); color: var(--lc-acento-texto) !important;
	box-shadow: var(--lc-sombra-sm);
}
.lc-btn:hover { transform: translateY(-1px); box-shadow: var(--lc-sombra); background: var(--lc-rojo-osc); }
.lc-btn:active { transform: translateY(0); }
.lc-btn--azul { background: var(--lc-azul); }
.lc-btn--azul:hover { background: var(--lc-azul-claro); }
.lc-btn--linea { background: transparent; color: var(--lc-texto) !important; border-color: var(--lc-borde); box-shadow: none; }
.lc-btn--linea:hover { background: var(--lc-superficie-2); border-color: var(--lc-linea-fuerte); }
.lc-btn--texto { background: transparent; color: var(--lc-acento) !important; padding-inline: 6px; box-shadow: none; }
.lc-btn--texto:hover { background: transparent; text-decoration: underline; }
.lc-btn--sm { padding: 9px 14px; font-size: .9rem; }
.lc-btn--lg { padding: 15px 26px; font-size: 1.05rem; }
.lc-btn--bloque { width: 100%; }
.lc-btn[disabled], .lc-btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; transform: none; }
.lc-acciones { display: flex; flex-wrap: wrap; gap: var(--lc-3); align-items: center; }

/* ── Etiquetas ───────────────────────────────────────────────────────────── */
.lc-badge, .lc-chip {
	display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: var(--lc-radio-pill);
	font-size: .78rem; font-weight: 700; letter-spacing: .02em; text-transform: uppercase;
	background: var(--lc-rojo-claro); color: var(--lc-rojo-osc);
}
.lc-chip { background: var(--lc-superficie-2); color: var(--lc-texto-suave); text-transform: none; letter-spacing: 0; }
.lc-badge--azul { background: var(--lc-azul-suave); color: var(--lc-azul-claro); }
.lc-badge--ok { background: var(--lc-ok-suave); color: var(--lc-ok); }
.lc-badge--aviso { background: var(--lc-aviso-suave); color: var(--lc-aviso); }
.lc-badge--error { background: var(--lc-error-suave); color: var(--lc-error); }

/* ── Tarjetas ────────────────────────────────────────────────────────────── */
.lc-tarjeta {
	background: var(--lc-superficie); border: 1px solid var(--lc-borde); border-radius: var(--lc-radio);
	overflow: hidden; display: flex; flex-direction: column;
	transition: transform var(--lc-transicion), box-shadow var(--lc-transicion), border-color var(--lc-transicion);
}
.lc-tarjeta--enlazable:hover { transform: translateY(-2px); box-shadow: var(--lc-sombra); border-color: var(--lc-linea-fuerte); }
.lc-tarjeta__media { aspect-ratio: 16 / 9; background: var(--lc-superficie-2); overflow: hidden; }
.lc-tarjeta__media img { width: 100%; height: 100%; object-fit: cover; }
.lc-tarjeta__cuerpo { padding: var(--lc-5); display: flex; flex-direction: column; gap: var(--lc-2); flex: 1; }
.lc-tarjeta__titulo { font-size: 1.15rem; margin: 0; }
.lc-tarjeta__titulo a { color: var(--lc-tinta) !important; text-decoration: none; }
.lc-tarjeta__titulo a:hover { color: var(--lc-acento) !important; }
.lc-tarjeta__pie { margin-top: auto; display: flex; align-items: center; gap: var(--lc-3); font-size: .85rem; color: var(--lc-texto-suave); }
.lc-tarjeta--fila { flex-direction: row; }
.lc-tarjeta--fila .lc-tarjeta__media { flex: 0 0 38%; aspect-ratio: 4 / 3; }
@media (max-width: 620px) { .lc-tarjeta--fila { flex-direction: column; } .lc-tarjeta--fila .lc-tarjeta__media { flex: none; width: 100%; } }

/* ── Avisos ──────────────────────────────────────────────────────────────── */
.lc-aviso {
	display: flex; gap: var(--lc-3); padding: var(--lc-4); border-radius: var(--lc-radio-sm);
	background: var(--lc-azul-suave); border-left: 4px solid var(--lc-azul-claro); margin: var(--lc-5) 0;
}
.lc-aviso > :last-child { margin-bottom: 0; }
.lc-aviso--ok { background: var(--lc-ok-suave); border-left-color: var(--lc-ok); }
.lc-aviso--aviso { background: var(--lc-aviso-suave); border-left-color: var(--lc-aviso); }
.lc-aviso--error { background: var(--lc-error-suave); border-left-color: var(--lc-error); }
.lc-aviso__icono { flex: 0 0 auto; font-size: 1.2rem; line-height: 1.3; }

/* ── Acordeón (con <details>, teclado y lectores de pantalla gratis) ─────── */
.lc-acordeon { border: 1px solid var(--lc-borde); border-radius: var(--lc-radio); background: var(--lc-superficie); overflow: hidden; }
.lc-acordeon + .lc-acordeon { margin-top: var(--lc-2); }
.lc-acordeon > summary {
	cursor: pointer; padding: var(--lc-4) var(--lc-5); font-weight: 700; color: var(--lc-tinta);
	display: flex; align-items: center; justify-content: space-between; gap: var(--lc-3); list-style: none; min-height: 44px;
}
.lc-acordeon > summary::-webkit-details-marker { display: none; }
.lc-acordeon > summary::after { content: "+"; font-size: 1.35rem; line-height: 1; color: var(--lc-acento); transition: transform var(--lc-transicion); }
.lc-acordeon[open] > summary::after { content: "–"; }
.lc-acordeon > summary:hover { background: var(--lc-superficie-2); }
.lc-acordeon__cuerpo { padding: 0 var(--lc-5) var(--lc-5); }
.lc-acordeon__cuerpo > :last-child { margin-bottom: 0; }

/* ── Pestañas ────────────────────────────────────────────────────────────── */
.lc-tabs { display: flex; flex-wrap: wrap; gap: var(--lc-2); border-bottom: 1px solid var(--lc-borde); margin-bottom: var(--lc-5); }
.lc-tab {
	border: 1px solid transparent; border-bottom: 3px solid transparent; background: transparent;
	color: var(--lc-texto-suave); font: inherit; font-weight: 700; padding: 10px 16px; cursor: pointer; border-radius: var(--lc-radio-sm) var(--lc-radio-sm) 0 0;
}
.lc-tab[aria-selected="true"] { color: var(--lc-acento); border-bottom-color: var(--lc-acento); background: var(--lc-superficie); }
.lc-tab:hover { color: var(--lc-texto); background: var(--lc-superficie-2); }
.lc-panel[hidden] { display: none; }

/* ── Formularios ─────────────────────────────────────────────────────────── */
.lc-campo { display: block; margin-bottom: var(--lc-4); }
.lc-campo > span, .lc-campo > label { display: block; font-weight: 700; margin-bottom: 6px; font-size: .95rem; }
.lc-input, .lc-select, .lc-textarea {
	width: 100%; padding: 12px 14px; font: inherit; color: var(--lc-texto);
	background: var(--lc-superficie); border: 1px solid var(--lc-linea-fuerte); border-radius: var(--lc-radio-sm); min-height: 44px;
}
.lc-input::placeholder, .lc-textarea::placeholder { color: var(--lc-gris-claro); }
.lc-input:focus, .lc-select:focus, .lc-textarea:focus { border-color: var(--lc-azul-claro); outline: 3px solid color-mix(in srgb, var(--lc-azul-claro) 35%, transparent); outline-offset: 1px; }
.lc-ayuda { display: block; font-size: .85rem; color: var(--lc-texto-suave); margin-top: 4px; }
.lc-error { display: block; font-size: .85rem; color: var(--lc-error); margin-top: 4px; font-weight: 700; }
.lc-campo--error .lc-input { border-color: var(--lc-error); }

/* ── Examen / simulador ──────────────────────────────────────────────────── */
.lc-examen__barra {
	position: sticky; top: var(--lc-alto-cabecera); z-index: 90; background: var(--lc-superficie);
	border-bottom: 1px solid var(--lc-borde); padding: var(--lc-3) 0;
}
.lc-examen__barra-in { display: flex; flex-wrap: wrap; align-items: center; gap: var(--lc-4); justify-content: space-between; }
.lc-examen__datos { display: flex; flex-wrap: wrap; gap: var(--lc-3) var(--lc-5); align-items: center; font-size: .9rem; }
.lc-dato { display: flex; flex-direction: column; line-height: 1.2; }
.lc-dato b { font-size: 1.15rem; color: var(--lc-tinta); }
.lc-tiempo { font-variant-numeric: tabular-nums; font-weight: 800; }
.lc-tiempo--poco { color: var(--lc-error); }

.lc-pregunta { background: var(--lc-superficie); border: 1px solid var(--lc-borde); border-radius: var(--lc-radio); padding: clamp(16px, 3vw, 28px); }
.lc-pregunta__numero { font-size: .8rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--lc-acento); }
.lc-pregunta__texto { font-size: clamp(1.05rem, 1.6vw, 1.35rem); font-weight: 700; color: var(--lc-tinta); margin: var(--lc-2) 0 var(--lc-5); max-width: var(--lc-medida); }
.lc-opciones { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--lc-3); }
.lc-opcion {
	display: flex; gap: var(--lc-3); align-items: flex-start; width: 100%; text-align: left;
	background: var(--lc-superficie); border: 2px solid var(--lc-borde); border-radius: var(--lc-radio-sm);
	padding: var(--lc-4); font: inherit; color: var(--lc-texto); cursor: pointer; min-height: 44px;
	transition: border-color var(--lc-transicion), background var(--lc-transicion), transform var(--lc-transicion);
}
.lc-opcion:hover { border-color: var(--lc-azul-claro); transform: translateX(2px); }
.lc-opcion__letra {
	flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
	background: var(--lc-superficie-2); font-weight: 800; font-size: .85rem;
}
.lc-opcion[aria-pressed="true"], .lc-opcion.lc-elegida { border-color: var(--lc-azul-claro); background: var(--lc-azul-suave); }
.lc-opcion.lc-correcta { border-color: var(--lc-ok); background: var(--lc-ok-suave); }
.lc-opcion.lc-correcta .lc-opcion__letra { background: var(--lc-ok); color: #fff; }
.lc-opcion.lc-incorrecta { border-color: var(--lc-error); background: var(--lc-error-suave); }
.lc-opcion.lc-incorrecta .lc-opcion__letra { background: var(--lc-error); color: #fff; }
.lc-opcion[disabled] { cursor: default; }
.lc-explicacion { margin-top: var(--lc-4); padding: var(--lc-4); border-radius: var(--lc-radio-sm); background: var(--lc-superficie-2); border-left: 4px solid var(--lc-azul-claro); }
.lc-explicacion > :last-child { margin-bottom: 0; }

.lc-navegador { display: flex; flex-wrap: wrap; gap: 6px; }
.lc-navegador button {
	width: 40px; min-height: 40px; border-radius: var(--lc-radio-sm); border: 1px solid var(--lc-borde);
	background: var(--lc-superficie); color: var(--lc-texto-suave); font-weight: 700; font-size: .85rem; cursor: pointer;
}
.lc-navegador button[data-estado="hecha"] { background: var(--lc-azul-suave); border-color: var(--lc-azul-claro); color: var(--lc-azul-claro); }
.lc-navegador button[data-estado="bien"] { background: var(--lc-ok-suave); border-color: var(--lc-ok); color: var(--lc-ok); }
.lc-navegador button[data-estado="mal"] { background: var(--lc-error-suave); border-color: var(--lc-error); color: var(--lc-error); }
.lc-navegador button[aria-current="true"] { outline: 3px solid var(--lc-azul-claro); outline-offset: 1px; }
.lc-navegador button[disabled] { opacity: .34; cursor: not-allowed; border-style: dashed; }
.lc-navegador button:not([disabled]):hover { border-color: var(--lc-azul-claro); }

.lc-resultado { text-align: center; }
.lc-resultado__nota { font-size: clamp(46px, 9vw, 82px); font-weight: 800; line-height: 1; color: var(--lc-acento); font-variant-numeric: tabular-nums; }
.lc-resultado--aprobado .lc-resultado__nota { color: var(--lc-ok); }
.lc-resultado--reprobado .lc-resultado__nota { color: var(--lc-error); }
.lc-resultado__cifras { display: flex; flex-wrap: wrap; gap: var(--lc-5); justify-content: center; margin: var(--lc-5) 0; }

/* ── Progreso ────────────────────────────────────────────────────────────── */
.lc-progreso { background: var(--lc-superficie-2); border-radius: var(--lc-radio-pill); height: 10px; overflow: hidden; }
.lc-progreso > span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--lc-acento), var(--lc-azul-claro)); transition: width .25s ease; }

/* ── Índice, estados y varios ────────────────────────────────────────────── */
.lc-indice { background: var(--lc-superficie-2); border: 1px solid var(--lc-borde); border-radius: var(--lc-radio); padding: var(--lc-5); }
.lc-indice ol, .lc-indice ul { margin: 0; padding-left: 1.1em; }
.lc-indice a { text-decoration: none; }
.lc-indice a:hover, .lc-indice a[aria-current="true"] { color: var(--lc-acento); font-weight: 700; }
.lc-vacio { text-align: center; padding: var(--lc-8) var(--lc-4); color: var(--lc-texto-suave); }
/* ---------- ajustes que solo usan las páginas de contenido ---------- */
.lc-entrada { font-size: clamp(1.05rem, 1.5vw, 1.25rem); color: var(--lc-texto-suave); max-width: var(--lc-medida); margin-bottom: var(--lc-4); }
.lc-lista-marcada { list-style: none; margin: 0 0 var(--lc-4); padding: 0; display: grid; gap: var(--lc-2); }
.lc-lista-marcada li { position: relative; padding-left: 26px; max-width: none; margin: 0; }
.lc-lista-marcada li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--lc-ok); font-weight: 800; }
.lc-lista-enlaces { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.lc-lista-enlaces li { max-width: none; margin: 0; }
.lc-lista-enlaces a { display: block; padding: 7px 10px; border-radius: var(--lc-radio-sm); text-decoration: none; color: var(--lc-tinta); }
.lc-lista-enlaces a:hover { background: var(--lc-superficie-2); color: var(--lc-azul-claro); }
.lc-lista-enlaces [aria-current="page"] { display: block; padding: 7px 10px; border-radius: var(--lc-radio-sm); background: var(--lc-azul-suave); color: var(--lc-azul-claro); }
.lc-lateral__principal { min-width: 0; }
.lc-lateral__barra { position: sticky; top: calc(var(--lc-alto-cabecera) + 16px); }
@media (max-width: 1024px) {
	.lc-lateral__barra { position: static; }
}
.lc-examen__cantidad-caja .lc-pequeno { display: block; margin-bottom: 2px; }
/* ---------- Panel del mega: cada quien arma su examen ---------- */
.lc-panel { background: var(--lc-superficie); border: 1px solid var(--lc-borde); border-radius: var(--lc-radio); padding: clamp(18px, 3vw, 30px); }
.lc-panel__titulo { margin: 0 0 var(--lc-2); }
.lc-panel__ayuda { color: var(--lc-texto-suave); max-width: var(--lc-medida); margin-bottom: var(--lc-5); }
.lc-panel__rejilla { display: grid; gap: var(--lc-4); grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.lc-panel__campo { display: grid; gap: 6px; }
.lc-panel__campo label { font-weight: 700; font-size: .95rem; }
.lc-panel__campo b { color: var(--lc-azul-claro); }
.lc-panel__campo input[type="range"] { width: 100%; accent-color: var(--lc-azul-claro); min-height: 32px; }
.lc-panel__campo select { min-height: 44px; }
.lc-explicacion--error { border-left-color: var(--lc-error); }
.lc-vacio__icono { font-size: 2.4rem; margin-bottom: var(--lc-2); }
.lc-sello { display: flex; align-items: center; gap: var(--lc-2); font-size: .85rem; font-weight: 700; color: var(--lc-texto-suave); }
.lc-divisor { display: flex; align-items: center; gap: var(--lc-3); color: var(--lc-texto-suave); font-size: .85rem; margin: var(--lc-5) 0; }
.lc-divisor::before, .lc-divisor::after { content: ""; flex: 1; height: 1px; background: var(--lc-borde); }
/* El botón principal usa el tono de FONDO (el que aguanta texto blanco);
   el acento aclarado se reserva para textos y gráficos. */
.lc-btn { background-color: var(--lc-acento-fondo); }
.lc-btn:hover { background-color: var(--lc-acento-fondo-hover); }
.lc-btn--azul { background-color: var(--lc-azul); }
.lc-btn--azul:hover { background-color: var(--lc-azul-claro); }
/* Los botones de contorno y de texto deben seguir sin relleno: sin estas dos
   líneas, la regla de arriba los pintaba de rojo y la letra oscura se perdía. */
.lc-btn--linea, .lc-btn--linea:hover { background-color: transparent; }
.lc-btn--texto, .lc-btn--texto:hover { background-color: transparent; }

/* ---------- portal.css ---------- */
/* ============================================================================
   Portal Licencia Panamá — MARCO DEL PORTAL
   Cabecera, pie, migas, portadas de sección, barra lateral y flotantes.
   Todo con el sistema; nada de estilos por página.
   ========================================================================== */

/* ── Cabecera ────────────────────────────────────────────────────────────── */
.lc-barra-superior {
	background: var(--lc-azul); color: #e8ecf5; font-size: .85rem;
}
.lc-barra-superior a { color: #e8ecf5; text-decoration: none; }
.lc-barra-superior a:hover { color: #fff; text-decoration: underline; }
.lc-barra-superior__in { display: flex; flex-wrap: wrap; gap: var(--lc-3) var(--lc-5); align-items: center; justify-content: space-between; padding: 7px 0; }

.lc-cabecera {
	position: sticky; top: 0; z-index: var(--lc-z-cabecera);
	background: var(--lc-superficie); border-bottom: 1px solid var(--lc-borde);
}
.lc-cabecera__in { display: flex; align-items: center; gap: var(--lc-5); min-height: 72px; }
.lc-marca { display: flex; align-items: center; gap: var(--lc-3); text-decoration: none; flex: 0 0 auto; }
.lc-marca img { max-height: 44px; width: auto; }
.lc-marca__texto { display: flex; flex-direction: column; line-height: 1.15; }
.lc-marca__nombre { font-weight: 800; font-size: 1.15rem; color: var(--lc-tinta); }
.lc-marca__lema { font-size: .78rem; color: var(--lc-texto-suave); }

.lc-nav { margin-left: auto; }
.lc-menu { display: flex; align-items: center; gap: var(--lc-1); list-style: none; margin: 0; padding: 0; }
.lc-menu > li { position: relative; }
.lc-menu a {
	display: inline-flex; align-items: center; gap: 6px; padding: 10px 12px; border-radius: var(--lc-radio-sm);
	color: var(--lc-tinta); font-weight: 600; text-decoration: none; min-height: 44px;
}
.lc-menu a:hover, .lc-menu a[aria-current="page"] { background: var(--lc-superficie-2); color: var(--lc-acento); }
.lc-menu .lc-submenu {
	position: absolute; top: calc(100% + 6px); left: 0; min-width: 250px; z-index: var(--lc-z-menu);
	background: var(--lc-superficie); border: 1px solid var(--lc-borde); border-radius: var(--lc-radio);
	box-shadow: var(--lc-sombra-lg); padding: var(--lc-2); list-style: none; margin: 0;
	opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity var(--lc-transicion), transform var(--lc-transicion), visibility var(--lc-transicion);
}
.lc-menu li:hover > .lc-submenu, .lc-menu li:focus-within > .lc-submenu { opacity: 1; visibility: visible; transform: none; }
.lc-submenu a { display: block; padding: 10px 12px; }
.lc-cabecera__acciones { display: flex; align-items: center; gap: var(--lc-2); flex: 0 0 auto; }
.lc-icono-btn {
	border: 1px solid var(--lc-borde); background: transparent; color: var(--lc-tinta);
	border-radius: var(--lc-radio-sm); cursor: pointer; padding: 8px;
}
.lc-icono-btn:hover { background: var(--lc-superficie-2); color: var(--lc-acento); }
.lc-hamburguesa { display: none; }
.lc-hamburguesa__barras, .lc-hamburguesa__barras::before, .lc-hamburguesa__barras::after {
	display: block; width: 18px; height: 2px; background: currentColor;
}
.lc-hamburguesa__barras { position: relative; }
.lc-hamburguesa__barras::before, .lc-hamburguesa__barras::after { content: ""; position: absolute; left: 0; }
.lc-hamburguesa__barras::before { top: -6px; }
.lc-hamburguesa__barras::after { top: 6px; }

/* En escritorio el submenú se abre al pasar el ratón: el botón no se usa. */
@media (min-width: 1025px) { .lc-submenu-boton { display: none !important; } }

@media (max-width: 860px) {
	:root { --lc-alto-cabecera: 64px; }
	.lc-cabecera__in { min-height: 64px; }
}
@media (max-width: 1024px) {
	.lc-hamburguesa { display: inline-flex; }
	.lc-nav {
		position: absolute; top: 100%; left: 0; right: 0; background: var(--lc-superficie);
		border-bottom: 1px solid var(--lc-borde); box-shadow: var(--lc-sombra); padding: var(--lc-4) var(--lc-gutter) var(--lc-5);
		display: none; margin: 0;
	}
	body.lc-menu-abierto .lc-nav { display: block; }
	.lc-menu { flex-direction: column; align-items: stretch; gap: 0; }
	.lc-menu > li { border-bottom: 1px solid var(--lc-borde); }
	.lc-menu a { padding: 14px 0; }
	.lc-menu .lc-submenu {
		position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none;
		border: 0; border-left: 2px solid var(--lc-borde); border-radius: 0; padding: 0 0 0 var(--lc-4);
		margin: 0 0 var(--lc-3); display: none;
	}
	.lc-menu li.lc-abierto > .lc-submenu { display: block; }
	.lc-submenu-boton {
		position: absolute; top: 4px; right: 0; width: 44px; height: 44px; border: 0; background: none;
		color: inherit; cursor: pointer; font-size: 1.1rem;
	}
	.lc-menu li:has(> .lc-submenu) > a { padding-right: 52px; }
}

/* ── Migas y portadas de sección ─────────────────────────────────────────── */
.lc-migas { border-bottom: 1px solid var(--lc-borde); background: var(--lc-superficie); }
.lc-migas__lista { display: flex; flex-wrap: wrap; gap: var(--lc-2); list-style: none; margin: 0; padding: 10px 0; font-size: .85rem; }
.lc-migas__lista li { display: flex; align-items: center; gap: var(--lc-2); max-width: none; margin: 0; color: var(--lc-texto-suave); }
.lc-migas__lista li + li::before { content: "›"; color: var(--lc-gris-claro); }
.lc-migas a { color: var(--lc-texto-suave); text-decoration: none; }
.lc-migas a:hover { color: var(--lc-acento); text-decoration: underline; }

.lc-hero { background: var(--lc-azul); color: #fff; position: relative; overflow: hidden; }
.lc-hero__in { padding-block: clamp(32px, 6vw, 72px); position: relative; z-index: 1; }
.lc-hero h1, .lc-hero h2 { color: #fff; }
.lc-hero p { color: rgba(255, 255, 255, .88); }
.lc-hero__etiqueta { color: #ffd7d3; }
.lc-hero--suave { background: var(--lc-superficie-2); color: var(--lc-texto); }
.lc-hero--suave h1, .lc-hero--suave h2 { color: var(--lc-tinta); }
.lc-hero--suave p { color: var(--lc-texto-suave); }
.lc-hero__datos { display: flex; flex-wrap: wrap; gap: var(--lc-5); margin-top: var(--lc-5); }
.lc-hero__dato b { display: block; font-size: 1.5rem; color: #fff; }

.lc-cabecera-seccion { margin-bottom: var(--lc-6); }
.lc-cabecera-seccion p { color: var(--lc-texto-suave); margin-bottom: 0; }

/* ── Pie ─────────────────────────────────────────────────────────────────── */
.lc-pie { background: var(--lc-azul); color: #dbe4f2; margin-top: var(--lc-9); }
.lc-pie a { color: #dbe4f2; text-decoration: none; }
.lc-pie a:hover { color: #fff; text-decoration: underline; }
.lc-pie__cols { display: grid; gap: var(--lc-6); grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); padding-block: var(--lc-7); }
.lc-pie h2, .lc-pie h3 { color: #fff; font-size: 1rem; text-transform: uppercase; letter-spacing: .08em; margin-bottom: var(--lc-3); }
.lc-pie ul { list-style: none; padding: 0; margin: 0; }
.lc-pie li { margin: 0; padding: 6px 0; max-width: none; }
.lc-pie__abajo { border-top: 1px solid rgba(255, 255, 255, .18); padding-block: var(--lc-4); font-size: .85rem; }
.lc-pie__abajo-in { display: flex; flex-wrap: wrap; gap: var(--lc-3) var(--lc-5); align-items: center; justify-content: space-between; }
.lc-redes { display: flex; gap: var(--lc-2); }
.lc-redes a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; }
.lc-redes a:hover { background: rgba(255, 255, 255, .12); }

/* ── Flotantes: tema, volver arriba y progreso de lectura ────────────────── */
.lc-flotante { position: fixed; z-index: var(--lc-z-flotante); }
.lc-volver { right: 18px; bottom: 18px; }
.lc-tema { left: 18px; bottom: 18px; }
.lc-volver button, .lc-tema button { width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--lc-borde); background: var(--lc-superficie); color: var(--lc-tinta); box-shadow: var(--lc-sombra); cursor: pointer; }
.lc-volver button:hover, .lc-tema button:hover { background: var(--lc-acento); color: #fff; border-color: var(--lc-acento); }
.lc-barra-progreso { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: var(--lc-z-modal); pointer-events: none; }
.lc-barra-progreso > span { display: block; height: 100%; width: 0; background: var(--lc-acento); }

/* ── Impresión ───────────────────────────────────────────────────────────── */
@media print {
	.lc-barra-superior, .lc-cabecera, .lc-pie, .lc-flotante { display: none !important; }
}

/* En celular, la barra superior solo deja el enlace de ayuda (ahorra alto) */
@media (max-width: 620px) {
	.lc-barra-superior__in p:first-child { display: none; }
	.lc-barra-superior__in { justify-content: flex-end; }
}

/* ---------- paginas.css ---------- */
/* ==========================================================================
   PÁGINAS DE CONTENIDO DEL PORTAL (portada, contacto, legales, manuales)
   Se suman a base.css + componentes.css antes de unir todo en licencia.css
   ========================================================================== */

/* ---------- Portada: héroe con imagen ---------- */
.lc-hero-portada { position: relative; background: var(--lc-azul); color: #fff; overflow: hidden; }
.lc-hero-portada__in { display: grid; gap: clamp(24px, 4vw, 56px); grid-template-columns: 1.05fr .95fr; align-items: center; padding-block: clamp(36px, 6vw, 72px); }
.lc-hero-portada h1 { color: #fff; margin-bottom: var(--lc-3); }
.lc-hero-portada p { color: #dbe6f7; max-width: 56ch; }
.lc-hero-portada__img { margin: 0; }
.lc-hero-portada__img img { width: 100%; height: auto; display: block; border-radius: var(--lc-radio); box-shadow: 0 24px 60px rgba(4, 12, 30, .45); }
.lc-hero-portada__etiqueta { display: inline-flex; align-items: center; gap: var(--lc-2); background: rgba(255, 255, 255, .14); color: #fff; border-radius: var(--lc-radio-pill); padding: 6px 14px; font-size: .8rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; margin-bottom: var(--lc-4); }
.lc-hero-portada__datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: var(--lc-4); margin-top: var(--lc-5); padding-top: var(--lc-4); border-top: 1px solid rgba(255, 255, 255, .18); }
.lc-hero-portada__datos b { display: block; font-size: 1.5rem; color: #fff; }
.lc-hero-portada__datos span { font-size: .84rem; color: #c9d8ef; }
.lc-hero-portada .lc-btn--linea { color: #fff !important; border-color: rgba(255, 255, 255, .5); }
.lc-hero-portada .lc-btn--linea:hover { background: rgba(255, 255, 255, .12); border-color: #fff; }

/* ---------- Pasos numerados (el método) ---------- */
.lc-pasos { counter-reset: paso; display: grid; gap: var(--lc-4); grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); list-style: none; margin: 0; padding: 0; }
.lc-paso { background: var(--lc-superficie); border: 1px solid var(--lc-borde); border-radius: var(--lc-radio); padding: var(--lc-5); }
.lc-paso::before { counter-increment: paso; content: counter(paso); display: grid; place-items: center; width: 38px; height: 38px; border-radius: var(--lc-radio-pill); background: var(--lc-azul-suave); color: var(--lc-azul-claro); font-weight: 800; margin-bottom: var(--lc-3); }
.lc-paso h3 { margin: 0 0 var(--lc-2); }

/* ---------- Fichas de capítulo ---------- */
.lc-cap { display: grid; grid-template-columns: 56px 1fr; gap: var(--lc-4); align-items: start; background: var(--lc-superficie); border: 1px solid var(--lc-borde); border-radius: var(--lc-radio); padding: var(--lc-5); height: 100%; }
.lc-cap__num { display: grid; place-items: center; width: 56px; height: 56px; border-radius: var(--lc-radio-sm); background: var(--lc-azul); color: #fff; font-weight: 800; font-size: 1.25rem; }
.lc-cap h3 { margin: 0 0 4px; font-size: 1.05rem; }
.lc-cap__temas { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: var(--lc-3) 0; padding: 0; }
.lc-cap__temas li { max-width: none; margin: 0; font-size: .78rem; background: var(--lc-superficie-2); border-radius: var(--lc-radio-pill); padding: 3px 10px; color: var(--lc-texto-suave); }
.lc-cap__acciones { display: flex; flex-wrap: wrap; gap: var(--lc-2); margin-top: var(--lc-3); }

/* ---------- Banda de cierre ---------- */
.lc-banda { background: var(--lc-azul); color: #fff; }
.lc-banda h2 { color: #fff; }
.lc-banda p { color: #dbe6f7; }
.lc-banda__in { display: grid; gap: var(--lc-5); justify-items: start; padding-block: clamp(32px, 5vw, 56px); }

@media (max-width: 900px) {
	.lc-hero-portada__in { grid-template-columns: 1fr; }
	.lc-hero-portada__img { order: -1; }
}

/* ---------- Cuerpo del manual (lectura larga) ---------- */
.lc-manual { color: var(--lc-texto); }
.lc-manual h2 { font-size: 1.4rem; margin-top: var(--lc-7); padding-top: var(--lc-4); border-top: 1px solid var(--lc-borde); }
.lc-manual h3 { font-size: 1.12rem; margin-top: var(--lc-5); }
.lc-manual p, .lc-manual li { max-width: var(--lc-medida); }
.lc-manual ul, .lc-manual ol { padding-left: 1.2em; }
.lc-manual img { max-width: 100%; height: auto; border-radius: var(--lc-radio-sm); }
.lc-manual table { width: 100%; border-collapse: collapse; margin: var(--lc-5) 0; display: block; overflow-x: auto; }
.lc-manual th, .lc-manual td { border: 1px solid var(--lc-borde); padding: 10px 12px; text-align: left; }
.lc-manual th { background: var(--lc-superficie-2); }
.lc-manual blockquote { margin: var(--lc-5) 0; padding: var(--lc-4) var(--lc-5); background: var(--lc-superficie-2); border-left: 4px solid var(--lc-azul-claro); border-radius: 0 var(--lc-radio-sm) var(--lc-radio-sm) 0; }
.lc-manual a { color: var(--lc-enlace); }

/* ---------- Páginas legales ---------- */
.lc-legal h2 { font-size: 1.15rem; margin-top: var(--lc-6); }
.lc-legal p { max-width: var(--lc-medida); color: var(--lc-texto); }

/* Índice del botón "volver arriba" en páginas largas */
.lc-manual-pagina .lc-volver { display: block; }

/* ---------- El manual como libro, con su índice pegajoso ---------- */
.lc-libro { display: grid; gap: var(--lc-6); align-items: start; }
@media (min-width: 1025px) {
	.lc-libro { grid-template-columns: minmax(240px, 280px) minmax(0, 1fr); gap: var(--lc-7); }
	.lc-libro__indice { position: sticky; top: calc(var(--lc-alto-cabecera) + 16px); max-height: calc(100vh - var(--lc-alto-cabecera) - 40px); overflow: auto; }
}
.lc-libro__indice {
	background: var(--lc-superficie); border: 1px solid var(--lc-borde);
	border-radius: var(--lc-radio); padding: var(--lc-4);
}
.lc-libro__indice summary {
	cursor: pointer; font-weight: 800; font-size: .95rem; letter-spacing: .02em;
	display: flex; align-items: center; gap: 8px; list-style: none;
}
.lc-libro__indice summary::-webkit-details-marker { display: none; }
.lc-libro__indice summary::after { content: "▾"; margin-left: auto; color: var(--lc-texto-suave); }
.lc-libro__indice[open] summary::after { content: "▴"; }
.lc-libro__indice ol { margin: var(--lc-3) 0 0; padding: 0; list-style: none; counter-reset: tema; display: grid; gap: 2px; }
.lc-libro__indice li { max-width: none; margin: 0; }
.lc-libro__indice a {
	display: block; padding: 7px 10px; border-radius: var(--lc-radio-sm); text-decoration: none;
	color: var(--lc-texto); font-size: .9rem; line-height: 1.35;
}
.lc-libro__indice a::before { counter-increment: tema; content: counter(tema) ". "; color: var(--lc-texto-suave); font-variant-numeric: tabular-nums; }
.lc-libro__indice a:hover { background: var(--lc-superficie-2); color: var(--lc-azul-claro); }
.lc-libro__cuerpo { background: var(--lc-superficie); border: 1px solid var(--lc-borde); border-radius: var(--lc-radio); padding: clamp(20px, 3vw, 40px); }
@media (max-width: 620px) { .lc-libro__indice { max-height: 46vh; overflow: auto; } }
/* Los títulos no se esconden bajo la cabecera al saltar desde el índice */
.lc-manual h2, .lc-manual h3 { scroll-margin-top: calc(var(--lc-alto-cabecera) + 20px); }
.lc-manual h2:first-child { margin-top: 0; border-top: 0; padding-top: 0; }

/* ---------- ux.css ---------- */
/* ==========================================================================
   AJUSTES FINOS DE UX, SIMETRÍA Y RITMO (van al final: mandan sobre todo)
   Medido con herramientas/auditar_ux.py en 1440, 1024 y 390 px.
   ========================================================================== */

/* ---------- 1. Botones: una sola altura por tamaño ----------
   Antes convivían 44, 45 y 50 px en la misma fila porque el alto salía del
   relleno + la línea. Ahora el alto es exacto y el texto queda centrado. */
.lc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding-block: 0;
}
.lc-btn--sm { min-height: 44px; }
.lc-btn--lg { min-height: 56px; }
/* Mismo criterio para los botones de icono y los campos */
.lc-icono-btn { min-height: 44px; min-width: 44px; }
.lc-input { min-height: 46px; }

/* ---------- 2. Fila de datos del hero: columnas parejas ----------
   Las etiquetas se parten en dos líneas y quedaban desparejas: ahora todas
   ocupan el mismo alto y arrancan a la misma altura. */
.lc-hero__datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: var(--lc-3); align-items: stretch; }
.lc-hero__dato { display: flex; flex-direction: column; justify-content: flex-start; gap: 2px; }
.lc-hero__dato span { min-height: 2.4em; }

/* ---------- 3. Ritmo vertical uniforme ---------- */
.lc-seccion { padding-block: clamp(40px, 5vw, 72px); }
.lc-tarjeta__cuerpo > :last-child { margin-bottom: 0; }
.lc-tarjeta__cuerpo > :first-child { margin-top: 0; }
/* Los encabezados no arrastran su margen al borde de la tarjeta */
.lc-tarjeta__titulo + * { margin-top: var(--lc-2); }
/* Rejillas: mismo hueco en todas y sin sobras raras */
.lc-rejilla { gap: var(--lc-5); }
.lc-pila > :last-child { margin-bottom: 0; }
/* Los bloques de contenido arrancan siempre a la misma altura */
.lc-lateral > * { min-width: 0; }
.lc-lateral:not(:first-child) { margin-top: var(--lc-6); }

/* ---------- 4. Detalles de precisión ---------- */
/* Los avisos y tarjetas comparten radio y borde: nada se ve "de otro sistema" */
.lc-aviso { border-radius: var(--lc-radio); }
/* Separación igual entre la miga de pan y el título en todas las páginas */
.lc-migas + .lc-seccion { padding-top: var(--lc-6); }
/* La barra del examen no se pega a la cabecera al saltar con el teclado */
.lc-examen__barra { scroll-margin-top: calc(var(--lc-alto-cabecera) + 12px); }
/* En pantallas medianas, el lateral del simulador pasa debajo con aire */
@media (max-width: 1024px) {
	.lc-lateral { gap: var(--lc-6); }
}

/* ---------- 5. CABECERA: proporción y marca ----------
   Antes la marca (logo + nombre + lema) se desbordaba y el lema quedaba
   pegado al nombre. Ahora la marca es una fila ordenada, el logo tiene tope
   de alto y el lema se separa y se corta con puntos suspensivos si es largo. */
.lc-cabecera__in {
	display: flex;
	align-items: center;
	gap: clamp(12px, 2vw, 28px);
	min-height: var(--lc-alto-cabecera);
	padding-block: 10px;
}
.lc-marca { display: flex; align-items: center; gap: 12px; min-width: 0; text-decoration: none; }
.lc-marca img, .lc-marca .custom-logo, .lc-marca .lc-marca__logo {
	display: block; width: auto; max-height: 40px; object-fit: contain;
	border-radius: var(--lc-radio-sm);
}
.lc-marca__texto { display: flex; flex-direction: column; justify-content: center; gap: 3px; min-width: 0; }
.lc-marca__nombre { font-weight: 800; font-size: clamp(1rem, 1.35vw, 1.18rem); line-height: 1.15; letter-spacing: -.01em; }
.lc-marca__lema {
	font-size: .76rem; line-height: 1.2; color: var(--lc-texto-suave);
	max-width: 46ch; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.lc-cabecera__acciones { display: flex; align-items: center; gap: var(--lc-2); margin-left: auto; }
.lc-nav .lc-menu { display: flex; align-items: center; gap: clamp(4px, .8vw, 12px); }
.lc-barra-superior__in { display: flex; align-items: center; justify-content: space-between; gap: var(--lc-4); }
@media (max-width: 1100px) { .lc-marca__lema { max-width: 28ch; } }
@media (max-width: 860px)  { .lc-marca__lema { display: none; } .lc-barra-superior__in { justify-content: center; } }

/* ---------- 6. Portada del simulador (antes de empezar) ---------- */
.lc-panel__datos {
	list-style: none; margin: var(--lc-5) 0 0; padding: 0;
	display: grid; gap: var(--lc-3); grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}
.lc-panel__datos li {
	display: flex; flex-direction: column; gap: 2px; max-width: none; margin: 0;
	background: var(--lc-superficie-2); border: 1px solid var(--lc-borde);
	border-radius: var(--lc-radio-sm); padding: var(--lc-3) var(--lc-4);
}
.lc-panel__datos b { font-size: 1.35rem; font-weight: 800; color: var(--lc-tinta); font-variant-numeric: tabular-nums; }
.lc-panel__datos span { font-size: .82rem; color: var(--lc-texto-suave); }

/* ==========================================================================
   MÁS DISEÑO: ilustraciones, tarjetas de simulador y detalles visuales
   ========================================================================== */
.lc-ilus { width: 100%; height: auto; display: block; color: var(--lc-azul-claro); }

/* --- Encabezado del simulador (ilustración + título) --- */
.lc-sim-encabezado { display: flex; align-items: center; gap: var(--lc-5); margin-bottom: var(--lc-4); }
.lc-sim-encabezado__ilus {
	flex: 0 0 auto; width: clamp(120px, 15vw, 176px); padding: var(--lc-4);
	background: linear-gradient(160deg, var(--lc-superficie-2), var(--lc-superficie));
	border: 1px solid var(--lc-borde); border-radius: var(--lc-radio);
	color: var(--lc-azul-claro);
}
.lc-sim-encabezado > div { min-width: 0; }
.lc-sim-encabezado h1 { margin-bottom: 0; }

/* --- Tarjetas del centro de simuladores --- */
.lc-sim-rejilla { align-items: stretch; }
.lc-sim { min-width: 0; }
.lc-sim__enlace {
	display: grid; grid-template-columns: 96px 1fr auto; align-items: center; gap: var(--lc-4);
	height: 100%; padding: var(--lc-4);
	background: var(--lc-superficie); border: 1px solid var(--lc-borde); border-radius: var(--lc-radio);
	text-decoration: none; color: inherit; transition: transform var(--lc-transicion), box-shadow var(--lc-transicion), border-color var(--lc-transicion);
}
.lc-sim__enlace:hover { transform: translateY(-3px); box-shadow: var(--lc-sombra); border-color: var(--lc-azul-claro); }
.lc-sim__ilus {
	display: grid; place-items: center; padding: var(--lc-2);
	background: linear-gradient(160deg, var(--lc-superficie-2), transparent);
	border: 1px solid var(--lc-borde); border-radius: var(--lc-radio-sm); color: var(--lc-azul-claro);
}
.lc-sim__texto { display: flex; flex-direction: column; align-items: flex-start; gap: var(--lc-2); min-width: 0; }
.lc-sim__titulo { margin: 0; font-size: 1.05rem; line-height: 1.25; }
.lc-sim__meta { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: .82rem; color: var(--lc-texto-suave); }
.lc-sim__meta i { font-style: normal; }
.lc-sim__meta i + i::before { content: "·"; margin-right: 10px; color: var(--lc-gris-claro); }
.lc-sim__flecha { font-size: 1.3rem; color: var(--lc-acento); transition: transform var(--lc-transicion); }
.lc-sim__enlace:hover .lc-sim__flecha { transform: translateX(4px); }
@media (max-width: 620px) {
	.lc-sim__enlace { grid-template-columns: 68px 1fr; }
	.lc-sim__flecha { display: none; }
}

/* --- Capítulos en la portada --- */
.lc-cap__ilus {
	display: grid; place-items: center; width: 84px; height: 84px; padding: var(--lc-2);
	background: linear-gradient(160deg, var(--lc-superficie-2), transparent);
	border: 1px solid var(--lc-borde); border-radius: var(--lc-radio);
	color: var(--lc-azul-claro); flex: 0 0 auto;
}
.lc-cap__ilus .lc-ilus { max-height: 62px; }

/* --- Detalles de brillo para que no se vea plano --- */
.lc-tarjeta { background: linear-gradient(180deg, var(--lc-superficie), var(--lc-superficie)); }
.lc-tarjeta--enlazable:hover { border-color: var(--lc-azul-claro); }
.lc-seccion--suave { background: linear-gradient(180deg, var(--lc-superficie-2), var(--lc-fondo-pagina)); }
.lc-etiqueta-seccion { display: inline-flex; align-items: center; gap: 6px; }

/* ---------- 7. Menos aire muerto y jerarquía medida ---------- */
/* Dos secciones seguidas no suman su relleno: el hueco de en medio se parte */
.lc-seccion + .lc-seccion { padding-top: clamp(8px, 1.5vw, 20px); }
.lc-seccion > .lc-contenedor > h2 { margin-top: clamp(20px, 3vw, 40px); }
.lc-sim-encabezado h1 { font-size: clamp(1.6rem, 3.2vw, 2.35rem); line-height: 1.15; }
.lc-sim-encabezado .lc-etiqueta-seccion { margin-bottom: 6px; }
@media (max-width: 620px) {
	.lc-sim-encabezado { flex-direction: column; align-items: flex-start; gap: var(--lc-3); }
	.lc-sim-encabezado__ilus { width: 104px; }
}
/* Los datos de la portada del simulador, en cuadros parejos */
.lc-panel__datos { margin-top: var(--lc-5); }
.lc-panel { border-top: 4px solid var(--lc-acento); }

/* ---------- 8. Contacto: formulario y preguntas frecuentes ---------- */
.lc-contacto { display: grid; gap: var(--lc-6); align-items: start; }
@media (min-width: 1025px) { .lc-contacto { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); } }
.lc-tarjeta--contacto { border-top: 4px solid var(--lc-acento); }
.lc-form { display: grid; gap: var(--lc-4); }
.lc-form__fila { display: grid; gap: var(--lc-4); grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.lc-campo { display: grid; gap: 6px; }
.lc-campo > span { font-weight: 700; font-size: .93rem; }
.lc-campo textarea { min-height: 148px; resize: vertical; font-family: inherit; line-height: 1.6; }
.lc-check { display: flex; gap: 10px; align-items: flex-start; font-size: .93rem; }
.lc-check input { margin-top: 3px; width: 20px; height: 20px; flex: 0 0 auto; accent-color: var(--lc-acento); }
.lc-acordeon { border: 1px solid var(--lc-borde); border-radius: var(--lc-radio-sm); padding: var(--lc-3) var(--lc-4); margin-bottom: 8px; background: var(--lc-superficie); }
.lc-acordeon:last-child { margin-bottom: 0; }
.lc-acordeon summary { cursor: pointer; font-weight: 700; font-size: .95rem; }
.lc-acordeon summary:hover { color: var(--lc-azul-claro); }
.lc-acordeon p { margin: var(--lc-2) 0 0; font-size: .92rem; color: var(--lc-texto-suave); }
.lc-contacto__lado .lc-tarjeta { margin-bottom: var(--lc-4); }

/* ---------- 9. Menos aire y titulares más contenidos (menos "plano") ---------- */
.lc-seccion { padding-block: clamp(24px, 3.2vw, 44px); }
.lc-seccion > .lc-contenedor > :last-child { margin-bottom: 0; }
.lc-seccion + .lc-seccion { padding-top: clamp(20px, 2.6vw, 36px); }
h1 { font-size: clamp(1.75rem, 3.2vw, 2.45rem); line-height: 1.15; }
h2 { font-size: clamp(1.25rem, 2.1vw, 1.6rem); }
.lc-entrada { margin-block: var(--lc-3) var(--lc-5); }
.lc-hero__texto { max-width: 46rem; }
.lc-seccion h2 + .lc-entrada { margin-top: var(--lc-2); }
/* La portada del simulador, más compacta y con presencia */
.lc-panel { padding: clamp(18px, 2.6vw, 26px); }
.lc-panel__datos { gap: var(--lc-3); }

/* ---------- 10. Barra del examen en celular: sin migas de progreso ---------- */
@media (max-width: 560px) {
	.lc-examen__barra-in > [data-examen-progreso] { display: none; }
	.lc-examen__barra-in { gap: var(--lc-2); }
	.lc-examen__barra-in .lc-dato { font-size: .82rem; }
	.lc-examen__barra-in .lc-btn { padding-inline: 14px; }
}

/* ---------- 11. Más aire para los botones del examen ---------- */
[data-examen-cuerpo] .lc-acciones { gap: var(--lc-4); }
[data-examen-cuerpo] .lc-acciones .lc-btn { min-height: 50px; padding-inline: 26px; }
.lc-opciones { gap: var(--lc-4); }
.lc-opcion { padding: 16px 18px; }
@media (max-width: 560px) {
	[data-examen-cuerpo] .lc-acciones { gap: 12px; }
	[data-examen-cuerpo] .lc-acciones .lc-btn { flex: 1 1 140px; padding-inline: 16px; }
	.lc-opcion { padding: 15px 14px; }
}

/* ---------- 12. Botones del examen: rojo con letra blanca, en claro y en oscuro ---------- */
[data-examen-anterior],
[data-examen-siguiente] {
	background-color: var(--lc-acento-fondo) !important;
	color: #fff !important;
	border-color: transparent !important;
}
[data-examen-anterior]:hover,
[data-examen-siguiente]:hover { background-color: var(--lc-acento-fondo-hover) !important; }
/* Aire simétrico: ni pegados a la tarjeta de arriba ni al bloque de abajo */
[data-examen-cuerpo] .lc-acciones { margin-block: 16px; }

/* ---------- 13. Tipografía con tamaño propio ----------
   Los botones usaban "font: inherit" y tomaban el tamaño del contenedor donde
   estuvieran (la barra del examen baja a .9rem, así que el botón quedaba en
   14.4 px). Aquí cada pieza tiene su tamaño, escalado con la misma curva que la
   base del portal, para que ni el tema de WordPress ni el contenedor la encojan. */
.lc-seccion { font-size: var(--lc-tam-base, 16px); }
.lc-btn { font-size: clamp(16px, .35vw + 15px, 17px); }
.lc-btn--sm { font-size: clamp(15px, .3vw + 14px, 16px); }
.lc-btn--lg { font-size: clamp(17px, .4vw + 16px, 18.5px); }
.lc-opcion { font-size: clamp(16px, .4vw + 15px, 17.5px); line-height: 1.45; }
.lc-examen__datos { font-size: clamp(14.5px, .3vw + 14px, 15.5px); }
.lc-dato { font-size: clamp(14.5px, .3vw + 14px, 15.5px); }
.lc-dato b { font-size: clamp(17px, .5vw + 16px, 19px); }
.lc-navegador button { font-size: clamp(15px, .3vw + 14px, 16px); }
.lc-pregunta__texto { font-size: clamp(19px, 1.1vw + 15px, 22.5px); }
.lc-entrada { font-size: clamp(16.5px, .4vw + 15.5px, 17.5px); }
.lc-pequeno, small { font-size: clamp(14px, .25vw + 13.5px, 15px); }
.lc-tarjeta__titulo { font-size: clamp(18px, .5vw + 17px, 19.5px); }
.lc-etiqueta-seccion { font-size: 12.8px; }

/* ---------- 14. Botones a prueba de temas ----------
   WordPress y los maquetadores traen sus propias reglas para <button> (relleno,
   altura de línea, alineación, apariencia nativa) y a veces con !important.
   Aquí se fijan las propiedades de estructura de nuestros componentes, con
   !important, para que el diseño no dependa del tema que esté activo. */
.lc-btn,
.lc-navegador button,
.lc-opcion,
.lc-tab {
	box-sizing: border-box !important;
	-webkit-appearance: none !important;
	appearance: none !important;
	font-family: inherit !important;
	text-transform: none !important;
	letter-spacing: normal !important;
}

.lc-btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
	line-height: 1.2 !important;
	border-radius: var(--lc-radio-pill) !important;
	border: 1px solid transparent !important;
	text-decoration: none !important;
}

/* Números de "Sus respuestas": caja cuadrada con el dígito centrado */
.lc-navegador button {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 40px !important;
	height: 40px !important;
	min-height: 40px !important;
	padding: 0 !important;
	line-height: 1 !important;
	text-align: center !important;
	border-radius: var(--lc-radio-sm) !important;
	font-variant-numeric: tabular-nums;
}

/* La opción alinea la letra y el texto arriba, no en el centro */
.lc-opcion {
	display: flex !important;
	align-items: flex-start !important;
	gap: var(--lc-3) !important;
	width: 100% !important;
	text-align: left !important;
	padding: 16px 18px !important;
	border: 1px solid var(--lc-borde) !important;
	border-radius: var(--lc-radio-sm) !important;
	line-height: 1.45 !important;
	background-color: var(--lc-superficie) !important;
	color: var(--lc-texto) !important;
}
@media (max-width: 560px) { .lc-opcion { padding: 15px 14px !important; } }
.lc-opcion__letra { flex: 0 0 auto; }

/* Rellenos y colores de los tres tipos de botón */
.lc-btn,
.lc-btn--lg,
.lc-btn--sm { padding: 12px 22px !important; }
.lc-btn--sm { padding: 9px 16px !important; }
.lc-btn--lg { padding: 15px 28px !important; }
.lc-btn { background-color: var(--lc-acento-fondo) !important; color: #fff !important; }
.lc-btn:hover { background-color: var(--lc-acento-fondo-hover) !important; }
.lc-btn--azul { background-color: var(--lc-azul) !important; }
.lc-btn--azul:hover { background-color: var(--lc-azul-claro) !important; }
.lc-btn--linea,
.lc-btn--linea:hover {
	background-color: var(--lc-superficie) !important;
	color: var(--lc-tinta) !important;
	border-color: var(--lc-linea-fuerte) !important;
	box-shadow: none !important;
}
.lc-btn--linea:hover { background-color: var(--lc-superficie-2) !important; }
.lc-btn--texto,
.lc-btn--texto:hover {
	background-color: transparent !important;
	color: var(--lc-acento) !important;
	border-color: transparent !important;
	box-shadow: none !important;
}

/* Los ayudantes de visibilidad mandan sobre el display forzado de los botones */
@media (max-width: 860px) { .lc-solo-escritorio { display: none !important; } }
@media (min-width: 861px) { .lc-solo-movil { display: none !important; } }

/* El botón "Terminar" del examen: secundario, pero con el rojo del portal */
[data-examen-terminar] {
	color: var(--lc-acento) !important;
	border-color: var(--lc-acento) !important;
	background-color: var(--lc-superficie) !important;
}
[data-examen-terminar]:hover { background-color: var(--lc-acento-suave, #fdecea) !important; }

/* ---------- 15. Ajustes puntuales pedidos ---------- */
/* "Ver el manual" y demás botones de bloque: letra de botón principal */
.lc-btn.lc-btn--bloque { font-size: clamp(17px, .4vw + 16px, 18px) !important; }
.lc-btn--sm { font-size: clamp(15.5px, .3vw + 14.5px, 16.5px) !important; }

/* "Empezar ahora": aire arriba y abajo, no pegado a los datos ni al texto */
.lc-acciones:has([data-examen-comenzar]) { margin-block: 26px 20px !important; }
[data-examen-comenzar] { margin: 0 !important; }
.lc-acciones:has([data-examen-comenzar]) + p { margin-top: 0 !important; }

/* "Terminar": que se vea y se sienta como acción disponible */
[data-examen-terminar] { font-weight: 800 !important; }
[data-examen-terminar][disabled] { opacity: .45 !important; cursor: default !important; }

/* ---------- 16. Botón de contorno sobre fondo oscuro ----------
   La regla general de .lc-btn--linea usa fondo claro y tinta oscura; en el hero
   (fondo azul) eso dejaba letra blanca sobre fondo blanco. */
.lc-hero-portada .lc-btn--linea,
.lc-hero-portada .lc-btn--linea:hover {
	background-color: transparent !important;
	color: #fff !important;
	border-color: rgba(255, 255, 255, .65) !important;
}
.lc-hero-portada .lc-btn--linea:hover { background-color: rgba(255, 255, 255, .16) !important; }

/* ---------- 17. Tarjetas del centro de simuladores: ilustración cuadrada ---------- */
.lc-sim__enlace { grid-template-columns: 104px minmax(0, 1fr) auto; align-items: center; }
.lc-sim__ilus {
	width: 104px;
	height: 104px;
	padding: 10px;
	display: grid;
	place-items: center;
	overflow: hidden;
	aspect-ratio: 1 / 1;
}
.lc-sim__ilus .lc-ilus { width: 100%; height: 100%; max-width: 100%; max-height: 100%; }
.lc-sim-encabezado__ilus {
	display: grid;
	place-items: center;
	aspect-ratio: 1 / 1;
	overflow: hidden;
}
.lc-sim-encabezado__ilus .lc-ilus { width: 100%; height: 100%; }
@media (max-width: 620px) {
	.lc-sim__enlace { grid-template-columns: 76px minmax(0, 1fr); }
	.lc-sim__ilus { width: 76px; height: 76px; padding: 8px; }
}

/* ---------- 18. Megasimulador: acabado premium ---------- */
.lc-premium__sello {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 10px;
	padding: 6px 14px;
	border-radius: 999px;
	background: linear-gradient(100deg, #b8860b, #e6b333 55%, #b8860b);
	color: #1b1b1b !important;
	font-size: 12.5px !important;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	box-shadow: 0 6px 18px rgba(184, 134, 11, .25);
}

/* El panel donde se arma el examen: tarjeta oscura con filo dorado */
.lc-premium .lc-panel {
	background: linear-gradient(155deg, #10233d, #0b1a2e 60%, #0a1626);
	border: 1px solid rgba(230, 179, 51, .45);
	box-shadow: 0 18px 40px rgba(8, 20, 36, .28);
	color: #eaf0f8;
}
.lc-premium .lc-panel__titulo,
.lc-premium .lc-panel__ayuda,
.lc-premium .lc-panel label,
.lc-premium .lc-panel__campo span { color: #eaf0f8 !important; }
.lc-premium .lc-panel__ayuda,
.lc-premium .lc-panel .lc-pequeno { color: #b9c8dc !important; }
.lc-premium .lc-panel .lc-input,
.lc-premium .lc-panel select {
	background: #0f2438 !important;
	border-color: rgba(230, 179, 51, .35) !important;
	color: #eaf0f8 !important;
}
.lc-premium .lc-panel .lc-btn { background-color: #e6b333 !important; color: #1b1b1b !important; }
.lc-premium .lc-panel .lc-btn:hover { background-color: #f0c24d !important; }

/* Presets: tres formas de empezar, en tarjetas */
.lc-presets {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	gap: 12px;
	margin: 18px 0 22px;
}
.lc-preset {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
	padding: 14px 16px;
	text-align: left;
	cursor: pointer;
	border-radius: var(--lc-radio-sm);
	border: 1px solid rgba(230, 179, 51, .35);
	background: rgba(255, 255, 255, .04);
	color: #eaf0f8;
	font: inherit;
	transition: transform var(--lc-transicion), border-color var(--lc-transicion), background var(--lc-transicion);
}
.lc-preset b { font-size: 15.5px; }
.lc-preset span { font-size: 13.5px; color: #b9c8dc; }
.lc-preset:hover { transform: translateY(-2px); border-color: #e6b333; background: rgba(230, 179, 51, .12); }

/* Sello premium en su propia línea */
.lc-premium__sello { display: flex !important; width: max-content; }
/* La meta de la tarjeta no arrastra el separador al segundo renglón */
.lc-sim__meta { gap: 2px 14px; }
.lc-sim__meta i + i::before { content: none; }
/* Ilustración un poco más grande dentro de su cuadro */
.lc-sim__ilus .lc-ilus { transform: scale(1.12); }

/* Presets del mega: texto legible sobre el panel oscuro */
.lc-preset b, .lc-preset strong { color: #fff !important; }
.lc-preset span { color: rgba(255, 255, 255, .78) !important; }
.lc-preset:hover b { color: var(--lc-oro, #d4a12a) !important; }

/* ---------- 19. Modo oscuro dentro de Bricks ----------
   Bricks pinta sus propias secciones y contenedores con color claro; al activar
   el modo oscuro esas cajas seguían blancas y el bloque parecía no cambiar. */
html.lc-oscuro body.lc-portal-wp { background-color: var(--lc-fondo-pagina); }
html.lc-oscuro .brxe-code,
html.lc-oscuro .brxe-code .brxe-block,
html.lc-oscuro .brxe-code .brxe-container,
html.lc-oscuro .brxe-code .brxe-section { background-color: transparent !important; }
html.lc-oscuro .lc-seccion { background-color: transparent; }
html.lc-oscuro .lc-tarjeta,
html.lc-oscuro .lc-panel { background-color: var(--lc-superficie); }

/* ---------- 20. Portada: tarjetas de capítulo sin solapes ---------- */
.lc-cap { grid-template-columns: 84px minmax(0, 1fr) !important; align-items: start; }
.lc-cap > div { min-width: 0; }
.lc-cap__ilus { width: 84px; height: 84px; padding: 8px; overflow: hidden; }
.lc-cap__ilus .lc-ilus { width: 100%; height: 100%; max-height: none; }
@media (max-width: 560px) {
	.lc-cap { grid-template-columns: 64px minmax(0, 1fr) !important; }
	.lc-cap__ilus { width: 64px; height: 64px; padding: 6px; }
}

/* ---------- 21. Simetría vertical de las secciones ---------- */
.lc-rejilla { align-items: stretch; }
.lc-seccion > .lc-contenedor > .lc-rejilla { margin-top: 28px; }
.lc-seccion > .lc-contenedor > .lc-acciones { margin-top: 32px; }
.lc-seccion > .lc-contenedor > .lc-acciones + .lc-rejilla { margin-top: 28px; }
.lc-acciones { gap: var(--lc-4); }

/* ---------- 22. Botón de imprimir en los manuales ---------- */
.lc-libro__barra { display: flex; flex-wrap: wrap; align-items: center; gap: var(--lc-3); justify-content: space-between; margin-bottom: var(--lc-4); }
@media print {
	.lc-libro__barra, .lc-cabecera, .lc-pie, .lc-migas, .lc-volver, .lc-barra-superior { display: none !important; }
	.lc-libro { display: block !important; }
	.lc-libro__indice { display: none !important; }
	.lc-libro__cuerpo { border: 0 !important; box-shadow: none !important; }
}

/* Cualquier botón suelto dentro de una sección guarda su aire */
.lc-seccion > .lc-contenedor > p:has(> .lc-btn) { margin-top: 32px; }
/* Tarjetas de capítulo: misma altura y el botón siempre al pie */
.lc-cap { display: flex !important; flex-direction: column; }
.lc-cap > div { display: flex; flex-direction: column; height: 100%; }
.lc-cap__acciones { margin-top: auto !important; padding-top: var(--lc-3); }

/* ---------- 21. Escala tipográfica accesible ----------
   Ningún texto visible baja de 13,5 px. Etiquetas y chips suben para leerse
   sin esfuerzo en celular, y el texto de apoyo se queda en 14,5-15,5 px. */
.lc-etiqueta-seccion,
.lc-premium__sello { font-size: 13.5px !important; }
.lc-badge, .lc-chip { font-size: 13.5px !important; }
.lc-cap__temas li { font-size: 14px !important; }
.lc-pregunta__numero { font-size: 13.5px !important; }
.lc-dato { font-size: 14.5px !important; }
.lc-dato b { font-size: 18px !important; }
.lc-marca__lema { font-size: 13.5px !important; }
.lc-pie__col a, .lc-pie__col li, .lc-pie__col p { font-size: 14.5px !important; }
.lc-nav a, .lc-submenu a { font-size: 15.5px !important; }
.lc-pequeno, small { font-size: clamp(14.5px, .25vw + 14px, 15.5px) !important; }
.lc-ayuda, .lc-error, .lc-sim__meta { font-size: 14px !important; }
.lc-navegador button { font-size: 16px !important; }
.lc-tab { font-size: 15.5px !important; }
.lc-opcion__letra { font-size: 15px !important; }
.lc-explicacion p { font-size: 15.5px !important; }
.lc-resultado__cifras { font-size: 15.5px !important; }
.lc-migas__lista { font-size: 14.5px !important; }

/* Etiquetas del panel y del hero, un punto más grandes */
.lc-panel__datos span, .lc-hero-portada__datos span { font-size: 14.5px !important; }
.lc-hero-portada__etiqueta { font-size: 13.5px !important; }
.lc-badge, .lc-chip { font-size: 14px !important; }
.lc-pie__legal, .lc-pie__legal p { font-size: 14.5px !important; }
.lc-etiqueta-seccion, .lc-pregunta__numero, .lc-premium__sello { font-size: 14px !important; }
.lc-pie p, .lc-pie a, .lc-pie span { font-size: 14.5px !important; }

/* ---------- 22. Estados de la opción (mandan sobre el relleno fijo) ---------- */
.lc-opcion.lc-elegida, .lc-opcion[aria-pressed="true"] {
	background-color: var(--lc-azul-suave) !important;
	border-color: var(--lc-azul-claro) !important;
}
.lc-opcion.lc-correcta { background-color: var(--lc-ok-suave) !important; border-color: var(--lc-ok) !important; }
.lc-opcion.lc-incorrecta { background-color: var(--lc-error-suave) !important; border-color: var(--lc-error) !important; }
.lc-opcion.lc-elegida .lc-opcion__letra { background: var(--lc-azul-claro) !important; color: #fff !important; }

/* ---------- 23. Centro de simuladores: tarjetas parejas ---------- */
/* Los puntos separadores dejaban un "·" colgando al final de la línea */
.lc-sim__meta i + i::before { content: none !important; }
.lc-sim__meta { gap: 2px 14px !important; font-size: 14px !important; }
/* La tarjeta se adapta a su propio ancho, no al de la rejilla */
.lc-sim { container-type: inline-size; }
.lc-sim__enlace { grid-template-columns: 88px minmax(0, 1fr) auto; gap: 14px; }
.lc-sim__ilus { width: 88px; height: 88px; padding: 6px; overflow: hidden; }
.lc-sim__ilus .lc-ilus { width: 100%; height: 100%; max-height: none; }
/* Tarjeta angosta (3 y 4 columnas): la ilustración pasa arriba */
@container (max-width: 430px) {
	.lc-sim__enlace { grid-template-columns: minmax(0, 1fr); gap: 10px; align-items: start; }
	.lc-sim__ilus { width: 100%; height: 78px; }
	.lc-sim__flecha { display: none; }
	.lc-sim__titulo { font-size: 1.02rem !important; }
}
@container (max-width: 250px) {
	.lc-sim__ilus { height: 70px; }
}
/* Texto de entrada del centro: línea de lectura cómoda */
.lc-entrada { max-width: 68ch; }
/* Las rejillas de capítulos: 3 por fila para que las 6 tarjetas llenen 2 filas */
.lc-sim-rejilla { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)) !important; }
@media (min-width: 1100px) { .lc-sim-rejilla { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; } }
@media (max-width: 1099px) and (min-width: 700px) { .lc-sim-rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }

/* El destino del enlace «saltar al contenido» no debe mostrar foco visible */
#contenido:focus, main:focus { outline: none !important; }

/* ---------- 24. Menú móvil: cajón lateral (off-canvas) ---------- */
.lc-velo { display: none; }
@media (max-width: 1024px) {
	.lc-hamburguesa { display: inline-flex !important; }
	.lc-velo {
		display: block; position: fixed; inset: 0; z-index: 90;
		background: rgba(8, 13, 25, .58); opacity: 0; pointer-events: none;
		transition: opacity .25s ease; backdrop-filter: blur(2px);
	}
	body.lc-menu-abierto .lc-velo { opacity: 1; pointer-events: auto; }
	body.lc-menu-abierto { overflow: hidden; }
	.lc-nav {
		position: fixed !important; inset: 0 0 0 auto !important;
		width: min(86vw, 380px) !important; max-width: 380px; height: 100dvh;
		margin: 0 !important; padding: 0 0 24px !important;
		background: var(--lc-superficie) !important;
		border-left: 1px solid var(--lc-borde); border-bottom: 0 !important;
		box-shadow: -24px 0 60px rgba(0, 0, 0, .28);
		/* Cerrado no ocupa espacio ni crea desborde: se apaga del todo. */
		display: none !important; visibility: hidden;
		overflow-y: auto; overscroll-behavior: contain; z-index: 95;
	}
	body.lc-menu-abierto .lc-nav {
		display: block !important; visibility: visible;
		animation: lc-entra .26s cubic-bezier(.4, 0, .2, 1) both;
	}
	@keyframes lc-entra {
		from { transform: translateX(28px); opacity: .4; }
		to   { transform: none; opacity: 1; }
	}
	.lc-nav__cabecera {
		position: sticky; top: 0; z-index: 2; display: flex; align-items: center;
		justify-content: space-between; gap: 12px; padding: 14px 16px;
		background: var(--lc-superficie); border-bottom: 1px solid var(--lc-borde);
	}
	.lc-nav__titulo { font-weight: 800; font-size: .95rem; letter-spacing: .02em; color: var(--lc-texto-suave); text-transform: uppercase; }
	.lc-nav__cabecera button { color: var(--lc-tinta) !important; font-size: 1.15rem; }
	.lc-nav .lc-menu { flex-direction: column; align-items: stretch; gap: 0; margin: 0; padding: 0; }
	.lc-nav .lc-menu > li { border-bottom: 1px solid var(--lc-borde); position: relative; }
	.lc-nav .lc-menu > li > a {
		display: block; padding: 16px; font-size: 1rem; font-weight: 600;
		color: var(--lc-tinta); text-decoration: none; line-height: 1.3;
	}
	.lc-nav .lc-menu > li > a:hover { background: var(--lc-superficie-2); }
	.lc-nav .lc-menu .lc-submenu {
		position: static; opacity: 1; visibility: visible; transform: none;
		box-shadow: none; border: 0; border-radius: 0; margin: 0; padding: 0 0 8px 16px;
		background: var(--lc-superficie-2); display: none;
	}
	.lc-nav .lc-menu li.lc-abierto > .lc-submenu { display: block; }
	.lc-nav .lc-menu .lc-submenu a { display: block; padding: 12px 16px; font-size: .95rem; color: var(--lc-texto-suave); border-bottom: 1px solid var(--lc-borde); }
	.lc-nav .lc-menu .lc-submenu li:last-child a { border-bottom: 0; }
	.lc-nav .lc-menu li:has(> .lc-submenu) > a { padding-right: 60px; }
	.lc-nav .lc-submenu-boton {
		position: absolute; top: 6px; right: 6px; width: 44px; height: 44px;
		min-height: 44px; border: 0; border-radius: 10px; background: none;
		color: var(--lc-texto-suave); cursor: pointer; font-size: 1.1rem;
	}
	.lc-nav .lc-submenu-boton:hover { background: var(--lc-superficie-2); color: var(--lc-tinta); }
}

/* Remate del cajón: los dos botones que de verdad importan */
@media (max-width: 1024px) {
	.lc-nav__pie { padding: 18px 16px 8px; border-top: 1px solid var(--lc-borde); display: grid; gap: 10px; margin-top: 8px; }
	.lc-nav__pie .lc-btn { width: 100%; justify-content: center; }
	/* La hamburguesa se convierte en X mientras el cajón está abierto */
	body.lc-menu-abierto .lc-hamburguesa__barras { background: transparent !important; }
	body.lc-menu-abierto .lc-hamburguesa__barras::before { top: 0 !important; transform: rotate(45deg); }
	body.lc-menu-abierto .lc-hamburguesa__barras::after { top: 0 !important; transform: rotate(-45deg); }
	body.lc-menu-abierto .lc-hamburguesa { color: var(--lc-tinta); }
}

/* El cajón solo existe en pantallas chicas: en PC no se muestran sus piezas */
.lc-nav__cabecera, .lc-nav__pie { display: none; }
@media (max-width: 1024px) {
	.lc-nav__cabecera { display: flex; }
	.lc-nav__pie { display: grid; }
}

/* ---------- 25. Cajón sin acordeón: todo a la vista ---------- */
@media (max-width: 1024px) {
	/* El botón de la X, grande y cómodo */
	.lc-nav__cabecera { padding: 10px 12px 10px 16px !important; }
	.lc-nav__cabecera button {
		width: 48px !important; height: 48px !important; min-height: 48px !important;
		display: inline-flex !important; align-items: center; justify-content: center;
		border-radius: 12px !important; background: var(--lc-superficie-2) !important;
		color: var(--lc-tinta) !important; font-size: 1.5rem !important; line-height: 1;
	}
	.lc-nav__cabecera button svg { width: 26px; height: 26px; }

	/* Sin acordeón: los submenús siempre abiertos, con su raya a la izquierda */
	.lc-nav .lc-menu .lc-submenu {
		display: block !important; position: static !important; opacity: 1 !important;
		visibility: visible !important; transform: none !important; box-shadow: none !important;
		border: 0 !important; border-radius: 0 !important; margin: 0 !important;
		padding: 0 0 10px !important; background: var(--lc-superficie-2) !important;
	}
	.lc-nav .lc-submenu-boton { display: none !important; }
	.lc-nav .lc-menu li:has(> .lc-submenu) > a { padding-right: 16px !important; }
	.lc-nav .lc-menu .lc-submenu a {
		display: block; padding: 12px 16px 12px 30px; font-size: .95rem;
		color: var(--lc-texto-suave); border-bottom: 1px solid var(--lc-borde);
		position: relative;
	}
	.lc-nav .lc-menu .lc-submenu a::before {
		content: ""; position: absolute; left: 16px; top: 50%; width: 6px; height: 6px;
		margin-top: -3px; border-radius: 50%; background: var(--lc-acento); opacity: .55;
	}
	.lc-nav .lc-menu .lc-submenu a:hover { background: var(--lc-superficie); color: var(--lc-tinta); }
	.lc-nav .lc-menu .lc-submenu li:last-child a { border-bottom: 0; }

}

/* ---------- 26. Cuenta en la cabecera ---------- */
.lc-cuenta { display: flex; align-items: center; }
.lc-cuenta__btn {
	display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px;
	border: 1px solid var(--lc-borde); border-radius: 999px;
	background: var(--lc-superficie); color: var(--lc-tinta);
	font-size: 15px; font-weight: 600; line-height: 1; cursor: pointer;
	transition: border-color .2s, color .2s, background .2s;
}
.lc-cuenta__btn:hover, .lc-cuenta__btn[aria-expanded="true"] {
	border-color: var(--lc-azul); color: var(--lc-azul);
}
.lc-cuenta__caja { position: relative; }
.lc-cuenta__menu {
	position: absolute; right: 0; top: calc(100% + 10px); min-width: 220px;
	background: var(--lc-superficie); border: 1px solid var(--lc-borde);
	border-radius: 14px; box-shadow: 0 20px 44px rgba(8, 20, 45, .18);
	padding: 8px; margin: 0; list-style: none; display: none; z-index: 70;
}
.lc-cuenta__menu[data-abierto="1"] { display: block; }
.lc-cuenta__menu a {
	display: block; padding: 10px 12px; border-radius: 9px;
	color: var(--lc-tinta); font-size: 15px; text-decoration: none;
}
.lc-cuenta__menu a:hover { background: var(--lc-superficie-2); color: var(--lc-azul); }
.lc-cuenta__menu hr { border: 0; height: 1px; background: var(--lc-borde); margin: 6px 4px; }
@media (max-width: 1024px) { .lc-cabecera__acciones > .lc-cuenta { display: none !important; } }

/* La cuenta dentro del cajón móvil */
.lc-nav__cuenta { padding: 16px; border-top: 1px solid var(--lc-borde); display: grid; gap: 10px; }
.lc-nav__cuenta .lc-cuenta__btn, .lc-nav__cuenta .lc-btn { width: 100%; justify-content: center; }
.lc-nav__cuenta__nombre { font-size: 15px; color: var(--lc-texto-suave); }

/* La cuenta del cajón solo existe en móvil: en PC vive en la cabecera */
.lc-nav__cuenta { display: none; }
@media (max-width: 1024px) { .lc-nav__cuenta { display: grid; } }

/* ---------- 27. Cabecera de PC: alto fijo y menú compacto ---------- */
@media (min-width: 1025px) {
	.lc-cabecera__in { min-height: 56px !important; padding-block: 0 !important; }
	.lc-nav .lc-menu { gap: 2px !important; }
	.lc-nav .lc-menu > li > a { padding: 8px 12px !important; font-size: 15px !important; line-height: 1.2 !important; }
	.lc-cabecera__acciones { gap: 10px !important; }
	.lc-cuenta__btn { padding: 8px 13px !important; font-size: 14.5px !important; }
}

/* ---------- 28. Barra de WordPress (solo con sesión) ---------- */
/* El nombre de usuario de la barra se salía del ancho en celular y
   arrastraba la página: se recorta y en móvil no se muestra. */
#wpadminbar { min-width: 0 !important; }
#wpadminbar .quicklinks { max-width: 100% !important; }
#wpadminbar #wp-admin-bar-my-account .display-name {
	display: inline-block; max-width: 120px; overflow: hidden;
	text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom;
}
@media (max-width: 782px) {
	#wpadminbar #wp-admin-bar-my-account .display-name { display: none; }
	body.admin-bar .lc-cabecera { top: var(--wp-admin--admin-bar--height, 46px); }
}
body.admin-bar.lc-portal-wp .lc-cabecera { top: var(--wp-admin--admin-bar--height, 32px); }

/* ---------- 29. Productos de WooCommerce dentro de Bricks ---------- */
/* La lista de productos hereda la sangría de listas del tema y el bloque
   se ve corrido a la derecha. Se anula solo en las listas de productos. */
ul.products, .products,
.brxe-woocommerce-products ul.products,
.brxe-products ul.products,
.wc-block-grid__products {
	margin-left: 0 !important; margin-right: 0 !important;
	padding-left: 0 !important; padding-right: 0 !important;
	list-style: none !important;
}
ul.products li.product,
.wc-block-grid__products li { margin-left: 0 !important; margin-right: 0 !important; }
.brxe-woocommerce-products { max-width: 100% !important; }

/* ---------- 30. Cabecera fija en todo el sitio ---------- */
/* En Bricks la cabecera vive dentro de una sección: si solo se hace sticky
   al bloque interno no tiene recorrido. Se fija la sección completa. */
.brxe-section:has(.lc-cabecera),
.brxe-section:has(header.site-header) {
	position: sticky !important; top: 0 !important; z-index: 90 !important;
}
.lc-cabecera { z-index: 91 !important; }
body.admin-bar .brxe-section:has(.lc-cabecera) {
	top: var(--wp-admin--admin-bar-height, 32px) !important;
}

/* ---------- 31. Modo oscuro en las páginas que no son del portal ---------- */
/* Los títulos y textos de Bricks/WooCommerce traen colores fijos (negro).
   En oscuro se fuerzan al color del tema, salvo dentro de los bloques del
   portal, botones, chapas y precios, que tienen su propio color. */
html.lc-oscuro :is(h1, h2, h3, h4, h5, h6, p, li, dd, dt, blockquote, figcaption, td, th, label, small, strong, em, span.brxe-text-basic, .brxe-heading, .brxe-text, .brxe-post-title, .brxe-post-content):not(.lc-seccion *):not(.lc-cabecera *):not(.lc-pie *):not(.lc-muro *):not(.lc-nav *):not(.price *):not(.woocommerce-Price-amount):not(.lc-badge):not(.lc-chip) {
	color: var(--lc-texto) !important;
}
html.lc-oscuro :is(a):not(.lc-seccion *):not(.lc-cabecera *):not(.lc-pie *):not(.lc-barra-superior *):not(.lc-nav *):not(.lc-btn):not(.button):not(.woocommerce-Price-amount) {
	color: var(--lc-enlace) !important;
}
html.lc-oscuro :is(.brxe-section, .brxe-container, .brxe-block, .brxe-div):not(.lc-seccion *) {
	background-color: transparent;
	border-color: var(--lc-borde);
}

/* ---------- 32. Botones de WooCommerce y Bricks en modo oscuro ---------- */
html.lc-oscuro :is(
	.woocommerce a.button,
	.woocommerce button.button,
	.woocommerce input.button,
	.woocommerce #respond input#submit,
	.woocommerce a.button.alt,
	.woocommerce button.button.alt,
	.woocommerce input.button.alt,
	.woocommerce-Button,
	.woocommerce-form-login .button,
	.woocommerce-form-register .button,
	.woocommerce-cart .checkout-button,
	.widget_shopping_cart .buttons a,
	.wc-block-components-button,
	.wp-block-button__link,
	.brxe-button,
	button.brxe-button,
	input[type=submit],
	.brxe-woocommerce-mini-cart .button
) {
	background-color: var(--lc-acento-fondo) !important;
	color: #fff !important;
	border: 1px solid transparent !important;
}

html.lc-oscuro :is(
	.woocommerce a.button:hover,
	.woocommerce button.button:hover,
	.woocommerce input.button:hover,
	.woocommerce-cart .checkout-button:hover,
	.wc-block-components-button:hover,
	.wp-block-button__link:hover,
	.brxe-button:hover,
	input[type=submit]:hover
) {
	background-color: var(--lc-acento-fondo-hover) !important;
	color: #fff !important;
}

html.lc-oscuro .woocommerce-form-login__submit,
html.lc-oscuro .woocommerce-form-register__submit,
html.lc-oscuro .woocommerce-EditAccountForm .button {
	background-color: var(--lc-acento-fondo) !important;
	color: #fff !important;
	border-color: transparent !important;
}

/* Campos de formulario de WooCommerce en oscuro */
html.lc-oscuro :is(.woocommerce input[type=text], .woocommerce input[type=email],
	.woocommerce input[type=password], .woocommerce input[type=tel],
	.woocommerce input[type=number], .woocommerce textarea, .woocommerce select,
	.woocommerce-Input) {
	background-color: var(--lc-superficie-2) !important;
	color: var(--lc-texto) !important;
	border: 1px solid var(--lc-borde) !important;
}

/* ---------- 33. Rediseño 2026: portada y directorio ---------- */
/* Piezas nuevas, todas con los colores del portal para que el modo oscuro
   las tome sin trabajo extra. */

.lc-caja {
	background: var(--lc-superficie);
	border: 1px solid var(--lc-borde);
	border-radius: 16px;
	overflow: hidden;
	display: flex; flex-direction: column;
	box-shadow: 0 1px 2px rgba(10, 22, 40, .04);
}
.lc-caja__foto { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.lc-caja__cuerpo { padding: 20px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.lc-caja__cuerpo > * { margin: 0; }

.lc-insignia {
	align-self: flex-start;
	display: inline-flex; align-items: center; gap: 6px;
	padding: 4px 10px; border-radius: 999px;
	background: var(--lc-azul-suave); color: var(--lc-azul);
	font-size: 13.5px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
}
.lc-insignia--rojo { background: #fdecea; color: var(--lc-acento); }
.lc-insignia--oro { background: #fdf3dc; color: #8a5a00; }
html.lc-oscuro .lc-insignia { background: rgba(127,180,255,.14); color: #9dc4ff; }
html.lc-oscuro .lc-insignia--rojo { background: rgba(255,90,77,.16); color: #ff9c93; }
html.lc-oscuro .lc-insignia--oro { background: rgba(234,179,8,.16); color: #f2c94c; }

/* Fila de datos con icono: tiempo · preguntas · mínimo */
.lc-meta-linea { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 14.5px; color: var(--lc-texto-suave); }
.lc-meta-linea span { display: inline-flex; align-items: center; gap: 6px; }
.lc-meta-linea svg { width: 16px; height: 16px; flex: 0 0 auto; opacity: .8; }

/* Caja de ilustración de los capítulos */
.lc-ilus-caja {
	width: 100%; height: 92px;
	display: grid; place-items: center;
	background: var(--lc-superficie-2);
	border-bottom: 1px solid var(--lc-borde);
}
.lc-ilus-caja svg { width: 68px; height: 68px; }

/* Tarjetas grandes del directorio */
.lc-dir-grande { display: grid; gap: 20px; grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1100px) { .lc-dir-grande { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .lc-dir-grande { grid-template-columns: 1fr; } }
.lc-dir-grande .lc-caja__ilus { height: 118px; display: grid; place-items: center; background: var(--lc-superficie-2); border-bottom: 1px solid var(--lc-borde); }
.lc-dir-grande .lc-caja__ilus svg { width: 150px; height: 88px; color: var(--lc-azul); }

/* Pasos del método */
.lc-pasos { display: grid; gap: 18px; grid-template-columns: repeat(3, 1fr); }
@media (max-width: 860px) { .lc-pasos { grid-template-columns: 1fr; } }
.lc-paso__num {
	width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center;
	background: var(--lc-azul-suave); color: var(--lc-azul); font-weight: 800; font-size: 17px;
}

/* Banda de cierre */
.lc-cierre {
	background: linear-gradient(135deg, #0b2545 0%, #12315c 60%, #1b3a6b 100%);
	color: #fff; padding-block: clamp(40px, 6vw, 72px);
}
.lc-cierre h2 { color: #fff; }
.lc-cierre p { color: #cfe0ff; max-width: 62ch; }

/* Hero con degradado y resplandor (sin imágenes extra) */
.lc-hero-portada--grad {
	background:
		radial-gradient(55% 75% at 92% 10%, rgba(214, 31, 38, .38) 0%, rgba(214, 31, 38, 0) 62%),
		radial-gradient(130% 130% at 6% 0%, #1a3d75 0%, #0b2545 52%, #061529 100%);
}
.lc-hero-portada__foto {
	border-radius: 18px; overflow: hidden;
	box-shadow: 0 30px 70px rgba(3, 10, 24, .55);
	border: 1px solid rgba(255, 255, 255, .12);
}
.lc-hero-portada__foto img { display: block; width: 100%; height: auto; }

/* Rejillas del rediseño */
.lc-rejilla-2 { display: grid; gap: 20px; grid-template-columns: repeat(2, 1fr); }
.lc-rejilla-3b { display: grid; gap: 20px; grid-template-columns: repeat(3, 1fr); }
.lc-rejilla-4b { display: grid; gap: 18px; grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1000px) {
	.lc-rejilla-3b { grid-template-columns: repeat(2, 1fr); }
	.lc-rejilla-4b { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 660px) {
	.lc-rejilla-2, .lc-rejilla-3b, .lc-rejilla-4b { grid-template-columns: 1fr; }
}
.lc-caja__acciones { display: flex; flex-wrap: wrap; gap: 10px; margin-top: auto; padding-top: 4px; }
.lc-caja h3 { font-size: 1.12rem; margin: 0; }
.lc-caja p { color: var(--lc-texto-suave); font-size: 15.5px; margin: 0; }

/* Variantes de botón del rediseño */
.lc-btn--oro {
	background: #b45309 !important; color: #fff !important;
	border-color: #b45309 !important;
}
.lc-btn--oro:hover { background: #92400e !important; border-color: #92400e !important; }
.lc-btn--claro {
	background: #fff !important; color: var(--lc-azul) !important;
	border-color: #fff !important;
}
.lc-btn--claro:hover { background: #eef3fb !important; border-color: #eef3fb !important; }

/* Encabezado de sección con acción a la derecha */
.lc-encabezado-seccion {
	display: flex; align-items: center; justify-content: space-between;
	gap: 16px; flex-wrap: wrap;
}
.lc-encabezado-seccion h2 { margin: 0; }

/* Rejilla de capítulos: 3 por fila en escritorio */
.lc-rejilla-caps { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
@media (max-width: 1100px) { .lc-rejilla-caps { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 700px) { .lc-rejilla-caps { grid-template-columns: 1fr !important; } }

/* Tarjeta de capítulo del directorio */
.lc-dir-cap { padding: 0 !important; overflow: hidden; }
.lc-dir-cap__enlace {
	display: flex; flex-direction: column; gap: 10px;
	padding: 18px; height: 100%; text-decoration: none; color: inherit;
}
.lc-dir-cap__enlace:hover h3 { color: var(--lc-acento); }
.lc-dir-cap h3 { margin: 0; font-size: 1.02rem; }

/* Ajustes finos del directorio */
.lc-dir-cap .lc-badge { align-self: flex-start; }
.lc-ilus-caja { height: 104px; }
.lc-ilus-caja svg { width: 84px; height: 84px; }
.lc-dir-cap h3 { min-height: 2.4em; }

/* Títulos de capítulo un poco más grandes en la portada */
.lc-cap h3 { font-size: 1.18rem !important; line-height: 1.32 !important; }
.lc-cap .lc-pequeno { font-size: 0.95rem !important; }

/* Botones alineados al pie de cada tarjeta */
.lc-caja { display: flex; flex-direction: column; }
.lc-caja__acciones { margin-top: auto; padding-top: 14px; }

/* Barra superior en modo oscuro: el enlace se perdía sobre el fondo */
html.lc-oscuro .lc-barra-superior { background: #0b1830 !important; color: #dbe6f7 !important; }
html.lc-oscuro .lc-barra-superior a { color: #dbe6f7 !important; text-decoration: underline; text-underline-offset: 2px; }
html.lc-oscuro .lc-barra-superior a:hover { color: #ffffff !important; }


/* ---------- 34. Audio de preguntas, compartir y progreso ---------- */
.lc-audio {
	display: inline-flex; align-items: center; gap: 6px; margin-left: 10px;
	padding: 6px 12px; border: 1px solid var(--lc-borde); border-radius: 999px;
	background: var(--lc-superficie); color: var(--lc-tinta);
	font-size: 14.5px; font-weight: 600; cursor: pointer; vertical-align: middle;
}
.lc-audio::before { content: "🔊"; font-size: 15px; }
.lc-audio:hover { border-color: var(--lc-azul); color: var(--lc-azul); }
.lc-audio[aria-pressed="true"] { background: var(--lc-azul); color: #fff; border-color: var(--lc-azul); }
.lc-audio[aria-pressed="true"]::before { content: "⏹"; }
.lc-audio--exp { margin: 10px 0 0; }
.lc-resultado__extra { margin-top: 16px; }

/* ---------- 35. Página del audiolibro ---------- */
.lc-aul { background: var(--lc-superficie); border: 1px solid var(--lc-borde); border-radius: 16px; overflow: hidden; margin-top: 24px; }
.lc-aul__barra { display: flex; gap: 14px; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--lc-borde); flex-wrap: wrap; }
.lc-aul__tabs { display: flex; gap: 8px; }
.lc-aul__tabs button { padding: 9px 16px; border: 1px solid var(--lc-borde); background: transparent; border-radius: 999px; font-size: 15px; font-weight: 600; cursor: pointer; color: var(--lc-tinta); }
.lc-aul__tabs button[aria-pressed="true"] { background: var(--lc-azul); color: #fff; border-color: var(--lc-azul); }
.lc-aul__sel { display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; color: var(--lc-texto-suave); }
.lc-aul__sel select { max-width: 340px; padding: 9px 12px; border: 1px solid var(--lc-borde); border-radius: 10px; background: var(--lc-superficie); color: var(--lc-tinta); font-size: 15px; }
.lc-aul__caja { padding: 18px; }
.lc-aul__ahora { margin: 0 0 12px; font-size: 1.15rem; }
.lc-aul audio { width: 100%; margin-bottom: 12px; }
.lc-aul__vel { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 14.5px; color: var(--lc-texto-suave); margin-bottom: 16px; }
.lc-aul__vel button { padding: 5px 10px; border: 1px solid var(--lc-borde); background: transparent; border-radius: 8px; cursor: pointer; font-size: 14px; color: var(--lc-tinta); }
.lc-aul__vel button[aria-pressed="true"] { background: var(--lc-azul); color: #fff; border-color: var(--lc-azul); }
.lc-aul__texto { max-height: min(52vh, 520px); overflow: auto; padding-right: 6px; }
.lc-aul__texto p { margin: 0 0 10px; padding: 7px 10px; border-radius: 8px; line-height: 1.62; cursor: pointer; }
.lc-aul__texto p:hover { background: var(--lc-suave); }
.lc-aul__texto p.activo { background: rgba(214, 31, 38, .13); box-shadow: inset 3px 0 0 var(--lc-acento); }
@media (max-width: 720px) { .lc-aul__sel { width: 100%; } .lc-aul__sel select { max-width: none; width: 100%; } }

/* Botón «Escuchar» junto a cada tema del manual */
.lc-libro .lc-libro__oir {
	display: inline-flex; align-items: center; gap: 6px; margin-left: 10px;
	padding: 4px 10px; border: 1px solid var(--lc-borde); border-radius: 999px;
	background: var(--lc-superficie); color: var(--lc-azul);
	font-size: 13.5px; font-weight: 600; text-decoration: none; vertical-align: middle;
}
.lc-libro .lc-libro__oir:hover { background: var(--lc-azul); color: #fff; border-color: var(--lc-azul); }


/* ---------- 36. Blog y entradas ---------- */
.lc-blog .lc-seccion{padding-block:clamp(28px,5vw,56px)}
.lc-blog h1{font-size:clamp(28px,4vw,42px);line-height:1.15;margin:0 0 12px}
.lc-post{display:flex;flex-direction:column;background:var(--lc-superficie);border:1px solid var(--lc-borde);border-radius:14px;overflow:hidden;height:100%;transition:transform .18s,box-shadow .18s}
.lc-post:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(10,25,50,.12)}
.lc-post__img{display:block;aspect-ratio:16/9;background:var(--lc-suave);overflow:hidden}
.lc-post__img img{width:100%;height:100%;object-fit:cover;display:block}
.lc-post__vacio{display:block;width:100%;height:100%;background:linear-gradient(135deg,#1b3a6b,#0b2545)}
.lc-post__cuerpo{display:flex;flex-direction:column;gap:8px;padding:16px 18px 18px}
.lc-post__cat{align-self:flex-start;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#b8271b;text-decoration:none}
.lc-post__titulo{margin:0;font-size:1.12rem;line-height:1.34}
.lc-post__titulo a{color:var(--lc-tinta);text-decoration:none}
.lc-post__titulo a:hover{color:var(--lc-azul)}
.lc-post__resumen{margin:0;font-size:15.5px;line-height:1.6;color:var(--lc-texto-suave)}
.lc-post__pie{margin:auto 0 0;font-size:14px;color:var(--lc-texto-suave)}
.lc-post-solo .lc-articulo{max-width:860px;margin:0 auto;padding-block:clamp(24px,4vw,48px)}
.lc-migas{font-size:14.5px;color:var(--lc-texto-suave);margin-bottom:14px}
.lc-migas a{color:inherit;text-decoration:none}
.lc-migas a:hover{color:var(--lc-azul)}
.lc-articulo__cab h1{font-size:clamp(26px,4vw,42px);line-height:1.16;margin:0 0 12px}
.lc-articulo__meta{margin:0;font-size:15px;color:var(--lc-texto-suave)}
.lc-articulo__img{margin:24px 0 0;border-radius:14px;overflow:hidden;aspect-ratio:16/9;background:var(--lc-suave)}
.lc-articulo__img img{width:100%;height:100%;object-fit:cover;display:block}
.lc-articulo__cuerpo{display:grid;grid-template-columns:240px minmax(0,1fr);gap:36px;margin-top:28px;align-items:start}
@media(max-width:900px){.lc-articulo__cuerpo{grid-template-columns:1fr;gap:20px}}
.lc-indice{position:sticky;top:96px;border-left:2px solid var(--lc-borde);padding-left:16px}
.lc-indice__t{margin:0 0 10px;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--lc-texto-suave)}
.lc-indice ol{margin:0;padding-left:18px;display:grid;gap:8px;font-size:15px}
.lc-indice a{color:var(--lc-tinta);text-decoration:none}
.lc-indice a:hover{color:var(--lc-azul)}
@media(max-width:900px){.lc-indice{position:static;border:1px solid var(--lc-borde);border-radius:12px;padding:14px 16px}}
.lc-articulo__texto{font-size:17.5px;line-height:1.68;color:var(--lc-texto)}
.lc-articulo__texto>*+*{margin-top:1.1em}
.lc-articulo__texto h2{font-size:clamp(21px,2.4vw,27px);line-height:1.25;margin:1.9em 0 .6em;scroll-margin-top:96px}
.lc-articulo__texto h3{font-size:clamp(18px,2vw,21px);margin:1.6em 0 .5em;scroll-margin-top:96px}
.lc-articulo__texto a{color:var(--lc-azul);text-underline-offset:2px}
.lc-articulo__texto ul,.lc-articulo__texto ol{padding-left:1.3em;display:grid;gap:.4em}
.lc-articulo__texto blockquote{margin:1.6em 0;padding:12px 18px;border-left:3px solid var(--lc-acento);background:var(--lc-suave);border-radius:0 10px 10px 0;font-style:italic}
.lc-articulo__texto img{border-radius:12px;height:auto}
.lc-compartir{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:34px;padding-top:22px;border-top:1px solid var(--lc-borde)}
.lc-compartir__t{margin:0 8px 0 0;font-size:14px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--lc-texto-suave)}
.lc-compartir__b{display:inline-flex;align-items:center;padding:9px 14px;border:1px solid var(--lc-borde);border-radius:999px;background:var(--lc-superficie);color:var(--lc-tinta);font-size:14.5px;font-weight:600;text-decoration:none;cursor:pointer}
.lc-compartir__b:hover{border-color:var(--lc-azul);color:var(--lc-azul)}
.lc-compartir__b--wa{background:#1f9d55;border-color:#1f9d55;color:#fff}
.lc-compartir__b--wa:hover{background:#177f44;color:#fff}
.lc-compartir__b--g{background:#f1f3f4;border-color:#dadce0}
.lc-autor{display:flex;gap:14px;align-items:center;margin-top:26px;padding:16px;border:1px solid var(--lc-borde);border-radius:14px;background:var(--lc-superficie)}
.lc-autor img{border-radius:50%;width:56px;height:56px;object-fit:cover}
.lc-autor__n{margin:0;font-weight:700}
.lc-autor__b{margin:2px 0 0;font-size:14.5px;color:var(--lc-texto-suave)}
.lc-relacionadas{margin-top:40px}
.lc-relacionadas h2{font-size:clamp(20px,2.4vw,26px);margin:0 0 16px}
.lc-prev-next{display:flex;gap:14px;justify-content:space-between;margin-top:32px;padding-top:20px;border-top:1px solid var(--lc-borde);flex-wrap:wrap}
.lc-prev-next a{display:block;max-width:48%;font-weight:600;color:var(--lc-tinta);text-decoration:none}
.lc-prev-next span{display:block;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--lc-texto-suave);margin-bottom:4px}
.lc-blog .navigation.pagination{margin-top:28px}
.lc-blog .nav-links{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.lc-blog .page-numbers{padding:8px 13px;border:1px solid var(--lc-borde);border-radius:10px;text-decoration:none;color:var(--lc-tinta);font-weight:600}
.lc-blog .page-numbers.current{background:var(--lc-azul);color:#fff;border-color:var(--lc-azul)}

/* Ajustes pedidos: entrada ancha con barra lateral */
.lc-post-solo .lc-articulo{max-width:none;margin:0;padding-block:0}
.lc-post-solo .lc-contenedor{padding-block:clamp(22px,3vw,40px)}
.lc-articulo__grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:44px;align-items:start}
/* minmax(0,1fr) también en móvil: con 1fr a secas, una tabla o una imagen
   ancha estira la columna y el artículo se sale del celular. */
@media(max-width:1024px){.lc-articulo__grid{grid-template-columns:minmax(0,1fr);gap:28px}}
.lc-articulo__texto{font-size:18px;line-height:1.72;max-width:74ch}
/* Tablas del artículo: en celular ninguna puede estirar la página. Se deja
   el scroll como red de seguridad y, por debajo de 640 px, se aprieta la
   letra para que la tabla entre completa sin tener que arrastrarla. */
.lc-articulo__texto table{display:block;overflow-x:auto;max-width:100%}
@media(max-width:640px){
	.lc-articulo__texto table{font-size:15px}
	.lc-articulo__texto th,.lc-articulo__texto td{padding:8px 10px}
}
.lc-articulo__cab h1{font-size:clamp(28px,3.6vw,44px)}
/* Aire abajo de la imagen: sin esto el primer párrafo queda pegado al borde. */
.lc-articulo__img{margin:22px 0 26px}
.lc-sidebar{position:sticky;top:96px;display:grid;gap:16px}
@media(max-width:1024px){.lc-sidebar{position:static}}
.lc-side-card{background:var(--lc-superficie);border:1px solid var(--lc-borde);border-radius:14px;padding:16px 18px}
.lc-side-card__t{margin:0 0 10px;font-size:13px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--lc-texto-suave)}
.lc-side-card__p{margin:0 0 12px;font-size:15px;line-height:1.55;color:var(--lc-texto-suave)}
.lc-side-toc{margin:0;padding-left:18px;display:grid;gap:8px;font-size:15px}
.lc-side-toc a{color:var(--lc-tinta);text-decoration:none}
.lc-side-toc a:hover{color:var(--lc-azul)}
.lc-side-lista{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:15.5px}
.lc-side-lista a{color:var(--lc-azul);text-decoration:none;font-weight:600}
.lc-side-card--azul{background:#11294b;border-color:#1b3a6b}
.lc-side-card--azul .lc-side-card__t,.lc-side-card--azul .lc-side-card__p{color:#cfdcf2}
.lc-side-card--oro{border-color:#e6c98f;background:#fffaf0}
.lc-side-card--oro .lc-side-card__t{color:#8a5a05}
.lc-relacionadas__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media(max-width:1100px){.lc-relacionadas__grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.lc-relacionadas__grid{grid-template-columns:1fr}}
.lc-relacionadas .lc-post__titulo{font-size:1rem}
.lc-autor,.lc-prev-next{display:none}
html.lc-oscuro .lc-side-card--oro{background:#2a2210;border-color:#6b5320}
html.lc-oscuro .lc-side-card--oro .lc-side-card__t{color:#e8c98a}

/* ---------- 37. Señales, glosario y preguntas ---------- */
.lc-filtros{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 24px}
.lc-filtros a{padding:7px 14px;border:1px solid var(--lc-borde);border-radius:999px;font-size:14.5px;font-weight:600;text-decoration:none;color:var(--lc-tinta)}
.lc-rejilla-senales{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
@media(max-width:1100px){.lc-rejilla-senales{grid-template-columns:repeat(4,1fr)}}
@media(max-width:700px){.lc-rejilla-senales{grid-template-columns:repeat(2,1fr)}}
.lc-senal{background:var(--lc-superficie);border:1px solid var(--lc-borde);border-radius:14px;padding:14px;text-align:center;text-decoration:none;color:var(--lc-tinta)}
.lc-senal img{width:96px;height:96px;display:block;margin:0 auto 8px}
.lc-senal b{font-size:14.5px;line-height:1.3;display:block}
.lc-senal-sola .lc-senal-ficha{display:grid;grid-template-columns:320px minmax(0,1fr);gap:36px;align-items:start;margin-top:24px}
@media(max-width:820px){.lc-senal-sola .lc-senal-ficha{grid-template-columns:1fr;gap:20px}}
.lc-senal-ficha__img{background:var(--lc-superficie);border:1px solid var(--lc-borde);border-radius:18px;padding:28px;display:flex;justify-content:center}
.lc-senal-ficha__sig{font-size:18.5px;line-height:1.6}
.lc-senal-ficha__datos{list-style:none;padding:0;display:grid;gap:6px;font-size:15.5px;color:var(--lc-texto-suave)}
.lc-faq__caja{max-width:900px}
.lc-faq__i{background:var(--lc-superficie);border:1px solid var(--lc-borde);border-radius:12px;padding:4px 18px;margin-bottom:12px}
.lc-faq__i summary{cursor:pointer;font-size:17.5px;font-weight:600;padding:14px 0;list-style:none;display:flex;justify-content:space-between;gap:14px}
.lc-faq__i summary::-webkit-details-marker{display:none}
.lc-faq__i summary::after{content:"+";color:var(--lc-acento);font-size:22px;line-height:1}
.lc-faq__i[open] summary::after{content:"–"}
.lc-faq__r{padding:0 0 16px;font-size:17px;line-height:1.65;color:var(--lc-texto)}
.lc-letra{margin-top:28px}
.lc-letra h2{font-size:28px;color:var(--lc-acento);margin:0 0 10px;border-bottom:2px solid var(--lc-borde);padding-bottom:6px}
.lc-letra__lista{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media(max-width:820px){.lc-letra__lista{grid-template-columns:1fr}}
.lc-term{background:var(--lc-superficie);border:1px solid var(--lc-borde);border-radius:12px;padding:16px 18px}
.lc-term h3{margin:0 0 6px;font-size:17.5px}
.lc-term p{margin:0;font-size:16px;line-height:1.6;color:var(--lc-texto-suave)}
