/* Min width media queries */
@media (min-width: 1200px) {

}

@media (min-width: 1400px) {
    .container {max-width: 1400px;}
    .hero{height:700px;}
    .cta .text-part {padding-inline-start: 250px;}
}

@media screen and (max-width: 1400px) {
    /* hedaer */
    .site-header .bottom-bar-wrapper{ padding-inline:30px;}
    .site-header .bottom-bar-wrapper .nav-wrapper{padding-inline-start: 350px;}
    /* hero */
    .hero{height:700px;}
    .title.title-white h1 {font-size: 55px;}
    .hero-content{padding-top: 250px;padding-bottom: 40px;}
    .hero-content .content-wrapper{padding-inline-end:32px;}
    .cta .bg-wrapper{width:68%;}
    .text-part.col-lg-6 {width: 60%;}
    .pattern-part.col-lg-6 {width: 40%;}
    /* cta */
    .cta .text-part{padding-inline-start: 18%;}
    /* portfolio */
    .portfolio .portfolio-slider-right{padding-inline: 60px;}
    .title.title-white h2 {font-size: 50px;}
}

@media screen and (max-width: 1200px) {
    /* hedaer */

    .site-header .bottom-bar-wrapper .nav-wrapper {padding-inline-start: 65%;}
    .site-header .bottom-bar-wrapper{justify-content: flex-end;}
  
    /* hero */
    .title.title-white h1 { font-size: 45px;}
    .hero-content .content-wrapper{padding-inline-end: 15%;}

    /* contact form cta */
    
    .contact .form-wrapper {padding: 40px 30px;}
    .title.title-white h2{font-size:36px;}
    .portfolio .portfolio-slider-right{padding-inline: 30px;}
    .portfolio .portfolio-slider-right::before{right:95%;}


    .site-header .nav_icon {display: block; position: relative;}
    .site-header .nav-wrapper{display: none;}
    .mobile-menu-open .site-header .mobile-menu, .mobile-menu-open .site-header .mobile-menu .nav-wrapper{display:block ;}
    .site-header .nav_icon img, .site-header .close-icon img {height: 35px;width: 35px;}
      .site-header .cta-wrapper {
    display: none;
    }
    .mobile-menu-open .mobile-sidebar-overlay {
    opacity: 1;
    pointer-events: auto;
    }
    body.mobile-menu-open .mobile-sidebar {
    transform: translateX(0);
    }
    body.mobile-menu-open {
    overflow: hidden;
    }
    .mobile-menu-open .site-header .mobile-menu {
    background: aliceblue;
    height: 100vh;
    position: absolute;
    right: 0;
    left: auto;
    width: 300px;
    top: 0;
    padding:30px;
    min-height: 900px;
    z-index:2;
}

.mobile-menu-open .site-header .mobile-menu div#close-sidebar {position: relative;z-index: 1;padding-top: 30px;text-align: end;}

.mobile-menu-open .site-header .mobile-menu  .nav-wrapper {
    position: relative;
    z-index: 99;
    display: block;
}


.mobile-menu .nav-wrapper ul li a {font-size: 20px;font-family: var(--font-primary);font-weight: 700;color: #333333;transition: all 300ms ease-in-out;}
.mobile-menu .nav-wrapper ul li a:hover,
.mobile-menu .nav-wrapper ul li.active>a {
    color: var(--color-accent);
}
.mobile-menu .nav-wrapper ul {
    display: flex;
    align-items: flex-start;
    margin-bottom: 0;
    gap: 2rem;
    flex-direction: column;
}
.mobile-menu-open .mobile-menu .cta-wrapper {
    display: block;
    position: relative;
    z-index: 1;
    margin-top: 50px;
}


.mobile-menu .nav-wrapper ul li.has-submenu {
    position: relative;
    display: flex;
    flex-wrap: wrap;
}

.mobile-menu .nav-wrapper ul li.has-submenu ul {
    position: static;
    width: 100%;
    left: 0;
    right: 0;
    top: 0;
    left: 0;
    height: 100%;
    box-shadow: none;
    border: none;
    border-radius: 0;
    background: transparent;
    padding: 10px 20px;
}
.site-header .navigation-links li.has-submenu::after{display: none;}
.mobile-menu .nav-wrapper ul li.has-submenu>a{position: relative;}
.mobile-menu .nav-wrapper ul li.has-submenu>a::after{
    content: '';
    display: block;
    height: 10px;
    width: 10px;
    background-image: url(../../assets/images/icons/down-arrow.svg);
    background-size: contain;
    background-position: center;
    filter: brightness(0) saturate(100%) invert(40%) sepia(84%) saturate(1873%) hue-rotate(352deg) brightness(102%) contrast(101%);
    transition: all 300ms ease-in;
    position: absolute;
        top: 11px;
        right: -20px;
}

}

@media screen and (max-width: 991px) {
    /* hedaer */
    .site-header .logo-wrapper{position: relative; z-index: 1;}
    .site-header .top-bar .top-bar-wrapper {justify-content: center !important;flex-wrap: wrap;gap: 0.5rem !important; }
    .site-header .bottom-bar-wrapper { padding: 10px 30px !important;}
    .site-header .bottom-bar-wrapper .nav-wrapper {padding-inline-start: 50%;}
    .site-header .logo-wrapper img {height: 120px;width: 215px;}
    .hero-content .content-wrapper{width:65%;}
    .bottom-bar .container {
    width: 100%;
    max-width: 100%; 
    padding-inline: 0;
    }
    .site-header .bottom-bar-wrapper {
    justify-content: space-between;
}
    /* CTA */
    .cta .cta-bg.col-lg-6 {width: 50%;}
    .cta .cta-bg::before {left: 40%;width: 50px;}
    .cta .bg-wrapper{width:58%;}
    .cta .pattern-part{display:none;}
    .cta .text-part{width:100%;padding-inline-start:55%;}

    /* contact form cta */
    .contact-cta {gap: 25px;}
    .contact-cta .content {padding-left: 0 !important;}
    .contact-cta .btn-wrapper {justify-content: flex-start !important;margin-top: 1rem !important;}
    .contact .title.title-black h2 {text-align: center;}
    .contact-form .wrapper-box {padding-inline-start: 0;margin-top: 35px;}
    .contact .form-wrapper {padding: 40px 30px;}
    .title.title-white h2{font-size:32px;}
    .title.title-white h1{font-size: 40px;}
    .portfolio .portfolio-slider-right {padding: 50px 20px 50px 25px;}
    .portfolio .portfolio-slider-right .content { margin-top: 20px !important;}
    .portfolio-slider-right .swiper-btn-wrapper{margin-top:20px !important;}
    .site-footer{padding-top:50px;}
    .site-footer .footer-wrapper {
        grid-template-columns: 1fr 1fr;
        gap: 2rem;
    }
    .site-footer .top-part .footer-wrapper{padding-bottom:50px;}
    .site-footer::after{max-width:195px;}

    


}

@media screen and (max-width: 767px) {
    /* hedaer */
    .site-header .bottom-bar-wrapper .nav-wrapper { padding-inline-start: 45%;}
    .site-header .top-bar {padding-block: 15px;}
    .site-header .bottom-bar-wrapper .nav-wrapper{padding-inline-start:91%;}
    .site-header .logo-wrapper img {
        height: 100px;
        width: 160px;
    }

    /* hero */
    .hero-content {padding-top: 50%;}
    .hero{height:700px;}
        .hero .bg-img .img{width:100%;}
        .hero .bg-img .img::before{display:none;}
    .hero-content .content-wrapper {padding-inline: 20px;width:100%;}
    .hero.bg-primary {
    position: relative;
}

.hero:before {
    content: "";
    position: absolute;
    opacity: 0.8;
    background-color: #032c5b;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}
    .pre-title span { font-size: 18px;}
    .hero-content h1 {font-size: 36px;}

    /* CTA */
    .cta .cta-bg::after, .cta .cta-bg::before{display:none;}
    .cta .cta-bg.col-lg-6 {display: none;}
    .cta .text-part{padding-inline-start: 0;padding: 0 20px;}
    .title.title-white h1{font-size: 38px;}
    .title.title-white h2{font-size:28px;}

    .portfolio .portfolio-inner .portfolio-slider-left, .portfolio .portfolio-inner .portfolio-slider-right {width: 100%;}
    .portfolio-inner.bg-primary {flex-wrap: wrap;}
    .portfolio .portfolio-slider-right::before{display:none;}
   
    .site-footer .footer-wrapper {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    .site-footer .bottom-part .copyright-wrapper{padding:20px 0px 70px 0px;}
    
}
@media screen and (max-width:576px){
    .mobile-menu-open .site-header .mobile-menu{width:100%;}
}