body {
    font-family: 'Montserrat', sans-serif;
}

.fade {
    @apply transition-opacity duration-500;
}
.fade.hidden {
    opacity: 0;
    pointer-events: none;
    position: absolute;
}
.fade.visible {
    opacity: 1;
    position: relative;
}
.load-more-list:not(.active) li:nth-child(n+6) {
    display: none;
}
.swiper-pagination-bullet {
    width: 16px;
    height: 16px;
    border: 2px solid #E3E3E3;
    background: transparent!important;
    opacity: 1;
    transition: 0.3s ease;
}

.swiper-pagination-bullet-active {
    width: 20px;
    height: 20px;
    border: 2px solid #03BBD3 !important;

}
.swiper-pagination {
    display: flex !important;
    justify-content: center !important;
    align-items: center;
    gap: 16px;
    width: 100%;
}
.device-tab {

    font-weight: 500;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: all 0.3s;
}
.device-tab svg{
    fill: #55535A;
}
.device-tab.active {
    color: #03BBD3;
    border-bottom: 2px solid #03BBD3;
}
.device-tab.active svg{
    fill: #03BBD3;
}

.laptop-image {
    aspect-ratio: 16/9;
    object-fit: cover;
    object-position: top;
}

.tablet-image {
    aspect-ratio: 160/97;
    object-fit: cover;
    object-position: top;
}