@charset "UTF-8";

@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");



*{

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}

:root{
    --black : #000;
    --white: #fff;
    --blue: #064089;
    --darkblue: #0A1E5B;
    --red: #E90003;
    --purple: #9772FB;
    --grey: #8D8D8D;
    --light-grey: #F5F5F5;
    --body-font: "Montserrat", sans-serif;
    --heading-font: "Encode Sans Expanded", sans-serif;
    --subhead-font: "Oxanium", sans-serif;
}

body, html{
    overflow-x: hidden;
    scroll-behavior: smooth;
}

body{
    background: var(--white);
    color: var(--grey);
    font-size: 13px;
    line-height: 1.7;
    font-family: var(--body-font);
    font-weight: 500;
}

p{
    font-size: 13px;
    font-weight: 500;
    line-height: 1.7;
    font-family: var(--body-font);
    color: var(--grey);
}

a{
    text-decoration: none !important;
    font-family: var(--body-font);
}

img{
    height: 100%;
    width: 100%;
    object-fit: cover;
}
.sec-space{
    padding: 98px 0;
}
.btn, .gjs-cell input[type="submit"]{
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.64px;
    border: 1px solid transparent;
    text-transform: uppercase;
    padding: 0 24px;
    border-radius: 0;
    position: relative;
    overflow: hidden;
}
.btn::before {
    content: "";
    height: 104%;
    width: 26px;
    background: #ffffff32;
    position: absolute;
    top: -2%;
    left: 22%;
    transform: skewX(-32deg);
    transition: 0.3s ease-in-out;
}

.btn::after {

    content: "";

    height: 104%;

    width: 8px;

    background: #ffffff32;

    position: absolute;

    top: -2%;

    left: 11%;

    transform: skewX(-32deg);

    transition: 0.3s ease-in-out;

}

.btn:hover::before{

    left: 64%;

}

.btn:hover::after{

    left: 53%;

}

.btn-primary, .gjs-cell input[type="submit"]{

    background-color: var(--red);

    color: var(--white);

}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active{

    background: var(--darkblue);

    color: var(--white);

    border-color: var(--darkblue);

}

.btn-line{

    font-weight: 700;

    color: red;

}

.btn-line::before, .btn-line::after{

    display: none;

}

.section-heading{

    margin-bottom: 42px;

    max-width: 80%;

}

.form-control, .es-form-field-container input.es-email{

    height: 40px;

    font-size: 13px;

    border-radius: 0;

    background: transparent;

    border: 1px solid #ced4da;

    color: var(--red);
    width: 100%;
    padding: 0 12px;

}
.es-form-field-container input.es-email{
    color: var(--white);
}

.form-control::placeholder{

    color: var(--white);

    text-transform: uppercase;

    font-size: 11px;

}

textarea {

    width: 100%;

    height: 120px;

    border-radius: 4px;

    border-color: #ced4da;

}





/* Header  */

.myHeader{

    background: var(--white);

}

.navbar-brand img{

    height: 80px;

    width: auto;

}

.navbar-nav .nav-item .nav-link{

    font-size: 13px;

    font-weight: 600;

    text-transform: capitalize;

    font-family: var(--body-font);

    color: var(--darkblue);

    padding: 32px 12px;

    position: relative;

    transition: 0.4s ease-in-out;

}

.navbar-nav .nav-item{

    margin: 0 12px;

    transition: 0.3s ease-in-out;

    position: relative;

}

.myHeader .navbar-nav .nav-item::before, .myHeader .navbar-nav .nav-item::after{

    content: "";

    width: 0;

    height: 6px;

    background: var(--red);

    position: absolute;

    top: 0;

    left: 0;

    transition: 0.3s ease-in-out;

}

.myHeader .navbar-nav .nav-item::after{

    top: auto;

    bottom: 0;

}

.navbar-nav .nav-item.active::before, .navbar-nav .nav-item:hover::before,

.navbar-nav .nav-item.active::after, .navbar-nav .nav-item:hover:after{

    width: 100%;

}

.navbar-nav .nav-item.active .nav-link, .navbar-nav .nav-item:hover .nav-link{

    color: var(--red);

}

.nav-text .btn-primary{

    background-color: var(--purple);

    border-color: var(--purple);

}

.nav-text .btn-primary:hover, .nav-text .btn-primary:focus, .nav-text .btn-primary:active{

    background-color: var(--red);

    border-color: var(--red);

}

