:root {
  --tinta: #0f1f33;
  --tinta-2: #44546a;
  --azul: #13407c;
  --azul-hondo: #0b2748;
  --acento: #e9682b;
  --acento-hondo: #c8531c;
  --verde: #127a55;
  --rojo: #b3261e;
  --fondo: #f6f8fb;
  --suave: #edf2f8;
  --linea: #dbe3ee;
  --blanco: #fff;
  --radio: 14px;
  --sombra: 0 1px 2px rgba(15, 31, 51, .06), 0 6px 20px rgba(15, 31, 51, .05);
}

body { background: var(--fondo); color: var(--tinta); font-family: Inter, system-ui, sans-serif; display: flex; flex-direction: column; min-height: 100vh; }
main { flex: 1; }
h1, h2, h3, .marca { font-family: "Plus Jakarta Sans", Inter, sans-serif; }
a { color: var(--azul); }
.saltar { position: absolute; left: -999px; top: 8px; background: var(--blanco); padding: 8px 14px; z-index: 2000; }
.saltar:focus { left: 8px; }
:focus-visible { outline: 3px solid var(--acento); outline-offset: 2px; }

.barra { background: var(--blanco); border-bottom: 1px solid var(--linea); padding: .7rem 0; }
.marca { font-weight: 800; font-size: 1.2rem; color: var(--azul-hondo); display: inline-flex; align-items: center; gap: .55rem; }
.marca-punto { width: 14px; height: 14px; border-radius: 4px; background: var(--acento); transform: rotate(45deg); }
.nav-link { color: var(--tinta-2); font-weight: 500; }
.nav-link.active { color: var(--azul); font-weight: 600; }

