:root{
  --primary1: 28,39,48; /* #1C2730 */
  --primary2: 69,100,163; /* #4564A3 */
  --baseColor: 139,139,139; /* #8B8B8B */
  --color_black: 0,0,0;
  --color_white: 255,255,255;
  --baseFont: 'Plus Jakarta Sans', sans-serif;
  
  --imgPrimary1: invert(8%) sepia(5%) saturate(6168%) hue-rotate(166deg) brightness(92%) contrast(83%);
  --imgPrimary2: invert(40%) sepia(15%) saturate(1751%) hue-rotate(182deg) brightness(91%) contrast(96%);
  --imgWhite: invert(100%) sepia(100%) saturate(0%) hue-rotate(13deg) brightness(103%) contrast(102%);
  --imgBlack: invert(0%) sepia(100%) saturate(0%) hue-rotate(108deg) brightness(93%) contrast(103%);
  --padding: clamp(3.125rem, 2.5rem + 3.125vw, 6.25rem);
  --mb:1.875rem;
  --bs-breadcrumb-divider: '/';
}

body {font-family: var(--baseFont); color:rgb(var(--baseColor)); font-weight: 400; font-variant-ligatures: no-common-ligatures;}
a:hover, a:focus {outline: none; -webkit-box-shadow: none; box-shadow: none; text-decoration: none;}
button:focus {outline: none;}
.sprite {background-image: url("../images/sprite.png"); background-position: 0 0; background-repeat: no-repeat; display: inline-block; vertical-align: middle;}
.transition {-webkit-transition: all .3s linear; transition: all .3s linear;}

.container{max-width: 1440px; width: 100%;}
::selection {color: rgb(var(--color_white)); background: rgb(var(--primary2));}
.clr-1 {color: rgb(var(--primary1)) !important;} .bg-clr-1 {background-color: rgb(var(--primary1));}
.clr-2 {color: rgb(var(--primary2)) !important;} .bg-clr-2 {background-color: rgb(var(--primary2));}

.ff-medium {font-weight: 500;}
.ff-semiBold {font-weight: 600;}
.ff-bold {font-weight: 700;}
.ff-Exbold {font-weight: 800;}

.bg{background-repeat: no-repeat; background-position: 0 0; background-size: cover;}

/* button custom */
.btn-custom {position: relative; border: none; background-color: rgb(var(--primary2)); box-shadow: 0 0 0 rgba(var(--color_black),0.2); border-radius: 24px 24px 24px 0px; color: rgb(var(--color_white)); overflow: hidden; padding: 1rem 1.5rem; transition: all .2s linear;}
.btn-custom:focus {box-shadow: none;}
.btn-custom:hover, .btn-custom:focus{ background-color: rgb(var(--primary1)); color: rgb(var(--color_white));}
.btn-custom.fill-none{background-color: transparent; color: rgb(var(--primary1)); padding: 0; border-radius: 0; font-weight: 700; text-transform: uppercase; display: flex; align-items: center;}
.btn-custom.fill-none .icon{width: 32px; height: 32px; border-radius: 50%; margin-left: 8px; background-color: rgb(var(--primary2)); display: flex; justify-content: center; align-items: center; transition: margin-left .3s linear; flex-shrink: 0;}
.btn-custom.fill-none .icon .arrow{background-position: -26px -3px; width: 16px;	height: 16px;}
.btn-custom.fill-none:hover .icon,.btn-custom.fill-none:focus .icon{margin-left: 16px;}
.btn-custom.fill-none:hover,.btn-custom.fill-none:focus{box-shadow: none;}

