/* ═══════════════════════════════════════════════════════════════════════
   Estatuto — la norma fundamental, para leer y para consultar.

   Mismo lenguaje que el resto de lo institucional: serifas para el texto,
   rótulos en versalita dorada, filetes finos en vez de sombras, esquinas
   rectas. La maqueta es la de un código: el número del artículo en el margen,
   el texto en una columna de lectura de ~64 caracteres, los incisos con la
   letra colgada.
   ═══════════════════════════════════════════════════════════════════════ */

#v-estatuto [hidden]{ display:none !important }
.e-sr{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; border:0 }

/* ── El escaneo del ejemplar impreso ─────────────────────────────────────
   Primer bloque de la sección: la tapa a la izquierda, como una ficha de museo,
   y al lado qué es y los dos botones. Fondo blanco y filete —no un recuadro de
   color— para que no se lea como un banner de descarga.                      */
.e-original{
  display:grid; grid-template-columns:186px minmax(0,1fr); gap:0;
  margin:0 0 34px; border:1px solid var(--linea-fina); background:#fff;
}
.e-original img{
  display:block; width:100%; height:100%; object-fit:cover;
  border-right:1px solid var(--linea-fina); background:var(--crema-2);
}
.e-original figcaption{ padding:24px 26px 26px; min-width:0 }
.e-o-rot{
  display:block; font-family:var(--sans-rotulo); font-size:10px; font-weight:700;
  letter-spacing:2.2px; text-transform:uppercase; color:var(--oro);
}
.e-original h2{
  font-family:var(--serif); font-size:23px; color:var(--verde); margin:7px 0 10px;
  font-weight:700;
}
.e-original p{
  font-family:var(--serif); font-size:15.5px; line-height:1.55; color:var(--tinta);
  margin:0 0 .6em; max-width:56ch;
}
.e-o-datos{
  font-family:var(--sans-rotulo) !important; font-size:12px !important;
  color:var(--gris) !important; letter-spacing:.3px; margin:0 0 16px !important;
}
/* Los botones de la sección ya van con esquinas rectas por `.seccion .btn`. */
.e-original .acciones{ margin-top:0 }
.e-original .btn.sec{ background:#fff; color:var(--verde); border:1px solid var(--verde) }
.e-original .btn.sec:hover{ background:var(--crema-2) }

/* ── Ficha del documento ─────────────────────────────────────────────── */
.e-ficha{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px;
  background:var(--linea-fina); border:1px solid var(--linea-fina);
  margin:0 0 30px;
}
.e-ficha > div{ background:#fff; padding:16px 18px 18px }
.e-ficha dt{
  font-family:var(--sans-rotulo); font-size:10px; font-weight:700; letter-spacing:2px;
  text-transform:uppercase; color:var(--oro); margin:0 0 7px;
}
.e-ficha dd{ margin:0; font-family:var(--serif); font-size:15.5px; line-height:1.35; color:var(--tinta) }
.e-ficha dd small{
  display:block; margin-top:5px; font-size:12.5px; line-height:1.45; color:var(--gris);
}

/* ── Barra de búsqueda ───────────────────────────────────────────────── */
.e-barra{ display:flex; gap:12px; align-items:stretch; margin:0 0 10px }
.e-buscar{ position:relative; flex:1; min-width:0 }
.e-buscar svg{ position:absolute; left:14px; top:50%; transform:translateY(-50%); color:var(--gris);
  pointer-events:none }
.e-buscar input{
  width:100%; height:100%; min-height:48px; padding:12px 14px 12px 42px;
  font-family:var(--serif); font-size:16.5px; color:var(--tinta);
  background:#fff; border:1px solid var(--linea-fina); border-radius:0;
  -webkit-appearance:none; appearance:none;
}
.e-buscar input::placeholder{ color:#8A8A7E; font-style:italic }
.e-buscar input:focus{ outline:2px solid var(--verde-2); outline-offset:0; border-color:var(--verde-2) }
.e-buscar input::-webkit-search-cancel-button{
  -webkit-appearance:none; appearance:none; width:16px; height:16px; cursor:pointer;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 3l10 10M13 3L3 13' stroke='%236E6E64' stroke-width='1.7' fill='none'/%3E%3C/svg%3E") center/contain no-repeat;
}
.e-barra{ scroll-margin-top:88px }
.e-btn{
  flex:none; padding:0 20px; background:#fff; color:var(--verde);
  border:1px solid var(--verde); border-radius:0; cursor:pointer;
  font-family:var(--sans-rotulo); font-size:12px; font-weight:700; letter-spacing:1.4px;
  text-transform:uppercase; transition:background .12s, color .12s;
}
.e-btn:hover{ background:var(--verde); color:#fff }
.e-btn:focus-visible, .e-grilla a:focus-visible, .e-indice a:focus-visible,
.e-enlace:focus-visible, .e-resol summary:focus-visible{
  outline:2px solid var(--verde-2); outline-offset:2px;
}
.e-estado{ margin:0; min-height:0; font-family:var(--sans-rotulo); font-size:13px; color:var(--gris) }
.e-estado.on{ margin:2px 0 12px; padding:10px 14px; background:var(--crema-2);
  border-left:3px solid var(--oro); color:var(--tinta) }
.e-estado a{ color:var(--verde-2); font-weight:600 }

/* ── Consultas frecuentes ────────────────────────────────────────────── */
.e-consultas{ margin:22px 0 44px }
.e-consultas .lab{
  display:block; margin:0 0 10px; font-family:var(--sans-rotulo); font-size:10px; font-weight:700;
  letter-spacing:2px; text-transform:uppercase; color:var(--oro);
}
.e-grilla{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(205px,1fr));
  border-top:1px solid var(--linea-fina); border-left:1px solid var(--linea-fina);
}
.e-grilla a{
  display:flex; flex-direction:column; gap:3px; padding:12px 16px 13px; background:#fff;
  border-right:1px solid var(--linea-fina); border-bottom:1px solid var(--linea-fina);
  text-decoration:none; transition:background .12s;
}
.e-grilla a b{ font-family:var(--serif); font-size:15.5px; line-height:1.25; font-weight:700; color:var(--verde) }
.e-grilla a small{ font-family:var(--sans-rotulo); font-size:11.5px; color:var(--gris) }
.e-grilla a:hover{ background:var(--crema-2) }

/* Mientras se busca, las consultas frecuentes sobran: los resultados suben. */
.buscando .e-consultas{ display:none }

/* ── Dos columnas: índice fijo + documento ───────────────────────────── */
.e-cols{ display:grid; grid-template-columns:248px minmax(0,1fr); gap:0 52px; align-items:start }

.e-indice{ position:sticky; top:96px; align-self:start; max-height:calc(100vh - 116px); overflow-y:auto;
  border-top:2px solid var(--verde); padding-top:4px; overscroll-behavior:contain }
.e-indice summary{
  list-style:none; cursor:pointer; padding:12px 0 10px;
  font-family:var(--sans-rotulo); font-size:10px; font-weight:700; letter-spacing:2.2px;
  text-transform:uppercase; color:var(--oro);
}
.e-indice summary::-webkit-details-marker{ display:none }
.e-indice.fija summary{ pointer-events:none }
.e-indice ol{ list-style:none; margin:0; padding:0 }
.e-indice a{
  display:grid; grid-template-columns:30px minmax(0,1fr); column-gap:6px; align-items:baseline;
  padding:9px 8px 9px 10px; margin-left:-10px; text-decoration:none;
  border-bottom:1px solid var(--linea-fina); border-left:2px solid transparent;
  transition:background .12s;
}
.e-indice a:hover{ background:var(--crema-2) }
.e-indice a.on{ border-left-color:var(--oro); background:var(--crema-2) }
.e-indice .rom{ font-family:var(--serif); font-size:12.5px; font-weight:700; color:var(--oro); letter-spacing:.4px }
.e-indice .nom{ font-family:var(--serif); font-size:14px; line-height:1.3; color:var(--tinta) }
.e-indice a.on .nom{ color:var(--verde); font-weight:700 }
.e-indice .rng{ grid-column:2; font-family:var(--sans-rotulo); font-size:11px; color:var(--gris); margin-top:2px }

/* ── Resolución de puesta en vigencia ────────────────────────────────── */
.e-resol{ border:1px solid var(--linea-fina); background:#fff; margin:0 0 54px; scroll-margin-top:96px }
.e-resol summary{
  list-style:none; cursor:pointer; padding:18px 22px 18px 52px; position:relative;
  display:flex; flex-direction:column; gap:3px;
}
.e-resol summary::-webkit-details-marker{ display:none }
.e-resol summary:before{
  content:""; position:absolute; left:22px; top:50%; width:8px; height:8px; margin-top:-6px;
  border-right:2px solid var(--verde); border-bottom:2px solid var(--verde);
  transform:rotate(-45deg); transition:transform .15s;
}
.e-resol[open] summary:before{ transform:rotate(45deg); margin-top:-8px }
.e-resol summary:hover{ background:var(--crema) }
.e-r-rot{ font-family:var(--serif); font-size:19px; font-weight:700; color:var(--verde) }
.e-r-sub{ font-family:var(--sans-rotulo); font-size:12.5px; color:var(--gris) }
.e-r-doc{ padding:6px 22px 26px 52px; border-top:1px solid var(--linea-fina) }
.e-r-cab{ font-family:var(--sans-rotulo); font-size:11px; font-weight:700; letter-spacing:1.6px;
  text-transform:uppercase; color:var(--oro); line-height:1.7; margin:20px 0 6px }
.e-r-cab i{ font-family:var(--serif); font-size:13px; letter-spacing:0; text-transform:none; color:var(--gris) }
.e-r-doc h4{ font-family:var(--serif); font-size:15px; font-variant:small-caps; letter-spacing:1.2px;
  color:var(--verde); margin:22px 0 8px }
.e-r-doc p{ font-family:var(--serif); font-size:16px; line-height:1.62; margin:0 0 .65em; max-width:64ch }
.e-r-fecha{ margin-top:18px !important; font-style:italic }
.e-firmas{ display:flex; flex-wrap:wrap; gap:14px 56px; margin-top:34px }
.e-firmas > div{ min-width:200px; border-top:1px solid var(--tinta); padding-top:7px }
.e-firmas span{ display:block; font-family:var(--serif); font-size:15px }
.e-firmas i{ display:block; font-family:var(--sans-rotulo); font-size:10.5px; font-style:normal;
  font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color:var(--oro); margin-top:2px }

/* ── Títulos y capítulos ─────────────────────────────────────────────── */
.e-titulo{ margin:0 0 58px; scroll-margin-top:96px }
.e-titulo-cab{ position:relative; padding:22px 0 6px; border-top:1px solid var(--verde) }
.e-titulo-cab:before{ content:""; position:absolute; left:0; right:0; top:3px; border-top:1px solid var(--verde) }
.e-rot{ font-family:var(--sans-rotulo); font-size:11px; font-weight:700; letter-spacing:2.4px;
  text-transform:uppercase; color:var(--oro) }
.e-titulo-cab h2{ font-family:var(--serif); font-size:clamp(24px,3.6vw,32px); line-height:1.14;
  color:var(--verde); margin:7px 0 0; letter-spacing:-.2px; font-weight:700 }

.e-cap{ display:flex; align-items:baseline; gap:14px; margin:30px 0 2px; padding-bottom:10px;
  border-bottom:1px solid var(--linea-fina) }
.e-cap .n{ flex:none; font-family:var(--sans-rotulo); font-size:10.5px; font-weight:700;
  letter-spacing:1.8px; text-transform:uppercase; color:var(--verde-2) }
.e-cap .t{ font-family:var(--serif); font-style:italic; font-size:18px; line-height:1.3; color:var(--tinta);
  font-weight:400 }

/* ── Artículos ───────────────────────────────────────────────────────── */
.e-art{
  display:grid; grid-template-columns:70px minmax(0,1fr); column-gap:20px;
  padding:24px 0 22px; border-bottom:1px solid var(--linea-fina); scroll-margin-top:96px;
}
.e-num{ text-align:right; font-family:var(--serif); font-weight:700; font-size:36px; line-height:.95;
  color:var(--verde); font-variant-numeric:lining-nums }
.e-num span{ display:block; margin-bottom:6px; font-family:var(--sans-rotulo); font-size:10px;
  font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--oro) }
.e-cuerpo{ min-width:0 }
.e-cab{ display:flex; justify-content:space-between; align-items:baseline; gap:14px; margin:0 0 8px;
  min-height:22px }
.e-tit{ margin:0; font-family:var(--serif); font-size:18px; line-height:1.3; font-weight:700; color:var(--tinta) }
.e-meta{ flex:none; display:flex; align-items:baseline; gap:14px; font-family:var(--sans-rotulo);
  font-size:11px; color:var(--gris) }
.e-pag{ letter-spacing:.4px }
.e-enlace{ color:var(--verde-2); text-decoration:none; font-weight:600; opacity:0; transition:opacity .12s }
.e-art:hover .e-enlace, .e-enlace:focus-visible{ opacity:1 }
.e-enlace:hover{ text-decoration:underline }
.e-enlace.ok{ opacity:1; color:var(--oro) }

.e-texto p{ margin:0 0 .8em; max-width:64ch; font-family:var(--serif); font-size:17px; line-height:1.68;
  color:var(--tinta); hyphens:manual }
.e-texto strong{ font-weight:700; color:var(--verde) }
.e-lista{ list-style:none; margin:.2em 0 .8em; padding:0; max-width:64ch }
.e-lista li{ display:grid; grid-template-columns:2.2em minmax(0,1fr); margin:0 0 .5em;
  font-family:var(--serif); font-size:17px; line-height:1.62 }
.e-lista .m{ color:var(--oro); font-weight:700; font-style:italic }
.e-vin li:before{ content:"—"; color:var(--oro); font-weight:700 }
.e-vin li{ grid-template-columns:1.7em minmax(0,1fr) }
.e-nota{ margin:.9em 0 0 !important; padding:8px 12px; max-width:64ch;
  font-family:var(--sans-rotulo) !important; font-size:12.5px !important; line-height:1.5 !important;
  color:var(--gris) !important; background:var(--crema-2); border-left:3px solid var(--oro) }
mark{ background:#F3E3A6; color:inherit; padding:0 1px }

.e-art.e-flash{ animation:e-flash 2.6s ease-out }
@keyframes e-flash{
  0%,35%{ background:#F6EBC4; box-shadow:-14px 0 0 #F6EBC4, 14px 0 0 #F6EBC4 }
  100%{ background:transparent; box-shadow:-14px 0 0 transparent, 14px 0 0 transparent }
}
@media(prefers-reduced-motion:reduce){
  .e-art.e-flash{ animation:none; background:#F6EBC4 }
}

/* ── Cierre y estados ────────────────────────────────────────────────── */
.e-cierre{ display:flex; flex-wrap:wrap; gap:18px 64px; margin:44px 0 30px; padding:22px 0 0;
  border-top:1px solid var(--verde) }
.e-cierre b{ display:block; font-family:var(--serif); font-size:17px; color:var(--verde) }
.e-cierre span{ display:block; font-family:var(--serif); font-size:15px; margin-top:2px }
.e-cierre i{ display:block; margin-top:3px; font-family:var(--sans-rotulo); font-size:10.5px; font-style:normal;
  font-weight:700; letter-spacing:1.6px; text-transform:uppercase; color:var(--oro) }
.e-cargando{ font-family:var(--serif); font-style:italic; color:var(--gris); padding:24px 0 }
.e-falla{ margin-top:8px }

/* ── Pantallas medianas y teléfono ───────────────────────────────────── */
@media(max-width:980px){
  .e-ficha{ grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media(max-width:900px){
  .e-cols{ display:block }
  .e-indice{ position:static; max-height:none; overflow:visible; margin:0 0 34px;
    border:1px solid var(--linea-fina); border-top:2px solid var(--verde); background:#fff }
  .e-indice summary{ padding:14px 18px; display:flex; justify-content:space-between; align-items:center }
  .e-indice summary:after{ content:"+"; font-size:20px; font-weight:400; color:var(--verde); letter-spacing:0 }
  .e-indice[open] summary:after{ content:"–" }
  .e-indice .e-nav{ padding:0 18px 8px }
  .e-indice a{ margin-left:0; padding-left:0 }
  .e-enlace{ opacity:1 }
}
@media(max-width:620px){
  .e-ficha{ grid-template-columns:1fr }
  /* La tapa pasa arriba: a 186 px de ancho fijo en un teléfono se comía media pantalla
     y dejaba el texto en una columna de treinta caracteres. Va entera (`contain`) y no
     recortada: recortada le cortaba la cabeza al título del cuadernillo. */
  .e-original{ grid-template-columns:1fr }
  .e-original img{ height:250px; object-fit:contain; padding:16px 0;
    background:var(--crema-2); border-right:0;
    border-bottom:1px solid var(--linea-fina) }
  .e-original figcaption{ padding:20px 18px 22px }
  .e-original h2{ font-size:21px }
  .e-original .acciones{ display:flex; gap:10px }
  .e-original .btn{ flex:1; justify-content:center; text-align:center }
  .e-barra{ flex-wrap:wrap }
  .e-btn{ display:none }
  .e-consultas{ margin-bottom:30px }
  .e-art{ grid-template-columns:minmax(0,1fr); padding:20px 0 18px; position:relative }
  /* En teléfono el enlace y la página suben a la fila del número: así un
     artículo sin título no deja un hueco entre el número y el texto. */
  .e-meta{ position:absolute; right:0; top:28px }
  .e-cab{ min-height:0; margin-bottom:6px }
  .buscando .e-indice:not(.fija){ display:none }
  .e-num{ text-align:left; display:flex; align-items:baseline; gap:8px; font-size:28px; margin-bottom:6px }
  .e-num span{ margin:0 }
  .e-texto p, .e-lista li{ font-size:16.5px }
  .e-cap{ flex-direction:column; gap:3px }
  .e-resol summary{ padding:16px 16px 16px 44px }
  .e-resol summary:before{ left:16px }
  .e-r-doc{ padding:4px 16px 22px }
  .e-art.e-flash{ animation-name:e-flash-m }
}
@keyframes e-flash-m{ 0%,35%{ background:#F6EBC4 } 100%{ background:transparent } }

/* ── Papel ───────────────────────────────────────────────────────────── */
@media print{
  header, footer, #aviso-arranque, .e-barra, .e-estado, .e-consultas, .e-indice,
  .e-enlace, .e-btn{ display:none !important }
  body{ background:#fff !important }
  #v-estatuto{ padding:0 !important }
  .e-cols{ display:block }
  .e-resol summary:before{ display:none }
  .e-resol{ break-inside:avoid }
  .e-ficha{ break-inside:avoid }
  .e-titulo{ margin-bottom:26pt }
  .e-titulo-cab, .e-cap{ break-after:avoid }
  .e-art{ break-inside:avoid; padding:11pt 0 9pt; grid-template-columns:52pt minmax(0,1fr) }
  .e-num{ font-size:22pt }
  .e-texto p, .e-lista li{ font-size:10.5pt; line-height:1.5 }
  .e-tit{ font-size:12pt }
  mark{ background:none }
}