.banner .btn-primary:hover, .banner .btn-primary:focus, .banner .btn-primary:active{

    background-color: var(--purple);

    border-color: var(--purple);

}



/* Banner  */

.banner{

    background: var(--darkblue);

}

.banner-img {

    position: relative;

    padding-top: 65%;

}

.banner-img img, .banner-img video{

    width: 100%;

    height: 100%;

    object-fit: cover;

    position: absolute;

    bottom: 0;

    left: 0;

    object-fit: cover;

}

.banner-text{

    max-width: 34%;

    background: #f5f5f524;

    padding: 84px 32px;

    backdrop-filter: blur(8px);

    position: relative;

}

.banner-text::before{

    content: "";

    width: 45%;

    height: calc(100% + 16px);

    border: 8px solid var(--white);

    border-left: none;

    background: transparent;

    position: absolute;

    top: -8px;

    right: 0;

}

.banner-text h1 {

    font-size: 31px;

    line-height: 1.4;

    color: var(--white);

    font-family: var(--heading-font);

    font-weight: 700;

    text-transform: uppercase;

    margin-bottom: 20px;

}

.banner-text h4{

    font-size: 17px;

    line-height: 1.6;

    text-transform: uppercase;

    color: var(--white);

    font-weight: 600;

    margin-bottom: 20px;

}

.banner-wrapper{

    position: absolute;

    top: 50%;

    left: 0;

    transform: translateY(-50%);

    width: 100%;

}





/* About start  */

.about-img{

    position:relative;

    padding-top: 64%;

}

.about-img img{

    object-fit: cover;

    position: absolute;

    top: 0;

    left: 0;

}

.about-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    grid-template-rows: 1fr 1fr 1fr;

    gap: 12px;

}

.about-grid .about-img:nth-child(2){

    grid-row: span 3;

}

.about-text{

    padding: 0 40px;

}

.about-text h6, .section-heading h6{

    font-size: 13px;

    font-family: var(--subhead-font);

    color: var(--red);

    font-weight: 700;

    text-transform: uppercase;

    position: relative;

    z-index: 1;

}

.about-text h6 strong, .section-heading h6 strong{

    background: var(--white);

    width: fit-content;

    padding: 0 12px;

}

.about-text h6 strong{

    padding-left: 0;

}

.about-text h6::before, .section-heading h6::before{

    content: "";

    width: 100%;

    height: 1px;

    background: var(--red);

    position: absolute;

    top: 46%;

    left: 0;

    z-index: -1;

}

.section-heading h6::before{

    width: 50%;

    left: 50%;

    transform: translateX(-50%);

}

.about-text h2, .section-heading h2{

    font-size: 32px;

    line-height: 1.4;

    font-weight: 800;

    text-transform: uppercase;

    color: var(--blue);

    font-family: var(--heading-font);

    position: relative;

}

.about-text h2{

    margin-bottom: 20px;

}

.about-text h2 strong, .section-heading h2 strong{

    display: block;

    font-weight: 800;

}



/* Service  */

.service-box{

    background: var(--light-grey);

    transition: 0.3s ease-in-out;

}

.service-img{

    position: relative;

    padding-top: 80%;

    overflow: hidden;

}

.service-img img{

    position: absolute;

    top: 0;

    left: 0;

    transition: 0.3s ease-in-out;

}

.serv-text{

    padding: 20px;

}

.serv-text h3{

    font-size: 18px;

    font-weight: 800;

    color: var(--darkblue);

    text-transform: uppercase;

    font-family: var(--heading-font);

}

.desc{

    overflow: hidden;

    text-overflow: ellipsis;

    display: -webkit-box;

    -webkit-line-clamp: 3;

    -webkit-box-orient: vertical;

}

.service-box:hover .service-img img{

    transform: scale(1.2);

}

.service-box:hover h3{

    color: var(--blue);

}

.owl-item.active.center .service-box{

    background: var(--darkblue);

}

.service-slider .owl-item.active.center .service-box h3, .service-slider .owl-item.active.center .service-box p{

    color: var(--white);

}

.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev{

    background: var(--light-grey);

    color: var(--darkblue);

    height: 40px;

    width: 40px;

    position: absolute;

    top: 45%;

    left: -48px;

    transition: 0.3s ease-in-out;

}

.owl-carousel .owl-nav button.owl-next{

    left: auto;

    right: -48px;

}

.owl-carousel .owl-nav button:hover, .owl-carousel .owl-nav button:focus, .owl-carousel .owl-nav button:active{

    background: var(--darkblue);

    color: var(--white);

    border: none;

    outline: 0;

}



