/* Sitio publico de normas. Toma los tokens de ejur-ui.css (--ej-*) y agrega
   lo propio de la lectura de una norma. Mobile-first, vanilla, sin libs. */

:root{
  /* Tipografia de lectura: la misma decision que ilex (serif 15/1.65). Un
     codigo se lee en parrafos largos, no en una tabla. */
  --pub-ff: var(--ej-serif, Georgia, "Times New Roman", serif);
  --pub-fs: 1.0625rem;
  --pub-lh: 1.65;
  --pub-max: 46rem;
}
*{box-sizing:border-box}
body.pub{
  margin:0; background:var(--ej-bg,#f6f7f8); color:var(--ej-ink,#15181c);
  font-family:var(--ej-sans,system-ui,sans-serif); font-size:16px; line-height:1.5;
  -webkit-text-size-adjust:100%;
}

/* --- cabecera --- */
.pub-top{
  display:flex; flex-wrap:wrap; gap:.5rem 1rem; align-items:center;
  justify-content:space-between; padding:.7rem 1rem;
  background:var(--ej-white,#fff); border-bottom:1px solid var(--ej-line,#d8dbdf);
  position:sticky; top:0; z-index:5;
}
.pub-brand{
  font-family:var(--ej-serif,Georgia,serif); font-size:1.25rem; letter-spacing:.06em;
  color:var(--ej-primary,#1b1e23); text-decoration:none; font-weight:600;
}
.pub-brand span{font-size:.78rem; letter-spacing:.02em; color:var(--ej-faint,#8b9097); font-weight:400}
.pub-nav{display:flex; gap:.35rem; flex-wrap:wrap}
.pub-nav a{
  color:var(--ej-muted,#5c636b); text-decoration:none; font-size:.85rem;
  padding:.35rem .6rem; border-radius:var(--ej-r-sm,6px);
}
.pub-nav a:hover{background:var(--ej-line-soft,#eef0f2); color:var(--ej-ink,#15181c)}
.pub-nav .pub-in{border:1px solid var(--ej-line,#d8dbdf); color:var(--ej-ink,#15181c)}

/* Adentro del iframe de /herramientas/ el menu del shell ya esta arriba: esta
   barra lo repetia entera (Normativa / Valor del JUS / Todas) y encima es
   sticky, asi que se comia una franja de pantalla en cada scroll. La marca
   .emb la pone un script del <head> cuando la pagina se ve embebida. */
.emb .pub-top{display:none}

/* Embebida en el shell PAGO (index.pl le agrega la `k` a la URL del iframe,
   y de ahi sale la marca .app): el que mira ya tiene cuenta. El CTA de alta
   no le dice nada y los links del pie a /, /registro/ y /tyc.pl salen del
   frame con target=_top, o sea que lo sacan de su sesion de un click. En el
   shell publico (.emb sin .app) los dos siguen: ahi si hay a quien invitar. */
.emb.app .cta,
.emb.app .pub-links{display:none}
/* y si al pie no le quedaba mas que esa navegacion, se va entero: si no, queda
   la linea de arriba del <footer> sola al final de la pagina. */
.emb.app .pub-foot-nav{display:none}

.pub-main{max-width:var(--pub-max); margin:0 auto; padding:1.25rem 1rem 2rem}

/* --- migas de la estructura del codigo --- */
.ruta{font-size:.76rem; color:var(--ej-faint,#8b9097); margin:0 0 .9rem; line-height:1.5}
.ruta span::after{content:" › "; color:var(--ej-line,#d8dbdf)}
.ruta span:last-child::after{content:""}

/* --- articulo --- */
.art-n{
  font-size:.75rem; letter-spacing:.09em; text-transform:uppercase;
  color:var(--ej-faint,#8b9097); margin:0 0 .2rem;
}
.norma h1, .portada h1{
  font-family:var(--ej-serif,Georgia,serif); font-weight:600; line-height:1.25;
  font-size:1.5rem; margin:0 0 .45rem; color:var(--ej-ink,#15181c);
}
.art-de{font-size:.83rem; color:var(--ej-muted,#5c636b); margin:0 0 1.25rem}
.art-de a{color:var(--ej-muted,#5c636b)}
.art-txt{
  font-family:var(--pub-ff); font-size:var(--pub-fs); line-height:var(--pub-lh);
  background:var(--ej-white,#fff); border:1px solid var(--ej-line,#d8dbdf);
  border-radius:var(--ej-r-lg,12px); padding:1.1rem 1.15rem;
}
.art-txt .art{margin:0}
.art-txt .inc{display:block; margin:.5rem 0 .5rem 1.25rem}
.art-txt .inc2{display:block; margin:.4rem 0 .4rem 2.25rem}

/* citas: la interna es un link real; la externa todavia no tiene pagina, asi
   que se marca pero no promete un destino */
a.cita{color:var(--ej-primary,#1b1e23); text-decoration:underline;
       text-decoration-style:dotted; text-underline-offset:3px}
a.cita:hover{background:#fdf3d5; text-decoration-style:solid}
.cita-ext{border-bottom:1px dotted var(--ej-faint,#8b9097); cursor:help}

/* --- anterior / siguiente --- */
.paso{display:grid; grid-template-columns:1fr; gap:.55rem; margin:1.25rem 0}
.paso-a{
  display:block; padding:.7rem .85rem; background:var(--ej-white,#fff);
  border:1px solid var(--ej-line,#d8dbdf); border-radius:var(--ej-r-md,8px);
  text-decoration:none; color:var(--ej-ink,#15181c);
}
.paso-a:hover{border-color:var(--ej-primary,#1b1e23)}
.paso-a span{display:block; font-size:.8rem; color:var(--ej-muted,#5c636b)}
.paso-a em{display:block; font-style:normal; font-size:.92rem; margin-top:.15rem}
.paso-r{text-align:right}
.paso-x{display:none}

/* --- portada de la norma --- */
.ficha{
  display:grid; grid-template-columns:1fr; gap:.15rem .9rem; margin:1.1rem 0;
  padding:.9rem 1rem; background:var(--ej-white,#fff);
  border:1px solid var(--ej-line,#d8dbdf); border-radius:var(--ej-r-lg,12px);
  font-size:.9rem;
}
.ficha dt{font-size:.72rem; text-transform:uppercase; letter-spacing:.07em;
          color:var(--ej-faint,#8b9097); margin-top:.5rem}
.ficha dd{margin:0}
.ficha dt:first-child{margin-top:0}
.intro{color:var(--ej-muted,#5c636b); line-height:1.6}

.buscador{margin:1.5rem 0 .5rem}
.buscador .ej-label{display:block; margin-bottom:.3rem; font-size:.8rem}
.buscador input{width:100%}
.buscador-n{font-size:.8rem; color:var(--ej-faint,#8b9097); margin:.4rem 0 0; min-height:1.1em}

/* --- indice jerarquico --- */
.indice{margin-top:.5rem}
.grupo{margin:0 0 .2rem}
.grupo h2{
  font-size:.78rem; letter-spacing:.06em; text-transform:uppercase;
  color:var(--ej-muted,#5c636b); font-weight:600; margin:1.1rem 0 .35rem;
}
.grupo.n0 h2{font-size:.86rem; color:var(--ej-ink,#15181c); margin-top:1.7rem;
             padding-bottom:.3rem; border-bottom:2px solid var(--ej-line,#d8dbdf)}
.grupo.n2 h2, .grupo.n3 h2{text-transform:none; letter-spacing:0; font-size:.85rem}
.grupo.n3 h2{color:var(--ej-faint,#8b9097); font-weight:400}
.indice ul{list-style:none; margin:0; padding:0}
.indice li{border-bottom:1px solid var(--ej-line-soft,#eef0f2)}
.indice li a{
  display:flex; gap:.6rem; padding:.5rem .2rem; text-decoration:none;
  color:var(--ej-ink,#15181c); font-size:.93rem; line-height:1.4;
}
.indice li a:hover{background:var(--ej-line-soft,#eef0f2)}
.indice li b{
  flex:0 0 2.6rem; text-align:right; color:var(--ej-faint,#8b9097);
  font-weight:600; font-variant-numeric:tabular-nums;
}
.indice li a:hover b{color:var(--ej-primary,#1b1e23)}
mark{background:#fdf3d5; color:inherit; padding:0 .1em; border-radius:2px}

/* --- hub --- */
.cards{display:grid; gap:.7rem; margin:1.3rem 0}
.card{
  display:block; padding:1rem 1.1rem; background:var(--ej-white,#fff);
  border:1px solid var(--ej-line,#d8dbdf); border-radius:var(--ej-r-lg,12px);
  text-decoration:none; color:var(--ej-ink,#15181c);
}
.card:hover{border-color:var(--ej-primary,#1b1e23)}
.card-k{display:block; font-size:.72rem; letter-spacing:.07em; text-transform:uppercase;
        color:var(--ej-faint,#8b9097); margin-bottom:.3rem}
.card b{display:block; font-family:var(--ej-serif,Georgia,serif); font-size:1.1rem;
        font-weight:600; line-height:1.3}
.card em{display:block; font-style:normal; font-size:.83rem;
         color:var(--ej-muted,#5c636b); margin-top:.35rem}
.masinfo{font-size:.85rem; color:var(--ej-faint,#8b9097)}

/* --- CTA --- */
.cta{
  margin:2rem 0 0; padding:1.1rem 1.15rem; background:var(--ej-white,#fff);
  border:1px solid var(--ej-line,#d8dbdf); border-radius:var(--ej-r-lg,12px);
}
.cta p{margin:0 0 .8rem; font-size:.92rem; line-height:1.55; color:var(--ej-muted,#5c636b)}
.cta p:last-child{margin-bottom:0; display:flex; gap:.5rem; flex-wrap:wrap}
.cta strong{color:var(--ej-ink,#15181c)}
.cta-btn,.cta-alt{
  display:inline-block; padding:.6rem 1rem; border-radius:var(--ej-r-md,8px);
  text-decoration:none; font-size:.9rem; font-family:var(--ej-sans,system-ui,sans-serif);
}
.cta-btn{background:var(--ej-primary,#1b1e23); color:#fff}
.cta-alt{border:1px solid var(--ej-line,#d8dbdf); color:var(--ej-ink,#15181c)}

/* --- pie --- */
.pub-foot{
  max-width:var(--pub-max); margin:0 auto; padding:1.5rem 1rem 2.5rem;
  border-top:1px solid var(--ej-line,#d8dbdf); font-size:.8rem;
  color:var(--ej-faint,#8b9097); line-height:1.6;
}
.pub-foot p{margin:0 0 .5rem}
.pub-foot a{color:var(--ej-muted,#5c636b)}
.pub-legal{font-size:.75rem}

@media (min-width:40rem){
  .pub-main{padding:2rem 1.5rem 3rem}
  .norma h1,.portada h1{font-size:1.85rem}
  .paso{grid-template-columns:1fr 1fr}
  .paso-x{display:block}
  .ficha{grid-template-columns:auto 1fr; gap:.45rem 1.2rem}
  .ficha dt{margin-top:0}
  .cards{grid-template-columns:1fr 1fr}
}

/* --- link al visor --- */
.visor{margin:1rem 0 0; padding:.85rem 1rem; background:var(--ej-white,#fff);
       border:1px solid var(--ej-line,#d8dbdf); border-radius:var(--ej-r-md,8px)}
.visor a{display:block; font-weight:600; text-decoration:none;
         color:var(--ej-primary,#1b1e23); font-size:.95rem}
.visor a:hover{text-decoration:underline}
.visor span{display:block; font-size:.8rem; color:var(--ej-faint,#8b9097); margin-top:.2rem}

/* --- compartir --- */
.compartir{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;margin:1rem 0 0;
           padding:.7rem .9rem;background:var(--ej-white,#fff);
           border:1px solid var(--ej-line,#d8dbdf);border-radius:var(--ej-r-md,8px)}
.compartir span{font-size:.8rem;color:var(--ej-faint,#8b9097);margin-right:.15rem}
.compartir a,.compartir button{font:inherit;font-size:.84rem;padding:.4rem .75rem;
  border-radius:var(--ej-r-sm,6px);text-decoration:none;cursor:pointer;
  border:1px solid var(--ej-line,#d8dbdf);background:none;color:var(--ej-ink,#15181c)}
.compartir a.wa{background:#25d366;border-color:#25d366;color:#fff}
.compartir button:hover{background:var(--ej-line-soft,#eef0f2)}
.compartir button.hecho{background:#e8f5ec;border-color:#25d366;color:#137a3a}

/* --- valor del JUS --- */
.jus-now{display:grid;gap:.7rem;margin:1.2rem 0}
@media(min-width:34rem){.jus-now{grid-template-columns:1fr 1fr}}
.jus-c{padding:1rem 1.1rem;background:var(--ej-white,#fff);
       border:1px solid var(--ej-line,#d8dbdf);border-radius:var(--ej-r-lg,12px)}
.jus-c span{display:block;font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;
            color:var(--ej-faint,#8b9097)}
.jus-c b{display:block;font-family:var(--ej-serif,Georgia,serif);font-size:1.9rem;
         line-height:1.15;margin:.2rem 0 .15rem;font-variant-numeric:tabular-nums}
.jus-c em{font-style:normal;font-size:.8rem;color:var(--ej-muted,#5c636b)}
.jus-h{font-size:.95rem;margin:2rem 0 .6rem}
.jus-t{overflow-x:auto;border:1px solid var(--ej-line,#d8dbdf);
       border-radius:var(--ej-r-md,8px);background:var(--ej-white,#fff)}
.jus-t table{width:100%;border-collapse:collapse;font-size:.9rem}
.jus-t th,.jus-t td{padding:.5rem .8rem;text-align:right;
                    border-bottom:1px solid var(--ej-line-soft,#eef0f2);white-space:nowrap}
.jus-t th:first-child,.jus-t td:first-child{text-align:left}
.jus-t th{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;
          color:var(--ej-faint,#8b9097);font-weight:600}
.jus-t tr:last-child td{border-bottom:0}
.jus-t td{font-variant-numeric:tabular-nums}

/* --- llamado al visor --- */
.visor{margin:1.2rem 0 0;padding:1rem 1.1rem;background:var(--ej-white,#fff);
       border:1px solid var(--ej-line,#d8dbdf);border-radius:var(--ej-r-lg,12px);text-align:center}
.visor-b{display:inline-block;background:var(--ej-primary,#1b1e23);color:#fff;
         text-decoration:none;padding:.7rem 1.3rem;border-radius:var(--ej-r-md,8px);
         font-size:.95rem;font-weight:600}
.visor-b:hover{opacity:.9}
.visor p{margin:.65rem 0 0;font-size:.83rem;color:var(--ej-muted,#5c636b);line-height:1.5}
/* el de arriba es un link discreto: el boton grande va al pie, cuando ya leyo */
.visor-top{margin:-.6rem 0 1rem;font-size:.85rem}
.visor-top a{color:var(--ej-primary,#1b1e23);text-decoration:none;
             border-bottom:1px solid var(--ej-line,#d8dbdf);padding-bottom:1px}
.visor-top a:hover{border-bottom-color:var(--ej-primary,#1b1e23)}

/* --- graficos --- */
.gr{margin:1.6rem 0 0;padding:.9rem .8rem;background:var(--ej-white,#fff);
    border:1px solid var(--ej-line,#d8dbdf);border-radius:var(--ej-r-lg,12px)}
.gr figcaption{font-size:.9rem;font-weight:600;margin-bottom:.6rem;color:var(--ej-ink,#15181c)}
.gr svg{width:100%;height:auto;display:block;overflow:visible}
.gr .g{stroke:var(--ej-line-soft,#eef0f2);stroke-width:1}
.gr .ln{fill:none;stroke:var(--s,#2b5cad);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.gr .ar{fill:var(--s,#2b5cad);opacity:.07}
.gr .pt{fill:var(--s,#2b5cad)}
.gr .lastp{fill:var(--s,#2b5cad);stroke:#fff;stroke-width:2}
.gr .hit{fill:transparent;cursor:pointer}
.gr .hit:hover{fill:var(--s,#2b5cad);fill-opacity:.12}
/* Dos series sobre el mismo eje: el color lo pone --s por serie, para no
   repetir cada regla de arriba. Azul y naranja se distinguen tambien con
   daltonismo rojo-verde, que es el caso frecuente. */
.gr .s1{--s:#2b5cad}
.gr .s2{--s:#c2410c}
.grleg{display:flex;flex-wrap:wrap;gap:.3rem 1rem;align-items:center;
       margin:-.25rem 0 .7rem;font-size:.78rem;color:var(--ej-muted,#5c636b)}
.grleg .lg{display:inline-flex;align-items:center;gap:.4rem}
.grleg .lg i{width:.9rem;height:2px;border-radius:2px;background:var(--s,#2b5cad)}
.grleg .s1{--s:#2b5cad}
.grleg .s2{--s:#c2410c}
/* El texto del SVG va en unidades del viewBox (640 de ancho), NO en px de
   pantalla: el dibujo se escala al contenedor, asi que el mismo numero se ve
   mas chico cuanto mas angosta es la pantalla. Por eso el tamano BAJA cuando
   la pantalla crece, al reves de lo habitual. Con los 10px de antes, en un
   celular las etiquetas de los ejes quedaban en 5px: ilegibles.
   Rendido: ~11px en 360-430px, ~13px en desktop. */
.gr .ay,.gr .ax{font-size:22px;fill:var(--ej-faint,#8b9097);font-family:var(--ej-sans,system-ui,sans-serif)}
/* La etiqueta del eje Y va sobre su linea de grilla y pegada a la izquierda:
   asi no necesita un margen propio que le robe ancho al dibujo (era lo que
   obligaba a achicar el texto). El halo blanco es para cuando cae encima de
   una curva. */
.gr .ay{text-anchor:start;paint-order:stroke;stroke:var(--ej-white,#fff);stroke-width:3px}
@media (min-width:34rem){
  .gr{padding:1rem 1.1rem}
  .gr .ay,.gr .ax{font-size:15px}
}
@media (min-width:46rem){
  .gr .ay,.gr .ax{font-size:13px}
}
.grnota{margin:.6rem 0 0;font-size:.78rem;color:var(--ej-faint,#8b9097);line-height:1.5}


/* --- guia comparativa CPCA / Ley 912 --------------------------------------
   Monocromo como el resto del sitio: la 912 (derogada) va en gris y el CPCA en
   tinta. El unico tono calido es el resaltado que ya usa el sitio (#fdf3d5),
   y marca solo lo que no tiene equivalente en el codigo anterior. */
.guia{font-family:var(--ej-sans,system-ui,sans-serif)}
.g-head{margin:0 0 1.25rem}
.g-eyebrow{font-size:.75rem;letter-spacing:.09em;text-transform:uppercase;color:var(--ej-faint,#8b9097);margin:0 0 .55rem}
.guia h1{font-family:var(--ej-serif,Georgia,serif);font-weight:600;line-height:1.2;font-size:1.7rem;
         margin:0 0 .85rem;color:var(--ej-ink,#15181c);text-wrap:balance}
.g-dek{font-family:var(--pub-ff);font-size:1.1rem;line-height:1.6;color:var(--ej-muted,#5c636b);margin:0}
.guia .ficha{margin:1.3rem 0 .9rem}
.leyenda{display:flex;flex-wrap:wrap;gap:.35rem 1.4rem;font-size:.8rem;color:var(--ej-faint,#8b9097);margin:0}
.g-ruta a,.guia .ficha a{color:var(--ej-muted,#5c636b);text-underline-offset:2px}
.g-ruta a:hover,.guia .ficha a:hover{color:var(--ej-ink,#15181c)}

.toc{margin:1.4rem 0 0;padding:1rem 1.15rem 1.1rem;background:var(--ej-white,#fff);
     border:1px solid var(--ej-line,#d8dbdf);border-radius:var(--ej-r-lg,12px);
     display:grid;gap:0 2rem;align-items:start}
.toc-t{grid-column:1/-1;font-family:var(--ej-serif,Georgia,serif);font-weight:600;font-size:1.05rem;margin:0}
.toc-h{font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ej-faint,#8b9097);
       font-weight:600;margin:.95rem 0 .2rem}
.toc ul{list-style:none;margin:0;padding:0}
.toc li{display:flex;justify-content:space-between;align-items:baseline;gap:.8rem;padding:.32rem 0;
        border-bottom:1px solid var(--ej-line-soft,#eef0f2);font-size:.9rem;line-height:1.35}
.toc li:last-child{border-bottom:0}
.toc a{color:var(--ej-ink,#15181c);text-decoration:none}
.toc a:hover{text-decoration:underline}
.toc li span{font-size:.72rem;color:var(--ej-faint,#8b9097);font-variant-numeric:tabular-nums;white-space:nowrap}

.tema{margin-top:3.25rem;scroll-margin-top:4.5rem}
.tema > p.loc{font-family:var(--ej-sans,system-ui,sans-serif);font-size:.7rem;letter-spacing:.06em;
  text-transform:uppercase;line-height:1.7;color:var(--ej-faint,#8b9097);margin:0 0 .4rem}
.loc b{color:var(--ej-ink,#15181c);font-weight:700;margin-right:.3rem}
.loc span{color:var(--ej-muted,#5c636b);font-weight:700;margin:0 .3rem 0 .8rem}
.guia h2{font-family:var(--ej-serif,Georgia,serif);font-weight:600;font-size:1.5rem;line-height:1.25;
         margin:0 0 1rem;color:var(--ej-ink,#15181c);text-wrap:balance}
.guia h3{font-family:var(--ej-serif,Georgia,serif);font-weight:600;font-size:1.15rem;line-height:1.3;
         margin:2.1rem 0 .65rem;color:var(--ej-ink,#15181c);text-wrap:balance}
.tema > p{font-family:var(--pub-ff);font-size:var(--pub-fs);line-height:var(--pub-lh);
          color:var(--ej-ink,#15181c);margin:0 0 1rem}
.lista{margin:0 0 1.1rem;padding-left:1.25rem}
.lista li{font-family:var(--pub-ff);font-size:var(--pub-fs);line-height:var(--pub-lh);margin:0 0 .5rem;padding-left:.15rem}
.lista li::marker{color:var(--ej-faint,#8b9097)}

/* citas: CPCA en tinta, Ley 912 en gris; las dos llevan al texto */
a.cn,a.cv{white-space:nowrap;text-decoration-line:underline;text-decoration-thickness:1px;
          text-underline-offset:3px;font-variant-numeric:tabular-nums}
a.cn{color:var(--ej-ink,#15181c);text-decoration-style:dotted;text-decoration-color:var(--ej-faint,#8b9097)}
a.cv{color:var(--ej-muted,#5c636b);text-decoration-style:dashed;text-decoration-color:#b9bec4}
a.cn:hover,a.cv:hover{background:#fdf3d5;color:var(--ej-ink,#15181c);text-decoration-style:solid}
.guia a:focus-visible{outline:2px solid var(--ej-primary,#1b1e23);outline-offset:2px;border-radius:2px}

/* cuadros comparativos: tabla en pantallas anchas, fichas apiladas en el celular */
.tabla{margin:1.25rem 0 1.6rem}
.cmp{width:100%;border-collapse:separate;border-spacing:0;background:var(--ej-white,#fff);
     border:1px solid var(--ej-line,#d8dbdf);border-radius:var(--ej-r-lg,12px);font-size:.9rem;line-height:1.5}
.cmp thead th{font-size:.68rem;letter-spacing:.07em;text-transform:uppercase;color:var(--ej-faint,#8b9097);
              font-weight:600;text-align:left;padding:.7rem .85rem .6rem;border-bottom:1px solid var(--ej-line,#d8dbdf)}
.cmp thead th a{text-transform:none;letter-spacing:0}
.cmp tbody th{font-weight:600;text-align:left;vertical-align:top;padding:.75rem .85rem;color:var(--ej-ink,#15181c)}
.cmp td{vertical-align:top;padding:.75rem .85rem}
.cmp tbody tr + tr > *{border-top:1px solid var(--ej-line-soft,#eef0f2)}
.cmp td.v{color:var(--ej-muted,#5c636b)}
.cmp td.n{color:var(--ej-ink,#15181c)}
.cmp .sin{color:var(--ej-faint,#8b9097);font-style:italic}
.plz td,.plz tbody th{font-variant-numeric:tabular-nums}
.plz tbody th{font-weight:500}
.nuevo{display:inline-block;font-family:var(--ej-sans,system-ui,sans-serif);font-style:normal;
       font-size:.64rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;line-height:1.5;
       background:#fdf3d5;color:#5c4400;padding:0 .4rem;border-radius:4px;margin-right:.35rem;vertical-align:.1em}
.pz{font-family:var(--ej-sans,system-ui,sans-serif);font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}

@media (min-width:40rem){
  .cmp tbody th{width:22%}
  .cmp td.v{width:35%;background:#fafbfb}
  .cmp-dos td.n{width:39%}
  .plz tbody th{width:40%}
  .plz td.v{width:30%}
}
@media (max-width:39.99rem){
  .cmp thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  .cmp,.cmp tbody,.cmp tr,.cmp tbody th,.cmp td{display:block}
  .cmp tbody tr + tr > *{border-top:0}
  .cmp tbody tr + tr{border-top:1px solid var(--ej-line,#d8dbdf)}
  .cmp tbody th{padding:.8rem .95rem .15rem;font-size:.95rem}
  .cmp td{padding:.4rem .95rem .55rem}
  .cmp td:last-child{padding-bottom:.85rem}
  .cmp td::before{content:attr(data-l);display:block;font-size:.64rem;font-weight:700;letter-spacing:.08em;
                  text-transform:uppercase;color:var(--ej-faint,#8b9097);margin-bottom:.1rem}
}

/* puntos de control: es una lista para tildar, y se ve como tal */
.control{margin:1.6rem 0 0;padding:1rem 1.15rem 1.1rem;background:var(--ej-white,#fff);
         border:1px solid var(--ej-line,#d8dbdf);border-radius:var(--ej-r-lg,12px)}
.control-t{font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ej-faint,#8b9097);
           font-weight:700;margin:0 0 .65rem}
.control ul{list-style:none;margin:0;padding:0;display:grid;gap:.6rem}
.control li{position:relative;padding-left:1.7rem;font-size:.93rem;line-height:1.5;color:var(--ej-ink,#15181c)}
.control li::before{content:"";position:absolute;left:0;top:.22em;width:.95em;height:.95em;
                    border:1.5px solid #9aa0a6;border-radius:3px}

/* etapas: solo donde el orden es el del procedimiento */
.etapas{list-style:none;counter-reset:et;margin:1.5rem 0 1.4rem;padding:0}
.etapas > li{counter-increment:et;position:relative;padding:0 0 1.2rem 2.85rem}
.etapas > li::before{content:counter(et);position:absolute;left:0;top:0;width:1.9rem;height:1.9rem;
  display:grid;place-items:center;border-radius:50%;border:1.5px solid var(--ej-primary,#1b1e23);
  background:var(--ej-bg,#f6f7f8);color:var(--ej-primary,#1b1e23);font-size:.82rem;font-weight:700;
  font-variant-numeric:tabular-nums;z-index:1}
.etapas > li::after{content:"";position:absolute;left:.94rem;top:1.9rem;bottom:0;width:1.5px;background:var(--ej-line,#d8dbdf)}
.etapas > li:last-child{padding-bottom:0}
.etapas > li:last-child::after{display:none}
.etapas h4{font-family:var(--ej-serif,Georgia,serif);font-size:1.06rem;font-weight:600;line-height:1.3;
           margin:.25rem 0 .3rem;color:var(--ej-ink,#15181c)}
.etapas p{margin:0;font-size:.94rem;line-height:1.58;color:#30353b}

.cols{list-style:none;margin:1rem 0 1.25rem;padding:.7rem 1.15rem;background:var(--ej-white,#fff);
      border:1px solid var(--ej-line,#d8dbdf);border-radius:var(--ej-r-lg,12px);
      columns:2 15rem;column-gap:1.75rem;font-size:.9rem;line-height:1.4}
.cols li{break-inside:avoid;padding:.34rem 0;border-bottom:1px solid var(--ej-line-soft,#eef0f2)}

.ctx{margin:1.3rem 0 1.8rem;padding:.95rem 1.15rem;background:var(--ej-white,#fff);
     border:1px solid var(--ej-line,#d8dbdf);border-radius:var(--ej-r-lg,12px);
     display:flex;flex-wrap:wrap;align-items:center;gap:.7rem 1.4rem}
.ctx p{margin:0;flex:1 1 22rem;font-size:.9rem;line-height:1.55;color:var(--ej-muted,#5c636b)}
.ctx p:last-child{flex:0 0 auto}
.ctx p:last-child a{display:inline-block;padding:.55rem .95rem;border-radius:var(--ej-r-md,8px);
                    background:var(--ej-primary,#1b1e23);color:#fff;text-decoration:none;font-size:.88rem}
.ctx strong{color:var(--ej-ink,#15181c)}

.faq{border-bottom:1px solid var(--ej-line,#d8dbdf)}
.faq:first-of-type{border-top:1px solid var(--ej-line,#d8dbdf)}
.faq summary{cursor:pointer;list-style:none;position:relative;padding:.9rem 2.2rem .9rem 0;
             font-family:var(--ej-serif,Georgia,serif);font-size:1.04rem;font-weight:600;line-height:1.35;color:var(--ej-ink,#15181c)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:.25rem;top:.72rem;font:400 1.3rem/1 var(--ej-sans,system-ui,sans-serif);color:var(--ej-faint,#8b9097)}
.faq[open] summary::after{content:"\2013"}
.faq summary:focus-visible{outline:2px solid var(--ej-primary,#1b1e23);outline-offset:2px}
.faq div p{margin:0 0 1rem;font-family:var(--pub-ff);font-size:1rem;line-height:1.6;color:var(--ej-ink,#15181c)}

.fuentes h2{font-size:1.15rem}
.tema.fuentes > p{font-family:var(--ej-sans,system-ui,sans-serif);font-size:.86rem;line-height:1.6;color:var(--ej-muted,#5c636b)}
.fuentes a{color:var(--ej-muted,#5c636b)}

@media (min-width:40rem){
  .guia h1{font-size:2.15rem}
  .guia h2{font-size:1.72rem}
  .toc{grid-template-columns:1fr 1fr}
}
/* la guia se enlaza desde la portada de su norma (y desde el hub, como card) */
.portada .guia-card{margin-top:1.1rem}
/* en el shell PAGO el llamado contextual a EJUR sobra, igual que el CTA */
.emb.app .ctx{display:none}

/* --- enlace a la guia comparativa desde cada articulo --- */
.guia-art{margin:1rem 0 0;padding:.8rem 1rem .85rem;background:var(--ej-white,#fff);
          border:1px solid var(--ej-line,#d8dbdf);border-radius:var(--ej-r-md,8px);font-size:.9rem;line-height:1.45}
.guia-art span{display:block;font-size:.68rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
               color:var(--ej-faint,#8b9097);margin-bottom:.35rem}
.guia-art ul{list-style:none;margin:0;padding:0;display:grid;gap:.3rem}
.guia-art a{color:var(--ej-ink,#15181c);text-underline-offset:3px}
.guia-art a:hover{text-decoration-thickness:2px}