.btn-primario { background: var(--acento); border: 1px solid var(--acento); color: #fff; font-weight: 600; }
.btn-primario:hover, .btn-primario:focus { background: var(--acento-hondo); border-color: var(--acento-hondo); color: #fff; }
.btn-primario:disabled { background: #b9c3d0; border-color: #b9c3d0; color: #fff; }
.btn-secundario { background: var(--blanco); border: 1px solid var(--azul); color: var(--azul); font-weight: 600; }
.btn-secundario:hover, .btn-secundario:focus { background: var(--azul); color: #fff; }
.btn-claro { background: var(--acento); color: #fff; font-weight: 700; border: 0; }
.btn-claro:hover, .btn-claro:focus { background: var(--acento-hondo); color: #fff; }
.btn-contorno { border: 1.5px solid rgba(255, 255, 255, .75); color: #fff; font-weight: 600; }
.btn-contorno:hover, .btn-contorno:focus { background: #fff; color: var(--azul-hondo); }

.hero { background: linear-gradient(135deg, var(--azul-hondo), var(--azul)); color: #fff; padding: 5rem 0; }
.hero-texto { max-width: 720px; }
.hero h1 { font-size: clamp(2rem, 5vw, 3.2rem); font-weight: 800; line-height: 1.12; margin-bottom: 1rem; }
.hero p { font-size: 1.15rem; color: #dbe6f4; margin-bottom: 1.6rem; }

.titulo-pagina { font-size: clamp(1.6rem, 4vw, 2.1rem); font-weight: 800; color: var(--azul-hondo); margin-bottom: .8rem; }
.titulo-bloque { font-size: clamp(1.4rem, 3vw, 1.8rem); font-weight: 800; color: var(--azul-hondo); margin-bottom: 1.5rem; }
.titulo-seccion, legend.titulo-seccion { font-size: 1.1rem; font-weight: 700; color: var(--azul-hondo); margin-bottom: .8rem; }
.text-secundario { color: var(--tinta-2); }
.chico { font-size: .86rem; }
.estrecho { max-width: 560px; }
.fondo-suave { background: var(--suave); }
.migas { font-size: .88rem; color: var(--tinta-2); }

.tarjeta { background: var(--blanco); border: 1px solid var(--linea); border-radius: var(--radio); box-shadow: var(--sombra); }
.enlace-titulo { color: inherit; text-decoration: none; }
.enlace-titulo:hover { color: var(--azul); text-decoration: underline; }

.pasos h3 { font-size: 1.08rem; font-weight: 700; margin-top: .7rem; }
.pasos p { color: var(--tinta-2); margin: 0; }
.paso-n { display: inline-flex; width: 38px; height: 38px; align-items: center; justify-content: center; border-radius: 50%; background: var(--suave); color: var(--azul); font-weight: 700; }

.plan { display: flex; flex-direction: column; height: 100%; padding: 1.6rem; background: var(--blanco); border: 1px solid var(--linea); border-radius: var(--radio); }
.plan-central { border: 2px solid var(--azul); box-shadow: var(--sombra); }
.plan-nombre { font-size: 1.2rem; font-weight: 800; color: var(--azul-hondo); }
.plan-precio { font-size: 1.45rem; font-weight: 700; color: var(--tinta); margin-bottom: .6rem; }
.plan-precio small { font-size: .85rem; font-weight: 500; color: var(--tinta-2); }
.plan-intro { font-weight: 600; font-size: .92rem; }
.plan-lista { list-style: none; padding: 0; margin: 0 0 1.3rem; }
.plan-lista li { padding: .22rem 0; font-size: .95rem; display: flex; gap: .45rem; }
.plan-lista i { color: var(--verde); }
.rango-guias { flex: 1 1 200px; max-width: 360px; }

.red-guias { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .8rem; }
.red-guias li { background: var(--blanco); border: 1px solid var(--linea); border-radius: 10px; padding: .8rem 1rem; }
.red-guias strong, .red-guias span { display: block; }
.red-guias span { color: var(--tinta-2); font-size: .85rem; }

.insignia { display: inline-flex; align-items: center; gap: .3rem; font-size: .8rem; font-weight: 600; padding: .22rem .6rem; border-radius: 999px; margin-right: .35rem; }
.insignia-miembro { background: #e4eefb; color: var(--azul); }
.insignia-verificada { background: #dcf3ea; color: var(--verde); }
.insignia-neutra { background: #eceff3; color: var(--tinta-2); }
.chip { display: inline-block; font-size: .8rem; font-weight: 600; padding: .15rem .55rem; border-radius: 6px; }
.chip-ok { background: #dcf3ea; color: var(--verde); }
.chip-mal { background: #fbe5e3; color: var(--rojo); }
.chip-neutro { background: #eceff3; color: var(--tinta-2); }
.tilde { color: var(--verde); }
.sin-tilde { color: #aab5c3; }
.lista-guias, .lista-simple { list-style: none; padding: 0; margin: 0; }
.lista-guias li { padding: .12rem 0; font-size: .94rem; }
.lista-simple li { padding: .3rem 0; font-size: .92rem; overflow-wrap: anywhere; }
.tabla th { color: var(--tinta-2); font-size: .82rem; font-weight: 600; }

.opcion-plan, .opcion-guia { display: flex; gap: .6rem; background: var(--blanco); border: 1.5px solid var(--linea); border-radius: 12px; padding: .9rem; cursor: pointer; height: 100%; }
.opcion-plan { flex-wrap: wrap; align-items: center; }
.opcion-plan:has(input:checked), .opcion-guia:has(input:checked) { border-color: var(--azul); background: #f2f7fd; }
.opcion-plan.deshabilitada { opacity: .5; cursor: not-allowed; }
.opcion-nombre { font-weight: 700; }
.opcion-precio { flex-basis: 100%; font-size: .85rem; color: var(--tinta-2); }
.opcion-guia small { display: block; color: var(--tinta-2); overflow-wrap: anywhere; }
.resumen { position: sticky; top: 1rem; }
.resumen-total { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.9rem; font-weight: 800; color: var(--azul-hondo); margin-bottom: .2rem; }

.galeria { display: flex; flex-wrap: wrap; gap: .8rem; }
.foto { margin: 0; width: 120px; }
.foto img { width: 120px; height: 90px; object-fit: contain; background: var(--suave); border: 1px solid var(--linea); border-radius: 8px; }
.foto figcaption { font-size: .8rem; color: var(--tinta-2); }
.campo-ficha { min-width: 240px; flex-basis: 300px; }

.datos { display: grid; grid-template-columns: minmax(120px, 34%) 1fr; gap: .5rem 1rem; margin-bottom: 1.2rem; }
.datos dt { font-weight: 600; color: var(--tinta-2); }
.datos dd { margin: 0; overflow-wrap: anywhere; }

.texto-legal { max-width: 800px; }
.texto-legal h2 { font-size: 1.2rem; font-weight: 700; color: var(--azul-hondo); margin-top: 1.9rem; scroll-margin-top: 1rem; }
.indice { margin: 0; padding-left: 1.1rem; columns: 2; }
@media (max-width: 575px) { .indice { columns: 1; } .hero { padding: 3rem 0; } }

.menu-admin .nav-link { font-size: .88rem; padding: .3rem .7rem; }
.menu-admin .nav-link.active { background: var(--azul); color: #fff; }
.dato { color: inherit; text-decoration: none; }
.dato-n { display: block; font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.7rem; font-weight: 800; color: var(--azul-hondo); }
.dato-t { color: var(--tinta-2); font-size: .88rem; }

.pie { background: var(--azul-hondo); color: #c6d4e5; padding: 1.4rem 0; font-size: .88rem; margin-top: 2.5rem; }
.pie a { color: #e7eef7; }
.trampa { position: absolute; left: -9999px; }

@media print {
  .barra, .pie, .no-imprimir, .migas { display: none !important; }
  body { background: #fff; }
  .tarjeta { box-shadow: none; border: 0; }
}

.ejemplos-cabeza { background: linear-gradient(135deg, var(--azul-hondo), var(--azul)); color: #fff; padding: 3rem 0; }
.ejemplos-cabeza h1 { font-size: clamp(1.8rem, 4.5vw, 2.6rem); font-weight: 800; margin-bottom: .5rem; }
.ejemplos-cabeza p { color: #dbe6f4; margin: 0; max-width: 640px; }
.ejemplo-tarjeta { display: block; height: 100%; overflow: hidden; background: var(--blanco); border: 1px solid var(--linea); border-radius: var(--radio); box-shadow: var(--sombra); color: inherit; text-decoration: none; }
.ejemplo-tarjeta:hover { border-color: var(--azul); }
.ejemplo-tarjeta img { display: block; width: 100%; height: auto; border-bottom: 1px solid var(--linea); }
.ejemplo-nombre, .ejemplo-texto, .ejemplo-ver { display: block; padding: 0 1.1rem; }
.ejemplo-nombre { padding-top: 1rem; font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.15rem; font-weight: 800; color: var(--azul-hondo); }
.ejemplo-texto { margin: .25rem 0 .6rem; color: var(--tinta-2); font-size: .94rem; }
.ejemplo-ver { padding-bottom: 1rem; color: var(--azul); font-weight: 600; font-size: .92rem; }
.tabla-planes th[scope="row"] { font-weight: 500; color: var(--tinta); }

/* Portada: la red, las guías y el alcance nacional */
html { scroll-behavior: smooth; scroll-padding-top: 76px; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
.barra { position: sticky; top: 0; z-index: 1020; }
.portada-hero { position: relative; isolation: isolate; display: flex; align-items: center; min-height: min(82vh, 680px); padding: 4.5rem 0 6.5rem; overflow: hidden; color: #fff; background: var(--azul-hondo) url("portada/hero.webp") center / cover no-repeat; }
.portada-hero video { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.portada-hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg, rgba(8, 26, 50, .93) 0%, rgba(8, 26, 50, .76) 48%, rgba(8, 26, 50, .28) 100%); }
.portada-hero-texto { max-width: 690px; }
.portada-sello { display: inline-flex; align-items: center; gap: .45rem; margin-bottom: 1.1rem; padding: .35rem .85rem; border: 1px solid rgba(255, 255, 255, .35); border-radius: 999px; background: rgba(255, 255, 255, .1); font-size: .88rem; font-weight: 600; }
.portada-sello i { color: #ffb48a; }
.portada-hero h1 { margin-bottom: 1rem; font-size: clamp(2.05rem, 5vw, 3.35rem); font-weight: 800; line-height: 1.1; letter-spacing: -.02em; }
.portada-hero p { margin-bottom: 1.7rem; font-size: clamp(1.05rem, 2vw, 1.2rem); line-height: 1.55; color: #dfe8f4; }
.portada-cifras { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(4, 1fr); margin-top: -3.4rem; padding: 0; overflow: hidden; border-radius: var(--radio); background: var(--blanco); box-shadow: 0 14px 40px rgba(15, 31, 51, .14); }
.portada-cifras > div { padding: 1.35rem 1rem; text-align: center; border-left: 1px solid var(--linea); }
.portada-cifras > div:first-child { border-left: 0; }
.portada-cifras strong { display: block; font-family: "Plus Jakarta Sans", sans-serif; font-size: clamp(1.45rem, 3vw, 2rem); font-weight: 800; line-height: 1.15; color: var(--azul-hondo); }
.portada-cifras span { display: block; margin-top: .2rem; font-size: .9rem; color: var(--tinta-2); }
.portada-seccion { padding-top: 4.5rem; padding-bottom: 4.5rem; }
.portada-cabeza { max-width: 680px; margin: 0 auto 2.4rem; text-align: center; }
.portada-cabeza h2, .portada-titulo { margin-bottom: .6rem; font-size: clamp(1.6rem, 3.5vw, 2.25rem); font-weight: 800; line-height: 1.18; letter-spacing: -.015em; color: var(--azul-hondo); }
.portada-cabeza p { margin: 0; font-size: 1.05rem; color: var(--tinta-2); }
.portada-antetitulo { display: block; margin-bottom: .45rem; font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--acento-hondo); }
.portada-cabeza-clara h2 { color: #fff; }
.portada-cabeza-clara p { color: #c9d7e8; }
.portada-cabeza-clara .portada-antetitulo { color: #ffb48a; }
.portada-guias { display: grid; grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.portada-guias a { display: flex; flex-direction: column; height: 100%; padding: 1.15rem 1.2rem; border: 1px solid var(--linea); border-radius: var(--radio); background: var(--blanco); color: var(--tinta); text-decoration: none; transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
.portada-guias a:hover { border-color: var(--azul); box-shadow: var(--sombra); transform: translateY(-2px); }
.portada-guia-logo { display: flex; align-items: center; height: 58px; margin-bottom: .75rem; }
.portada-guia-logo img { display: block; max-width: 180px; max-height: 58px; object-fit: contain; }
.portada-iniciales { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 13px; background: linear-gradient(160deg, var(--azul), var(--azul-hondo)); color: #fff; font-family: "Plus Jakarta Sans", sans-serif; font-weight: 800; }
.portada-guias strong { font-size: 1rem; line-height: 1.25; color: var(--azul-hondo); }
.portada-guia-dominio { margin-bottom: .6rem; font-size: .85rem; color: var(--tinta-2); overflow-wrap: anywhere; }
.portada-guia-dato { display: flex; gap: .4rem; padding-top: .12rem; font-size: .88rem; color: var(--tinta); }
.portada-guia-dato i { color: var(--acento-hondo); }
.portada-alcance { padding: 4.5rem 0; background: var(--azul-hondo); color: #fff; }
.portada-regiones { display: grid; grid-template-columns: repeat(6, 1fr); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.portada-regiones li { position: relative; grid-column: span 2; min-height: 270px; overflow: hidden; border-radius: var(--radio); background: #16365f; }
.portada-regiones li:nth-child(n + 4) { grid-column: span 3; }
.portada-regiones img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.portada-regiones div { position: absolute; inset: auto 0 0; padding: 3.2rem 1.15rem 1.05rem; background: linear-gradient(180deg, rgba(8, 26, 50, 0), rgba(8, 26, 50, .9) 58%); }
.portada-regiones h3 { margin: 0 0 .2rem; font-size: 1.2rem; font-weight: 800; color: #fff; }
.portada-regiones p { margin: 0; font-size: .9rem; line-height: 1.4; color: #dfe8f4; }
.portada-video { position: relative; overflow: hidden; aspect-ratio: 16 / 9; border-radius: 18px; background: var(--suave); box-shadow: 0 14px 40px rgba(15, 31, 51, .16); }
.portada-video video { display: block; width: 100%; height: 100%; object-fit: cover; }
.portada-pasos { margin: 1.1rem 0 0; padding: 0; list-style: none; counter-reset: paso; }
.portada-pasos li { position: relative; padding: .7rem 0 .7rem 3.2rem; counter-increment: paso; }
.portada-pasos li::before { content: counter(paso); position: absolute; left: 0; top: .75rem; display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: var(--azul); color: #fff; font-weight: 700; }
.portada-pasos strong, .portada-pasos span { display: block; }
.portada-pasos strong { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.05rem; color: var(--azul-hondo); }
.portada-pasos span { color: var(--tinta-2); }
.portada-bajada { max-width: 760px; }
.portada-cierre { padding: 5rem 0; text-align: center; color: #fff; background: linear-gradient(rgba(11, 39, 72, .8), rgba(11, 39, 72, .8)), url("portada/bandera.webp") center / cover no-repeat; }
.portada-cierre h2 { margin-bottom: .5rem; font-size: clamp(1.7rem, 4vw, 2.5rem); font-weight: 800; letter-spacing: -.015em; }
.portada-cierre p { margin-bottom: 1.5rem; font-size: 1.1rem; color: #e6edf6; }
.pie-columnas { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 2rem; }
.pie .marca { color: #fff; margin-bottom: .6rem; }
.pie-marca p { max-width: 320px; margin: 0; line-height: 1.5; }
.pie h2 { margin: 0 0 .55rem; font-size: .82rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #fff; }
.pie nav a { display: block; padding: .14rem 0; text-decoration: none; }
.pie nav a:hover { text-decoration: underline; }
.pie-final { margin: 1.6rem 0 0; padding-top: 1rem; border-top: 1px solid rgba(255, 255, 255, .14); }
@media (max-width: 991px) {
  .portada-regiones { grid-template-columns: repeat(2, 1fr); }
  .portada-regiones li, .portada-regiones li:nth-child(n + 4) { grid-column: span 1; }
  .portada-regiones li:last-child { grid-column: span 2; }
  .pie-columnas { grid-template-columns: repeat(2, 1fr); }
  .pie-marca { grid-column: span 2; }
}
@media (max-width: 767px) {
  .portada-hero { min-height: 0; padding: 3.2rem 0 5.6rem; }
  .portada-hero::after { background: linear-gradient(180deg, rgba(8, 26, 50, .82), rgba(8, 26, 50, .9)); }
  .portada-cifras { grid-template-columns: repeat(2, 1fr); margin-right: 1rem; margin-left: 1rem; width: auto; }
  .portada-cifras > div:nth-child(3) { border-left: 0; }
  .portada-cifras > div:nth-child(n + 3) { border-top: 1px solid var(--linea); }
  .portada-seccion, .portada-alcance { padding-top: 3.2rem; padding-bottom: 3.2rem; }
  .portada-regiones { grid-template-columns: 1fr; }
  .portada-regiones li, .portada-regiones li:last-child { grid-column: span 1; min-height: 230px; }
}
@media (max-width: 575px) { .pie-columnas { grid-template-columns: 1fr 1fr; gap: 1.4rem; } }

/* Pantallas de ingreso: las cuentas y la administración comparten esta estructura. */
.ingreso { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); width: calc(100% - 2rem); max-width: 1040px; margin: 2.4rem auto 0; background: var(--blanco); border: 1px solid var(--linea); border-radius: 20px; box-shadow: var(--sombra); overflow: hidden; }
.ingreso-lado { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: flex-end; min-height: 560px; padding: 2.4rem; color: #dbe6f4; background: var(--azul-hondo) url(portada/comercio.webp) 62% center / cover no-repeat; }
.ingreso-lado::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(8, 26, 50, .2) 0%, rgba(8, 26, 50, .6) 48%, rgba(8, 26, 50, .94) 100%); }
.ingreso-lema { margin: 0 0 .45rem; font-family: "Plus Jakarta Sans", sans-serif; font-size: clamp(1.45rem, 2.7vw, 2rem); font-weight: 800; line-height: 1.2; color: #fff; }
.ingreso-texto { margin: 0; line-height: 1.5; }
.ingreso-puntos { list-style: none; display: grid; gap: .55rem; margin: 1.3rem 0 0; padding: 0; font-size: .92rem; }
.ingreso-puntos li { display: flex; align-items: center; gap: .65rem; }
.ingreso-puntos .bi { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; background: rgba(255, 255, 255, .14); color: #fff; }
.ingreso-cuerpo { display: flex; align-items: center; justify-content: center; padding: 2.4rem 2rem; }
.ingreso-caja { width: 100%; max-width: 370px; }
.ingreso-caja .titulo-pagina { margin-bottom: .35rem; font-size: 1.7rem; }
.ingreso-bajada { margin-bottom: 1.4rem; color: var(--tinta-2); }
.ingreso-sello { display: inline-flex; align-items: center; gap: .4rem; margin-bottom: .9rem; padding: .25rem .65rem; border-radius: 999px; background: var(--suave); color: var(--azul); font-size: .78rem; font-weight: 600; }
.ingreso-caja .form-label { margin-bottom: .3rem; font-size: .86rem; font-weight: 600; }
.ingreso-caja .alert { padding: .6rem .8rem; font-size: .9rem; }
.ingreso-caja .btn-primario { padding: .66rem 1rem; border-radius: 10px; }
.ingreso-campo { position: relative; }
.ingreso-campo > .bi { position: absolute; top: 50%; left: .85rem; transform: translateY(-50%); color: var(--tinta-2); pointer-events: none; }
.ingreso-campo .form-control { padding: .66rem .9rem .66rem 2.45rem; border-radius: 10px; }
.ingreso-campo .form-control:focus { border-color: var(--azul); box-shadow: 0 0 0 .2rem rgba(19, 64, 124, .16); }
.ingreso-campo-clave .form-control { padding-right: 2.7rem; }
.ingreso-ver { position: absolute; top: 50%; right: .3rem; transform: translateY(-50%); padding: .3rem .5rem; border: 0; border-radius: 7px; background: none; color: var(--tinta-2); line-height: 1; }
.ingreso-ver:hover { background: var(--suave); color: var(--azul); }
.ingreso-olvido { margin: -.35rem 0 1rem; text-align: right; font-size: .85rem; }
.ingreso-nota { margin: 1.1rem 0 0; text-align: center; font-size: .86rem; color: var(--tinta-2); }
@media (max-width: 991.98px) {
  .ingreso { grid-template-columns: minmax(0, 1fr); max-width: 480px; margin-top: 1.4rem; }
  .ingreso-lado { display: none; }
  .ingreso-cuerpo { padding: 1.8rem 1.4rem; }
}

/* Modal de ejemplos: las páginas se ven en un marco, sin salir de la portada. */
.ejemplo-tarjeta { cursor: pointer; }
.ejemplo-modal .modal-header { gap: .6rem 1rem; }
.ejemplo-modal .modal-title { font-size: 1.15rem; font-weight: 800; color: var(--azul-hondo); }
.ejemplo-modal .btn-close { margin: 0; }
.ejemplo-modal-opciones { display: flex; gap: .35rem; margin-left: auto; }
.ejemplo-modal .modal-body { position: relative; height: 76vh; padding: 0; overflow: hidden; background: var(--fondo); }
.ejemplo-modal iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; background: var(--fondo); }
.ejemplo-modal-cargando { display: none; position: absolute; inset: 0; z-index: 1; margin: 0; place-content: center; background: var(--fondo); color: var(--tinta-2); }
.ejemplo-modal.cargando .ejemplo-modal-cargando { display: grid; }
@media (max-width: 991.98px) {
  .ejemplo-modal .modal-body { height: auto; }
}
@media (max-width: 767.98px) {
  .ejemplo-modal .modal-header { flex-wrap: wrap; justify-content: space-between; }
  .ejemplo-modal-opciones { order: 3; width: 100%; margin: 0; overflow-x: auto; }
  .ejemplo-modal-opciones .btn { flex: 1 0 auto; padding-inline: .45rem; font-size: .8rem; }
  .ejemplo-modal .modal-footer { display: none; }
}

/* Panel de estadísticas de ejemplo. */
.est { margin: 0; background: var(--fondo); color: var(--tinta); }
.est-aviso { background: #fff4d6; color: #5c4307; font-size: .9rem; border-bottom: 1px solid #ecd9a0; }
.est-aviso .container { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .4rem 1rem; padding-top: .55rem; padding-bottom: .55rem; }
.est-aviso-enlaces { display: flex; align-items: center; gap: .9rem; }
.est-aviso a { color: #5c4307; font-weight: 600; }
.est-aviso a.est-aviso-boton { padding: .25rem .8rem; border-radius: 8px; background: #5c4307; color: #fff; text-decoration: none; }
.est-cuerpo { padding-top: 1.6rem; padding-bottom: 2rem; }
.est-cabeza { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: .6rem 1rem; margin-bottom: 1.1rem; }
.est-cabeza p { margin: 0; color: var(--tinta-2); font-weight: 600; }
.est-cabeza h1 { margin: 0; font-size: clamp(1.5rem, 3.4vw, 2rem); font-weight: 800; color: var(--azul-hondo); }
.est-periodo { padding: .35rem .8rem; border: 1px solid var(--linea); border-radius: 999px; background: var(--blanco); color: var(--tinta-2); font-size: .88rem; }
.est-tarjeta { padding: 1.15rem 1.25rem; border: 1px solid var(--linea); border-radius: var(--radio); background: var(--blanco); box-shadow: var(--sombra); }
.est-tarjeta h2 { margin: 0 0 .6rem; font-family: Inter, system-ui, sans-serif; font-size: .95rem; font-weight: 600; color: var(--tinta-2); }
.est-tarjeta > .bi { color: var(--azul); font-size: 1.2rem; }
.est-resumen { display: grid; grid-template-columns: 1.6fr repeat(4, 1fr); gap: .75rem; margin-bottom: .75rem; }
.est-resumen .est-tarjeta h2 { margin: 0; font-size: .85rem; }
.est-numero { margin: .15rem 0; font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.65rem; font-weight: 800; line-height: 1.15; color: var(--azul-hondo); }
.est-principal { background: var(--azul-hondo); border-color: var(--azul-hondo); }
.est-resumen .est-principal h2, .est-principal .est-comparacion { color: #dbe6f4; }
.est-principal .est-numero { font-size: 2.5rem; color: #fff; }
.est-comparacion { margin: 0; font-size: .85rem; }
.est-barras { display: block; width: 100%; height: auto; }
.est-barra { fill: var(--azul); }
.est-barras .est-barra:hover { fill: var(--acento); }
.est-eje { stroke: var(--linea); stroke-width: 1; }
.est-rotulo { fill: var(--tinta-2); font-size: 12px; }
.est-valor { fill: var(--tinta); font-size: 13px; font-weight: 700; }
.est-guias { display: grid; gap: .85rem; margin: 0; padding: 0; list-style: none; }
.est-guias li { display: grid; grid-template-columns: 1fr auto; gap: .2rem .6rem; font-size: .92rem; }
.est-guias strong { font-weight: 700; }
.est-guias svg { grid-column: 1 / -1; display: block; width: 100%; height: 8px; }
.est-guia-fondo { fill: var(--suave); }
@media (max-width: 991.98px) {
  .est-resumen { grid-template-columns: repeat(2, 1fr); }
  .est-principal { grid-column: 1 / -1; }
}

/* Eliminar empresas */
.bajas-resumen { display: flex; flex-wrap: wrap; gap: .4rem; }
.bajas-guias { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; }
.bajas-guias li { display: flex; align-items: center; gap: .45rem; }
.bajas-guias .form-check-input { margin: 0; flex: 0 0 auto; }
.bajas-barra { position: sticky; bottom: 0; z-index: 5; }
@media (max-width: 991.98px) { .bajas-barra { bottom: 64px; } }

/* Mensajes */
.mensaje-texto { white-space: normal; overflow-wrap: anywhere; line-height: 1.6; }

/* Verificación en dos pasos */
.dos-pasos-pasos { padding-left: 1.2rem; margin: 1rem 0 1.25rem; }
.dos-pasos-pasos li { margin-bottom: .75rem; }
.dos-pasos-qr { display: block; width: 240px; max-width: 100%; height: auto; margin: .75rem 0; border: 1px solid var(--linea); border-radius: 8px; background: #fff; image-rendering: pixelated; }
.dos-pasos-clave { display: inline-block; margin-top: .4rem; padding: .35rem .6rem; border-radius: 6px; background: var(--suave); color: var(--tinta); font-size: .95rem; letter-spacing: .04em; word-break: break-all; user-select: all; }
.dos-pasos-codigos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; padding: 0; margin: 1rem 0; list-style: none; }
.dos-pasos-codigos code { display: block; padding: .5rem; border: 1px dashed var(--linea); border-radius: 6px; color: var(--tinta); font-size: 1rem; text-align: center; user-select: all; }