/* ============================================================
   BLOG · 04 ARCHIVO — hoja de contactos que cambia de página con una ola de oro
   Todo con scope bajo #archivo (prefijo ar-)
   ============================================================ */
#archivo{--ar-bar-top:var(--nav-h);--ar-hair:rgba(216,166,70,.26);--ar-bar-h:0px;
  position:relative;overflow-x:clip;isolation:isolate;
  background:linear-gradient(180deg,var(--ink) 0,rgba(5,9,15,0) 260px),radial-gradient(90% 60% at 85% 12%,rgba(16,39,58,.55) 0%,rgba(5,9,15,0) 60%),var(--ink); /* integrador: sin costura con destacados */
  padding-block:clamp(84px,10vw,160px) clamp(84px,9vw,150px)}
#archivo .ar-defs{position:absolute;width:0;height:0;overflow:hidden}

/* ---------- Fondo: papel con oro, muy tenue ---------- */
#archivo .ar-bg{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
#archivo .ar-bg img,#archivo .ar-bg__v{position:absolute;right:-4%;top:0;width:min(72vw,1100px);height:auto;opacity:.13;
  filter:saturate(.8);-webkit-mask-image:radial-gradient(70% 70% at 70% 30%,#000 30%,transparent 75%);mask-image:radial-gradient(70% 70% at 70% 30%,#000 30%,transparent 75%)}
/* video del papel con oro (mismo encuadre que la imagen): aparece encima del póster solo cuando ya corre */
#archivo .ar-bg__v{aspect-ratio:3/2;object-fit:cover;opacity:0;transition:opacity 1.2s ease}
#archivo .ar-bg__v.is-on{opacity:.16}

/* ---------- Encabezado + folio gigante ---------- */
#archivo .ar-head{display:flex;align-items:flex-end;justify-content:space-between;gap:clamp(24px,4vw,64px);margin-bottom:clamp(30px,4vw,56px)}
#archivo .ar-head__txt{max-width:640px}
#archivo .ar-title{margin:18px 0 0;font-size:clamp(3rem,8.4vw,8.2rem);line-height:.9}
#archivo .ar-lead{margin-top:20px;max-width:46ch}
#archivo .ar-big{margin:0 clamp(0px,3vw,56px) -.08em 0;display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none;line-height:1}
#archivo .ar-big[hidden]{display:none}
#archivo .ar-big__k{font:700 .72rem/1 var(--sans);letter-spacing:.28em;text-transform:uppercase;color:var(--gold-2)}
#archivo .ar-big__n{display:flex;align-items:baseline;gap:.08em;font:400 clamp(4.4rem,10vw,10.5rem)/.82 var(--serif);font-variation-settings:"opsz" 144;letter-spacing:-.04em;
  color:transparent;-webkit-text-stroke:1.2px rgba(216,166,70,.62)}
#archivo .ar-big__n span{display:inline-block;font-variant-numeric:lining-nums tabular-nums}
#archivo .ar-big__n [data-big="n"]{color:rgba(216,166,70,.08);-webkit-text-stroke-color:var(--gold-2)}
#archivo .ar-big__n i{font-style:italic;font-size:.5em;-webkit-text-stroke:0;color:var(--gold-3);margin:0 .1em}

/* ---------- Barra pegajosa: buscador + tomos + conteo ---------- */
#archivo .ar-bar{position:sticky;top:var(--ar-bar-top);z-index:20;margin:0 calc(50% - 50vw) clamp(14px,1.6vw,22px);padding:12px calc(50vw - 50%);
  transition:top .7s var(--ease),background-color .4s,border-color .4s;border-bottom:1px solid transparent}
#archivo .ar-bar[hidden]{display:none}
html:has(#nav.is-hidden) #archivo .ar-bar{--ar-bar-top:0px}
#archivo .ar-bar.is-stuck{background:rgba(5,9,15,.92);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);border-color:var(--ar-hair)}
#archivo.is-low .ar-bar.is-stuck{background:rgba(5,9,15,.97);backdrop-filter:none;-webkit-backdrop-filter:none}
#archivo .ar-bar__in{display:flex;align-items:center;gap:clamp(12px,1.6vw,22px)}

#archivo .ar-search{position:relative;flex:0 1 360px;min-width:220px;margin:0}
#archivo .ar-search__ico{position:absolute;left:16px;top:50%;width:19px;height:19px;margin-top:-9.5px;fill:none;stroke:var(--gold-2);stroke-width:1.7;stroke-linecap:round;pointer-events:none}
#archivo .ar-search__in{width:100%;min-height:48px;padding:12px 48px 12px 46px;border:1px solid var(--line-2);border-radius:999px;background:rgba(5,9,15,.6);
  color:var(--cream);font:500 1rem/1.2 var(--sans);-webkit-appearance:none;appearance:none;transition:border-color .3s,box-shadow .3s,background-color .3s}
#archivo .ar-search__in::-webkit-search-cancel-button,#archivo .ar-search__in::-webkit-search-decoration{-webkit-appearance:none;appearance:none}
#archivo .ar-search__in::placeholder{color:var(--mute);opacity:1}
#archivo .ar-search__in:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(216,166,70,.2);background:rgba(8,18,28,.9)}
#archivo .ar-search__x{position:absolute;right:2px;top:50%;width:44px;height:44px;margin-top:-22px;display:grid;place-items:center;border:0;border-radius:50%;background:none;color:var(--cream-2);cursor:pointer}
#archivo .ar-search__x[hidden]{display:none}
#archivo .ar-search__x svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
#archivo .ar-search__x:hover{color:var(--gold-2)}