/* owl-carousel */
.owl-flex .owl-stage {display: flex;}
.owl-carousel.style01 .owl-dots{display: flex; justify-content: flex-end; position: absolute; right: 0; bottom: 8px;}
.owl-carousel.style01 .owl-dots .owl-dot span{margin-left: 10px; width: 10px; height: 10px; border-radius: 50%; background-color: rgb(var(--baseColor)); display: block;}
.owl-carousel.style01 .owl-dots .owl-dot.active span{background-color: rgb(var(--primary1));}
.owl-carousel.style01 .owl-nav button{width: 54px; height: 36px; display: flex; align-items: center; justify-content: center; background-color: #E8EEF6;}
.owl-carousel.style01 .owl-nav button:hover{background-color: rgb(var(--color_white)); }
.owl-carousel.style01 .owl-nav [class^='owl-'].disabled {opacity: 0.5; cursor: default;}
.owl-carousel.style01 .owl-nav.disabled [class^='owl-'] {display: none;}

#wrapper {max-width: 1920px; margin: 0 auto; position: relative;}

/* header */
header { left: 0; right: 0; top: 0; margin: 0 auto; background-color: transparent; transition: all 0.3s; z-index: 99 !important;}
header .navbar .navbar-toggler:focus{outline: none; box-shadow: none;}
header .navbar {transition: all 0.3s linear; z-index: 10;}
header .navbar .navbar-brand img{transform: scale(1); transition: transform .2s linear; transform-origin: left center;}
header .navbar .navbar-nav .nav-item {margin: 0 15px; }
header .navbar .navbar-nav .nav-item .nav-link {padding: 35px 0; color: rgb(var(--primary1)); transition: 0.5s; }
header .navbar .navbar-nav .nav-item .nav-link:hover, header .navbar .navbar-nav .nav-item .nav-link.current {color: rgb(var(--primary1));}
header .navbar .navbar-nav .nav-item:hover>.nav-link,header .navbar .navbar-nav .nav-item .nav-link.active{color: rgb(var(--primary1));}
header .navbar .navbar-nav .nav-item ul li .active{background-color: transparent; color: rgb(var(--primary2));}
header .menu-wrapper {border-top: 1px solid #DBE6EC;}
header .dropdown:hover > .dropdown-menu {display: flex; }
header .dropdown-menu{width: 800px; flex-wrap: wrap; left: 50%; transform: translateX(-50%); border-radius: 24px 24px 24px 0px; border: none;}
header .dropdown-menu li{width: 33.33%;}
header .dropdown-menu li .icon{border-radius: 50%; width: 40px; height: 40px; display: flex; flex-shrink: 0; align-items: center; justify-content: center; background-color: rgb(var(--primary2)); margin-right: 1rem;}
header .dropdown-menu li .icon img {width: 24px; height: 24px;}
header .navbar .navbar-nav .dropdown-menu li .nav-link{padding:15px;}
header .dropdown-menu .dropdown-item:focus, header .dropdown-menu .dropdown-item:hover {color: rgb(var(--primary1)); background-color: transparent;}
header.fixed {box-shadow: 0px 4px 50px rgba(44, 48, 50, 0.1); background-color: rgb(var(--color_white),0.9); backdrop-filter: blur(15px);}
header.fixed .navbar .navbar-brand img{transform: scale(0.75);}
.contact-info a {width: 50px; height: 50px;background-color: rgb(var(--primary2));border-radius: 24px 24px 24px 0px; text-decoration: none; color: rgb(var(--color_white)); transition: all .3s linear;}
.contact-info a:last-child {margin-left: 15px; padding: 15px 24px;}
.contact-info a:hover,.contact-info a:focus{background-color: rgb(var(--primary1));}
.contact-info a svg path{fill: rgb(var(--color_white));}



/* banner */
.banner {transition: all 0.3s; position: relative; overflow: hidden; height: 90vh; max-height: 843px; background-repeat: no-repeat; background-position: center center; background-size: cover;}
.banner .container {display: flex; align-items: center; height: 100%; flex-wrap: wrap;}
.banner .banner-outer{width: 100%;}
.banner .banner-text{margin: 30px 0;}
.banner .banner-text .text{font-size: clamp(1.25rem, 0.375rem + 4.375vw, 5.625rem) !important; line-height: normal;}
.banner .banner-text .banner-item{margin: 0 15px; width: calc(100% - 15px);}
.banner .banner-text .image{transition: all 0.5s;}

/* Typography */
.padding {padding: var(--padding) 0;}
.padding-sm {padding: calc(var(--padding) / 2) 0;}
h2.title {font-size: clamp(1.125rem, 0.9rem + 1.125vw, 2.25rem); color: rgb(var(--primary1)); margin-bottom: 3rem; font-weight: 600;}
h2.title span{display: block; color: rgb(var(--primary2)); font-size: 0.875rem; letter-spacing: 1.96px; text-transform: uppercase; margin-bottom: 1rem; font-weight: 800; letter-spacing: 1.96px;}
h3 {font-size: clamp(1.125rem, 1.1rem + 0.125vw, 1.25rem);}

/* about */
.about .circle-pic{position: absolute; left: 0; top: 0;}
.about .about-block-inner{position: relative; z-index: 1;}
.about .about-block-inner .text-block {max-width: 400px;}
.about .about-block-inner .text-block h2:before {left: auto; right: 0;}
.about .about-block-bottom {z-index: 1; position: relative;}

.pic {overflow: hidden;}
.pic img {transition: 0.4s;}
.pic:hover img {transform: scale(1.08);}


/* service-slider */
.service-slider.owl-carousel>div {overflow: visible;}
.service-slider .item .card {text-decoration: none; color: inherit; background-color: transparent;}
.service-slider .item .card .ratio{--bs-aspect-ratio: 100%; background-color: #f0f0f0;}
.service-slider .item .card .ratio h2{display: flex; align-items: center; justify-content: center;}
.service-slider .item .card-footer{background-color: transparent;}
.service-slider .item .text{ color: rgb(var(--primary1)); font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem); font-weight: 600;}
.service-slider .item:hover .text{color: rgb(var(--primary2));}
.service-slider .owl-nav{display: flex; justify-content: end; top: -5rem; position: absolute; right: 0;}
.service-slider .owl-nav button{width: 32px; height: 32px; border-radius: 50%; margin-left: 15px; transition: all .3s linear;}
.service-slider .owl-nav button.owl-prev,.service-slider  .owl-nav button.owl-next{background-color: #CDCDCD; display: flex; align-items: center; justify-content: center;}
.service-slider .owl-nav button.owl-prev .arrow-left{background-position: -3px -3px; width: 16px; height: 16px; transition: none;}
.service-slider .owl-nav button.owl-next .arrow-right{background-position: -26px -3px; width: 16px;	height: 16px; transition: none;}
.service-slider .owl-nav button:hover{background-color: rgb(var(--color_white));}
.service-slider .owl-nav button:hover {background-color: rgb(var(--primary2));}

/* case-study */
.case-study{background-repeat: no-repeat; background-position: center top; background-size: cover;}
.case-study .card{background-color: transparent; text-decoration: none; color: inherit;}
.case-study .card .ratio{padding-top: 60%; position: relative; margin-bottom: 1.5rem;}
.case-study .card .card-footer{background-color: transparent;}
.case-study .card .card-footer .location{color: rgb(var(--baseColor)); margin-bottom: 0.8rem;}
.case-study .card:hover .text{color: rgb(var(--primary2));}

/* testimonial-slider */
.testimonials{overflow: hidden;}
.testimonials .owl-stage{display: flex; flex-wrap: wrap;}
.testimonial-slider.owl-carousel>div {overflow: visible;}
.testimonial-slider .item{height: 100%;}
.testimonial-slider .item .card{height: 100%; background: url('../images/gradient-bg1.jpg') no-reeat center top / cover; background: radial-gradient(ellipse at bottom,  #405d97 0%,#1c2841 100%);}
.testimonial-slider .item .card p{color: rgb(var(--color_white));}
.testimonial-slider .item .card h4{color: rgb(var(--color_white)); font-size: 1rem; font-weight: 600; margin-bottom: 0; margin-top: auto;}
.testimonial-slider .item .card h4::before{content: "-"; margin-right: 5px; display: inline-block;}
.testimonial-slider .owl-nav{display: flex; justify-content: end; top: -5rem; position: absolute; right: 0;}
.testimonial-slider .owl-nav button{width: 32px; height: 32px; border-radius: 50%; margin-left: 15px;}
.testimonial-slider .owl-nav button.owl-prev,.testimonial-slider  .owl-nav button.owl-next{background-color: #CDCDCD; display: flex; align-items: center; justify-content: center;}
.testimonial-slider .owl-nav button.owl-prev .arrow-left{background-position: -3px -3px; width: 16px; height: 16px; transition: none;}
.testimonial-slider .owl-nav button.owl-next .arrow-right{background-position: -26px -3px; width: 16px;	height: 16px; transition: none;}
.testimonial-slider .owl-nav button:hover{background-color: rgb(var(--color_white));}
.testimonial-slider .owl-nav button:hover {background-color: rgb(var(--primary2));}


/* clientele */
#clientele .circle-pic{position: absolute; right: 0; top: 0;}
#clientele .owl-stage{display: flex; flex-wrap: wrap;}
#clientele .clientele-slider .item{height: 100%; display: flex; align-items: center; justify-content: center;}
#clientele .clientele-slider .item .img-wrap img{filter: grayscale(1); width: auto; transition: filter .2s linear; width: auto;}
#clientele .clientele-slider .item:hover .img-wrap img{filter:none;}


/* blog */
.blog{background-repeat: no-repeat; background-position: center top; background-size: cover;}
.blog .card{background-color: transparent; text-decoration: none; color: inherit;}
.blog .card .ratio{padding-top: 60%; position: relative; margin-bottom: 1.5rem;}
.blog .card .card-footer{background-color: transparent;}
.blog .card .card-footer .date{color: rgb(var(--baseColor)); margin-bottom: 0.8rem;}
.blog .card:hover .text{color: rgb(var(--primary2));}

h4{color: rgb(var(--primary1)); font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem); font-weight: 600;}

/* footer */
.totop {bottom: 30px; cursor: pointer; display: flex; align-items: center; justify-content: center; width: 45px; height: 45px; position: fixed; right: -60px; z-index: 99; background-color: rgb(var(--color_white)); text-align: center; opacity: 0; border-radius: 50%; box-shadow: 0px 10px 29.7px 3.3px rgba(0, 0, 0, 0.2);}


.footer{background-image: url('../images/bg.jpg'); background-repeat: no-repeat; background-position: center top; background-size: cover; border-radius: 120px 120px 0 0;}
.footer .top .btn-custom{text-transform: uppercase; font-weight: 700;}
.footer .top .btn-custom:active{background-color: rgb(var(--primary1)); color: rgb(var(--color_white));}
.footer .middle { overflow: hidden; position: relative; background-image: url('../images/footer-bg02.jpg'); background-repeat: no-repeat; background-position: center top; background-size: cover; border-radius: 120px 120px 0 0;}
.footer .middle .padding{padding:var(--padding) 0;}
.footer .middle .circle-pic{position: absolute; left: 0; top: -40px;}
.footer .middle .container{position: relative; z-index: 1;}
.footer .middle .f-logo{display: block;}
.footer .middle address{font-size: 1rem; color: rgb(var(--color_white));}
.footer .middle a{display: inline-block; text-decoration: none; color: rgb(var(--color_white)); text-underline-offset:4px}
.footer .middle a:hover{color:rgb(var(--color_white)); text-decoration: underline;}
.footer .middle .contact-no{font-size: clamp(1.125rem, 0.9rem + 1.125vw, 2.25rem); }
.footer .middle .social-media li{margin: 0 10px 0 0;}
.footer .middle .social-media li a{transition: all .2s linear; position: relative; top: 0;}
.footer .middle .social-media li a:hover{top: -2px;}
.footer .middle .menu-link li a{margin-bottom: 1rem; font-size: 1rem; position: relative; left: 0; transition: all .3s linear;}
.footer .middle .menu-link li a:hover{left: 5px;}

.footer .bottom{padding-bottom: calc(var(--padding) / 3); font-size: 12px; color: #97A3BB;}
.footer .bottom .copyright a{color: rgb(var(--color_white));}
.footer .bottom a{color:#97A3BB; text-decoration: none;}


/* inner pages styles */
.inner-banner {padding-top: 25%; background-position: 0 0; background-size: cover;}
.inner-banner .container { inset: 0; z-index: 1; transition: all .3s linear;}
.inner-banner .container{padding-top: 150px;}
.inner-banner .circle-pic{position: absolute; right: 0; top: 0; left: auto; width: auto; height: auto;}

.breadcrumb {--bs-breadcrumb-divider-color: rgb(var(--primary2)); --bs-link-color: rgb(var(--primary2)); font-size: 0.875rem; --bs-link-hover-color: rgba(var(--primary1));}
.breadcrumb .breadcrumb-item a {text-decoration: none; text-underline-offset: 4px; font-weight: 800; text-transform: uppercase;}
.breadcrumb .breadcrumb-item.active {color: rgb(var(--primary2)); font-weight: 800; text-transform: uppercase;}
.breadcrumb .breadcrumb-item a:hover {text-decoration: underline;}

.inner-banner h1{font-size: clamp(1.25rem, 1.05rem + 1vw, 2.25rem); font-weight: 600; color: rgb(var(--primary1));}

.vision-block{background-position: 60% 0; background-size: cover; padding: var(--padding); margin-bottom: calc(var(--padding) / 2);}
.commitment-block{background-position: 0 0; background-size: cover; padding: var(--padding);}
.radius{border-radius: 60px 60px 60px 0;}
.radius img,.radius iframe{border-radius: 60px 60px 60px 0;}

.main-container .container{position: relative;}

/* service-item */
.service-item{min-height: 265px; text-decoration: none; color: inherit;  background-color: #E5EDEF; transition: all .3s linear;}
.service-wrap [class^="col-"]:nth-child(2n) .service-item{background-color: #f5f5f5;}
.service-item .icon{background-color: rgb(var(--primary2)); border-radius: 50%; display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; flex-shrink: 0; transition: all .3s linear;}
.service-item .icon svg {width: 34px; height: 34px;}
.service-item:hover .icon{background-color: rgb(var(--primary1)); }
.service-item:hover .text{color: rgb(var(--primary2));}

.icon-wrap{width: 90px; height: 90px; border-radius: 50%; background-color:rgb(var(--primary2)); display: flex; align-items: center; justify-content: center;}


ul.style1 li {position: relative; padding-left: 20px; margin-bottom: 10px; line-height: normal;}
ul.style1 li:before {content: ''; position: absolute; left: 0; top: 7px; width: 10px; height: 10px; border-radius: 50%; border: 1px solid rgb(var(--primary2));}
ul.style1 li strong{font-weight: 600;}
ul.style2 li{font-size: 0.875rem; line-height: normal; margin-bottom: 15px;}
ul.style2 li:last-child{margin-bottom: 0;}


h6{font-size: 0.875rem; letter-spacing: 1.96px;}
.address-block p{color: rgb(var(--primary1)); margin-bottom: 30px; font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);}
.address-block h4 a{color: inherit; text-decoration: none; text-underline-offset: 4px; transition: all .3s linear;}
.address-block h4 a:hover, .address-block h4 a:focus{ text-decoration: underline;}

.inquiry-block{padding-bottom: 10px;}
.inquiry-block h6{font-size: 0.875rem; letter-spacing: 1.96px;}

.form-control::-webkit-input-placeholder {color: #929292;}
.form-control::-moz-placeholder {color: #929292;}
.form-control:-ms-input-placeholder {color: #929292;}
.form-control:-moz-placeholder {color: #929292;}

.inquiry-block form .form-control{border-radius: 0; color: rgb(var(--primary1)); padding: 0 0 20px; border: none; border-bottom: 1px solid #CDCDCD; font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem); font-weight: 600;}
.inquiry-block form .form-control:focus{box-shadow: none;}
.inquiry-block form textarea.form-control{resize: none; height: 100px;}
.inquiry-block form .btn-custom:active{background-color: rgb(var(--primary1)) !important; color: rgb(var(--color_white)) !important; box-shadow: 5px 5px 0 rgba(var(--color_black),0.2);}

.inquiry-block form .input-group-addon .refresh {display: flex; align-items: center; background: #f5f5f5; cursor: pointer; border-color: #f5f5f5;}

.case-study-block h6{letter-spacing: 0; font-weight: 600;}

.conclusion p{color: #B0BFDD;}
.conclusion ul li{color: #B0BFDD;}
.conclusion ul li::before{border: 1px solid rgb(var(--color_white));}
.conclusion ul li strong{color: rgb(var(--color_white));}

/* strategic-block */
/* .strategic-block .block{width: 303px; height: 244px; display: flex; align-items: center; justify-content: center;}
.strategic-block .block.block-bg01{background: url('../images/shape01.png') no-repeat 0 0 / cover; }
.strategic-block .block.block-bg02{background: url('../images/shape02.png') no-repeat 0 0 / cover; width: 288px; }
.strategic-block .block.block-bg03{background: url('../images/shape03.png') no-repeat 0 0 / cover; width: 290px; height: 246px;}
.strategic-block .block.block-bg04{background: url('../images/shape04.png') no-repeat 0 0 / cover; width: 245px; height: 322px; }
.strategic-block .block.block-bg05{background: url('../images/shape05.png') no-repeat 0 0 / cover; width: 291px; height: 246px; }
.strategic-block .block.block-bg06{background: url('../images/shape06.png') no-repeat 0 0 / cover; width: 289px; height: 244px; }
.strategic-block .block.block-bg07{background: url('../images/shape07.png') no-repeat 0 0 / cover; width: 291px; height: 246px; }
.strategic-block .block .block-inner{padding-right: 50px; text-align: center;}
.strategic-block .block.block-bg04 .block-inner{padding-right: 0; padding-bottom: 50px;}
.strategic-block .block.block-bg05 .block-inner{padding-right: 0; padding-left: 50px;}
.strategic-block .block.block-bg06 .block-inner{padding-right: 0; padding-left: 50px;}
.strategic-block .block.block-bg07 .block-inner{padding-right: 0; padding-left: 50px;}
.strategic-block .block .block-inner .icon{margin-bottom: 20px;}

.strategic-block .col{width: 20%;}  

.strategic-block .item{background-color: rgb(var(--primary2)); min-height: 450px;} */
.services-block .item{ min-height: 450px; height: 100%; transition: all .3s linear;}
