/* El Archivo: muro infinito de fotos que se abre sobre la escena 3D como un obturador. */
.archivo{--cy:50%;position:fixed;inset:0;z-index:27;background:var(--negro);color:var(--hueso);visibility:hidden;overflow:hidden;
  clip-path:inset(var(--cy) 0 calc(100% - var(--cy)) 0);transition:clip-path 1s var(--suave),visibility 0s 1s;
  touch-action:none;user-select:none;-webkit-user-select:none}
.archivo.abierto{visibility:visible;clip-path:inset(0 0 0 0);transition:clip-path 1s var(--suave)}

.ar-lienzo{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:none;touch-action:none}
.arrastrando .ar-lienzo{cursor:none}

/* Nombre gigante de la categoría detrás de las fotos: asoma entre los huecos */
.ar-fondo{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;overflow:hidden}
.ar-fondo b{font-family:'Archivo',sans-serif;font-weight:900;font-size:clamp(90px,19vw,340px);line-height:.8;letter-spacing:-.04em;
  text-transform:uppercase;color:transparent;-webkit-text-stroke:1.5px rgba(242,74,31,.55);text-align:center}

/* Portada: ARCHIVO enorme mientras las fotos aterrizan */
.ar-portada{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:22px;pointer-events:none;z-index:2;
  mix-blend-mode:difference;transition:opacity .9s var(--suave),transform 1.2s var(--suave)}
.ar-portada h2{font-family:'Archivo',sans-serif;font-weight:900;font-size:clamp(60px,18vw,300px);line-height:.8;letter-spacing:-.045em;
  text-transform:uppercase;color:var(--hueso);display:flex;overflow:hidden;padding-bottom:.04em}
.ar-portada h2 span{display:inline-block;transform:translateY(105%);transition:transform 1.15s var(--suave) .35s}
.ar-portada h2 span + span{transition-delay:.47s}
.ar-portada p{font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--hueso);opacity:0;transition:opacity .8s .9s;text-align:center;padding:0 24px;line-height:1.8}
.ar-portada p b{color:var(--hueso);font-weight:700}
.archivo.abierto .ar-portada h2 span{transform:none}
.archivo.abierto .ar-portada p{opacity:1}
.archivo.sin-portada .ar-portada{opacity:0;transform:scale(1.12)}

/* Barra superior */
.ar-barra{position:absolute;top:0;left:0;right:0;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:22px 32px;font-size:11px;letter-spacing:.28em;text-transform:uppercase;pointer-events:none}
.ar-barra > *{pointer-events:auto}
.ar-marca{display:flex;align-items:center;gap:12px;mix-blend-mode:difference}
.ar-marca img{width:16px;height:auto;display:block}
.ar-marca small{color:var(--gris);letter-spacing:.2em;font-size:10px;padding-left:12px;border-left:1px solid rgba(248,245,240,.3)}
.ar-filtros{display:flex;gap:6px;padding:5px;border-radius:999px;background:rgba(7,6,6,.62);border:1px solid rgba(248,245,240,.14);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.ar-filtros button{background:none;border:0;border-radius:999px;color:var(--gris);font:inherit;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;padding:10px 14px;cursor:pointer;white-space:nowrap;transition:background .35s,color .35s}
.ar-filtros button sup{font-size:8px;margin-left:5px;color:var(--mutation);letter-spacing:0;transition:color .35s}
.ar-filtros button:hover{color:var(--hueso)}
.ar-filtros button[aria-pressed="true"]{background:var(--hueso);color:var(--negro)}
.ar-filtros button[aria-pressed="true"] sup{color:var(--negro)}
.ar-filtros button:focus-visible,.ar-cerrar:focus-visible,.ar-foco button:focus-visible{outline:1px solid var(--mutation);outline-offset:3px}
.ar-cerrar{background:rgba(7,6,6,.62);border:1px solid rgba(248,245,240,.5);color:var(--hueso);font:inherit;letter-spacing:.28em;
  padding:11px 18px;cursor:pointer;text-transform:uppercase;transition:background .3s,color .3s;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.ar-cerrar:hover{background:var(--hueso);color:var(--negro)}

/* Pista y ficha de la foto bajo el cursor */
.ar-pista{position:absolute;left:32px;bottom:28px;z-index:3;font-size:10px;letter-spacing:.32em;text-transform:uppercase;color:var(--hueso);
  mix-blend-mode:difference;pointer-events:none;transition:opacity .6s}
.ar-pista::before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--mutation);margin-right:12px;vertical-align:1px;
  animation:ar-latido 1.6s ease-in-out infinite}
@keyframes ar-latido{50%{transform:scale(.45);opacity:.5}}
.ar-info{position:absolute;right:32px;bottom:26px;z-index:3;text-align:right;mix-blend-mode:difference;pointer-events:none;
  opacity:0;transform:translateY(10px);transition:opacity .35s,transform .45s var(--suave)}
.ar-info small{display:block;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--gris)}
.ar-info b{display:block;font-family:'Archivo',sans-serif;font-weight:900;font-size:clamp(28px,3.6vw,56px);line-height:.9;letter-spacing:-.02em;
  text-transform:uppercase;margin-top:8px;color:var(--hueso)}
.archivo.sobre .ar-info{opacity:1;transform:none}
.archivo.sobre .ar-pista{opacity:0}

/* Cursor propio: ARRASTRA / VER */
.ar-cursor{position:absolute;left:0;top:0;z-index:5;pointer-events:none;width:0;height:0}
.ar-cursor span{position:absolute;left:0;top:0;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;display:grid;place-items:center;
  font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--hueso);border:1px solid rgba(248,245,240,.7);
  backdrop-filter:blur(6px) saturate(1.4);-webkit-backdrop-filter:blur(6px) saturate(1.4);
  transition:transform .45s var(--suave),background .3s,color .3s,border-color .3s}