#archivo .ar-chips{position:relative;flex:1 1 auto;min-width:0}
#archivo .ar-chips__row{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;padding:2px}
#archivo .ar-chips__row::-webkit-scrollbar{display:none}
#archivo .ar-chip{min-height:44px;padding:8px 16px 8px 13px;gap:9px;cursor:pointer;flex:none;transition:background-color .35s,border-color .35s,color .35s}
#archivo .ar-chip b{font-size:.78rem;color:var(--gold-2);opacity:.9}
#archivo .ar-chip:hover{border-color:var(--gold);color:var(--gold-2)}
#archivo .ar-chip[aria-selected="true"]{background:linear-gradient(135deg,#f7e2a8,#d8a646 55%,#b8862f);border-color:transparent;color:#1a1204}
#archivo .ar-chip[aria-selected="true"] b{color:#1a1204;opacity:.75}
#archivo .ar-glifo{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
#archivo .ar-chip .ar-glifo{color:var(--gold-2)}
#archivo .ar-chip[aria-selected="true"] .ar-glifo{color:#1a1204}
#archivo .ar-chips__more{display:none}

#archivo .ar-meta{display:flex;align-items:center;gap:18px;margin:0 0 clamp(18px,2vw,28px)}
#archivo .ar-mini{display:none}
#archivo .ar-tomos{display:none}
#archivo .ar-count{flex:1;min-width:0;display:flex;align-items:center;gap:14px;margin:0;font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-2);white-space:nowrap}
#archivo .ar-count:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--ar-hair),rgba(216,166,70,0))}
#archivo .ar-count:empty{display:none}
#archivo .ar-count b{color:var(--gold-2)}

/* ---------- Escenario + retícula ---------- */
#archivo .ar-stage{position:relative}
#archivo .ar-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2vw,30px)}
#archivo .ar-card{position:relative;display:flex;flex-direction:column;min-width:0;color:var(--cream)}
#archivo .ar-card[hidden]{display:none}

#archivo .ar-card__media{position:relative;overflow:hidden;border-radius:var(--r-sm);aspect-ratio:16/10;background:linear-gradient(135deg,var(--ink-3),#2a2010);
  box-shadow:inset 0 0 0 1px var(--ar-hair)}
#archivo .ar-card__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
#archivo .ar-card__img{filter:grayscale(1) sepia(.35) contrast(1.05) brightness(.8)}
#archivo .ar-card__tint{position:absolute;inset:0;background:linear-gradient(160deg,#F4D58A 0%,#D8A646 45%,#7a5518 100%);mix-blend-mode:color;opacity:.62;pointer-events:none}
/* «revelado»: de oro apagado a oro brillante (no al color original: hay portadas cian/magenta de la identidad vieja) */
#archivo .ar-card__color{clip-path:polygon(0% 0%,0% 0%,-45% 100%,-45% 100%);transition:clip-path .8s var(--ease),transform 1.2s var(--ease);
  filter:grayscale(1) sepia(.9) saturate(1.55) hue-rotate(-4deg) contrast(1.1) brightness(1.04)}
#archivo .ar-card__media:after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(216,166,70,.32);pointer-events:none}
#archivo .ar-card:hover .ar-card__color,#archivo .ar-card:focus-within .ar-card__color,#archivo .ar-card.is-lit .ar-card__color{clip-path:polygon(0% 0%,145% 0%,100% 100%,-45% 100%)}
#archivo .ar-card:hover .ar-card__media img,#archivo .ar-card:focus-within .ar-card__media img{transform:scale(1.04)}

#archivo .ar-card__body{display:flex;flex-direction:column;gap:12px;padding-top:18px;min-width:0;flex:1}
#archivo .ar-card__meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0;font:700 .74rem/1.2 var(--sans);letter-spacing:.14em;text-transform:uppercase}
#archivo .ar-cat{display:inline-flex;align-items:center;gap:8px;color:var(--gold-2);min-width:0}
#archivo .ar-cat .ar-glifo{width:16px;height:16px}
#archivo .ar-folio{flex:none;font-size:.76rem;letter-spacing:.08em;color:var(--cream-2)}
#archivo .ar-folio i{font-style:normal;color:var(--gold-3);margin:0 .15em}
#archivo .ar-card__t{margin:0;font:500 clamp(1.25rem,1.5vw,1.5rem)/1.18 var(--serif);letter-spacing:-.012em;color:var(--cream);text-wrap:pretty}
#archivo .ar-card__t a{color:inherit;background:linear-gradient(var(--gold-2),var(--gold-2)) 0 100%/0 1px no-repeat;transition:background-size .7s var(--ease),color .4s}
#archivo .ar-card__t a:after{content:"";position:absolute;inset:0;z-index:2;border-radius:var(--r-sm)}
#archivo .ar-card__t a:focus-visible{outline:none}
#archivo .ar-card__t a:focus-visible:after{outline:2px solid var(--gold-2);outline-offset:6px}
#archivo .ar-card:hover .ar-card__t a{background-size:100% 1px;color:var(--gold-2)}
#archivo .ar-card__d{margin:0;font-size:.95rem;line-height:1.58;color:var(--cream-2);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}
#archivo .ar-card__go{margin-top:auto;display:inline-flex;align-items:center;gap:.5em;min-height:24px;font:700 .82rem/1 var(--sans);letter-spacing:.04em;color:var(--gold-2)}
#archivo .ar-card__go i{font-style:normal;transition:transform .6s var(--ease)}
#archivo .ar-card:hover .ar-card__go i,#archivo .ar-card:focus-within .ar-card__go i{transform:translateX(6px)}

