#page-intro picture::after{background: rgba(0, 0, 0, .4);}    
#calisthenics-section,
#macchine-fitness-section{overflow:hidden}
.tutorial-list{margin-top:3.2rem}
.tutorial-list__carousel.swiper{overflow:visible}
.tutorial-list__carousel .swiper-slide{width:calc(95% - 1.2rem);height:auto;border-radius:1.6rem;overflow:hidden;}
.tutorial-list__carousel .nav-carousel-control-wrapper {gap: .8rem;}

@media (min-width: 650px) {
    .tutorial-list__carousel .swiper-slide {width: calc(75% - 1.2rem);}
}

@media (min-width: 768px) {
    .tutorial-list__carousel .swiper-slide {width: calc(50% - 1.2rem);}
    .tutorial-list .nav-carousel-control-wrapper {margin: 0;position: absolute;top: -2.4rem;right: 0;transform: translateY(-100%);}
}

@media(min-width:1280px){ 
    .tutorial-list__carousel .swiper-slide{width:calc((100% - (2.4rem * 2)) / 3)}
}

@media(min-width:1440px){
    .tutorial-list__carousel .swiper-slide {width: calc((100% - (2.4rem * 3)) / 4);}
}


.card-tutorial{border-radius:1.6rem;width:100%;overflow:hidden;background:#fff;padding:0;cursor:pointer}
.card-tutorial__header{position:relative}
.card-tutorial__image-wrapper{position:relative}
.card-tutorial__image-wrapper img{width:100%;height:auto;display:block;aspect-ratio: 5/4;object-fit: cover;}
.card-tutorial__image-wrapper:after{background: rgba(0, 0, 0, .4);content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;pointer-events: none;mix-blend-mode: multiply;}
.card-tutorial__video-icon{position: absolute;top: 50%;left: 50%;color: #fff;font-size: 4rem;transform: translate(-50%, -50%);border: .4rem solid;border-radius: 50%;width: 10rem;height: 10rem;display:flex;place-content:center;align-items:center}
.card-tutorial__content{display:flex;flex-direction:column;align-items:center;padding:2.4rem}
.card-tutorial__title{font-family:var(--ff-default);font-weight:700;font-size:2.4rem;text-align:center;color:var(--primary-color);margin-bottom:2.4rem;line-height:1.1}
.card-tutorial__rendering{width:60%;height:auto;display:block;}
.card-tutorial:hover .button:not(.active):after, 
.card-tutorial:hover .button:not(.active):before {transform: scale(2);transform-origin: bottom left;transition-timing-function: cubic-bezier(1, .43, .66, 1.21);}

@media(min-width:1280px){ 
    .card-tutorial__title{font-size:3.2rem}
}