@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;}
header .container-fluid{transition: all 0.4s ease-in-out;}
.header-inner{position: relative; padding:20px 0px; border-bottom: 1px solid rgba(255, 255, 255, 0.2); background: transparent; overflow: visible;}
.header-inner-blur{position: absolute; inset: 0; background: rgba(0, 0, 0, 0.3); -webkit-backdrop-filter: blur(11.95px); backdrop-filter: blur(11.95px); pointer-events: none; z-index: 0;}
.header-inner > .container{position: relative; z-index: 1;}
.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-weight: 600; font-size: 14px; color: var(--fix-white-fix); cursor: pointer;}
.head-right{gap: 10px;}
.fixed header{background: transparent !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;}
.fixed .header-inner-blur{background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.04) 100%); -webkit-backdrop-filter: blur(15px); backdrop-filter: blur(15px);}
.btn.green{color: var(--fix-color-black) !important;}
.menu-toggle{display: none;}
.fixed header .container-fluid{padding: 0;}

.has-submenu{position: relative; z-index: 2;}
.submenu{display: none !important; position: absolute; top: 45px; left: 0; max-height: 250px; overflow: auto; min-width: 300px; border-radius: 16px; padding:15px 0px; display: none; background: rgba(0, 0, 0, 0.3); border: 1px solid rgba(255, 255, 255, 0.2); -webkit-backdrop-filter: blur(11.95px); backdrop-filter: blur(11.95px); z-index: 200;}
.has-submenu.active .submenu{display: block !important;}
.submenu li a{padding: 8px 20px; display: block; color: var(--white-900); transition: all 0.3s ease;}
.submenu li a:hover{background: var(--background-bg-hover); color: var(--primary-orange);}
.submenu-trigger i{margin-left: 5px; transition: transform 0.3s ease;}
.has-submenu.active .submenu-trigger i{transform: rotate(180deg);}

/* Light theme header — readable on white / light page backgrounds */
.light_theme .header-inner{border-bottom-color: rgba(0, 0, 0, 0.08);}
.light_theme .header-inner-blur{background: rgba(255, 255, 255, 0.72);}
.light_theme .fixed .header-inner-blur{background: rgba(255, 255, 255, 0.88);}
.light_theme .menu-box ul li a{color: var(--fix-black-fix);}
.light_theme .logo svg path[fill="var(--fix-white-fix)"]{fill: var(--fix-black-fix);}
.light_theme .menu-toggle svg path{stroke: var(--fix-black-fix);}
.light_theme .submenu{background: rgba(255, 255, 255, 0.85); border-color: rgba(0, 0, 0, 0.1);}
.light_theme .submenu li a{color: var(--fix-black-fix);}


.home-banner-inner{background: url(../images/home/banner.png) no-repeat left top; background-size: cover; min-height: 100px; overflow: hidden; position: relative; border-radius: 0px 0px 16px 16px;}
.home-banner-inner .col-md-7,.home-banner-inner .col-md-5{display: flex; align-items: center;}
.banner-inner-image{margin-bottom: -5px; position: relative; z-index: 1;}
.banner-des-box{width: 100%; display: flex; flex-direction: column; gap: 70px; position: relative; z-index: 1; padding: 70px 0px;}
.banner-des-top{display: flex; flex-direction: column; gap: 15px;}
.banner-des-top h1{color: var(--fix-white-fix) !important;}
.banner-des-top p{color: var(--fix-white-fix);}



/* switch settings */

.day-night-btn .toggle{background-color:var(--primary-yellow); 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-white-fix);}
.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);}
.grid-layout{position: fixed; left: 0; top: 0; width: 100%; height: 100%; display: flex; padding: 0px 30px; opacity: 60%; pointer-events: none;}
.grid-layout ul{display: flex; align-items: center; gap: 30px; justify-content: space-between; width: 100%;}
.grid-layout ul li{width: 1px; height: 100%; background: var(--card-bg-400);}

/*section head css here*/