/* ---------- Vacío ---------- */
#archivo .ar-empty{padding:clamp(48px,8vw,110px) clamp(20px,4vw,60px);text-align:center;border:1px solid var(--ar-hair);border-radius:var(--r);background:rgba(13,27,40,.4)}
#archivo .ar-empty[hidden]{display:none}
#archivo .ar-stage.is-empty{min-height:60vh}
#archivo .ar-empty__t{margin:0 auto 26px;max-width:40ch;font:400 clamp(1.25rem,2vw,1.7rem)/1.35 var(--serif);color:var(--cream)}
#archivo .ar-empty__t q{quotes:none;color:var(--gold-2);font-style:italic}
#archivo .ar-empty__b{min-height:48px}

/* ---------- La ola de oro líquido ---------- */
#archivo .ar-wave{position:absolute;inset:-14px -10px;z-index:10;pointer-events:none;visibility:hidden;clip-path:polygon(0 0,0 0,0 100%,0 100%)}
#archivo .ar-wave.is-on,#archivo .ar-wave-rim.is-on{visibility:visible}
#archivo .ar-wave-rim{position:absolute;inset:-14px -10px;z-index:11;pointer-events:none;visibility:hidden;clip-path:polygon(0 0,0 0,0 100%,0 100%);
  background:linear-gradient(180deg,#FFFBEA,#F4D58A 35%,#FFF3CF 62%,#E8C371)}
/* frente brillante: banda de oro translúcido (gold-2→gold, ~35 %) que precede al borde */
#archivo .ar-wave-glow{position:absolute;inset:-14px -10px;z-index:9;pointer-events:none;visibility:hidden;clip-path:polygon(0 0,0 0,0 100%,0 100%);
  background:linear-gradient(90deg,rgba(244,213,138,.42),rgba(216,166,70,.3) 45%,rgba(216,166,70,.08));mix-blend-mode:screen}
#archivo .ar-wave-glow.is-dir-r{background:linear-gradient(270deg,rgba(244,213,138,.42),rgba(216,166,70,.3) 45%,rgba(216,166,70,.08))}
#archivo .ar-wave-glow.is-on{visibility:visible}
html.reduce #archivo .ar-wave-glow{display:none}
html.reduce #archivo .ar-wave-rim{display:none}
#archivo .ar-wave__liq,#archivo .ar-wave__sheen{position:absolute;inset:-30px}
#archivo .ar-wave__liq{background:
  radial-gradient(60% 40% at 30% 30%,rgba(255,246,216,.85),rgba(255,246,216,0) 60%),
  radial-gradient(50% 50% at 75% 70%,rgba(143,101,32,.75),rgba(143,101,32,0) 70%),
  linear-gradient(100deg,#8F6520 0%,#D8A646 22%,#F4D58A 40%,#E0B661 55%,#F7E2A8 70%,#B8862F 88%,#7a5518 100%);
  background-size:100% 100%,100% 100%,180% 100%}
#archivo:not(.is-low) .ar-wave__liq{filter:url(#ar-liq)}
#archivo .ar-wave__sheen{background:repeating-linear-gradient(100deg,rgba(255,255,255,0) 0 60px,rgba(255,250,230,.18) 70px,rgba(255,255,255,0) 90px 160px);mix-blend-mode:overlay}

/* ---------- Paginación ---------- */
#archivo .ar-pag{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:clamp(36px,4.5vw,64px)}
#archivo .ar-pag[hidden]{display:none}
#archivo .ar-pag__nums{display:flex;gap:8px;list-style:none;margin:0;padding:2px}
#archivo .ar-pag__nums button,#archivo .ar-pag__arrow{min-width:48px;height:48px;padding:0 14px;display:inline-grid;place-items:center;border:1px solid var(--line-2);border-radius:999px;
  background:rgba(5,9,15,.55);color:var(--cream);font:700 .95rem/1 var(--sans);font-variant-numeric:tabular-nums lining-nums;cursor:pointer;
  transition:background-color .35s,border-color .35s,color .35s,opacity .35s}
#archivo .ar-pag__nums button:hover,#archivo .ar-pag__arrow:hover:not(:disabled){border-color:var(--gold);color:var(--gold-2)}
#archivo .ar-pag__nums button[aria-current="page"]{background:linear-gradient(135deg,#f7e2a8,#d8a646 55%,#b8862f);border-color:transparent;color:#1a1204;box-shadow:0 10px 30px -12px rgba(216,166,70,.75)}
#archivo .ar-pag__arrow{font-size:1.15rem}
#archivo .ar-pag__arrow:disabled{opacity:.3;cursor:default}
#archivo .ar-pag__m,#archivo .ar-pag__cnt{display:none}

/* ============================================================
   ESCRITORIO con JS (≥900): retícula editorial 1 grande + 3 en columna
   ============================================================ */
