*{box-sizing:border-box}
html,body{height:100%;background:transparent}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial;background:transparent}
.wrap{max-width:980px;margin:0 auto;padding:12px;display:flex;flex-direction:column;gap:18px}
.visually-hidden{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
.slider{position:relative;overflow:hidden;background:transparent;border-radius:8px}
.slider.compact{max-width:520px}
.track{display:flex;transition:transform .45s ease}
.slide{min-width:100%;display:flex;align-items:center;justify-content:center;padding:6px;background:transparent}
.slide img{max-width:100%;height:auto;display:block;background:transparent}
.nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,0.35);color:#fff;border:none;padding:.4rem .8rem;font-size:1.2rem;cursor:pointer;border-radius:8px;backdrop-filter:blur(2px)}
.prev{left:8px}
.next{right:8px}
.dots{position:absolute;left:50%;transform:translateX(-50%);bottom:8px;display:flex;gap:8px}
.dots button{width:10px;height:10px;border-radius:50%;border:none;background:rgba(255,255,255,0.6);cursor:pointer}
.dots button.active{background:rgba(255,255,255,1)}
.slider-title {
  color:#ffffff;   /* letra blanca */
  text-align:center;
  font-size:1.5em;
  margin:20px 0 10px 0;
  font-family:Arial, sans-serif;
}
@media(max-width:600px){.nav{padding:.3rem .5rem;font-size:1rem}}