/* OUTSIDERS HOUSE — ARCHIVO: collage y visor (usa las variables de transmisiones.css) */
.oh-nav a[aria-current="page"]{color:var(--oh-m)}

.ar-grid{display:flex;align-items:flex-start;gap:clamp(16px,2.4vw,36px);margin-top:clamp(8px,2vw,16px)}
.ar-col{display:flex;flex-direction:column;gap:clamp(28px,3.6vw,52px);min-width:0}
.ar-col-a{flex:0 0 44%}
.ar-col-b{flex:1 1 0;padding-top:clamp(60px,10vw,150px)}
.ar-col-c{flex:1.15 1 0;padding-top:clamp(24px,4vw,64px)}
.ar-it{width:var(--w,100%);margin:0;display:flex;flex-direction:column;gap:10px;min-width:0}
.ar-it.ar-e{align-self:flex-end}

.ar-btn{position:relative;display:block;width:100%;padding:0;margin:0;border:1px solid rgba(237,234,226,0.12);background:#0d0e14;cursor:zoom-in;overflow:hidden;transition:transform 260ms cubic-bezier(0.16,1,0.3,1),box-shadow 260ms ease,border-color 260ms ease}
.ar-btn img{display:block;width:100%;height:auto;transition:transform 600ms cubic-bezier(0.16,1,0.3,1),filter 300ms ease}
.ar-btn::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(7,8,13,0.5) 0px,rgba(7,8,13,0.5) 1px,transparent 1px,transparent 3px);opacity:.18;mix-blend-mode:multiply}
.ar-btn:hover,.ar-btn:focus-visible{border-color:rgba(237,234,226,0.3);box-shadow:-5px 0 0 rgba(255,46,136,0.75),5px 0 0 rgba(184,255,60,0.75);transform:translateY(-3px)}
.ar-btn:hover img,.ar-btn:focus-visible img{transform:scale(1.025)}
.ar-btn:focus-visible{outline:none}

/* Marcas de esquina tipo visor */
.ar-mk{position:absolute;inset:10px;pointer-events:none;opacity:0;transition:opacity 200ms ease}
.ar-mk i{position:absolute;width:14px;height:14px;border:0 solid var(--oh-fg)}
.ar-mk i:nth-child(1){top:0;left:0;border-top-width:1.5px;border-left-width:1.5px}
.ar-mk i:nth-child(2){top:0;right:0;border-top-width:1.5px;border-right-width:1.5px}
.ar-mk i:nth-child(3){bottom:0;left:0;border-bottom-width:1.5px;border-left-width:1.5px}
.ar-mk i:nth-child(4){bottom:0;right:0;border-bottom-width:1.5px;border-right-width:1.5px}
.ar-btn:hover .ar-mk,.ar-btn:focus-visible .ar-mk{opacity:1}

.ar-it figcaption{display:flex;gap:12px;flex-wrap:wrap;font-family:var(--oh-mono);font-size:10px;letter-spacing:0.14em;color:var(--oh-mute);text-transform:uppercase}
.ar-n{color:var(--oh-m)}

/* Visor */
.ar-lb{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;background:rgba(7,8,13,0.96);padding:clamp(14px,3vw,28px);animation:ohBoot 220ms ease both}
.ar-lb[hidden]{display:none}
.ar-lb-top{display:flex;justify-content:space-between;align-items:center;gap:16px;font-family:var(--oh-mono);font-size:11px;letter-spacing:0.16em}
.ar-lb-cap{margin:0;color:var(--oh-fg)}
.ar-lb-cap b{color:var(--oh-m);font-weight:400;margin-right:12px}
.ar-lb-x,.ar-lb-nav{cursor:pointer;border:1px solid rgba(237,234,226,0.22);background:transparent;color:var(--oh-fg);font-family:var(--oh-mono);font-size:11px;letter-spacing:0.16em;border-radius:0;padding:10px 14px;transition:color 160ms ease,border-color 160ms ease}
.ar-lb-x:hover,.ar-lb-nav:hover,.ar-lb-x:focus-visible,.ar-lb-nav:focus-visible{color:var(--oh-m);border-color:var(--oh-m);outline:none}
.ar-lb-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;gap:clamp(8px,2vw,24px);padding:clamp(12px,2vw,20px) 0}
.ar-lb-stage img{max-width:min(100%,1400px);max-height:100%;width:auto;height:auto;object-fit:contain;flex:0 1 auto;min-width:0;box-shadow:-4px 0 0 rgba(255,46,136,0.6),4px 0 0 rgba(184,255,60,0.6)}
.ar-lb-nav{flex:none;font-size:16px;padding:12px 16px}
.ar-lb-help{margin:0;text-align:center;font-family:var(--oh-mono);font-size:10px;letter-spacing:0.16em;color:rgba(168,174,189,0.6)}
body.ar-lock{overflow:hidden}

@media (max-width:760px){
  .ar-grid{flex-direction:column;align-items:stretch;gap:28px}
  .ar-col{display:contents}
  .ar-it{order:var(--o);width:100%;align-self:stretch}
  .ar-it.ar-p{width:78%;align-self:flex-start}
  .ar-it.ar-p.ar-mr{align-self:flex-end}
  .ar-lb-nav{position:absolute;bottom:clamp(14px,3vw,28px)}
  .ar-lb-nav[data-lb="prev"]{left:clamp(14px,3vw,28px)}
  .ar-lb-nav[data-lb="next"]{right:clamp(14px,3vw,28px)}
  .ar-lb-help{display:none}
  .ar-lb-stage{padding-bottom:64px}
}
@media (prefers-reduced-motion:reduce){
  .ar-btn,.ar-btn img{transition:none}
  .ar-btn:hover,.ar-btn:focus-visible{transform:none}
  .ar-btn:hover img{transform:none}
}