/* Contact Banner  */

.contact-banner{

    background-color: var(--purple);

    overflow: hidden;

}

.contact-banner .contact-image{

    position: absolute;

    top: 0;

    right: 0;

    width: 50%;

    height: 100%;

}

.contact-banner h6, .contact-banner h2, .contact-banner p{

    color: var(--white);

}

.contact-banner .about-text h6 strong{

    background: transparent;

}

.contact-banner h6::before{

    background: var(--white);

    width: 86%;

    left: auto;

    right: 0;

}

.contact-banner::before, .main-footer::before{

    content: "";

    background: url(../images/world-map.png) no-repeat center;

    background-size: cover;

    transform: scale(1.5);

    width: 50%;

    height: 100%;

    position: absolute;

    top: 0;

    left: 0;

    opacity: 0.1;

}



/* Process Workflow */

.work-flow::before {

    content: "";

    width: 92%;

    height: 24%;

    background: url(../images/line.png) no-repeat center;

    background-size: contain;

    position: absolute;

    top: 50%;

    left: 0;

    transform: translateY(-50%);

}

.workflow-icon {

    height: 128px;

    width: 128px;

    border: 4px solid var(--darkblue);

    border-radius: 50%;

    background: var(--white);

    padding: 27px;

    margin: 0 auto;

}

.workflow-icon span{

    display: block;

    font-size: 14px;

    height: 32px;

    width: 32px;

    border-radius: 50%;

    line-height: 32px;

    text-align: center;

    background: var(--red);

    color: var(--white);

    position: absolute;

    bottom: 0;

    right: 0;

}

.flow-box h4{

    font-family: var(--heading-font);

    font-weight: 700;

    font-size: 15px;

    text-transform: uppercase;

    color: var(--red);

    margin-top: 32px;

}

.workflow-row [class*="col-"]:nth-child(even){

    margin-top: 40px;

}



/* Testimonials  */

.testimonials{

    overflow: hidden;

}

.testimonials::before{

    content: "";

    width: 100%;

    height: 50%;

    background: var(--light-grey);

    position: absolute;

    bottom: 0;

    left: 0;

}

.test-box{

    background: var(--darkblue);

    padding: 40px 32px 0;

    z-index: 1;

}

.test-box::before{

    content: "";

    width: 100%;

    height: 48px;

    background: var(--light-grey);

    clip-path: polygon(50% 0%, 0% 100%, 100% 100%);

    position: absolute;

    bottom: -1px;

    left: 0;

    z-index: -1;

}

.test-box .stars .bi{

    color: #FFCE1B;

    margin: 0 2px;

}

.test-box p{

    color: var(--white);

    font-weight: 400;

}

.test-box img.quote{

    height: 48px;

    width: 48px;

    object-fit: contain;

    margin: 12px auto;

}

.test-box h4{

    font-size: 18px;

    font-family: var(--subhead-font);

    font-weight: 600;

    color: var(--white);

    text-transform: uppercase;

    margin-bottom: 4px;

}

.test-box h5{

    font-size: 14px;

    font-weight: 600;

    color: var(--purple);

}

.cust-img{

    height: 84px;

    width: 84px;

    border-radius: 50%;

    border: 1px solid var(--white);

    overflow: hidden;

    margin: 40px auto 0;

}

.delivery-man {

    height: 100%;

    width: 50%;

    position: absolute;

    top: 4%;

    left: -7%;

    z-index: 9;

}

.delivery-man img{

    object-position: top;

}

.owl-carousel .owl-dots{

    margin-top: 24px;

}

.owl-carousel button.owl-dot {

    height: 8px;

    width: 8px;

    border-radius: 50%;

    background: transparent;

    margin-right: 4px;

    border: 1px solid var(--darkblue);

}

.owl-carousel button.owl-dot.active{

    background: var(--darkblue);

}



/* Why Us  */

.why-list li{

    position: relative;

    padding-left: 70px;

}

.why-icon{

    position: absolute;

    top: 0;

    left: 12px;

}

.why-icon img{

    height: 40px;

    width: 40px;

    object-fit: contain;

}

.why-icon::before{

    content: "";

    height: 40px;

    width: 40px;

    border-radius: 50%;

    background: #ECECEC;

    position: absolute;

    bottom: -32%;

    left: -32%;

    z-index: -1;

}

.why-list h4 {

    font-size: 14px;

    font-weight: 800;

    text-transform: uppercase;

    color: var(--purple);

    margin-bottom: 2px;

}