@media (min-width:900px){
  #archivo.is-js .ar-grid{grid-template-columns:minmax(0,.86fr) minmax(0,1fr);grid-auto-rows:minmax(0,auto);column-gap:clamp(30px,3.6vw,64px);row-gap:0;min-height:var(--ar-grid-h,0px)}
  #archivo.is-js .ar-card{grid-column:2;flex-direction:row;align-items:stretch;gap:clamp(18px,1.8vw,28px);padding:clamp(16px,1.6vw,22px) 0;border-top:1px solid var(--ar-hair)}
  #archivo.is-js .ar-card.is-last{border-bottom:1px solid var(--ar-hair)}
  #archivo.is-js .ar-card .ar-card__media{flex:none;width:clamp(124px,12.5vw,190px);aspect-ratio:1/1;height:auto;align-self:flex-start}
  #archivo.is-js .ar-card .ar-card__body{padding-top:2px;gap:9px}
  #archivo.is-js .ar-card .ar-card__t{font-size:clamp(1.12rem,1.3vw,1.32rem);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}
  #archivo.is-js .ar-card .ar-card__d{-webkit-line-clamp:2;line-clamp:2;font-size:.9rem}

  /* tarjeta grande */
  #archivo.is-js .ar-card.is-lead{grid-column:1;grid-row:1 / span 3;flex-direction:column;justify-content:flex-end;padding:0;border:0;border-radius:var(--r);overflow:hidden;min-height:clamp(520px,44vw,680px);isolation:isolate}
  #archivo.is-js .ar-card.is-lead.is-solo{grid-row:auto}
  #archivo.is-js .ar-card.is-lead .ar-card__media{position:absolute;top:0;left:0;width:100%;height:100%;aspect-ratio:auto;border-radius:var(--r);z-index:-1}
  #archivo.is-js .ar-card.is-lead .ar-card__media:before{content:"";position:absolute;inset:0;z-index:3;background:linear-gradient(180deg,rgba(5,9,15,0) 18%,rgba(5,9,15,.55) 40%,rgba(5,9,15,.88) 55%,rgba(5,9,15,.96) 100%);pointer-events:none}
  #archivo.is-js .ar-card.is-lead .ar-card__meta{text-shadow:0 1px 10px rgba(5,9,15,.9)}
  #archivo.is-js .ar-card.is-lead .ar-folio i{color:var(--gold-2)}
  /* paginación rápida junto a «Mostrando…» (escritorio) */
  #archivo.is-js .ar-mini{display:flex;align-items:center;gap:10px;flex:none}
  #archivo.is-js .ar-mini[hidden]{display:none}
  #archivo .ar-mini__b{width:44px;height:44px;display:inline-grid;place-items:center;border:1px solid var(--line-2);border-radius:50%;background:rgba(5,9,15,.55);color:var(--cream);font:700 1rem/1 var(--sans);cursor:pointer;transition:border-color .35s,color .35s,opacity .35s}
  #archivo .ar-mini__b:hover:not(:disabled){border-color:var(--gold);color:var(--gold-2)}
  #archivo .ar-mini__b:disabled{opacity:.3;cursor:default}
  #archivo .ar-mini__c{font:700 .82rem/1 var(--sans);letter-spacing:.12em;color:var(--cream-2);font-variant-numeric:tabular-nums lining-nums}
  #archivo .ar-mini__c b{color:var(--gold-2)}
  #archivo.is-js .ar-card.is-lead .ar-card__body{flex:none;padding:clamp(24px,2.6vw,40px);gap:14px}
  #archivo.is-js .ar-card.is-lead .ar-card__t{font-size:clamp(1.8rem,2.7vw,2.7rem);line-height:1.06;letter-spacing:-.02em;-webkit-line-clamp:4;line-clamp:4}
  #archivo.is-js .ar-card.is-lead .ar-card__d{font-size:1rem;-webkit-line-clamp:3;line-clamp:3;color:var(--cream);opacity:.86;max-width:52ch}
  #archivo.is-js .ar-card.is-lead .ar-card__go{margin-top:6px;font-size:.88rem}
  #archivo.is-js .ar-card.is-lead .ar-folio{color:var(--cream)}
  #archivo.is-js .ar-card.is-lead .ar-card__t a:after{border-radius:var(--r)}
  /* hilo vertical de oro entre columnas */
  #archivo.is-js .ar-stage:before{content:"";position:absolute;top:0;bottom:0;left:var(--ar-x,-20px);width:1px;
    background:linear-gradient(180deg,rgba(216,166,70,0),var(--ar-hair) 12%,var(--ar-hair) 88%,rgba(216,166,70,0));pointer-events:none}
  #archivo.is-js .ar-stage.is-empty:before,#archivo.is-js .ar-stage.is-one:before,#archivo.is-js .ar-stage:not([style*="--ar-x"]):before{display:none}
}
@media (min-width:900px) and (max-width:1100px){
  #archivo .ar-bar__in{flex-wrap:wrap}
  #archivo .ar-search{flex:1 1 280px}
  #archivo .ar-chips{flex:1 1 100%;order:3}
}
@media (min-width:900px) and (max-height:760px){
  #archivo.is-js .ar-card.is-lead{min-height:480px}
  #archivo.is-js .ar-card .ar-card__media{width:clamp(110px,10vw,150px)}
}

/* ============================================================
   CELULAR / TABLETA (<900): lista vertical
   ============================================================ */
