/* =====================================================================
   CERTICOM · estilos propios
   Se carga DESPUÉS de /praxis/assets/praxis.css: reutiliza su sistema
   de diseño (colores, tarjetas, botones, panel, "celular") y solo
   agrega lo que PRAXIS no tiene.
   ===================================================================== */

/* ---------- Tarjetas de módulos (panel del estudiante) ---------- */
.cx-modulos { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: .9rem; margin-bottom: 1.6rem; }
.cx-mod {
  display: flex; gap: .85rem; align-items: flex-start; width: 100%; padding: 1rem 1.1rem; text-align: left;
  background: var(--px-superficie); color: var(--px-texto);
  border: 1.5px solid rgba(var(--px-celeste, 58, 168, 240), .45); border-radius: 18px; cursor: pointer;
  transition: border-color .2s, transform .2s, box-shadow .2s;
}
.cx-mod:hover { border-color: rgba(var(--px-celeste, 58, 168, 240), .95); transform: translateY(-2px); }
.cx-mod.activo { border-color: var(--px-dorado); box-shadow: 0 0 0 3px rgba(240, 180, 41, .18); }
.cx-mod-icono { display: grid; place-items: center; flex: none; width: 42px; height: 42px; border-radius: 12px; background: var(--px-fondo); color: var(--px-dorado); font-size: 1.2rem; }
.cx-mod-cuerpo { display: flex; flex-direction: column; gap: .3rem; min-width: 0; flex: 1; }
.cx-mod-nombre { font-family: var(--px-fuente-titulo); font-size: .98rem; line-height: 1.3; color: var(--px-titulo); }
.cx-mod-meta { font-size: .74rem; color: var(--px-texto-tenue); }
.cx-mod-estado { margin-top: .15rem; }
.cx-barra { display: block; height: 6px; border-radius: 999px; background: var(--px-fondo); overflow: hidden; margin-top: .2rem; }
.cx-barra span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--px-verde), #6fe0a6); transition: width .4s; }