section{position: relative; z-index: 1;}
.section-head{text-align: center; margin-bottom: 50px;}
.section-head-inner{margin: auto; max-width: 1000px; display: flex; flex-direction: column; gap: 20px;}
.section-head.with-dot h2{background: url(../images/header/dot.svg) no-repeat center bottom; padding-bottom: 20px;}
.section-head.with-dot.text-left h2{background-position: left bottom;}


.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: 45px; color: var(--white-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-900); opacity: 50%; transition: all 0.4s ease-in-out;}
.owl-dots .owl-dot.active{opacity: 100%; width: 12px; height: 12px;}


/*footer css here*/



/*testimonials css here*/
.testimonials-section{background: linear-gradient(0deg, rgba(0, 0, 0, 0.00) 0%, rgba(61, 16, 91, 0.30) 100%),url(../images/footer/dot-bg.svg) repeat top left;}
.testimonials-box{padding: 30px; border-radius: 16px; width: 100%; display: flex; flex-direction: column; gap: 50px; justify-content: space-between; text-align: center;}
.testimonials-des{display: flex; flex-direction: column; gap: 25px;}
.quote-icon svg path{fill: var(--white-700);}
.testimonials-user-box{display: flex; align-items: center; gap: 15px; flex-direction: column; justify-content: center;}
.testimonials-user-box figure{width: 60px; height: 60px; border-radius:50px; display: flex; align-items: center; justify-content: center; font-size: 18px; color: var(--fix-color-white); overflow: hidden;}
.testimonials-user-box figure img{width: 100%; height: 100%; object-fit: cover;}
.testimonials-user-box figcaption{display: flex; flex-direction: column; gap: 5px;}
.testimonials-user-box figcaption span{font-family: var(--bold);}
.center .testimonials-box{border-radius: 16px; background: var(--shade-purple-950);}
.center .testimonials-box .quote-icon svg path{fill: var(--fix-white-fix);}
.center .testimonials-box .body-2{color: var(--fix-white-fix);}
.center .testimonials-box .subtitle-3{color: var(--fix-white-fix);}
.center .testimonials-box .body-1{color: var(--fix-white-fix);}

.testimonials-list .owl-stage{display: flex;}
.testimonials-list .owl-item {display: flex;}
.testimonials-list .owl-item .item{display: flex;}


/*blog css here*/

.blog-list ul{display:grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 24px;}
.blog-list ul li{display: flex;}
.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; background: var(--card-bg-100); border-radius: 16px; overflow: hidden;}
.blog-box figcaption{display: flex; flex-direction: column; gap: 10px; padding: 30px; background: var(--card-bg-100);}
.date-blog{color: var(--white-scale-600);}
.blog-list .date-blog{margin-top: 10px;}


/* .request-form-section{position: relative; z-index: 1;} */

.request-form-section{overflow: hidden;}

.form-box-bg{background: var(--card-bg-200); border-radius: 16px 16px 0px 0px !important; overflow: hidden;} 
.form-box-bg .section-head{background: linear-gradient(82deg, var(--primary-purple) 0%, var(--shade-purple-950) 98.37%); padding: 30px 40px; margin: 0;}
.form-box-bg .section-head h3{color: var(--fix-white-fix);}
.form-box-bg .section-head p{color: var(--fix-white-fix);}
.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; margin-bottom: -5px;}
.form-ger-img img{max-height: 550px;}

.form-ger-box{display: flex; flex-direction: column; justify-content: space-between; width: 100%; gap: 30px; padding-left: 30px;}


.footer-top-section{background: linear-gradient(180deg, var(--shade-purple-950) 0%, var(--shade-purple-900) 100%); border-bottom: solid 15px var(--primary-yellow);}
.global-presence-head{padding-left: 30px;}
.global-presence-bg .section-head{display: flex; flex-direction: column; gap: 10px; padding-right: 90px;}
.global-presence-bg .section-head .h2-headline{color: var(--fix-white-fix);}
.global-presence-bg .section-head .body-2{color: var(--fix-white-fix);}
.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(--fix-white-fix); 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-orange);}

.bottom-footer{background:var(--card-bg-200); border-top: solid 15px var(--primary-orange);}
.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);}
.btn-box{gap: 15px;}



