

/*MENU!!!!!!!!!!!!!!!!!!!!!!!!!!*/

/* MEDIA QUERIES */

/* TABLET */
@media (min-width: 768px) and (max-width: 979px) {
    .mainWrap {
        width: 768px;
    }

    .menu ul {
        top: 37px;
    }

    .menu li a {
        font-size: 12px;
    }

    a.homer {
        background: #374147;
    }
}

/* MOBILE */
@media (max-width: 767px) {
    .mainWrap {
        width: auto;
        padding: 50px 20px;
    }

    .menu {
        display: none;
    }

    .responsive-menu {
        display: block;
    }

    nav {
        margin: 0;
        background: none;
    }

    .menu li {
        display: block;
        margin: 0;
    }

    .menu li a {
        background: #fff;
        color: #797979;
    }

    .menu li a:hover,
    .menu li:hover > a {
        background: #9ca3da;
        color: #fff;
    }

    /* Toggle icon + highlight */
    .submenu-toggle {
        display: inline;
        float: right;
        color: #797979;
    }

    .menu li.open > a .submenu-toggle {
        color: #BA0707;
    }

    /* Collapsible submenu logic */
    .menu li > ul {
        visibility: hidden;
        opacity: 0;
        height: 0;
        overflow: hidden;
        transition: all 0.3s ease;
        position: relative;
        transform: none;
    }

    .menu li.open > ul {
        visibility: visible;
        opacity: 1;
        height: auto;
        overflow: visible;
    }

    .menu ul ul {
        left: 0;
        transform: none;
    }

    .menu li ul ul {
        display: none;
    }

    .menu li ul li:hover > ul {
        display: block;
    }
}


/*SECONDPART!!!!!!!!!!!!!!!!*/



/*SLIDER!!!!!!!!!!!!!!*/

@media screen and (max-width: 768px) {
    .slide-content{
        margin: 0 10px;
    }
    .swiper-navBtn{
        display: none;
    }
}



/*THIRDPART!!!!!!!!!!!!!!!!!!!!!!!!!!*/



@media (max-width: 768px) {
    .profile-card {
        flex-direction: column;
        text-align: center;
    }

    .profile-image img {
        width: 100%;
        max-width: 280px;
    }

    .profile-content {
        padding: 0;
    }
}













/*FOURTHPART!!!!!!!!!!!!!!!!!*/

@media (max-width: 768px) {
    #fourthPart {
        flex-direction: column;
        margin-left: 0;
    }

    #fourthPart section {
        height: auto;
        padding-bottom: 2rem;
    }

    .wrapper .card {
        width: 90vw;
        height: auto;
        flex-direction: column;
        padding: 1rem;
        border-radius: 20px;
    }

    .wrapper .card .img {
        position: static;
        margin-bottom: 1rem;
    }

    .wrapper .card .details {
        margin-left: 0;
        text-align: center;
    }

    .stars {
        margin-top: 1rem;
    }
}