@import url('variable-component.css');
@import url('cta.css');
@import url("https://cdn.jsdelivr.net/npm/@tabler/icons-webfont@latest/tabler-icons.min.css");



/*Header css here*/

header{position: fixed; left: 0; top: 0; width: 100%; z-index: 99; padding: 15px 0px;}
.header-inner{gap: 30px;}
.menu-box{display: flex; align-items: center; gap: 30px; flex: 1; justify-content: center;}
.menu-box ul{display: flex; align-items: center; gap: 30px;}
.menu-box ul li a{font-family: var(--medium); font-size: 14px; color: var(--white-scale-900);}
.head-right{gap: 10px;}
.fixed header{background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.04) 100%) !important; backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);}
.btn.green{color: var(--fix-color-black) !important;}
.menu-toggle{display: none;}


/* switch settings */

.day-night-btn .toggle{background-color:var(--primary-colors-orange); width: 45px; height: 45px; border-radius: 50%; display: grid; place-items: center; cursor: pointer; box-shadow: 0 0 50px 20px rgba(0, 0, 0, 0.1); line-height: 1;}
.input{display: none;}
.icon{grid-column: 1 / 1; grid-row: 1 / 1; transition: transform 500ms;}
.icon--moon{transition-delay: 200ms; color:var(--fix-color-white);}
.icon--sun {transform: scale(0); color: yellow;}
#switch:checked + .icon--moon {transform: rotate(360deg) scale(0);}
#switch:checked ~ .icon--sun{transition-delay: 200ms; transform: scale(1) rotate(360deg);}
  
.light_theme .day-night-btn .toggle{background: var(--fix-color-black);}


/*section head css here*/

.section-head{text-align: center; margin-bottom: 70px;}
.section-head-inner{margin: auto; max-width: 1000px; display: flex; flex-direction: column; gap: 20px;}
.section-head span{color: var(--primary-colors-orange); font-family: var(--bold);}
.section-head span.purple-color{color: var(--primary-colors-purple);}
.section-head span.orange-color{color: var(--primary-colors-orange);}
.bespoke-solution-box figcaption{gap: 10px; display: flex; flex-direction: column;}

/*footer css here*/

.testimonials-section{background: var(--background-bg-block);}
.testimonials-box{background: var(--opacity-shade-white-white-100); padding: 30px; border-radius: 16px; width: 100%; display: flex; flex-direction: column; gap: 50px; justify-content: space-between; aspect-ratio: 9/12;}
.testimonials-des{display: flex; flex-direction: column; gap: 10px;}
.testimonials-user-box{display: flex; align-items: center; gap: 20px;}
.testimonials-user-box figure{width: 50px; height: 50px; border-radius: 14px; display: flex; align-items: center; justify-content: center; font-size: 18px; color: var(--fix-color-white);}
.testimonials-user-box figure img{width: 100%; height: 100%; object-fit: cover;}
.testimonials-list .owl-stage{display: flex;}
.testimonials-list .owl-item {display: flex;}
.testimonials-list .owl-item .item{display: flex;}

.blog-list ul{display:grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 24px;}
.blog-box figure{margin: 0;}
.blog-box figure img{aspect-ratio:10/6; width: 100%; object-fit: cover; border-radius: 16px;}
.blog-box{display: flex; flex-direction: column; gap: 22px;}
.blog-box figcaption{display: flex; flex-direction: column; gap: 5px;}
.date-blog{color: var(--white-scale-600);}
.blog-list .date-blog{margin-top: 10px;}

/* .request-form-section{position: relative; z-index: 1;} */
.form-box{background: var(--background-bg-block); padding: 50px; border: solid 1px var(--white-scale-300); border-radius: 16px; position: relative; z-index: 1;}
.form-bottom{gap: 15px;}
.whatapp-box a{display: flex; align-items: center; gap: 10px;}
.direct-connect-box{display: flex; align-items: center; gap: 10px; flex-direction: column;}
.form-ger-img{width: 100%; text-align: center;}
.form-ger-img img{max-height: 550px;}



.owl-nav{display: flex; align-items: center; justify-content: space-between; max-width: 1404px; margin: auto; padding: 0px 12px; margin-top: 20px;}
.owl-nav .owl-prev,.owl-nav .owl-next{width: 45px; height: 45px; display: flex; align-items: center; justify-content: center; position: relative; z-index: 9;}
.owl-nav i{font-size: 30px; color: var(--white-scale-900);}
.owl-dots{display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: -28px;}
.owl-dots .owl-dot{width: 6px; height: 6px; border-radius: 50px; background: var(--white-scale-900); opacity: 50%; transition: all 0.4s ease-in-out;}
.owl-dots .owl-dot.active{opacity: 100%; width: 12px; height: 12px;}