.service-serve-list ul{display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 30px;}
.service-serve-list ul li{border-radius: 16px; background: var(--black-800); padding: 40px; text-align: center;}
.service-serve-box{display: flex; flex-direction: column; gap: 10px;}

.smart-solutions-section .col-md-7,.smart-solutions-section .col-md-5{display: flex; align-items: center;}
.smart-solutions-img{position: relative; padding: 50px 0px 50px 50px; width: 100%;}
.smart-solutions-img::before{content: ""; position: absolute; left: 0; top: 0; width: 100%; max-width: 325px; height: 100%; background: var(--black-800); border-radius: 16px;}
.smart-solutions-img img{width: 100%; object-fit: cover; position: relative; z-index: 1; aspect-ratio: 10/12.4; border-radius: 16px; max-width: 396px;}
.smart-solutions-head{display: flex; flex-direction: column; gap: 15px;}
.smart-solutions-list ul{display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 50px;}
.smart-solutions-list ul li{display: flex; flex-direction: column; gap: 10px;}
.smart-solutions-des{display: flex; flex-direction: column; gap: 50px; width: 100%;}

.portfolio-box{gap: 30px; display: flex; flex-direction: column;}
.portfolio-box-left{flex: 1; display: flex; flex-direction: column; gap: 10px;}
.portfolio-box figure img{aspect-ratio: 2/1; object-fit: cover; border-radius: 16px;}
.portfolio-box figcaption{gap: 30px; border-radius: 16px; background: var(--black-800); padding: 30px;} 


@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: 70px 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:110px; margin: 0px 15px; width: calc(100% - 30px); border-radius: 16px; padding: 30px; display: none; background: rgba(0, 0, 0, 0.3); border: 1px solid rgba(255, 255, 255, 0.2); backdrop-filter: blur(11.95px); -webkit-backdrop-filter: blur(11.95px);}
.light_theme .menu-box{background: rgba(255, 255, 255, 0.92); border-color: rgba(0, 0, 0, 0.1);}
.menu-box ul li a{text-align: center; width: 100%; display: block;}
.submenu{position: relative; top: 0; background: transparent; margin-top: 15px;}
.light_theme .submenu{background: rgba(255, 255, 255, 0.65); border: 1px solid rgba(0, 0, 0, 0.08); border-radius: 12px;}

.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;}
.global-presence-bg .section-head{padding-right: 0;}
.home-banner-inner{padding-top: 125px !important;}



}

@media (max-width: 1023px) {
.request-form-section .col-md-6{width: 100%;}
.global-presence-bg{padding:0px;}
.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: 40px 0px;}
.banner-des-top h1 br{display: none;}
.banner-des-top h1{font-size: 45px;}
.testimonials-section .col-md-6{width: 100%;}
.form-ger-box{padding-left: 0;}
.request-form-section .row{row-gap: 30px;}
.request-form-section .row .form-box .row{row-gap: 0;}
footer{padding: 0;}
.portfolio-section .owl-carousel{padding: 0px 15px;}
.testimonials-list{padding: 0px 15px;}

}

@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: 0px 15px; margin: 0;}
.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: 85px;}
.head-right .btn i{display: none;}
header .container-fluid{padding: 0;}
.header-inner{padding: 10px 0px;}
.form-box-bg .section-head{padding: 15px;}
.form-box{padding: 15px;}
.menu-box{top: 80px;}
.footer-top-section{border-width: 5px;}
.bottom-footer{border-width: 5px;}
.banner-des-box{gap: 25px;}
.banner-des-box{padding-bottom: 30px;}
.btn-box{flex-wrap: wrap;}
.home-banner-inner{padding-top: 100px !important;}

.smart-solutions-img::before{max-width: 230px;}
.smart-solutions-img{padding: 15px 0px 15px 15px;}
.smart-solutions-section .row{row-gap: 15px;}
.smart-solutions-list ul{gap: 30px;}
.portfolio-box figcaption{flex-direction: column;}
}

@media (max-width: 580px){
.logo svg{max-width: 120px;}   
header .btn{height: 41px; padding: 8px 10px;}
.head-right img{height: 35px !important;}
}