.whyus .about-img {

    padding-top: 100%;

}



/* Partners  */

.partner-logo img{

    height: 120px;

    width: 100%;

    object-fit: contain;

    opacity: 0.4;

    transition: 0.3s ease-in-out;

}

.partner-logo:hover img{

    opacity: 1;

}



/* Footer  */

.footer-top{

    background: var(--purple);

    padding: 60px 0;

}

.footer-top h2{

    color: var(--white);

    font-weight: 600;

}

.footer-top p{

    color: var(--white);

    font-weight: 300;

    margin-bottom: 0;

}

.footer-top .btn{

    flex-shrink: 0;

    background: var(--darkblue);

}

.email-subscribers, .es-form-field-container{

    display: flex;

}
form[data-form-id="1"] .es-form-field-container .gjs-row {
    flex-grow: 1 !important;
}

.email-subscribers .form-control{

    border-color: var(--white);

}

.footer-logo img{

    height: 92px;

    width: auto;

    filter: brightness(0) invert(1);

}
.emaillist{
    width: 100%;
}
.social-list li a {

    color: var(--white);

    height: 36px;

    width: 36px;

    line-height: 38px;

    text-align: center;

    border-radius: 0;

    background: var(--purple);

    font-size: 20px;

    display: block;

}

.social-list li:not(:last-child){

    margin-right: 12px;

}





.main-footer{

    background: var(--darkblue);

    padding-top: 98px;

    overflow: hidden;
	
	z-index: 1;

}

.main-footer::before{

    width: 100%;

    transform: scale(1.1);

    filter: brightness(0) invert(1);

    opacity: 0.04;
	z-index: -1;

}

.main-footer h3{

    font-size: 18px;

    font-weight: 600;

    font-family: var(--heading-font);

    text-transform: uppercase;

    color: var(--white);

    margin-bottom: 20px;

}

.myFooter .navbar-nav li a{

    color: var(--white) !important;

    font-weight: 500 !important;

    padding: 6px 0 !important;

}

.myFooter .navbar-nav li.active a{

    color: var(--purple) !important;

}

.myFooter .navbar-nav li{

    background: transparent !important;

    margin: 0;

}

.con-list .con-box {

    position: relative;

    padding-left: 50px;

}

.con-box h5 , .timing h5{

    font-size: 12px;

    color: var(--purple);

    font-weight: 600;

    margin-bottom: 2px;

}

.con-box, .con-box a , .timing span{

    font-size: 13px;

    line-height: 1.4;

    color: var(--white);

}

.con-box .bi , .copyright li .bi{

    display: block;

    color: var(--white);

    height: 36px;

    width: 36px;

    line-height: 36px;

    text-align: center;

    border-radius: 0;

    background: var(--purple);

    font-size: 18px;

    position: absolute;

    top: 0;

    left: 0;

}

.con-list .con-box:not(:last-child), .timing li:not(:last-child){

    margin-bottom: 12px;

}

.footer-row{

    margin-bottom: 98px;

}

.copyright li .bi{

    position: static;

}

.copyright li{

    margin-left: 12px;

}

.myFooter hr{

    background: var(--white);

}

.copyright{

    padding: 0 0 20px 0;

}

.copyright p, .main-footer p{

    color: var(--white);

    margin-bottom: 0;

}

.copyright p a{

    color: var(--purple);

    font-weight: 700;

}







/* Inner Pages  */

.inner-banner {

    padding: 98px 0;

}

.inner-banner{

    background: url(../images/banner-bg.jpg) no-repeat center;

    background-size: cover !important;

    width: 100%;

    height: 100%;

    position: relative;

    z-index: 1;

}

.inner-banner::before {

    content: "";

    background: linear-gradient(312deg, var(--darkblue), #9772fbbd);

    width: 100%;

    height: 100%;

    position: absolute;

    top: 0;

    left: 0;

    z-index: -1;

}

.inner-banner-text h2 {

    color: var(--white);

    font-family: var(--heading-font);

    text-transform: uppercase;

    font-weight: 700;

}



/* About Page  */

.about-cms{

    background: var(--light-grey);

}

.ab-row:nth-child(odd){

    flex-direction: row-reverse;

}

.about-cms .ab-row:not(:last-child){

    margin-bottom: 84px;

}

.about-cms h6 strong{

    background: var(--light-grey);

}


/* Service Page  */
.serv-row{
    row-gap: 24px;
}