:root{--slide-height:60vh;--control-size:40px;--indicator-size:12px;--transition-duration:0.6s;--primary-color:#42b883}.slideshow{position:relative;max-width:800;margin:0 auto}.slides-container{position:relative;height:var(--slide-height);overflow:hidden;border-radius:12px}.slide{position:absolute;width:100%;height:100%;opacity:0;transition:all var(--transition-duration) ease}.slide.active{opacity:1;transform:translateX(0)}.slide-image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.slide-content{position:absolute;bottom:0;left:0;right:0;padding:2rem;background:linear-gradient(transparent,rgba(0,0,0,.7));color:#fff}.control{position:absolute;top:50%;transform:translateY(-50%);width:var(--control-size);height:var(--control-size);border:none;border-radius:50%;background:hsla(0,0%,100%,.9);cursor:pointer;font-size:1.5rem;transition:all .3s ease}.control:hover{background:#fff;transform:translateY(-50%) scale(1.1)}.prev{left:1rem}.next{right:1rem}.indicators{position:absolute;bottom:1rem;left:50%;transform:translateX(-50%);display:-ms-flexbox;display:flex;gap:.5rem}.indicators button{width:var(--indicator-size);height:var(--indicator-size);border:none;border-radius:50%;background:hsla(0,0%,100%,.5);cursor:pointer;transition:all .3s ease}.indicators button.active{background:var(--primary-color);transform:scale(1.2)}@media (max-width:768px){:root{--slide-height:50vh;--control-size:30px}.slide-content{padding:1rem}}