/* Explorador de obras (tema oscuro, Opción 2) */
#obras{--o-amber:#D37C15;--o-line:rgba(255,255,255,.14)}
#obras .chips{display:flex;gap:10px;overflow-x:auto;padding:4px 0 18px;margin-bottom:6px;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch}
#obras .chips::-webkit-scrollbar{display:none}
#obras .chips button{flex:none;display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 18px;border:1px solid var(--o-line);border-radius:3px;background:rgba(255,255,255,.03);color:#cfd8e6;font:500 14px "Space Grotesk",sans-serif;letter-spacing:.03em;cursor:pointer;scroll-snap-align:center;transition:.25s;white-space:nowrap}
#obras .chips button i{font-style:normal;font-size:11px;color:#8da0bd}
#obras .chips button:hover{border-color:var(--o-amber);color:#fff}
#obras .chips button.on{background:var(--o-amber);border-color:var(--o-amber);color:#0e1726;font-weight:700}
#obras .chips button.on i{color:#0e1726;opacity:.7}
.car{position:relative;border-radius:4px;overflow:hidden;background:#06101e;box-shadow:0 40px 90px -40px rgba(0,0,0,.8)}
.car .track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;outline-offset:-3px}
.car .track::-webkit-scrollbar{display:none}
.car .track.drag{scroll-snap-type:none;cursor:grabbing;user-select:none}
.car .track.drag img{pointer-events:none}
.sl{flex:0 0 100%;scroll-snap-align:center;scroll-snap-stop:always;position:relative;aspect-ratio:16/9;max-height:78vh;overflow:hidden;margin:0}
.sl img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;cursor:zoom-in}
.sl.lw:before{content:"";position:absolute;inset:-20px;background:var(--bg) center/cover;filter:blur(26px) brightness(.55)}
.sl.lw img{object-fit:contain}
.car:after{content:"";position:absolute;left:0;right:0;bottom:0;height:46%;background:linear-gradient(transparent,rgba(6,16,30,.88));pointer-events:none}
.car .cap{position:absolute;z-index:2;left:clamp(18px,3vw,40px);bottom:clamp(16px,2.6vw,34px);pointer-events:none;max-width:60%}
.car .cap small{font:600 12px "Space Grotesk",sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--o-amber)}
.car .cap h3{font:700 clamp(24px,3.4vw,46px)/1.05 "Space Grotesk",sans-serif;letter-spacing:-.03em;margin-top:6px}
.car .ctl{position:absolute;z-index:3;right:clamp(14px,2.4vw,32px);bottom:clamp(14px,2.4vw,30px);display:flex;align-items:center;gap:10px}
.car .ctl span{font:600 13px "Space Grotesk",sans-serif;letter-spacing:.1em;color:#d6deea;margin-right:6px}
.car .ctl button{width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(14,23,38,.55);backdrop-filter:blur(8px);color:#fff;font-size:20px;cursor:pointer;transition:.25s;display:grid;place-items:center}
.car .ctl button:hover:not(:disabled){background:var(--o-amber);border-color:var(--o-amber);color:#0e1726}
.car .ctl button:disabled{opacity:.3;cursor:default}
#obras .thumbs{display:flex;gap:10px;overflow-x:auto;padding:14px 2px 6px;scrollbar-width:thin;scrollbar-color:var(--o-amber) transparent}
#obras .thumbs button{flex:none;width:104px;aspect-ratio:4/3;padding:0;border:2px solid transparent;border-radius:3px;overflow:hidden;opacity:.55;cursor:pointer;transition:.25s;background:#06101e}
#obras .thumbs button img{width:100%;height:100%;object-fit:cover}
#obras .thumbs button:hover{opacity:.9}
#obras .thumbs button.on{opacity:1;border-color:var(--o-amber)}
@media(max-width:1000px){.sl{aspect-ratio:16/10}.car .cap{max-width:52%}}
@media(max-width:640px){
  .sl{aspect-ratio:4/3.4}
  .car .cap{max-width:none;right:16px;bottom:74px}
  .car .ctl{left:16px;right:16px;bottom:14px;justify-content:space-between}
  .car .ctl span{order:2;margin:0}.car .ctl #pprev,.car .ctl [data-prev]{order:1}.car .ctl [data-next]{order:3}
  #obras .thumbs button{width:72px}
  #obras .chips button{height:40px;padding:0 14px;font-size:13px}
}
@media(prefers-reduced-motion:reduce){.car .track{scroll-behavior:auto}}