/* Biblioteca EMECUATRO — estilo minimalista alineado al sitio. Ajusta la paleta aquí. */
:root{
  --tinta:#0B1F3A;--texto:#1E2733;--suave:#6B7380;--tenue:#9AA1AB;
  --fondo:#FFFFFF;--lateral:#FFFFFF;--linea:#ECEEF1;--hover:#F4F6F9;
  --acento:#0B1F3A;--acento-suave:#EEF2F8;--enlace:#1D4280;
  --serif:"Fraunces",Georgia,serif;--sans:"Inter",system-ui,-apple-system,sans-serif;
  --barra:52px;--izq:272px;--der:340px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--fondo);color:var(--texto);font:400 13.5px/1.7 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button,input,select{font:inherit}

/* Barra superior */
header.barra{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:14px;height:var(--barra);padding:0 18px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--linea)}
.marca{font:600 15px var(--serif);letter-spacing:.02em;color:var(--tinta)}
.marca span{color:var(--acento)}
.sep{width:1px;height:18px;background:var(--linea)}
.seccion{font-size:12.5px;color:var(--suave)}
.acciones{margin-left:auto;display:flex;gap:8px;align-items:center}
.buscar{position:relative}
.buscar input{width:240px;height:32px;padding:0 12px 0 30px;border:1px solid var(--linea);border-radius:8px;background:var(--lateral);font-size:12.5px;color:var(--texto);outline:none;transition:.15s}
.buscar input:focus{border-color:var(--acento);background:#fff}
.buscar svg{position:absolute;left:10px;top:9px;width:14px;height:14px;stroke:var(--tenue)}
.btn{height:32px;padding:0 11px;border:1px solid var(--linea);border-radius:8px;background:#fff;color:var(--suave);font-size:12px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.btn:hover{color:var(--tinta);border-color:#D3D8DF}
.btn.on{color:var(--tinta);border-color:var(--acento);background:var(--acento-suave)}
.solo-movil{display:none}

/* Estructura de tres columnas; la derecha se colapsa sola */
.layout{display:grid;grid-template-columns:var(--izq) minmax(0,1fr) 0;height:calc(100vh - var(--barra));transition:grid-template-columns .28s ease}
.layout.con-panel{grid-template-columns:var(--izq) minmax(0,1fr) var(--der)}
nav.lateral,main.texto,aside.panel{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#DADFE6 transparent}

/* Columna izquierda */
nav.lateral{background:var(--lateral);border-right:1px solid var(--linea);padding:18px 12px 48px}
.rotulo{display:flex;align-items:center;justify-content:space-between;font:600 10px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--tenue);margin:0 8px 8px}
/* Ordenamientos: la ley y su reglamento como familia; sigla como sello */
.leyes{display:flex;flex-direction:column;gap:2px;margin-bottom:24px}
.leyes a{position:relative;display:flex;gap:10px;align-items:center;padding:6px 8px;border-radius:8px;font-size:12.5px;line-height:1.3;color:var(--texto);transition:background .15s,color .15s}
.leyes a b{flex:0 0 44px;text-align:center;font:600 9.5px/1 var(--sans);letter-spacing:.06em;padding:4px 0;border-radius:5px;background:var(--acento-suave);color:var(--tinta)}
.leyes a.const b{background:var(--tinta);color:#fff}
.leyes a.reg{margin-left:20px;font-size:12px;color:var(--suave)}
.leyes a.reg::before{content:"";position:absolute;left:-10px;top:-4px;height:calc(50% + 4px);width:8px;border-left:1px solid #D3D8DF;border-bottom:1px solid #D3D8DF;border-bottom-left-radius:5px}
.leyes a.reg b{flex-basis:40px;background:#fff;color:var(--enlace);box-shadow:inset 0 0 0 1px #C5D1E4}
.leyes a:hover{background:var(--hover);color:var(--tinta)}
.leyes a.activa{background:var(--acento-suave);color:var(--tinta);font-weight:600}
.leyes a.activa::after{content:"";position:absolute;right:8px;width:6px;height:6px;border-radius:50%;background:var(--enlace)}
.leyes a.activa b{background:var(--tinta);color:#fff;box-shadow:none}
/* Índice plegable: Título > Capítulo > Sección, cada nivel con su tono */
.toc-acciones{display:flex;gap:4px}
.toc-acciones button{border:0;background:none;padding:2px 4px;border-radius:4px;font:500 10.5px var(--sans);letter-spacing:0;text-transform:none;color:var(--enlace);cursor:pointer}
.toc-acciones button:hover{background:var(--acento-suave)}
.toc [data-i]{display:grid;grid-template-columns:18px minmax(0,1fr);align-items:start}
.toc [data-i][hidden]{display:none}
.toc .flecha{width:18px;height:24px;border:0;background:none;padding:0;cursor:pointer;color:#9DB0CC;display:flex;align-items:center;justify-content:center;transition:transform .18s,color .15s}
.toc .flecha svg{width:10px;height:10px}
.toc .flecha:hover{color:var(--tinta)}
.toc .expandida>.flecha{transform:rotate(90deg);color:var(--enlace)}
.toc .t{display:block;padding:3px 8px;border-radius:6px;font-size:12.5px;line-height:1.4;transition:background .15s}
.toc .t:hover{background:var(--hover)}
.toc .n1{margin-top:10px}.toc .n1>.t{font-weight:600;color:var(--tinta)}
.toc .n2{margin-top:6px}.toc .n2>.t{font-weight:600;color:var(--tinta)}
.toc .n3{padding-left:12px}.toc .n3>.t{font-weight:500;color:var(--enlace)}
.toc .n4{padding-left:24px}.toc .n4>.t{font-size:12px;color:#5E77A0}
.toc .actual>.t{background:var(--acento-suave);color:var(--tinta)}
.toc .arts{grid-column:2;display:none;flex-wrap:wrap;gap:3px;padding:4px 8px 8px}
.toc .actual>.arts,.toc .abierta>.arts{display:flex}
.toc .arts a{min-width:28px;text-align:center;font-size:11px;padding:1px 5px;border-radius:5px;color:var(--enlace);background:#fff;border:1px solid var(--linea)}
.toc .arts a:hover{border-color:#C5D1E4;background:var(--acento-suave)}
.toc .arts a.activo{background:var(--tinta);border-color:var(--tinta);color:#fff}

/* Texto */
main.texto{padding:40px 56px 140px}
.portada{max-width:68ch;margin:0 auto 36px}
.portada .sig{font:600 11px var(--sans);letter-spacing:.1em;color:var(--acento)}
.portada h1{font:500 26px/1.25 var(--serif);color:var(--tinta);margin:6px 0 8px;letter-spacing:-.01em}
.portada .meta{font-size:12px;color:var(--tenue)}
.enc{max-width:68ch;margin:48px auto 18px;padding-top:18px;border-top:1px solid var(--linea)}
.enc .e{font:600 11px var(--sans);letter-spacing:.06em;color:var(--acento)}
.enc .s{font:500 18px/1.35 var(--serif);color:var(--tinta);margin-top:2px}
.enc.n3,.enc.n4{border-top:0;padding-top:0;margin-top:30px}
.enc.n3 .s,.enc.n4 .s{font-size:15.5px}
article.art{max-width:68ch;margin:0 auto 6px;padding:12px 0 12px 16px;border-left:2px solid transparent;scroll-margin-top:16px;transition:border-color .2s}
article.art.foco{border-left-color:var(--acento)}
article.art h3{font:600 13px var(--sans);color:var(--tinta);margin:0 0 6px;display:flex;gap:10px;align-items:baseline}
article.art h3 .copiar{font-weight:400;font-size:11px;color:var(--tenue);cursor:pointer;opacity:0;transition:.15s}
article.art:hover h3 .copiar{opacity:1}
article.art p{margin:0 0 9px}
.correl{font-size:11.5px;color:var(--tenue);margin-top:4px}
p.nota,.nota{font-size:11px;color:var(--tenue);margin:-5px 0 9px!important}
.suelto{max-width:68ch;margin:0 auto 9px}
a.ref{color:var(--enlace);border-bottom:1px solid #C5D1E4;cursor:pointer;transition:.15s}
a.ref:hover{background:var(--acento-suave);border-bottom-color:var(--acento)}
a.ref.ext{border-bottom-style:dashed;border-bottom-color:var(--acento)}
mark{background:#DCE6F5;color:inherit;border-radius:2px}
.resultados{max-width:68ch;margin:0 auto 24px;padding:10px 14px;border:1px solid var(--linea);border-radius:8px;font-size:12px;color:var(--suave);background:var(--lateral)}
.resultados a{color:var(--tinta);border-bottom:1px solid var(--linea)}

/* Columna derecha */
aside.panel{border-left:1px solid var(--linea);background:var(--lateral);padding:0;opacity:0;transition:opacity .2s}
.layout.con-panel aside.panel{opacity:1;padding:18px 14px 60px}
.panel .rotulo{margin:0 2px 4px}
.panel .ayuda{font-size:11.5px;color:var(--tenue);margin:0 2px 12px;line-height:1.5}
.tarjeta{background:#fff;border:1px solid var(--linea);border-radius:10px;margin-bottom:8px;overflow:hidden;animation:entra .25s ease}
@keyframes entra{from{opacity:0;transform:translateY(4px)}}
.tarjeta.fija{border-color:var(--acento)}
.tarjeta .cab{display:flex;align-items:center;gap:8px;padding:8px 11px;cursor:pointer;font-size:12px;font-weight:600;color:var(--tinta)}
.tarjeta .cab .sig{font:600 9.5px var(--sans);letter-spacing:.06em;padding:2px 5px;border-radius:4px;background:var(--acento-suave);color:var(--acento)}
.tarjeta .cab .ir{margin-left:auto;font-weight:400;font-size:11px;color:var(--tenue)}
.tarjeta .cab .ir:hover{color:var(--tinta)}
.tarjeta .cuerpo{padding:0 11px 9px;font-size:12px;line-height:1.6;max-height:300px;overflow-y:auto;color:var(--texto)}
.tarjeta .cuerpo p{margin:0 0 7px}
.tarjeta.cerrada .cuerpo{display:none}

/* Portada de la biblioteca */
.catalogo{max-width:980px;margin:0 auto;padding:64px 24px 90px}
.catalogo .sig{font:600 11px var(--sans);letter-spacing:.1em;color:var(--acento)}
.catalogo h1{font:500 clamp(28px,4vw,38px)/1.15 var(--serif);color:var(--tinta);margin:8px 0 10px;letter-spacing:-.01em}
.catalogo .intro{color:var(--suave);max-width:60ch;margin:0 0 28px;font-size:14px}
.catalogo .buscar input{width:100%;max-width:380px;height:38px}
.catalogo .buscar svg{top:12px}
.rejilla{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin-top:26px}
.rejilla a{display:flex;flex-direction:column;gap:6px;padding:18px 18px 16px;border:1px solid var(--linea);border-radius:12px;background:#fff;transition:.18s}
.rejilla a:hover{border-color:#D3D8DF;box-shadow:0 6px 20px rgba(11,31,58,.06);transform:translateY(-1px)}
.rejilla .s{font:600 10.5px var(--sans);letter-spacing:.08em;color:var(--acento)}
.rejilla .n{font:500 16px/1.3 var(--serif);color:var(--tinta)}
.rejilla .d{font-size:11.5px;color:var(--tenue);margin-top:auto;padding-top:6px}
.fuente{margin-top:36px;font-size:11.5px;color:var(--tenue);max-width:70ch}

@media (max-width:1180px){
  :root{--izq:240px}
  .layout,.layout.con-panel{grid-template-columns:var(--izq) minmax(0,1fr)}
  aside.panel{position:fixed;right:0;top:var(--barra);bottom:0;width:min(380px,92vw);transform:translateX(100%);transition:transform .25s;z-index:20;box-shadow:-10px 0 30px rgba(11,31,58,.08);opacity:1;padding:18px 14px 60px}
  aside.panel.abierto{transform:none}
}
@media (max-width:760px){
  .layout,.layout.con-panel{grid-template-columns:1fr}
  nav.lateral{position:fixed;left:0;top:var(--barra);bottom:0;width:86vw;max-width:320px;z-index:21;transform:translateX(-100%);transition:transform .25s;box-shadow:10px 0 30px rgba(11,31,58,.08)}
  nav.lateral.abierto{transform:none}
  main.texto{padding:24px 18px 110px}
  .solo-movil{display:inline-flex}
  .buscar input{width:130px}
  .seccion,.sep{display:none}
}
@media print{header.barra,nav.lateral,aside.panel{display:none!important}.layout{display:block;height:auto}main.texto{overflow:visible;padding:0}}