.archivo.sobre .ar-cursor span{background:var(--mutation);border-color:var(--mutation);color:var(--negro);transform:scale(1.12);font-weight:700}
.archivo.arrastrando .ar-cursor span{transform:scale(.55)}
.ar-cursor{opacity:0;transition:opacity .3s}
.archivo.listo.con-cursor .ar-cursor{opacity:1}
.archivo.con-foco .ar-cursor{opacity:0}
@media (pointer:coarse){.ar-cursor{display:none}.ar-lienzo{cursor:auto}}

/* Vista en grande */
.ar-foco{position:absolute;inset:0;z-index:6;visibility:hidden;transition:visibility 0s .76s}
.ar-foco.abierto{visibility:visible;transition:none}
.ar-foco-velo{position:absolute;inset:0;background:rgba(7,6,6,.9);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);opacity:0;transition:opacity .6s var(--suave)}
.ar-foco.abierto .ar-foco-velo{opacity:1}
.ar-foco-img,.ar-foco-vid{position:absolute;display:block;object-fit:cover;background:#131211;
  transition:left .75s var(--suave),top .75s var(--suave),width .75s var(--suave),height .75s var(--suave),opacity .3s}
.ar-foco-img.sin-trans{transition:none}
.ar-foco-img.cambia{opacity:0}
.ar-foco-vid{opacity:0;pointer-events:none;transition:opacity .5s}
.ar-foco-vid.on{opacity:1}
.ar-foco-info{position:absolute;left:32px;top:22px;max-width:calc(100% - 300px);opacity:0;transform:translateY(14px);transition:opacity .4s,transform .6s var(--suave)}
.ar-foco.abierto .ar-foco-info{opacity:1;transform:none;transition-delay:.35s}
.ar-foco-info small{font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--mutation)}
.ar-foco-info h3{font-family:'Archivo',sans-serif;font-weight:900;font-size:clamp(24px,3vw,46px);line-height:.9;letter-spacing:-.02em;text-transform:uppercase;margin-top:6px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar-foco-n{display:block;margin-top:8px;font-size:11px;letter-spacing:.3em;color:var(--gris)}
.ar-foco-flecha{position:absolute;top:50%;width:56px;height:56px;margin-top:-28px;border-radius:50%;border:1px solid rgba(248,245,240,.4);
  background:rgba(7,6,6,.5);color:var(--hueso);font:inherit;font-size:18px;cursor:pointer;opacity:0;transition:opacity .4s,background .3s,color .3s,border-color .3s}
.ar-foco-flecha:hover{background:var(--mutation);border-color:var(--mutation);color:var(--negro)}
.ar-foco-ant{left:32px}.ar-foco-sig{right:32px}
.ar-foco.abierto .ar-foco-flecha{opacity:1;transition-delay:.4s}
.ar-foco-cerrar{position:absolute;right:32px;top:22px;background:none;border:1px solid rgba(248,245,240,.5);color:var(--hueso);font:inherit;
  font-size:11px;letter-spacing:.28em;text-transform:uppercase;padding:11px 18px;cursor:pointer;opacity:0;transition:opacity .4s,background .3s,color .3s}
.ar-foco-cerrar:hover{background:var(--hueso);color:var(--negro)}
.ar-foco.abierto .ar-foco-cerrar{opacity:1;transition-delay:.3s}
.ar-foco-tira{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);max-width:calc(100% - 64px);display:flex;gap:8px;overflow-x:auto;
  padding:4px;scrollbar-width:none;opacity:0;transition:opacity .5s}
.ar-foco-tira::-webkit-scrollbar{display:none}
.ar-foco.abierto .ar-foco-tira{opacity:1;transition-delay:.5s}
.ar-foco-tira button{flex:none;height:58px;padding:0;border:0;background:none;cursor:pointer;opacity:.4;outline-offset:2px;transition:opacity .3s,transform .4s var(--suave)}
.ar-foco-tira button img{height:100%;width:auto;display:block}
.ar-foco-tira button:hover{opacity:.8}
.ar-foco-tira button.on{opacity:1;outline:1px solid var(--mutation);transform:translateY(-4px)}
.ar-foco.solo .ar-foco-flecha,.ar-foco.solo .ar-foco-tira{display:none}

@media (max-width:760px){
  .ar-barra{padding:16px;flex-wrap:wrap;gap:12px}
  .ar-marca small{display:none}
  .ar-filtros{order:3;width:100%;overflow-x:auto;scrollbar-width:none;border-radius:999px}
  .ar-filtros::-webkit-scrollbar{display:none}
  .ar-filtros button{padding:9px 12px}
  .ar-cerrar{padding:9px 14px;font-size:10px}
  .ar-pista{left:16px;bottom:20px;font-size:9px}
  .ar-info{right:16px;bottom:44px}
  .ar-foco-info{left:16px;top:16px;max-width:calc(100% - 170px)}
  .ar-foco-info h3{font-size:24px}
  .ar-foco-cerrar{right:16px;top:14px;font-size:10px;padding:9px 14px}
  .ar-foco-flecha{display:none}
  .ar-foco-tira{bottom:20px;max-width:calc(100% - 32px)}
  .ar-foco-tira button{height:46px}
}
@media (prefers-reduced-motion:reduce){
  .archivo,.archivo.abierto{transition:visibility 0s}
  .ar-portada h2 span{transition:none}
  .ar-pista::before{animation:none}
}