@media (max-width:899px){
  #archivo{--ar-bar-top:var(--nav-h)}
  #archivo .ar-head{display:block}
  #archivo .ar-title{font-size:clamp(3rem,17vw,5.4rem)}
  #archivo .ar-big{display:none}
  #archivo .ar-bg img,#archivo .ar-bg__v{width:140vw;right:-40%;opacity:.12}
  #archivo .ar-bg__v{aspect-ratio:2/3;opacity:0}
  #archivo .ar-bg__v.is-on{opacity:.15}
  #archivo .ar-bar{padding:10px var(--gut) 8px}
  #archivo .ar-bar__in{flex-direction:column;align-items:stretch;gap:10px}
  #archivo .ar-search{flex:none;min-width:0;width:100%}
  #archivo .ar-search__in{min-height:50px;font-size:16px}
  #archivo .ar-chips{margin-right:calc(var(--gut)*-1)}
  #archivo .ar-bar{margin-bottom:calc(14px + var(--ar-cut,0px))}
  #archivo .ar-bar.is-stuck{background:var(--ink);backdrop-filter:none;-webkit-backdrop-filter:none}
  #archivo .ar-bar.is-compact .ar-bar__in{flex-direction:row;align-items:center;gap:8px}
  #archivo .ar-bar.is-compact .ar-search{flex:1 1 auto;width:auto;min-width:0}
  #archivo .ar-bar.is-compact .ar-search__in{min-height:46px}
  #archivo .ar-bar.is-compact .ar-chips{display:none}
  #archivo .ar-bar.is-compact .ar-tomos{display:inline-flex;align-items:center;gap:7px;flex:none;max-width:46%;min-height:46px;padding:0 14px 0 12px;
    border:1px solid var(--ar-hair);border-radius:999px;background:rgba(216,166,70,.1);color:var(--gold-2);font:700 .85rem/1 var(--sans);cursor:pointer}
  #archivo .ar-tomos__t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #archivo .ar-tomos__chev{width:14px;height:14px;flex:none;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
  #archivo .ar-chips__row{padding-right:64px;scroll-padding-inline:2px}
  #archivo .ar-chips:after{content:"";position:absolute;right:0;top:0;bottom:0;width:84px;pointer-events:none;
    background:linear-gradient(90deg,rgba(5,9,15,0),rgba(5,9,15,.92) 62%);transition:opacity .3s}
  #archivo .ar-chips.is-end:after{opacity:0}
  #archivo .ar-chips__more{display:grid;place-items:center;position:absolute;right:calc(var(--gut) - 6px);top:50%;z-index:2;width:44px;height:44px;margin-top:-22px;
    border:1px solid var(--ar-hair);border-radius:50%;background:rgba(5,9,15,.92);color:var(--gold-2);font:700 1.3rem/1 var(--sans);cursor:pointer;transition:opacity .3s}
  #archivo .ar-chips.is-end .ar-chips__more{opacity:0;pointer-events:none}
  #archivo .ar-count{font-size:.78rem;letter-spacing:.12em}

  #archivo .ar-grid{grid-template-columns:minmax(0,1fr);gap:18px}
  #archivo .ar-card{padding:0 0 22px;border-bottom:1px solid var(--ar-hair)}
  #archivo .ar-card__body{gap:10px;padding-top:16px}
  #archivo .ar-card__t{font-size:1.35rem}
  /* celular: sin subrayado en todas las líneas; el activo se nota con el color y el revelado */
  #archivo .ar-card__t a,#archivo .ar-card:hover .ar-card__t a{background:none}
  #archivo .ar-card.is-lit .ar-card__t a{color:var(--gold-2)}
  #archivo .ar-card__d{font-size:.95rem}
  #archivo .ar-card__meta{font-size:.78rem;letter-spacing:.12em}
  #archivo .ar-folio{font-size:.75rem}
  #archivo .ar-card__go{min-height:44px;font-size:.9rem}

  #archivo .ar-pag{display:grid;grid-template-columns:48px 1fr 48px;grid-template-areas:"p c n" "l l l";gap:14px 10px;align-items:center}
  #archivo .ar-pag[hidden]{display:none}
  #archivo .ar-pag__prev{grid-area:p}
  #archivo .ar-pag__next{grid-area:n}
  #archivo .ar-pag__cnt{display:block;grid-area:c;text-align:center;font-size:1.1rem;color:var(--cream-2)}
  #archivo .ar-pag__cnt b{color:var(--gold-2);font-size:1.5rem}
  #archivo .ar-pag__nums{grid-area:l;overflow-x:auto;scrollbar-width:none;justify-content:flex-start;padding:2px 2px 4px;scroll-snap-type:x proximity;overscroll-behavior-x:contain}
  #archivo .ar-pag__nums{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);padding-right:36px}
  #archivo .ar-pag__nums.is-end{-webkit-mask-image:none;mask-image:none}
  #archivo .ar-pag__nums button[aria-current="page"]{box-shadow:none}
  #archivo .ar-pag__nums::-webkit-scrollbar{display:none}
  #archivo .ar-pag__nums li{flex:none;scroll-snap-align:center}
  #archivo .ar-pag__arrow{padding:0;font-size:1.5rem}
  #archivo .ar-pag__d{display:none}
  #archivo .ar-pag__m{display:inline}
}
@media (min-width:600px) and (max-width:899px){
  #archivo .ar-grid{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}
}

/* ---------- Movimiento reducido / gama baja ---------- */
html.reduce #archivo .ar-card__color{display:none}
html.reduce #archivo .ar-card__img{filter:grayscale(1) sepia(.35) contrast(1.05) brightness(.95)}
html.reduce #archivo .ar-card__media img{transition:none;transform:none!important}
html.reduce #archivo .ar-wave{display:none}
html.reduce #archivo .ar-bar{transition:none}

/* nav opaco mientras la barra del archivo está pegada (no se transparenta la portada de abajo) */
html.ar-stuck .nav.is-solid{background:var(--ink);backdrop-filter:none;-webkit-backdrop-filter:none}

/* ---------- Portadas de respaldo: oro líquido + glifo del tomo + folio ----------
   Estas 14 portadas traen símbolos cripto (₿ ₽ USDC TETHER) o texto incrustado en inglés / sin tildes.
   Se muestran en oro tipográfico (también sin JS) hasta que el equipo de portadas entregue las nuevas
   en la misma ruta; entonces basta con borrar este bloque. */
