/* ===== Sección CURSOS (?section=cursos): catálogo, ficha y Mis cursos  [21-10-2026] =====
   La carga sola `enqueue_assets()` (frontend-<seccion>.css, con time()). Mismo dibujo que el DEMO aprobado
   (_CURSOS/demo/demo.css). Colores en variables: el modo oscuro solo cambia las variables
   (.fgp-frontend-wrapper[data-tema="oscuro"]), así no hay que tocar la capa oscura general. */

.fgp-cursos {
    --c-azul: #2f9bff; --c-azul-o: #1f7fd6; --c-azul-s: #eef5ff; --c-texto: #1b2735; --c-gris: #5a6c7d; --c-gris-c: #6f7d8c;
    --c-fondo: #f5f7fa; --c-panel: #fff; --c-borde: #e5e9f0; --c-sombra: 0 4px 18px rgba(20, 40, 80, .06);
    --c-ok: #1e8a57; --c-ok-s: #e7f7ef; --c-aviso: #8a5a12; --c-aviso-s: #fff6e5; --c-rojo: #c43a3a; --c-rojo-s: #fdecec;
    max-width: 1240px; margin: 0 auto; padding: 26px 20px 60px; color: var(--c-texto); font-size: 15px; line-height: 1.5;
}
.fgp-frontend-wrapper[data-tema="oscuro"] .fgp-cursos {
    --c-azul: #58aefc; --c-azul-o: #8cc8ff; --c-azul-s: #16263a; --c-texto: #e6edf5; --c-gris: #a9b6c4; --c-gris-c: #93a1b0;
    --c-fondo: #0f1620; --c-panel: #17212d; --c-borde: #273445; --c-sombra: 0 4px 18px rgba(0, 0, 0, .35);
    --c-ok: #4fd18f; --c-ok-s: #14301f; --c-aviso: #f0c060; --c-aviso-s: #33280f; --c-rojo: #ff7b7b; --c-rojo-s: #3a1a1a;
}
.fgp-cursos *, .fgp-cursos *::before, .fgp-cursos *::after { box-sizing: border-box; }
.fgp-cursos a { color: var(--c-azul); }
.fgp-cursos .gris { color: var(--c-gris); }

/* botones */
.fgp-cursos-btn { border: 1px solid var(--c-borde); background: var(--c-panel); color: var(--c-texto); border-radius: 8px; padding: 7px 14px; font-weight: 600;
    font-size: 14px; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; gap: 6px; cursor: pointer; font-family: inherit; line-height: 1.3; }
