:root{
--shs-height:480px;
}
.shs-wrap{
position:relative;
width:100%;
max-width:100%;
}
.shs-swiper{
width:100%;
height:var(--shs-height);
border-radius:16px;
overflow:hidden;
box-shadow:0 10px 30px rgba(0,0,0,.15);
background:transparent;
}
.shs-slide{
position:relative;
}
.shs-bg{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
object-position:center center;
display:block;
z-index:1;
}
.shs-bg-link{ position:absolute; inset:0; z-index:1; display:block; }
.shs-overlay{
position:absolute;
inset:0;
background:linear-gradient(180deg, rgba(0,0,0,0.08) 0%, rgba(0,0,0,0.45) 55%, rgba(0,0,0,0.65) 100%);
z-index:2;
}
.shs-content{
position:absolute;
inset:auto 0 0 0;
padding:24px 28px 32px;
color:#fff;
text-shadow:0 2px 8px rgba(0,0,0,.45);
z-index:3;
}
.shs-title{
margin:0 0 8px 0;
font-size:clamp(20px, 3.2vw, 36px);
line-height:1.15;
font-weight:800;
word-break:break-word;
}
.shs-excerpt{
max-width:900px;
font-size:clamp(14px,1.6vw,18px);
margin-bottom:16px;
line-height:1.45;
}
.shs-btn{
display:inline-block;
background:#111;
color:#fff;
padding:10px 16px;
border-radius:999px;
text-decoration:none;
font-weight:700;
transition:transform .15s ease,opacity .15s ease;
}
.shs-btn:hover{ transform:translateY(-2px); opacity:.9; } .swiper-button-prev, .swiper-button-next{
filter: drop-shadow(0 2px 6px rgba(0,0,0,.4));
z-index:4;
}
.swiper-pagination-bullet{ opacity:.65; }
.swiper-pagination-bullet-active{ opacity:1; }
@media (max-width: 768px){
.shs-swiper{ height:calc(var(--shs-height) * .66); }
.shs-content{ padding:14px 14px 18px; }
.shs-title{ font-size:clamp(18px,5vw,24px); }
.shs-excerpt{ font-size:clamp(13px,3.6vw,16px); }
}