@media (max-width:1060px) {
    .hero-right{
        width: 80%;
    }
    .hero-content{
        display: flex;
        align-items:center;
        padding: 30px 50px 30px 50px;
        gap: 50px;
    }
}
@media (max-width:964px) {
    .hand{
        display: none;
    }
    .hero-img2{
        display:block;
        transform: rotate(-20deg);
    }
    .hero-right{
        width: 60%;
    }
    .hero-content{
        display: flex;
        align-items:center;
        padding: 30px 50px 30px 50px;
        gap: 50px;
    }
    .hero-right img{
        width: 80%;
        z-index: 1;
    }
    .work-items-2 img{
        z-index: 1;
        width: 100%;
    }
}
@media (max-width:924px) {
    .hero-right{
        width: 50%;
    }
}
@media (max-width:876px) {
    .hero-right{
        display: none;
    }
    .about-content{
        display:grid;
        align-items: center;
        grid-template-areas: "about-right" "about-left";
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
    }
    .about-left {
        grid-area: about-left;
        width: 100%;
    }
    .about-right {
        grid-area: about-right;
        width: 100%;
    }
}
@media (max-width:768px) {
    .service-items{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap:10px;
    }
    .work-items-2{
        display: none;
        height: 0;
    }
    .work-items{
        display: grid;
        grid-template-columns: repeat(2,1fr);
        align-items: center;
        gap: 50px;
    }
    .work-preview{
        display: flex;
        align-items:flex-start;
        gap: 15px;
    }
    .nav-center{
        display: none;
    }
    .nav-right{
        display: none;
    }
    #bars {
        cursor: pointer;
        display:block;
    }
    #sidebar {
        width: 40%;
        transition: left 1.3s ease;
        display:block;
    }
}
@media (max-width:740px) {
    .svs-content{
        display: grid;
        grid-template-columns: repeat(2,1fr);
        gap: 10px;
        width: 100%;
    }
    .partner-wrapper {
        overflow: hidden;
        padding: 10px 0;
        position: relative;
      }
      
      .partner-track {
        display: flex;
        animation: scroll 10s linear infinite;
        width: max-content;
        gap: 30px;
      }
      .partner-logo{
        display: block;
    }
      .partner {
        display: flex;
        gap: 30px;
      }
      
      .partner img {
        height: 50px;
        object-fit: contain;
        flex-shrink: 0;
      }
      
      @keyframes scroll {
        0% {
          transform: translateX(0%);
        }
        100% {
          transform: translateX(-50%);
        }
      }
      
    .testimonial{
        background-color: var(--light);
        padding: 40px 20px;
        border-radius: 20px;
    }   
}
@media (max-width:800px) {
    .footer-content{
        display:grid;
        grid-template-columns: repeat(1,1fr);
        align-items: flex-start;
        width: fit-content;
    }
}
@media (max-width:719px) {
    .desktop-footer{
        display:none;
    }
    .all-footer{
        padding: 40px 0 20px 0;
        display:block;
    }
}
@media (max-width:570px) {
    .work-items{
        display:block;
        grid-template-columns: repeat(1,1fr);
        align-items: center;
    }
}
@media (max-width:530px) {
    .person img{
        width: 60px;
        border-radius: 100%;
    }
    .testionial-content{
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
    }
}
@media (max-width:500px) {
    .service-items{
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        gap:10px;
    }
    .work-items{
        display: grid;
        grid-template-columns: repeat(1,1fr);
        align-items: center;
        gap: 50px;
    }
    .work {
        margin-bottom: 30px;
    }
    #sidebar {
        width: 60%;
        transition: left 1.3s ease;
        display:block;
    }
    .svs-content{
        display: grid;
        grid-template-columns: repeat(1,1fr);
        gap: 10px;
        width: 100%;
    }
    .hero-left h1{
        margin-bottom: 10px;
        font-size:36px;
        font-weight: bolder;
    }
    .svs-item h5{
        font-size: 27px;
        font-weight: bolder;
        color: var(--text);
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .svs-item h6{
        font-size: 13px;
        text-align: center;
    }
    .hero-content{
        display: flex;
        align-items:center;
        padding: 30px 20px 30px 20px;
        gap: 50px;
    }
    .about-button{
        font-size: 17px;
        border: none;
        font-weight: bolder;
        outline: none;
        border-radius: 5px;
        background: var(--secondary) ;
        color: var(--tertiary);
        transition: .30s ease;
        padding: 20px 10px;
        width: 100%;
    }
    .cta-btn{
        display: block;
    }
    .cta-btn :nth-child(1) {
        margin-bottom: 10px;
    }
    
}
@media (max-width:400px) {
    .hero-left h1{
        margin-bottom: 10px;
        font-size:35px;
        font-weight: bolder;
    }
    .hero-left p{
        margin-bottom: 10px;
        font-size:17px;
        color: var(--text);
    }
    .about-right h2{
        font-weight: bolder;
        font-size: 30px;
        color: var(--text);
    }
}