footer{background: url(../images/footer/footer-bg.png) no-repeat; background-size: cover; padding:60px 30px 30px 30px; margin-top: -220px;}
.global-presence-head{padding-left: 30px;}
.global-presence-bg{background: var(--fix-color-white); padding: 60px; border-radius: 16px; margin: 30px 0px 60px 0px;}
.global-presence-bg .section-head{display: flex; flex-direction: column; gap: 10px;}
.global-presence-bg .section-head .h2-headline{color: var(--fix-color-black);}
.global-presence-bg .section-head .body-2{color: var(--fix-color-black);}
.global-presence-bg .col-md-8 .row{row-gap: 24px;}
.global-presence-bg .col-md-8 .col-md-6{display: flex;}
.country-box{display: flex; gap: 15px; background: var(--black-scale-50); border-radius: 30px; padding: 15px; width: 100%;}
.country-box figure{margin: 0; width: 50px; flex:0 0 50px; height: 50px; border-radius: 14px; overflow: hidden;}
.country-box figure img{width: 100%; height: 100%; object-fit: cover;}
.country-box figcaption{display:flex; flex-direction: column; gap: 5px;}
.country-box figcaption h6{color: var(--black-scale-900);}
.country-box figcaption p{color: var(--black-scale-900);}
.country-box figcaption a{color: var(--primary-colors-blue);}

.bottom-footer{border-radius: 16px; background:var(--background-bg-body);}
.bottom-footer-top h6{text-transform: uppercase; letter-spacing: 1px; margin-bottom: 30px;}
.adress-des{display: flex; flex-direction: column; gap: 10px;}
.adress-des a{display: block;}
.footer-menu-box ul{display: flex; flex-direction: column; gap: 10px;}
.social-icon{margin-left: auto; display: flex; align-items: center; gap: 10px;}
.bottom-footer-bottom{padding: 30px 0px; border-top: 1px solid rgba(255, 255, 255, 0.2); display: flex; align-items: center; justify-content: space-between;}
.bottom-menu{display: flex; align-items: center; gap: 30px;}
.bottom-menu .body-1{text-decoration: underline;}


.partners-list-section{padding: 50px 0 0 0px;}
.partners-list-section ul{display: flex; align-items: center; gap: 10px; justify-content: space-between;}
.partners-list-section ul li a{opacity: 50%;}
.partners-list-section ul li a svg{max-width: 100%;}
.partners-list-section ul li a:hover{opacity: 100%;}
.banner-des-top h1{font-size: 88px; line-height: 95px; color: var(--fix-color-white);}

.accordion-content{display: none;}
.accordion-content.show{display: block;}


.career-serve-section .dedicated-developers-box{background: none; padding: 0;}
.career-serve-section .dedicated-developers-box img{width: 100%; object-fit: cover; height: 248px; border-radius: 16px;}

.footer-top-section .section-head h2{color: var(--fix-color-white);}


@media (max-width: 2000px) {}

@media (max-width: 1403px){
.container{max-width: 100%; padding: 0px 15px;}
.container-fluid{padding: 0px 15px;}
.banner-des-top h1{font-size: 80px; line-height: 80px;}
.section-padding{padding: 100px 0px;}   
footer{padding: 60px 15px 15px 15px;}
.global-presence-bg{margin-bottom: 30px;}
.section-head{margin-bottom: 50px;}
}
  
@media (max-width: 1285px) {
.menu-toggle{display: block;}
.menu-box{position: absolute; left: 0; top: 80px; margin: 0px 15px; width: calc(100% - 30px); background: var(--white-scale-200); border-radius: 16px; padding: 30px; display: none;}     
.menu-box ul{flex-direction: column;}
.menu-box ul li a{font-family:var(--bold); font-size: 18px;}
.menu-box.active{display: block;}
.testimonials-box{gap: 15px;}
.blog-list ul{grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));}
.form-box{padding: 30px;}
.banner-des-top h1{font-size: 52px; line-height: 55px;}
}

@media (max-width: 1023px) {
.request-form-section .col-md-6{width: 100%;}
.form-ger-img{display: none;}
.global-presence-bg{padding: 30px;}
.global-presence-bg .col-md-4{width: 100%;}
.global-presence-bg .col-md-8{width: 100%;}
.section-head{margin-bottom: 30px;}
.bottom-footer-top .col-md-8{width: 100%;}
.bottom-footer-top h6{margin-bottom: 15px;}
.social-icon{margin-top: 30px;}
.section-padding{padding: 60px 0px;}
.banner-des-top h1 br{display: none;}
.banner-des-top h1{font-size: 45px;}
}

@media (max-width: 767px){
.logo svg{max-width: 135px;}
.banner-des-top h1{font-size: 35px; line-height: 40px;}
.header-inner{gap: 15px;}
.head-right .btn.blue i{display: none;}
.bespoke-solution-section .row{row-gap: 30px;}
.section-head-inner .mt-4{margin-top: 0 !important;}
.read-more-btn.ms-auto{margin-right: auto; margin-left: inherit !important; margin-top: 15px;}
.testimonials-box{padding: 20px;}
.form-bottom{flex-wrap: wrap;}
.global-presence-bg{padding: 20px;}
.bottom-footer-top.section-padding{padding: 15px 0px !important;}
.footer-top-section .container{padding: 0;}
.footer-menu-box.ps-5{padding-left: 0 !important;}
.bottom-footer-top .row{row-gap: 30px;}
.social-icon{margin-top: 0;}
.bottom-footer-bottom{flex-wrap: wrap;}
.bottom-footer-bottom{padding: 15px 0px;}
.bottom-menu{gap: 15px; justify-content: center; flex-wrap: wrap;}
.bottom-footer-bottom p{width: 100%; text-align: center;}
.section-padding{padding: 30px 0px;}
.partners-list-section{display: none;}
.section-head .row{row-gap: 30px;}
.btn-box.d-flex.justify-content-end{justify-content: flex-start;}

.day-night-btn{position: absolute; right: 15px; top: 65px;}
}