/* Manual de AURA — mismos colores y aire que auraplayout.com */
:root{
  --navy:#26304f; --navy-2:#2c3452; --ink-2:#4e5261; --ink-3:#717586;
  --azul:#36a7da; --azul-2:#2b96c8; --teal:#37b2b0;
  --banda-azul:#e9f2ff; --banda-teal:#eafaf7; --banda-crema:#faf8f5;
  --linea:#e2e8f2; --linea-2:#cfd9e8; --sombra:0 10px 30px rgba(44,52,82,.10);
  --mono:"Consolas","Roboto Mono",monospace;
}
*{box-sizing:border-box} html{-webkit-text-size-adjust:100%}
body{margin:0;background:#f7f9fc;color:var(--navy);
     font:16px/1.68 "Segoe UI",system-ui,-apple-system,sans-serif}
a{color:var(--azul-2);text-decoration:none} a:hover{text-decoration:underline}
.caja{max-width:1000px;margin:0 auto;padding:0 20px}

header.top{background:var(--navy-2);color:#fff}
header.top .caja{display:flex;align-items:center;gap:16px;min-height:62px;flex-wrap:wrap}
.marca{color:#fff;font-weight:800;font-size:18px;letter-spacing:.4px}
.marca small{display:block;font-size:8px;letter-spacing:2px;color:#9fb0d0;font-weight:600}
.top nav{margin-left:auto;display:flex;gap:16px;flex-wrap:wrap}
.top nav a{color:#c6d2e8;font-size:14px;font-weight:600}
.top nav a:hover{color:#fff}

.tira{background:linear-gradient(180deg,var(--banda-azul),#fff);border-bottom:1px solid var(--linea)}
.tira .caja{padding:38px 20px 32px}
.tira.fina .caja{padding:28px 20px 26px}
h1{margin:0 0 10px;font-size:32px;line-height:1.18;letter-spacing:-.5px}
.tira.fina h1{font-size:27px}
.lead{color:var(--ink-2);margin:0;max-width:72ch}
.miga{font-size:13px;color:var(--ink-3);margin:0 0 10px}
.miga a{color:var(--ink-3)}

/* Selector de idioma en la cabecera del manual */
.idioma{position:relative}
.idioma .idi-b{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 11px;
  border-radius:7px;background:transparent;border:1px solid #3a4869;color:#c6d2e8;
  font:700 12.5px/1 inherit;letter-spacing:.6px;cursor:pointer;white-space:nowrap}
.idioma .idi-b:hover{color:#fff;border-color:#6a7ea8}
.idioma .idi-m{position:absolute;right:0;top:calc(100% + 6px);z-index:60;min-width:150px;
  background:#fff;border:1px solid var(--linea-2);border-radius:10px;
  box-shadow:0 16px 40px rgba(20,35,70,.22);overflow:hidden;display:none}
.idioma.abierto .idi-m{display:block}
.idioma .idi-m a{display:block;padding:10px 14px;color:var(--navy);font-size:14px;
  font-weight:600;border-bottom:1px solid var(--linea)}
.idioma .idi-m a:last-child{border-bottom:0}
.idioma .idi-m a:hover{background:var(--banda-azul);text-decoration:none}
.idioma .idi-m a.on{color:var(--azul-2)}

/* ── Buscador ───────────────────────────────────────────────────────────── */
.buscador{position:relative;margin-top:22px;max-width:620px}
.buscador input{width:100%;padding:15px 17px 15px 46px;border:1px solid var(--linea-2);
  border-radius:11px;font:16px/1.4 inherit;color:var(--navy);background:#fff url("data:image/svg+xml;utf8,\
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23717586' stroke-width='2'\
 stroke-linecap='round'><circle cx='11' cy='11' r='7'/><path d='M20 20l-3.5-3.5'/></svg>") no-repeat 15px 50%;
  background-size:18px;box-shadow:var(--sombra)}
.buscador input:focus{outline:2px solid var(--azul);outline-offset:-1px;border-color:var(--azul)}
.resultados{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 8px);background:#fff;
  border:1px solid var(--linea-2);border-radius:12px;box-shadow:0 18px 44px rgba(20,35,70,.20);
  overflow:hidden;max-height:66vh;overflow-y:auto}
a.res{display:block;padding:13px 16px;border-bottom:1px solid var(--linea);color:var(--navy)}
a.res:last-child{border-bottom:0}
a.res:hover{background:var(--banda-azul);text-decoration:none}
a.res .sec{display:block;font-size:11px;font-weight:800;letter-spacing:.7px;color:var(--azul-2);
           text-transform:uppercase;margin-bottom:2px}
a.res b{display:block;font-size:15.5px}
a.res .rs{display:block;color:var(--ink-3);font-size:13.5px;margin-top:2px}
.nada{padding:18px;color:var(--ink-3);font-size:14.5px}

/* ── Índice ─────────────────────────────────────────────────────────────── */
main{padding:34px 0 60px}
.bloque{background:#fff;border:1px solid var(--linea);border-radius:14px;
        box-shadow:var(--sombra);padding:22px 24px;margin-bottom:20px}
.bloque h2{margin:0 0 4px;font-size:20px;display:flex;align-items:center;gap:10px}
.bloque .ic{font-size:22px}
.sd{margin:0 0 14px;color:var(--ink-3);font-size:14.5px}
ul.arts{list-style:none;margin:0;padding:0}
ul.arts li{padding:11px 0;border-top:1px solid var(--linea)}
ul.arts li a{font-weight:700;font-size:16px;color:var(--navy)}
ul.arts li a:hover{color:var(--azul-2)}
ul.arts li span{display:block;color:var(--ink-3);font-size:14px;margin-top:1px}

/* ── Artículo ───────────────────────────────────────────────────────────── */
.art{display:grid;grid-template-columns:1fr 260px;gap:26px;align-items:start}
.texto{background:#fff;border:1px solid var(--linea);border-radius:14px;
       box-shadow:var(--sombra);padding:30px 34px;font-size:16.5px}
.texto h2{font-size:21px;margin:30px 0 10px;padding-top:4px}
.texto h2:first-child{margin-top:0}
.texto h3{font-size:17px;margin:22px 0 7px}
.texto p{margin:0 0 14px}
.texto ul,.texto ol{margin:0 0 16px;padding-left:22px}
.texto li{margin-bottom:7px}
.texto code{font-family:var(--mono);background:#f2f5fa;border:1px solid var(--linea);
            border-radius:5px;padding:1px 6px;font-size:14.5px}
.texto b{color:#1d2743}
.nota{background:var(--banda-azul);border-left:4px solid var(--azul);border-radius:0 9px 9px 0;
      padding:13px 16px;margin:0 0 16px;font-size:15.5px}
.ojo{background:#fff6e8;border-left:4px solid #e8a050;border-radius:0 9px 9px 0;
     padding:13px 16px;margin:0 0 16px;font-size:15.5px}
.tabla{overflow-x:auto;margin:0 0 18px;border:1px solid var(--linea);border-radius:10px}
.tabla table{width:100%;border-collapse:collapse;font-size:15px;min-width:420px}
.tabla th,.tabla td{padding:10px 13px;border-bottom:1px solid var(--linea);text-align:left}
.tabla th{background:var(--banda-azul);font-size:13px;letter-spacing:.4px}
.tabla tr:last-child td{border-bottom:0}

.tambien{background:#fff;border:1px solid var(--linea);border-radius:14px;padding:18px 20px;
         box-shadow:var(--sombra);position:sticky;top:20px}
.tambien h3{margin:0 0 10px;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--ink-3)}
.tambien ul{list-style:none;margin:0;padding:0}
.tambien li{padding:8px 0;border-top:1px solid var(--linea);font-size:14.5px}
.tambien li:first-child{border-top:0}

.cierre{grid-column:1/-1;margin-top:22px;background:var(--banda-teal);border:1px solid #a9e0dc;
        border-radius:12px;padding:16px 20px;font-size:15px;color:#1f6b69}
.cierre a{color:#14625f;font-weight:700}

footer{border-top:1px solid var(--linea);background:#fff;padding:26px 0;color:var(--ink-3);font-size:13.5px}
footer .caja{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
footer a{color:var(--ink-3)} .sep{flex:1}

@media(max-width:860px){
  .art{grid-template-columns:1fr}
  .tambien{position:static}
  h1{font-size:25px} .tira.fina h1{font-size:22px}
  .texto{padding:22px 20px;font-size:16px}
  .bloque{padding:18px 17px}
  .tira .caja{padding:26px 20px 24px}
}