.sws-container {
position: relative;
width: 100%;
overflow: hidden;
background: #f4f4f4;
height: auto; 
}
.sws-wrapper {
display: flex;
align-items: flex-start; 
will-change: transform;
transition: transform 0.6s ease;
height: auto; 
}
.sws-slide {
position: relative;
flex: 0 0 100%;
width: 100%;
height: auto; 
}
.sws-click, 
.sws-picture {
display: block;
width: 100%;
height: auto;
line-height: 0; 
font-size: 0;
padding-bottom: 0;
}
.sws-img {
display: block !important;
width: 100% !important;
height: auto !important; 
object-fit: contain !important; 
margin: 0 !important;
padding: 0 !important;
} .sws-btn {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 40px;
height: 40px;
background: #02a1e6;
border: 1px solid #fff;
cursor: pointer;
z-index: 100;
opacity: 0;
transition: opacity 0.2s ease;
}
@media (max-width: 768px) {
.sws-btn { opacity: 1; } }
.sws-container:hover .sws-btn { opacity: 1; }
.sws-prev { left: 20px; }
.sws-next { right: 20px; }
.sws-prev::after,
.sws-next::after {
content: '';
display: block;
width: 12px;
height: 12px;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
position: absolute;
top: 50%;
left: 50%;
}
.sws-prev::after { transform: translate(-25%, -50%) rotate(-135deg); }
.sws-next::after { transform: translate(-75%, -50%) rotate(45deg); }
.sws-dots {
position: absolute;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
display: flex;
gap: 8px;
z-index: 100;
}
.sws-dot {
width: 10px;
height: 10px;
border: 1px solid #02a1e6;
padding: 0;
cursor: pointer;
background: transparent;
transition: 0.3s;
}
.sws-dot.active { background: #02a1e6; }
@media (max-width: 768px) {
.sws-container, 
.sws-wrapper, 
.sws-slide, 
.sws-click, 
.sws-picture, 
.sws-img {
height: auto !important;
min-height: unset !important;
max-height: none !important;
}
}