/* ---------- Validación curso por curso ---------- */
.cx-val { display: inline-flex; align-items: center; gap: .35rem; padding: .15rem .6rem; border-radius: 999px; font-size: .72rem; font-weight: 700; white-space: nowrap; }
.cx-val::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.cx-val-pendiente { color: #f0b429; background: rgba(240, 180, 41, .13); }
.cx-val-aprobado { color: #2fb873; background: rgba(47, 184, 115, .14); }
.cx-val-observado { color: #ff8a84; background: rgba(224, 86, 79, .14); }
.cx-nota { width: 90px; padding: .3rem .5rem; text-align: center; }
.cx-total td { font-weight: 700; color: var(--px-dorado); border-top: 1px solid var(--px-borde); }

/* ---------- Ventanas (coordinación), igual que en PRAXIS ---------- */
.modal-content { background: var(--px-superficie); color: var(--px-texto); border: 1px solid var(--px-borde); }
.modal-header, .modal-footer { border-color: var(--px-borde) !important; }
.btn-close { filter: invert(1); }
.px-resultado { display: flex; align-items: center; gap: .5rem; min-height: 38px; padding: .45rem .8rem; border-radius: 10px; border: 1px solid var(--px-borde); background: var(--px-fondo-alto); font-weight: 600; font-size: .9rem; color: var(--px-texto-tenue); }
.px-resultado.ok { color: #6fe0a6; border-color: rgba(47, 184, 115, .45); background: rgba(47, 184, 115, .1); }
.px-resultado.no { color: #ff8a84; border-color: rgba(224, 86, 79, .45); background: rgba(224, 86, 79, .1); }
.px-res { display: inline-flex; align-items: center; gap: .25rem; margin-left: .4rem; padding: .12rem .55rem; border-radius: 999px; font-size: .7rem; font-weight: 700; vertical-align: middle; }
.px-res.ok { color: #6fe0a6; background: rgba(47, 184, 115, .15); border: 1px solid rgba(47, 184, 115, .4); }
.px-res.no { color: #ff8a84; background: rgba(224, 86, 79, .15); border: 1px solid rgba(224, 86, 79, .4); }
.px-jur-fila { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; padding: .4rem 0; border-top: 1px solid var(--px-borde); font-size: .85rem; }
.px-jur-fila:first-child { border-top: 0; }
.px-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.px-chip { padding: .3rem .85rem; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .25); background: transparent; color: var(--px-texto); font-size: .8rem; cursor: pointer; }
.px-chip.activo { background: var(--px-dorado); border-color: var(--px-dorado); color: #1a1300; font-weight: 700; }
.px-interruptor { position: relative; width: 38px; height: 22px; border-radius: 999px; background: rgba(255, 255, 255, .18); border: 0; padding: 0; cursor: pointer; transition: .2s; }
.px-interruptor::after { content: ""; position: absolute; left: 3px; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: .2s; }
.px-interruptor.on { background: var(--px-verde); }
.px-interruptor.on::after { left: 19px; }

/* Selector compacto de validación dentro de tablas */
.cx-sel { width: auto; padding: .25rem .5rem; font-size: .8rem; }
.cx-sel.v-aprobado { border-color: rgba(47, 184, 115, .7); color: #6fe0a6; }
.cx-sel.v-observado { border-color: rgba(224, 86, 79, .7); color: #ff8a84; }

/* Catálogo de módulos (coordinación) */
.cx-cat-mod { margin-bottom: 1rem; }
.cx-cat-mod h3 { font-size: 1rem; margin: 0 0 .2rem; }

/* =====================================================================
   TEMA CERTICOM · azul UNAP claro + oro (mismo diseño que la portada)
   Sobrescribe las variables de PRAXIS solo en las páginas de CERTICOM.
   ===================================================================== */
:root {
  --az-50: #eef3fb; --az-100: #d8e3f5; --az-200: #b2c7eb; --az-300: #83a2dc; --az-400: #557cc6;
  --az-500: #3560ab; --az-600: #264b8c; --az-700: #1b3b72; --az-800: #0f2a5c; --az-900: #0b1f45; --az-950: #06132c;
  --or-100: #f5e9cf; --or-200: #ecd5a3; --or-300: #dfba70; --or-400: #cc9d47; --or-500: #b3812f; --or-600: #956a25;
  --oc-300: #f4a763;
  --f-titulo: "Montserrat", system-ui, sans-serif;
  --f-serif: "Source Serif 4", Georgia, serif;

  --px-fondo: rgba(6, 19, 44, .30);
  --px-fondo-alto: rgba(255, 255, 255, .08);
  --px-superficie: rgba(255, 255, 255, .09);
  --px-superficie-alta: rgba(255, 255, 255, .14);
  --px-borde: rgba(255, 255, 255, .18);
  --px-dorado: #dfba70;
  --px-dorado-oscuro: #b3812f;
  --px-texto: #eef2fa;
  --px-texto-tenue: #c9d5ee;
  --px-fuente-titulo: "Montserrat", system-ui, sans-serif;
}
.px-tema-celeste { --px-celeste: 255, 255, 255; }

body.px-body {
  background:
    radial-gradient(900px 600px at 78% 4%, rgba(178, 199, 235, .45), transparent 60%),
    radial-gradient(700px 520px at 4% 96%, rgba(131, 162, 220, .35), transparent 62%),
    linear-gradient(160deg, var(--az-500), var(--az-700));
  background-attachment: fixed;
  background-color: var(--az-600);
}
h1, h2, h3, h4 { letter-spacing: -.005em; }
a { color: var(--or-200); }
a:hover { color: var(--or-100); }

/* Botones en oro */
.btn-px { background: linear-gradient(180deg, var(--or-400), var(--or-600)); border: 0; color: #fff; font-family: var(--f-titulo); font-weight: 600; box-shadow: 0 8px 22px -10px rgba(179, 129, 47, .9); }
.btn-px:hover, .btn-px:focus, .btn-px:active { background: linear-gradient(180deg, var(--or-300), var(--or-500)) !important; color: #fff !important; }
.btn-px-outline { border-color: rgba(255, 255, 255, .45); color: #fff; }
.btn-px-outline:hover { background: rgba(255, 255, 255, .14); border-color: #fff; color: #fff; }
.btn-px-ghost { color: var(--az-50); }

/* Superficies: vidrio claro; ventanas y menús, sólidos para que se lean */
.px-card, .px-doc { background: linear-gradient(180deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .06)); }
.px-tema-celeste .px-card, .px-tema-celeste .px-doc { border: 1px solid rgba(255, 255, 255, .22); }
.px-tema-celeste .px-doc:hover { border-color: rgba(255, 255, 255, .5); }
.modal-content, .px-visor-caja, .px-confirmar-caja, .dropdown-menu { background: #1f4686; }
.px-form-control, select.px-form-control, input.px-form-control { background: rgba(6, 19, 44, .32); border-color: rgba(255, 255, 255, .22); color: #fff; }
.px-form-control:focus { background: rgba(6, 19, 44, .42); border-color: var(--or-300); box-shadow: 0 0 0 3px rgba(223, 186, 112, .2); color: #fff; }
.px-form-control option { background: #1f4686; color: #fff; }
.px-tabla th { background: rgba(255, 255, 255, .08); color: var(--az-100); font-family: var(--f-titulo); }
.px-tabla tr:hover td { background: rgba(255, 255, 255, .05); }
.px-celular-cuerpo, .px-tema-celeste .px-celular-cuerpo { background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .24); border-radius: 22px; box-shadow: none; }
.px-celular-pantalla { background: rgba(6, 19, 44, .22); border-radius: 16px; }
.px-notif { border-color: rgba(255, 255, 255, .22); }
.px-notif.nueva { background: rgba(179, 129, 47, .16); border-color: rgba(223, 186, 112, .7); }
.px-stepper li.actual::before { box-shadow: 0 0 0 4px rgba(223, 186, 112, .25); }
.px-usuario { background: rgba(255, 255, 255, .1); }
.px-tema-celeste .px-usuario { border: 1px solid rgba(255, 255, 255, .28); }
.px-usuario-avatar { background: linear-gradient(180deg, var(--or-300), var(--or-500)); color: #fff; }
.px-badge-en_revision, .px-badge-pendiente, .px-badge-plan_enviado, .px-badge-informe_enviado, .px-badge-evaluado { background: rgba(223, 186, 112, .2); color: var(--or-200); }

/* Barra lateral y superior de PRAXIS (coordinación, perfil) en vidrio claro */
.px-sidebar, .px-topbar { background: rgba(15, 42, 92, .35); backdrop-filter: blur(10px); }
.px-tema-celeste .px-sidebar { border-right: 1px solid rgba(255, 255, 255, .2); }
.px-tema-celeste .px-topbar { border-bottom: 1px solid rgba(255, 255, 255, .2); }
.px-sidebar .px-marca-wrap img { height: 40px; }
.px-marca-praxis { font-family: var(--f-titulo); font-weight: 800; letter-spacing: .06em; }
.px-nav a { border: 1px solid transparent; font-family: var(--f-titulo); font-size: .86rem; font-weight: 600; }
.px-nav a i { display: grid; place-items: center; width: 34px; height: 34px; flex: none; border-radius: 9px; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .24); color: var(--az-50); font-size: 1.05rem; }
.px-nav a:hover { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .22); }
.px-nav a.activo { background: rgba(179, 129, 47, .22); border-color: var(--or-300); color: #fff; }
.px-nav a.activo i { color: var(--or-200); background: rgba(179, 129, 47, .28); border-color: rgba(223, 186, 112, .7); }
.px-nav a.activo .px-nav-contador { background: var(--or-500); color: #fff; }
.px-nav-movil { background: #1f4686 !important; }
.px-nav-movil a.activo { color: var(--or-200); }

/* ---------- Panel del estudiante (estructura del diseño aprobado) ---------- */
.cx-marco { max-width: 1280px; margin: 0 auto; }
@media (min-width: 992px) {
  .cx-marco { margin: 24px auto; border: 1px solid rgba(255, 255, 255, .24); border-radius: 22px; background: rgba(255, 255, 255, .07); box-shadow: 0 40px 100px -40px rgba(6, 19, 44, .55); }
}
.cx-appbar { display: flex; align-items: center; gap: .9rem; padding: 14px 22px; border-bottom: 1px solid rgba(255, 255, 255, .18); }
.cx-logo { display: flex; align-items: center; gap: .6rem; font: 800 1.05rem var(--f-titulo); letter-spacing: .06em; color: #fff; }
.cx-logo:hover { color: #fff; }
.cx-logo img { width: 46px; }
.cx-logo b span { color: var(--or-300); }
.cx-segm { display: flex; gap: 2px; margin: 0 auto; padding: 4px; border-radius: 12px; border: 1px solid rgba(255, 255, 255, .22); background: rgba(255, 255, 255, .08); }
.cx-segm a { display: inline-flex; align-items: center; gap: .4rem; padding: .45rem .9rem; border-radius: 9px; font: 600 .78rem var(--f-titulo); color: #d3dcf0; }
.cx-segm a:hover { color: #fff; }
.cx-segm a.on { background: rgba(255, 255, 255, .2); color: #fff; }
.cx-segm i { font-size: 1.05rem; }
.cx-estado { display: flex; align-items: center; gap: .4rem; font-size: .8rem; color: #c9d5ee; }
.cx-estado i { font-size: 1.05rem; }
.cx-ico { display: grid; place-items: center; flex: none; width: 38px; height: 38px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .24); background: transparent; color: #d3dcef; position: relative; cursor: pointer; }
.cx-ico:hover { border-color: rgba(255, 255, 255, .6); color: #fff; }
.cx-ico i { font-size: 1.15rem; }
.cx-ico .px-punto { position: absolute; top: 7px; right: 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--oc-300); }
.cx-boton-borde { padding: .55rem 1.1rem; border-radius: 9px; border: 1px solid rgba(255, 255, 255, .4); color: #fff; font: 600 .82rem var(--f-titulo); }
.cx-boton-borde:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.cx-appbar .px-usuario { padding-right: .9rem; }

.cx-cuerpo { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 22px; padding: 22px; }
.cx-lateral { padding: 18px 14px; border-radius: 18px; border: 1px solid rgba(255, 255, 255, .22); background: linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .06)); align-self: start; position: sticky; top: 18px; }
.cx-lateral h3 { margin: 4px 6px 2px; font: 700 .82rem var(--f-titulo); letter-spacing: .1em; text-transform: uppercase; color: #fff; }
.cx-lateral > p { margin: 0 6px 16px; font-size: .78rem; color: #c9d5ee; }
.cx-separa { margin: 14px 6px 10px; font: 600 .66rem var(--f-titulo); letter-spacing: .14em; text-transform: uppercase; color: #b7c6e6; }

/* Fichas (módulos y accesos) */
.cx-lateral .cx-modulos { display: block; margin: 0; }
.cx-ficha, .cx-lateral .cx-mod { display: flex; align-items: center; gap: .8rem; width: 100%; padding: 10px; margin-bottom: 9px; border-radius: 12px; border: 1px solid rgba(255, 255, 255, .18); background: rgba(255, 255, 255, .08); color: #f2f5fb; text-align: left; cursor: pointer; transition: .2s; box-shadow: none; transform: none; }
.cx-ficha:hover, .cx-lateral .cx-mod:hover { border-color: rgba(255, 255, 255, .5); background: rgba(255, 255, 255, .12); color: #fff; transform: none; }
.cx-lateral .cx-mod.activo { border-color: var(--or-300); background: rgba(179, 129, 47, .18); box-shadow: none; }
.cx-ficha .cuadro, .cx-lateral .cx-mod-icono { display: grid; place-items: center; flex: none; width: 46px; height: 46px; border-radius: 10px; background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .28); color: var(--az-50); font-size: 1.35rem; }
.cx-lateral .cx-mod.activo .cx-mod-icono { color: var(--or-200); border-color: rgba(223, 186, 112, .7); background: rgba(179, 129, 47, .25); }
.cx-ficha b, .cx-lateral .cx-mod-nombre { display: block; font: 600 .84rem/1.25 var(--f-titulo); color: #f2f5fb; }
.cx-lateral .cx-mod-meta { font-size: .7rem; color: #c9d5ee; }
.cx-lateral .cx-mod-cuerpo { gap: .2rem; }
.cx-lateral .cx-mod-estado .px-badge { font-size: .66rem; }
.cx-lateral .cx-mod .cx-barra { height: 4px; margin-top: 4px; background: rgba(255, 255, 255, .1); }
.cx-barra span { background: linear-gradient(90deg, var(--or-500), var(--oc-300)); }

/* Lienzo */
.cx-lienzo { position: relative; min-width: 0; padding: 34px 36px; border-radius: 18px; border: 1px solid rgba(255, 255, 255, .22);
  background:
    linear-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px) 0 0 / 100% 64px,
    linear-gradient(90deg, rgba(255, 255, 255, .07) 1px, transparent 1px) 0 0 / 64px 100%,
    radial-gradient(600px 400px at 85% 20%, rgba(178, 199, 235, .25), transparent 60%),
    rgba(255, 255, 255, .06); }

.cx-hero { display: grid; grid-template-columns: 1.1fr .9fr; gap: 1.5rem; align-items: center; }
.cx-pildora { display: inline-flex; align-items: center; gap: .45rem; padding: .3rem .75rem; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .22); background: rgba(255, 255, 255, .08); font: 600 .72rem var(--f-titulo); color: #e8edf7; }
.cx-pildora i { width: 7px; height: 7px; border-radius: 50%; background: var(--oc-300); box-shadow: 0 0 10px var(--oc-300); }
.cx-pildora.ok i { background: #6fe0a6; box-shadow: 0 0 10px #6fe0a6; }
.cx-hero h1 { margin: 1rem 0 .8rem; font: 700 clamp(1.7rem, 3.2vw, 2.5rem)/1.12 var(--f-titulo); color: #fff; letter-spacing: -.01em; }
.cx-hero h1 em { font-style: normal; color: var(--or-300); }
.cx-hero p { margin: 0 0 1.4rem; color: #e1e8f6; max-width: 480px; }
.cx-hero .acc { display: flex; flex-wrap: wrap; align-items: center; gap: 1.1rem; }
.cx-hero .acc .enlace { font: 600 .86rem var(--f-titulo); color: #fff; }
.cx-hero .acc .enlace:hover { color: var(--or-200); }
.cx-ilus { position: relative; height: 270px; }
.cx-cert { position: absolute; inset: 20px 30px 30px 40px; padding: 22px 24px; border-radius: 14px; background: linear-gradient(160deg, #fdfbf6, #efe6d2); color: var(--az-800); transform: rotate(-5deg); box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .55), 0 0 0 8px rgba(38, 75, 140, .35); }
.cx-cert .t { font: 700 1.2rem var(--f-serif); letter-spacing: .06em; text-align: center; color: var(--az-800); }
.cx-cert .s { font: 700 .55rem var(--f-titulo); letter-spacing: .16em; text-align: center; color: var(--or-500); text-transform: uppercase; }
.cx-cert .n { margin: 14px auto 6px; width: 80%; font: 700 .72rem var(--f-titulo); text-align: center; color: var(--az-800); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cx-cert .l { margin: 6px auto; width: 82%; height: 5px; border-radius: 3px; background: #d6dbe4; }
.cx-cert .pie { position: absolute; left: 22px; right: 22px; bottom: 18px; display: flex; justify-content: space-between; align-items: flex-end; }
.cx-cert .firma { width: 70px; border-top: 1px solid #9aa3b5; }
.cx-qr { width: 46px; height: 46px; background: conic-gradient(var(--az-800) 25%, transparent 0 50%, var(--az-800) 0 75%, transparent 0) 0 0 / 9px 9px; border: 3px solid var(--az-800); }
.cx-sello { position: absolute; right: 6px; top: 0; display: grid; place-items: center; width: 74px; height: 74px; border-radius: 50%; background: var(--or-500); color: #fff; font-size: 2rem; box-shadow: 0 12px 30px -8px rgba(179, 129, 47, .9); transform: rotate(8deg); }
.cx-arco { position: absolute; border: 2px dashed var(--or-300); border-color: var(--or-300) transparent transparent transparent; border-radius: 50%; }

.cx-siguiente { display: grid; grid-template-columns: 240px 1fr; gap: 1.2rem; margin: 2rem 0 1.4rem; }
.cx-pieza { display: flex; align-items: center; gap: .8rem; padding: 14px 16px; border-radius: 12px; border: 1.5px solid var(--az-200); background: rgba(255, 255, 255, .12); color: #fff; font: 600 .9rem var(--f-titulo); box-shadow: 0 16px 30px -18px rgba(85, 124, 198, .9); }
.cx-pieza .cuadro { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 9px; background: rgba(255, 255, 255, .14); color: var(--az-50); font-size: 1.15rem; }
.cx-hueco { display: flex; align-items: center; justify-content: center; gap: .6rem; padding: 12px 16px; border-radius: 12px; border: 1.5px dashed rgba(255, 255, 255, .45); color: #d3dcf0; font-size: .88rem; text-align: center; }
.cx-hueco b { color: #fff; font-family: var(--f-titulo); }

.cx-tarjetas { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid rgba(255, 255, 255, .2); border-radius: 14px; background: rgba(255, 255, 255, .08); }
.cx-tarjetas > div { padding: 1.4rem 1.5rem; border-right: 1px solid rgba(255, 255, 255, .15); min-width: 0; }
.cx-tarjetas > div:last-child { border-right: 0; }
.cx-circ { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .4); color: var(--az-50); font-size: 1.45rem; margin-bottom: .9rem; }
.cx-circ.ac { border-color: var(--or-300); color: var(--or-200); }
.cx-tarjetas h3 { margin: 0 0 .3rem; font: 600 1rem var(--f-titulo); color: #fff; }
.cx-tarjetas p { margin: 0; font-size: .82rem; color: #d6dff2; }
.cx-tarjetas .num { font: 700 1.2rem var(--f-titulo); color: var(--or-300); }

.cx-seccion { margin-top: 2.2rem; }
.cx-seccion > h2, .px-docs-cab h2 { font: 700 1.15rem var(--f-titulo); color: #fff; }
.cx-info { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 1.2rem; align-items: stretch; }
.cx-info .px-card { margin-bottom: 0; }
.cx-info .dato { margin: 0 0 .15rem; font-size: .74rem; color: #c9d5ee; }
.cx-notif { margin-top: 2.2rem; }
.cx-notif-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: .7rem; }
.cx-notif-lista .px-celular-vacio { grid-column: 1 / -1; border: 1px dashed rgba(255, 255, 255, .3); border-radius: 14px; }

@media (max-width: 991.98px) {
  .cx-cuerpo { grid-template-columns: 1fr; padding: 14px 12px 90px; gap: 14px; }
  .cx-lateral { position: static; }
  .cx-segm, .cx-estado, .cx-appbar .cx-boton-borde, .cx-appbar .px-usuario-datos { display: none; }
  .cx-appbar { padding: 12px 14px; }
  .cx-logo { margin-right: auto; }
  .cx-lienzo { padding: 22px 18px; }
  .cx-hero, .cx-siguiente, .cx-tarjetas, .cx-info { grid-template-columns: 1fr; }
  .cx-ilus { display: none; }
  .cx-tarjetas > div { border-right: 0; border-bottom: 1px solid rgba(255, 255, 255, .15); }
  .cx-tarjetas > div:last-child { border-bottom: 0; }
}
.px-docs-cab h2, .px-seg-titulo h3 { border-bottom-color: var(--or-300); }
.px-stat { background: linear-gradient(180deg, rgba(255, 255, 255, .13), rgba(255, 255, 255, .06)); }
.px-tema-celeste .px-stat { border: 1px solid rgba(255, 255, 255, .22); }
.px-stat .px-stat-icono { background: rgba(255, 255, 255, .14) !important; border: 1px solid rgba(255, 255, 255, .28); color: var(--or-200) !important; }
.px-header-publico { background: rgba(15, 42, 92, .55); border-bottom-color: rgba(255, 255, 255, .2); }
code { color: var(--or-200); }
@media (max-width: 991.98px) { .cx-lateral .cx-separa, .cx-lateral > .cx-ficha { display: none; } .cx-lateral { padding: 14px 10px 6px; } }