.fgp-cursos-btn:hover, .fgp-cursos-btn:focus-visible { border-color: var(--c-azul); color: var(--c-azul); }
.fgp-cursos-btn.pri { background: var(--c-azul); border-color: var(--c-azul); color: #fff; }
.fgp-cursos-btn.pri:hover { background: var(--c-azul-o); color: #fff; }
.fgp-cursos-btn.ok { background: var(--c-ok); border-color: var(--c-ok); color: #fff; }
.fgp-cursos-btn.grande { padding: 12px 20px; font-size: 15px; border-radius: 10px; }
.fgp-cursos-btn[disabled] { opacity: .45; cursor: not-allowed; }

/* cabecera */
.fgp-cursos-titulo { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.fgp-cursos-titulo h1 { margin: 0; font-size: 28px; letter-spacing: -.3px; color: var(--c-texto); }
.fgp-cursos-titulo p { margin: 4px 0 0; color: var(--c-gris); }
.fgp-cursos-pestanas { display: flex; gap: 6px; flex-wrap: wrap; }
.fgp-cursos-pestanas a { padding: 8px 14px; border-radius: 999px; text-decoration: none; color: var(--c-gris); border: 1px solid var(--c-borde); background: var(--c-panel); font-weight: 600; font-size: 14px; }
.fgp-cursos-pestanas a.on { background: var(--c-texto); color: var(--c-panel); border-color: var(--c-texto); }
.fgp-cursos-franja { border-radius: 12px; padding: 12px 16px; margin-bottom: 18px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; border: 1px solid var(--c-borde); color: var(--c-texto); }
.fgp-cursos-franja.info { background: var(--c-azul-s); }
.fgp-cursos-franja.aviso { background: var(--c-aviso-s); }
.fgp-cursos-franja .esp { flex: 1; min-width: 200px; }

/* filtros */
.fgp-cursos-filtros { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 18px; }
.fgp-cursos-chips { display: flex; flex-wrap: wrap; gap: 8px; flex: 1; }
.fgp-cursos-chip { border: 1px solid var(--c-borde); background: var(--c-panel); color: var(--c-texto) !important; border-radius: 999px; padding: 6px 14px; font-size: 14px; text-decoration: none; }
.fgp-cursos-chip.on { background: var(--c-azul); border-color: var(--c-azul); color: #fff !important; }
/* [18.581] selector de idioma: franja propia a todo lo ancho, encima de las categorías, discreta (segmentos) */
.fgp-cursos-idiomas { flex: 0 0 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding-bottom: 10px; margin-bottom: 2px; border-bottom: 1px solid var(--c-borde); }
.fgp-cursos-idiomas-et { font-size: 16px; margin-right: 6px; opacity: .8; }
.fgp-cursos-idioma { color: var(--c-gris, var(--c-texto)) !important; text-decoration: none; font-size: 13px; font-weight: 600; padding: 5px 11px; border-radius: 8px; border: 1px solid transparent; }
.fgp-cursos-idioma:hover { border-color: var(--c-borde); }
.fgp-cursos-idioma.on { color: var(--c-azul) !important; border-color: var(--c-azul); background: rgba(47, 155, 255, .10); }
/* [18.581] las categorías en su fila (antes se partían en tres al compartirla con el idioma y el buscador); el buscador, debajo */
.fgp-cursos-filtros > .fgp-cursos-chips { flex: 1 1 100%; }
@media (max-width: 560px) { .fgp-cursos-filtros .fgp-cursos-buscar { flex: 1 1 100%; min-width: 0; } }
.fgp-cursos-buscar, .fgp-cursos-select { border: 1px solid var(--c-borde); background: var(--c-panel); color: var(--c-texto); border-radius: 10px; padding: 8px 12px; font: inherit; }
.fgp-cursos-buscar { min-width: 220px; }

/* tarjetas */
.fgp-cursos-rejilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 18px; }
.fgp-cursos-tarjeta { background: var(--c-panel); border: 1px solid var(--c-borde); border-radius: 14px; box-shadow: var(--c-sombra); overflow: hidden;
    display: flex; flex-direction: column; text-decoration: none; color: var(--c-texto) !important; transition: transform .15s, box-shadow .15s, border-color .15s; }
.fgp-cursos-tarjeta:hover, .fgp-cursos-tarjeta:focus-visible { transform: translateY(-2px); border-color: var(--c-azul); box-shadow: 0 10px 28px rgba(47, 155, 255, .16); }
.fgp-cursos-portada { aspect-ratio: 16 / 9; position: relative; overflow: hidden; background: #0e1116; }
.fgp-cursos-portada-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fgp-cursos-portada-gen { --fgp-acento: #f6dd00; position: absolute; inset: 0; padding: 18px 20px; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px;
    background: radial-gradient(circle at 88% 12%, rgba(255, 255, 255, .12) 0 22%, transparent 23%), linear-gradient(135deg, #0e1116, #1d2733); color: #fff; }
.fgp-cursos-portada-gen.cat-mecanica { background-image: radial-gradient(circle at 88% 12%, rgba(255,255,255,.12) 0 22%, transparent 23%), linear-gradient(135deg, #3d1f08, #b8611a); }
.fgp-cursos-portada-gen.cat-diagnosis { background-image: radial-gradient(circle at 88% 12%, rgba(255,255,255,.12) 0 22%, transparent 23%), linear-gradient(135deg, #072c26, #12806b); }
.fgp-cursos-portada-gen.cat-programacion-diesel { background-image: radial-gradient(circle at 88% 12%, rgba(255,255,255,.12) 0 22%, transparent 23%), linear-gradient(135deg, #0d1b2c, #2a74ad); }
.fgp-cursos-portada-gen.cat-programacion-gasolina { background-image: radial-gradient(circle at 88% 12%, rgba(255,255,255,.12) 0 22%, transparent 23%), linear-gradient(135deg, #2a0b0b, #b53a2e); }
.fgp-cursos-portada-gen .ico { position: absolute; right: 22px; top: 18px; font-size: 54px; line-height: 1; }
.fgp-cursos-portada-gen .marca { font-size: 11px; font-weight: 700; letter-spacing: 2px; color: var(--fgp-acento); }
.fgp-cursos-portada-gen .tit { font-size: 20px; font-weight: 800; line-height: 1.2; max-width: 78%; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.fgp-cursos-insignias { position: absolute; bottom: 10px; right: 10px; display: flex; gap: 6px; }
.fgp-cursos-ins { font-size: 11px; font-weight: 800; letter-spacing: .4px; text-transform: uppercase; border-radius: 6px; padding: 3px 7px; }
.fgp-cursos-ins.nuevo { background: #f6dd00; color: #1b1b1b; }
.fgp-cursos-ins.gratis { background: #1e8a57; color: #fff; }
.fgp-cursos-ins.tuyo { background: #fff; color: #1b2735; }
.fgp-cursos-tar-cuerpo { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.fgp-cursos-cat { font-size: 12px; font-weight: 700; color: var(--c-gris); text-transform: uppercase; letter-spacing: .5px; }
.fgp-cursos-tar-cuerpo h3 { margin: 0; font-size: 17px; line-height: 1.3; color: var(--c-texto); }
.fgp-cursos-resumen { color: var(--c-gris); font-size: 14px; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.fgp-cursos-meta { display: flex; flex-wrap: wrap; gap: 6px 12px; color: var(--c-gris-c); font-size: 13px; }
.fgp-cursos-pie { margin-top: auto; padding-top: 10px; border-top: 1px solid var(--c-borde); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.fgp-cursos-precio { font-size: 20px; font-weight: 800; color: var(--c-texto); }
.fgp-cursos-precio.gratis, .fgp-cursos-precio.tuyo { color: var(--c-ok); }
.fgp-cursos-candado { font-size: 13px; color: var(--c-gris); display: flex; gap: 6px; align-items: center; }
.fgp-cursos-vacio { text-align: center; color: var(--c-gris); padding: 50px 10px; }
.fgp-cursos-paginas { display: flex; gap: 6px; justify-content: center; margin-top: 22px; flex-wrap: wrap; }
.fgp-cursos-paginas a { min-width: 36px; text-align: center; padding: 6px 10px; border: 1px solid var(--c-borde); border-radius: 8px; text-decoration: none; color: var(--c-texto); background: var(--c-panel); }
.fgp-cursos-paginas a.on { background: var(--c-azul); border-color: var(--c-azul); color: #fff; }

/* ficha */
.fgp-cursos-migas { font-size: 13px; color: var(--c-gris); margin-bottom: 14px; }
.fgp-cursos-migas a { color: var(--c-gris); }
.fgp-cursos-ficha { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 26px; align-items: start; }
.fgp-cursos-ficha-hero { background: var(--c-panel); border: 1px solid var(--c-borde); border-radius: 16px; overflow: hidden; box-shadow: var(--c-sombra); }
.fgp-cursos-ficha-hero .fgp-cursos-portada { aspect-ratio: 16 / 7; }
.fgp-cursos-ficha-txt { padding: 20px 22px; }
.fgp-cursos-ficha-txt h1 { margin: 6px 0; font-size: 28px; line-height: 1.2; color: var(--c-texto); }
.fgp-cursos-ficha-txt .sub { color: var(--c-gris); margin: 0 0 12px; font-size: 16px; }
.fgp-cursos-stats { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.fgp-cursos-stats > div { background: var(--c-fondo); border: 1px solid var(--c-borde); border-radius: 10px; padding: 8px 12px; font-size: 13px; color: var(--c-gris); }
.fgp-cursos-stats b { display: block; color: var(--c-texto); font-size: 16px; }
.fgp-cursos-caja { background: var(--c-panel); border: 1px solid var(--c-borde); border-radius: 16px; padding: 20px; box-shadow: var(--c-sombra); position: sticky; top: 112px; }
.fgp-cursos-caja .fgp-cursos-precio { font-size: 32px; }
.fgp-cursos-caja ul { padding-left: 18px; color: var(--c-gris); font-size: 14px; margin: 14px 0 0; }
.fgp-cursos-caja .fgp-cursos-btn { width: 100%; margin-top: 10px; }
.fgp-cursos-bloqueo { background: var(--c-fondo); border: 1px dashed var(--c-borde); border-radius: 12px; padding: 14px; text-align: center; color: var(--c-gris); }
.fgp-cursos-bloqueo b { display: block; color: var(--c-texto); font-size: 16px; margin-bottom: 4px; }
.fgp-cursos-seccion { background: var(--c-panel); border: 1px solid var(--c-borde); border-radius: 16px; padding: 20px 22px; margin-top: 18px; box-shadow: var(--c-sombra); }
.fgp-cursos-seccion h2 { margin: 0 0 12px; font-size: 19px; color: var(--c-texto); }
.fgp-cursos-prosa { font-size: 15.5px; line-height: 1.65; }
.fgp-cursos-objetivos { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px 18px; padding: 0; margin: 0; list-style: none; }
.fgp-cursos-objetivos li { padding-left: 26px; position: relative; font-size: 14px; }
.fgp-cursos-objetivos li::before { content: "✓"; position: absolute; left: 0; color: var(--c-ok); font-weight: 800; }
.fgp-cursos-temario details { border: 1px solid var(--c-borde); border-radius: 12px; margin-bottom: 8px; background: var(--c-panel); }
.fgp-cursos-temario summary { padding: 12px 14px; cursor: pointer; font-weight: 700; display: flex; justify-content: space-between; gap: 10px; }
.fgp-cursos-temario summary span { color: var(--c-gris); font-weight: 500; font-size: 13px; white-space: nowrap; }
.fgp-cursos-temario ol { margin: 0; padding: 0 14px 10px; list-style: none; }
.fgp-cursos-temario li { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-top: 1px solid var(--c-borde); font-size: 14px; }
.fgp-cursos-temario li .t { flex: 1; }
.fgp-cursos-temario li .d { color: var(--c-gris-c); font-size: 13px; }
.fgp-cursos-muestra { background: var(--c-ok-s); color: var(--c-ok); font-size: 11px; font-weight: 800; border-radius: 6px; padding: 2px 6px; text-transform: uppercase; }
.fgp-cursos-presenta { width: 100%; aspect-ratio: 16 / 9; border-radius: 12px; background: #0b0f15; display: block; }

/* mis cursos */
.fgp-cursos-lista { display: grid; gap: 14px; }
.fgp-cursos-fila { display: grid; grid-template-columns: 220px minmax(0, 1fr) auto; gap: 18px; align-items: center; background: var(--c-panel); border: 1px solid var(--c-borde); border-radius: 14px; padding: 12px; box-shadow: var(--c-sombra); }
.fgp-cursos-fila .fgp-cursos-portada { border-radius: 10px; }
.fgp-cursos-fila .fgp-cursos-portada-gen { padding: 10px 12px; gap: 3px; }
.fgp-cursos-fila .fgp-cursos-portada-gen .ico { font-size: 30px; right: 12px; top: 10px; }
.fgp-cursos-fila .fgp-cursos-portada-gen .marca { font-size: 9px; letter-spacing: 1px; }
.fgp-cursos-fila .fgp-cursos-portada-gen .tit { font-size: 14px; max-width: 72%; -webkit-line-clamp: 2; }
.fgp-cursos-fila h3 { margin: 0 0 4px; font-size: 17px; color: var(--c-texto); }
.fgp-cursos-barra { height: 8px; background: var(--c-fondo); border: 1px solid var(--c-borde); border-radius: 999px; overflow: hidden; margin: 8px 0 4px; }
.fgp-cursos-barra i { display: block; height: 100%; background: linear-gradient(90deg, var(--c-azul), #7cc4ff); }
.fgp-cursos-estado { font-size: 12px; font-weight: 800; border-radius: 6px; padding: 3px 8px; display: inline-block; }
.fgp-cursos-estado.pend { background: var(--c-aviso-s); color: var(--c-aviso); }

/* compra */
.fgp-cursos-velo { position: fixed; inset: 0; background: rgba(10, 16, 24, .55); z-index: 100000; display: grid; place-items: center; padding: 16px; }
.fgp-cursos-modal { background: var(--c-panel); color: var(--c-texto); border-radius: 16px; width: 100%; max-width: 480px; padding: 22px; box-shadow: 0 20px 60px rgba(0,0,0,.3); }
.fgp-cursos-modal h3 { margin: 0 0 4px; color: var(--c-texto); }
.fgp-cursos-modal .total { display: flex; justify-content: space-between; align-items: baseline; background: var(--c-fondo); border-radius: 12px; padding: 12px 14px; margin: 14px 0; }
.fgp-cursos-modal label.cons { display: flex; gap: 10px; font-size: 13px; color: var(--c-gris); align-items: flex-start; margin-bottom: 12px; }
.fgp-cursos-modal .fgp-cursos-btn { width: 100%; margin-top: 8px; }
.fgp-cursos-modal .error { color: var(--c-rojo); font-size: 14px; margin-top: 8px; }
.fgp-cursos-toast { position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%); background: #1b2735; color: #fff; padding: 12px 18px; border-radius: 12px; z-index: 100001; box-shadow: 0 10px 30px rgba(0,0,0,.3); font-size: 14px; max-width: 92vw; }

@media (max-width: 960px) {
    .fgp-cursos-ficha { grid-template-columns: 1fr; }
    .fgp-cursos-caja { position: static; }
    .fgp-cursos-fila { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .fgp-cursos { padding: 18px 14px 50px; }
    .fgp-cursos-titulo h1 { font-size: 23px; }
    .fgp-cursos-buscar { min-width: 0; flex: 1; }
}

/* ===== ESCAPARATE (la presentación del modo de fábrica, templates/frontend/cursos/escaparate.php)  [22-10-2026] =====
   Maqueta C elegida por el taller. Solo variables --c-*: el modo oscuro sale solo. La cabecera va sobre fondo oscuro fijo
   con texto claro (igual que las portadas de los cursos), así se ve igual en claro y en oscuro. Sin JS ni recursos externos. */

.fgp-cursos-escaparate { max-width: 1120px; }
.fgp-cursos-escaparate h2,
.fgp-cursos-escaparate h3 { color: var(--c-texto); }
.fgp-cursos-escaparate .esc-nota a { color: var(--c-texto); font-weight: 700; text-decoration: underline; text-decoration-color: var(--c-azul); text-underline-offset: 3px; }

/* el botón principal: azul oscuro del tema mezclado con un 20 % del color del texto. En claro sale ≈#1e6db6 (blanco encima
   ≈5,3:1, AA); en oscuro se aclara (≈#9ecffd con el fondo de panel encima, >9:1). La primera línea es el respaldo sin color-mix. */
.fgp-cursos-escaparate .fgp-cursos-btn.pri,
.fgp-cursos-escaparate .fgp-cursos-btn.pri:hover,
.fgp-cursos-escaparate .fgp-cursos-btn.pri:focus-visible {
    background: var(--c-azul-o); border-color: var(--c-azul-o);
    background: color-mix(in srgb, var(--c-azul-o) 80%, var(--c-texto)); border-color: color-mix(in srgb, var(--c-azul-o) 80%, var(--c-texto));
    color: var(--c-panel);
}
.fgp-cursos-escaparate .fgp-cursos-btn.pri:hover,
.fgp-cursos-escaparate .fgp-cursos-btn.pri:focus-visible { box-shadow: 0 0 0 3px var(--c-azul-s), 0 0 0 5px var(--c-azul); }
.fgp-cursos-escaparate .fgp-cursos-btn.grande { text-align: center; }
/* los botones secundarios que son enlaces heredan el azul claro de «.fgp-cursos a»: en texto oscuro se leen mejor */
.fgp-cursos-escaparate a.fgp-cursos-btn:not(.pri) { color: var(--c-texto); }
.fgp-cursos-escaparate a.fgp-cursos-btn:not(.pri):hover,
.fgp-cursos-escaparate a.fgp-cursos-btn:not(.pri):focus-visible { color: var(--c-azul-o); border-color: var(--c-azul); }

/* ---------- cabecera ---------- */
.fgp-cursos-escaparate .esc-cab {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 24px;
    padding: 30px 34px; margin-bottom: 18px; border-radius: 16px; border: 1px solid var(--c-borde); box-shadow: var(--c-sombra); overflow: hidden;
    background: radial-gradient(circle at 92% 8%, rgba(246, 221, 0, .13) 0 17%, transparent 18%), linear-gradient(135deg, #0e1116, #1d2733);
    color: #c9d3de;
}
.fgp-cursos-escaparate .esc-cab-txt { min-width: 0; }
.fgp-cursos-escaparate .esc-marca { display: block; font-size: 11px; font-weight: 700; letter-spacing: 2px; color: #f6dd00; }
.fgp-cursos-escaparate .esc-estado {
    display: inline-flex; align-items: center; gap: 8px; margin-top: 12px; padding: 4px 11px 4px 9px; border-radius: 999px;
    background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .18); color: #fff;
    font-size: 12px; font-weight: 800; letter-spacing: .6px; text-transform: uppercase;
}
.fgp-cursos-escaparate .esc-estado i { width: 9px; height: 9px; border-radius: 50%; background: #f6dd00; box-shadow: 0 0 0 4px rgba(246, 221, 0, .22); }
.fgp-cursos-escaparate .esc-cab h1 { margin: 10px 0 8px; font-size: 32px; line-height: 1.15; letter-spacing: -.4px; color: #fff; }
.fgp-cursos-escaparate .esc-cab p { margin: 0; max-width: 56ch; font-size: 16px; color: #c9d3de; }
.fgp-cursos-escaparate .esc-ilus { display: block; width: 210px; max-width: 100%; height: auto; }

/* ---------- bloque destacado: dónde saldrán + categorías (lista estática) ---------- */
.fgp-cursos-escaparate .esc-destacado {
    background: var(--c-panel); border: 1px solid var(--c-borde); border-top: 4px solid var(--c-azul); border-radius: 16px;
    box-shadow: var(--c-sombra); padding: 22px 24px 24px; margin-bottom: 28px;
}
.fgp-cursos-escaparate .esc-destacado-cab { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 18px; }
.fgp-cursos-escaparate .esc-insignia {
    flex: none; width: 46px; height: 46px; border-radius: 50%; background: var(--c-azul-s); border: 1px solid var(--c-borde);
    display: grid; place-items: center; font-size: 22px; line-height: 1;
}
.fgp-cursos-escaparate .esc-destacado h2 { margin: 2px 0 4px; font-size: 22px; line-height: 1.25; }
.fgp-cursos-escaparate .esc-destacado-cab p { margin: 0; color: var(--c-gris); }

/* categorías: lista estática (no se pulsan), por eso sin cursor de mano ni efecto al pasar */
.fgp-cursos-escaparate .esc-chips {
    list-style: none; margin: 0; padding: 0;
    display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); gap: 10px;
}
.fgp-cursos-escaparate .esc-chip {
    display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 10px 16px 10px 12px;
    border: 1px solid var(--c-borde); border-radius: 999px; background: var(--c-azul-s); color: var(--c-texto);
    font-size: 15px; font-weight: 600; line-height: 1.25;
}
.fgp-cursos-escaparate .esc-chip .ico { flex: none; font-size: 18px; line-height: 1; }

.fgp-cursos-escaparate .esc-accion { display: grid; gap: 12px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--c-borde); }
.fgp-cursos-escaparate .esc-con-cuenta,
.fgp-cursos-escaparate .esc-sin-cuenta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; }
.fgp-cursos-escaparate .esc-nota { color: var(--c-gris); font-size: 14px; }

/* ---------- qué vas a encontrar ---------- */
.fgp-cursos-escaparate .esc-ventajas > h2 { margin: 0 0 14px; font-size: 22px; line-height: 1.25; }
.fgp-cursos-escaparate .esc-rejilla {
    list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 16px;
}
.fgp-cursos-escaparate .esc-ventaja {
    display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 4px 14px; align-content: start;
    background: var(--c-panel); border: 1px solid var(--c-borde); border-radius: 14px; padding: 18px; box-shadow: var(--c-sombra);
}
.fgp-cursos-escaparate .esc-ico {
    grid-row: span 2; width: 44px; height: 44px; border-radius: 12px; background: var(--c-azul-s);
    display: grid; place-items: center; font-size: 22px; line-height: 1;
}
.fgp-cursos-escaparate .esc-ventaja h3 { margin: 0; font-size: 16px; line-height: 1.3; }
.fgp-cursos-escaparate .esc-ventaja p { margin: 0; color: var(--c-gris); font-size: 14px; }

/* ---------- cierre ---------- */
.fgp-cursos-escaparate .esc-cierre { margin: 26px 0 0; }
/* [18.576] la franja del dueño / probadores (solo ellos la ven) */
.fgp-cursos-escaparate .esc-dueno { margin-bottom: 18px; }

/* ---------- móvil ---------- */
@media (max-width: 720px) {
    .fgp-cursos-escaparate .esc-cab { grid-template-columns: minmax(0, 1fr); padding: 24px 20px; }
    .fgp-cursos-escaparate .esc-ilus { display: none; }
    .fgp-cursos-escaparate .esc-cab h1 { font-size: 26px; }
    .fgp-cursos-escaparate .esc-cab p { font-size: 15px; }
    .fgp-cursos-escaparate .esc-destacado { padding: 18px 16px 20px; }
    .fgp-cursos-escaparate .esc-destacado h2,
    .fgp-cursos-escaparate .esc-ventajas > h2 { font-size: 20px; }
}
@media (max-width: 480px) {
    .fgp-cursos-escaparate .esc-insignia { width: 40px; height: 40px; font-size: 19px; }
    .fgp-cursos-escaparate .esc-accion .fgp-cursos-btn.grande { flex: 1 1 100%; }
    .fgp-cursos-escaparate .esc-cierre .fgp-cursos-btn { flex: 1 1 auto; }
    .fgp-cursos-escaparate .esc-ventaja { padding: 16px; }
}