#archivo .ar-card__ph{display:none}
#archivo .ar-card:is([data-slug="que-es-una-stablecoin-y-por-que-esta-revolucionando-los-pagos-digitales"],[data-slug="por-que-el-dolar-digital-esta-ganando-popularidad-en-latinoamerica"],[data-slug="pagos-con-stablecoins-para-empresas-como-optimizar-las-operaciones-internacionales"],[data-slug="como-usar-tus-activos-digitales-en-la-vida-diaria-con-una-tarjeta-financiera-moderna"],[data-slug="como-proteger-tu-patrimonio-frente-a-la-inflacion-con-una-estrategia-financiera-diversificada"],[data-slug="que-es-el-fraccionamiento-digital-de-propiedades-y-como-esta-cambiando-la-inversion"],[data-slug="tokenizacion-inmobiliaria-vs-crowdfunding-inmobiliario-cuales-son-las-diferencias"],[data-slug="blockchain-explicado-para-principiantes-guia-completa-para-entender-la-tecnologia"],[data-slug="como-los-pagos-blockchain-reducen-costos-para-empresas-y-emprendedores"],[data-slug="como-blockchain-esta-transformando-las-inversiones-los-pagos-y-los-servicios-fi"],[data-slug="el-ecosistema-financiero-del-futuro-invertir-cobrar-y-gastar-desde-una-sola-pla"],[data-slug="pagos-masivos-a-empleados-o-empresas-como-automatizar-la-dispersion"],[data-slug="ley-fintech-mexico-y-tokenizacion-regulacion-completa-2026"],[data-slug="cuanto-cuesta-un-wire-transfer-a-mexico-desglose-real-de-comisiones-en-2026"]) .ar-card__img,#archivo .ar-card:is([data-slug="que-es-una-stablecoin-y-por-que-esta-revolucionando-los-pagos-digitales"],[data-slug="por-que-el-dolar-digital-esta-ganando-popularidad-en-latinoamerica"],[data-slug="pagos-con-stablecoins-para-empresas-como-optimizar-las-operaciones-internacionales"],[data-slug="como-usar-tus-activos-digitales-en-la-vida-diaria-con-una-tarjeta-financiera-moderna"],[data-slug="como-proteger-tu-patrimonio-frente-a-la-inflacion-con-una-estrategia-financiera-diversificada"],[data-slug="que-es-el-fraccionamiento-digital-de-propiedades-y-como-esta-cambiando-la-inversion"],[data-slug="tokenizacion-inmobiliaria-vs-crowdfunding-inmobiliario-cuales-son-las-diferencias"],[data-slug="blockchain-explicado-para-principiantes-guia-completa-para-entender-la-tecnologia"],[data-slug="como-los-pagos-blockchain-reducen-costos-para-empresas-y-emprendedores"],[data-slug="como-blockchain-esta-transformando-las-inversiones-los-pagos-y-los-servicios-fi"],[data-slug="el-ecosistema-financiero-del-futuro-invertir-cobrar-y-gastar-desde-una-sola-pla"],[data-slug="pagos-masivos-a-empleados-o-empresas-como-automatizar-la-dispersion"],[data-slug="ley-fintech-mexico-y-tokenizacion-regulacion-completa-2026"],[data-slug="cuanto-cuesta-un-wire-transfer-a-mexico-desglose-real-de-comisiones-en-2026"]) .ar-card__color,#archivo .ar-card:is([data-slug="que-es-una-stablecoin-y-por-que-esta-revolucionando-los-pagos-digitales"],[data-slug="por-que-el-dolar-digital-esta-ganando-popularidad-en-latinoamerica"],[data-slug="pagos-con-stablecoins-para-empresas-como-optimizar-las-operaciones-internacionales"],[data-slug="como-usar-tus-activos-digitales-en-la-vida-diaria-con-una-tarjeta-financiera-moderna"],[data-slug="como-proteger-tu-patrimonio-frente-a-la-inflacion-con-una-estrategia-financiera-diversificada"],[data-slug="que-es-el-fraccionamiento-digital-de-propiedades-y-como-esta-cambiando-la-inversion"],[data-slug="tokenizacion-inmobiliaria-vs-crowdfunding-inmobiliario-cuales-son-las-diferencias"],[data-slug="blockchain-explicado-para-principiantes-guia-completa-para-entender-la-tecnologia"],[data-slug="como-los-pagos-blockchain-reducen-costos-para-empresas-y-emprendedores"],[data-slug="como-blockchain-esta-transformando-las-inversiones-los-pagos-y-los-servicios-fi"],[data-slug="el-ecosistema-financiero-del-futuro-invertir-cobrar-y-gastar-desde-una-sola-pla"],[data-slug="pagos-masivos-a-empleados-o-empresas-como-automatizar-la-dispersion"],[data-slug="ley-fintech-mexico-y-tokenizacion-regulacion-completa-2026"],[data-slug="cuanto-cuesta-un-wire-transfer-a-mexico-desglose-real-de-comisiones-en-2026"]) .ar-card__tint{display:none}
#archivo .ar-card:is([data-slug="que-es-una-stablecoin-y-por-que-esta-revolucionando-los-pagos-digitales"],[data-slug="por-que-el-dolar-digital-esta-ganando-popularidad-en-latinoamerica"],[data-slug="pagos-con-stablecoins-para-empresas-como-optimizar-las-operaciones-internacionales"],[data-slug="como-usar-tus-activos-digitales-en-la-vida-diaria-con-una-tarjeta-financiera-moderna"],[data-slug="como-proteger-tu-patrimonio-frente-a-la-inflacion-con-una-estrategia-financiera-diversificada"],[data-slug="que-es-el-fraccionamiento-digital-de-propiedades-y-como-esta-cambiando-la-inversion"],[data-slug="tokenizacion-inmobiliaria-vs-crowdfunding-inmobiliario-cuales-son-las-diferencias"],[data-slug="blockchain-explicado-para-principiantes-guia-completa-para-entender-la-tecnologia"],[data-slug="como-los-pagos-blockchain-reducen-costos-para-empresas-y-emprendedores"],[data-slug="como-blockchain-esta-transformando-las-inversiones-los-pagos-y-los-servicios-fi"],[data-slug="el-ecosistema-financiero-del-futuro-invertir-cobrar-y-gastar-desde-una-sola-pla"],[data-slug="pagos-masivos-a-empleados-o-empresas-como-automatizar-la-dispersion"],[data-slug="ley-fintech-mexico-y-tokenizacion-regulacion-completa-2026"],[data-slug="cuanto-cuesta-un-wire-transfer-a-mexico-desglose-real-de-comisiones-en-2026"]) .ar-card__media{background:
  radial-gradient(120% 90% at 85% 110%,rgba(5,9,15,.15),rgba(5,9,15,.82) 70%),
  url("../../../assets/img/gen/hub-oro-liquido-768.webp") var(--ar-ph-pos,30% 60%)/var(--ar-ph-size,190%) no-repeat,
  linear-gradient(140deg,#0b141f,#2a2010 60%,#8f6520)}
#archivo .ar-card:is([data-slug="que-es-una-stablecoin-y-por-que-esta-revolucionando-los-pagos-digitales"],[data-slug="por-que-el-dolar-digital-esta-ganando-popularidad-en-latinoamerica"],[data-slug="pagos-con-stablecoins-para-empresas-como-optimizar-las-operaciones-internacionales"],[data-slug="como-usar-tus-activos-digitales-en-la-vida-diaria-con-una-tarjeta-financiera-moderna"],[data-slug="como-proteger-tu-patrimonio-frente-a-la-inflacion-con-una-estrategia-financiera-diversificada"],[data-slug="que-es-el-fraccionamiento-digital-de-propiedades-y-como-esta-cambiando-la-inversion"],[data-slug="tokenizacion-inmobiliaria-vs-crowdfunding-inmobiliario-cuales-son-las-diferencias"],[data-slug="blockchain-explicado-para-principiantes-guia-completa-para-entender-la-tecnologia"],[data-slug="como-los-pagos-blockchain-reducen-costos-para-empresas-y-emprendedores"],[data-slug="como-blockchain-esta-transformando-las-inversiones-los-pagos-y-los-servicios-fi"],[data-slug="el-ecosistema-financiero-del-futuro-invertir-cobrar-y-gastar-desde-una-sola-pla"],[data-slug="pagos-masivos-a-empleados-o-empresas-como-automatizar-la-dispersion"],[data-slug="ley-fintech-mexico-y-tokenizacion-regulacion-completa-2026"],[data-slug="cuanto-cuesta-un-wire-transfer-a-mexico-desglose-real-de-comisiones-en-2026"]) .ar-card__ph{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:space-between;padding:clamp(14px,1.6vw,22px);pointer-events:none}
#archivo .ar-card:is([data-slug="que-es-una-stablecoin-y-por-que-esta-revolucionando-los-pagos-digitales"],[data-slug="por-que-el-dolar-digital-esta-ganando-popularidad-en-latinoamerica"],[data-slug="pagos-con-stablecoins-para-empresas-como-optimizar-las-operaciones-internacionales"],[data-slug="como-usar-tus-activos-digitales-en-la-vida-diaria-con-una-tarjeta-financiera-moderna"],[data-slug="como-proteger-tu-patrimonio-frente-a-la-inflacion-con-una-estrategia-financiera-diversificada"],[data-slug="que-es-el-fraccionamiento-digital-de-propiedades-y-como-esta-cambiando-la-inversion"],[data-slug="tokenizacion-inmobiliaria-vs-crowdfunding-inmobiliario-cuales-son-las-diferencias"],[data-slug="blockchain-explicado-para-principiantes-guia-completa-para-entender-la-tecnologia"],[data-slug="como-los-pagos-blockchain-reducen-costos-para-empresas-y-emprendedores"],[data-slug="como-blockchain-esta-transformando-las-inversiones-los-pagos-y-los-servicios-fi"],[data-slug="el-ecosistema-financiero-del-futuro-invertir-cobrar-y-gastar-desde-una-sola-pla"],[data-slug="pagos-masivos-a-empleados-o-empresas-como-automatizar-la-dispersion"],[data-slug="ley-fintech-mexico-y-tokenizacion-regulacion-completa-2026"],[data-slug="cuanto-cuesta-un-wire-transfer-a-mexico-desglose-real-de-comisiones-en-2026"]) .ar-card__ph .ar-glifo{width:clamp(34px,3.4vw,52px);height:auto;aspect-ratio:1;color:var(--gold-2);stroke-width:1.2;filter:drop-shadow(0 2px 12px rgba(5,9,15,.7))}
#archivo .ar-card:is([data-slug="que-es-una-stablecoin-y-por-que-esta-revolucionando-los-pagos-digitales"],[data-slug="por-que-el-dolar-digital-esta-ganando-popularidad-en-latinoamerica"],[data-slug="pagos-con-stablecoins-para-empresas-como-optimizar-las-operaciones-internacionales"],[data-slug="como-usar-tus-activos-digitales-en-la-vida-diaria-con-una-tarjeta-financiera-moderna"],[data-slug="como-proteger-tu-patrimonio-frente-a-la-inflacion-con-una-estrategia-financiera-diversificada"],[data-slug="que-es-el-fraccionamiento-digital-de-propiedades-y-como-esta-cambiando-la-inversion"],[data-slug="tokenizacion-inmobiliaria-vs-crowdfunding-inmobiliario-cuales-son-las-diferencias"],[data-slug="blockchain-explicado-para-principiantes-guia-completa-para-entender-la-tecnologia"],[data-slug="como-los-pagos-blockchain-reducen-costos-para-empresas-y-emprendedores"],[data-slug="como-blockchain-esta-transformando-las-inversiones-los-pagos-y-los-servicios-fi"],[data-slug="el-ecosistema-financiero-del-futuro-invertir-cobrar-y-gastar-desde-una-sola-pla"],[data-slug="pagos-masivos-a-empleados-o-empresas-como-automatizar-la-dispersion"],[data-slug="ley-fintech-mexico-y-tokenizacion-regulacion-completa-2026"],[data-slug="cuanto-cuesta-un-wire-transfer-a-mexico-desglose-real-de-comisiones-en-2026"]) .ar-card__ph b{font:400 clamp(2.6rem,5vw,4.6rem)/.8 var(--serif);letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.1px rgba(244,213,138,.85);font-variant-numeric:lining-nums tabular-nums}
#archivo .ar-card:nth-child(3n+1){--ar-ph-pos:20% 70%;--ar-ph-size:200%}
#archivo .ar-card:nth-child(3n+2){--ar-ph-pos:70% 30%;--ar-ph-size:240%}
#archivo .ar-card:nth-child(3n){--ar-ph-pos:45% 85%;--ar-ph-size:170%}
@media (min-width:900px){
  #archivo.is-js .ar-card.is-lead:is([data-slug="que-es-una-stablecoin-y-por-que-esta-revolucionando-los-pagos-digitales"],[data-slug="por-que-el-dolar-digital-esta-ganando-popularidad-en-latinoamerica"],[data-slug="pagos-con-stablecoins-para-empresas-como-optimizar-las-operaciones-internacionales"],[data-slug="como-usar-tus-activos-digitales-en-la-vida-diaria-con-una-tarjeta-financiera-moderna"],[data-slug="como-proteger-tu-patrimonio-frente-a-la-inflacion-con-una-estrategia-financiera-diversificada"],[data-slug="que-es-el-fraccionamiento-digital-de-propiedades-y-como-esta-cambiando-la-inversion"],[data-slug="tokenizacion-inmobiliaria-vs-crowdfunding-inmobiliario-cuales-son-las-diferencias"],[data-slug="blockchain-explicado-para-principiantes-guia-completa-para-entender-la-tecnologia"],[data-slug="como-los-pagos-blockchain-reducen-costos-para-empresas-y-emprendedores"],[data-slug="como-blockchain-esta-transformando-las-inversiones-los-pagos-y-los-servicios-fi"],[data-slug="el-ecosistema-financiero-del-futuro-invertir-cobrar-y-gastar-desde-una-sola-pla"],[data-slug="pagos-masivos-a-empleados-o-empresas-como-automatizar-la-dispersion"],[data-slug="ley-fintech-mexico-y-tokenizacion-regulacion-completa-2026"],[data-slug="cuanto-cuesta-un-wire-transfer-a-mexico-desglose-real-de-comisiones-en-2026"]) .ar-card__ph{align-items:flex-start;padding:clamp(24px,2.6vw,40px)}
  #archivo.is-js .ar-card.is-lead:is([data-slug="que-es-una-stablecoin-y-por-que-esta-revolucionando-los-pagos-digitales"],[data-slug="por-que-el-dolar-digital-esta-ganando-popularidad-en-latinoamerica"],[data-slug="pagos-con-stablecoins-para-empresas-como-optimizar-las-operaciones-internacionales"],[data-slug="como-usar-tus-activos-digitales-en-la-vida-diaria-con-una-tarjeta-financiera-moderna"],[data-slug="como-proteger-tu-patrimonio-frente-a-la-inflacion-con-una-estrategia-financiera-diversificada"],[data-slug="que-es-el-fraccionamiento-digital-de-propiedades-y-como-esta-cambiando-la-inversion"],[data-slug="tokenizacion-inmobiliaria-vs-crowdfunding-inmobiliario-cuales-son-las-diferencias"],[data-slug="blockchain-explicado-para-principiantes-guia-completa-para-entender-la-tecnologia"],[data-slug="como-los-pagos-blockchain-reducen-costos-para-empresas-y-emprendedores"],[data-slug="como-blockchain-esta-transformando-las-inversiones-los-pagos-y-los-servicios-fi"],[data-slug="el-ecosistema-financiero-del-futuro-invertir-cobrar-y-gastar-desde-una-sola-pla"],[data-slug="pagos-masivos-a-empleados-o-empresas-como-automatizar-la-dispersion"],[data-slug="ley-fintech-mexico-y-tokenizacion-regulacion-completa-2026"],[data-slug="cuanto-cuesta-un-wire-transfer-a-mexico-desglose-real-de-comisiones-en-2026"]) .ar-card__ph b{font-size:clamp(6rem,10vw,10rem)}
}