@media (max-width:768px){
.header{
padding:15px 25px 10px;
}
.site-title{
font-size:2.4rem;
margin-bottom:12px;
}
.logo img{
width:120px;
}
.splide__slide img{
height:280px;
}
.splide__slide:hover img{
filter:brightness(0.95) contrast(1.1) saturate(1.1);
}
.social-link{
padding:4px 12px 4px 4px;
border-radius:40px;
}
.social-link img{
width:50px;
height:50px;
margin-right:12px;
}
.social-link:hover img{
filter:brightness(1);
}
.social-link::after{
font-size:14px;
}
.social-links{
gap:6px;
max-width:250px;
}
}
@media (max-width:480px){
.header{
padding:12px 20px 8px;
}
.site-title{
font-size:2.1rem;
margin-bottom:10px;
letter-spacing:-1px;
}
.logo img{
width:110px;
}
.splide__slide img{
height:350px;
}
.social-link img{
width:55px;
height:55px;
}
.social-link::after{
font-size:15px;
}
}
@media (max-width:360px){
.header{
padding:10px 15px 6px;
}
.site-title{
font-size:1.9rem;
}
.logo img{
width:100px;
}
.splide__slide img{
height:300px;
}
.social-link{
padding:4px 10px 4px 4px;
border-radius:35px;
}
.social-link img{
width:50px;
height:50px;
margin-right:10px;
}
.social-link::after{
font-size:14px;
}
.social-links{
gap:5px;
max-width:230px;
}
}
@media (orientation:landscape) and (max-height:500px){
.header{
padding:8px 20px 5px;
}
.site-title{
font-size:1.7rem;
margin-bottom:8px;
}
.logo img{
width:90px;
}
.splide__slide img{
height:160px;
}
.social-link{
padding:3px 8px 3px 4px;
border-radius:30px;
}
.social-link img{
width:45px;
height:45px;
margin-right:8px;
}
.social-link::after{
font-size:12px;
}
.social-links{
gap:4px;
max-width:200px;
}
}