/* Visor de presentaciones del portal: reproduce el lienzo de 1920×1080 de las diapositivas */
:root{
  --navy:#0a1f5c; --navy-2:#13296e; --gold:#f9be25; --red:#d71920;
  --ink:#14213d; --muted:#4e5a70; --bg:#e9edf5; --line:#d6dce8;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--ink);font-family:'Source Sans 3',system-ui,-apple-system,'Segoe UI',sans-serif}

/* Barra superior */
.barra{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:var(--navy);color:#fff;padding:10px 16px;border-top:5px solid var(--gold);box-shadow:inset 0 3px 0 var(--red)}
.barra img.logo{height:40px;width:auto;display:block}
.barra .titulo{flex:1 1 220px;min-width:0;font-weight:700;font-size:1.02rem;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.barra .acciones{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.barra a,.barra button{font:inherit;font-size:.9rem;font-weight:600;color:#fff;background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:6px 12px;cursor:pointer;text-decoration:none;white-space:nowrap}
.barra a:hover,.barra button:hover{background:rgba(255,255,255,.16)}
.barra button.on{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.barra .contador{font-variant-numeric:tabular-nums;color:#fce3a0;font-weight:600;min-width:64px;text-align:center}

/* Escenario */
.escenario{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px;min-height:calc(100vh - 70px)}
.marco{position:relative;overflow:hidden;background:#fff;border-radius:6px;box-shadow:0 2px 6px rgba(20,33,61,.12),0 10px 30px rgba(20,33,61,.12)}
.marco>section{position:absolute;left:0;top:0;transform-origin:0 0}
.modo-una .marco{display:none}
.modo-una .marco.activa{display:block}
.modo-todas .escenario{justify-content:flex-start;gap:18px}
.modo-todas .marco{cursor:pointer}
.modo-todas .marco:hover{outline:3px solid var(--gold)}
.nav{display:flex;gap:10px;margin-top:14px}
.nav button{font:inherit;font-weight:700;font-size:1rem;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);padding:8px 18px;cursor:pointer}
.nav button:hover{border-color:var(--navy)}
.modo-todas .nav{display:none}
.ayuda{font-size:.85rem;color:var(--muted);margin-top:8px;text-align:center}
.modo-todas .ayuda{display:none}

/* Pantalla completa */
.escenario:fullscreen{background:#0b1430;padding:0}
.escenario:fullscreen .nav,.escenario:fullscreen .ayuda{display:none}
.escenario:fullscreen .marco{border-radius:0;box-shadow:none}

/* Lienzo de cada diapositiva: valores por defecto del formato */
.marco section{width:1920px;height:1080px;overflow:hidden;display:flex;flex-direction:column}
.marco section *{box-sizing:border-box;margin:0}
.marco section div{display:flex;flex-direction:column;min-width:0}
.marco section div[style*="display:flex"]{flex-direction:row}
.marco section h1{font-size:96px;font-weight:600;line-height:1.1}
.marco section h2{font-size:64px;font-weight:600;line-height:1.15}
.marco section h3{font-size:44px;font-weight:600;line-height:1.2}
.marco section p{font-size:32px;line-height:1.4}
.marco section ul,.marco section ol{padding-left:1.2em}
.marco section li{margin:0 0 .2em}
.marco section img{display:block;flex:none}
.marco section svg{display:block;flex:none}
.marco section table{border-collapse:collapse;width:100%}
.marco section th,.marco section td{padding:.35em .6em;text-align:left;vertical-align:top;
  border-bottom:1px solid color-mix(in srgb,currentColor 22%,transparent)}
.marco section th{font-weight:700;border-bottom:2px solid color-mix(in srgb,currentColor 55%,transparent)}
.marco section a{color:inherit}
.marco x-icon,.marco x-shape{display:block;flex:none}
.marco x-icon svg{width:100%;height:100%}
.marco x-connector{position:absolute;left:0;top:0;width:1920px;height:1080px;pointer-events:none;display:block}
.marco x-connector svg{width:1920px;height:1080px}

@media (max-width:640px){
  .barra .titulo{flex-basis:100%;order:3;white-space:normal}
  .escenario{padding:10px;min-height:auto}
}
@media print{
  .barra,.nav,.ayuda{display:none}
  .modo-una .marco{display:block}
  .marco{break-inside:avoid;margin:0 auto 12px;box-shadow:none}
}