@import url('https://fonts.googleapis.com/css2?family=Stack+Sans+Headline:wght@200..700&display=swap');

html { overflow-x: hidden;}
body {margin: 0;padding: 0;font-family: "Stack Sans Headline", sans-serif;overflow-x: hidden;color: #2c2c2c;}
p, .main-table li {color: #2b2c2c;font-size: 16px;line-height: 29px;margin: 0 0 15px 0;font-weight: 200;letter-spacing: .4px;word-spacing: 2px; font-family: "Stack Sans Headline", sans-serif;}
.main-table li {color: #2c2c2c; font-size: 15px;line-height: 25px;margin: 0 0 10px 0; font-family: "Stack Sans Headline", sans-serif;}
a { text-decoration: none !important; font-family: "Stack Sans Headline", sans-serif;}
h1, h4, h5, h6 { font-family: "Stack Sans Headline", sans-serif;}
h2, h3 { font-family: "Stack Sans Headline", sans-serif;}

img { filter: brightness(96%);}

.main-table {text-align: left;padding: 5% 0;}
#RadDockZone2 .container-fluid { padding: 0 6% !important;}

#widgetsControl_C, #widgetsControl {height: auto !important;}
#Div_body .container-fluid {margin: 0px;padding: 0px;}
#MenuControl .nav-item {margin: 0px;}
#MenuControl .nav-item .nav-link {color: rgb(255, 255, 255);font-size: 14px;padding: 0;font-weight: 400;text-transform: uppercase;letter-spacing: .8px;}
#MenuControl .nav-fill {width: 100%;}
#MenuControl .bg-light {height: 100%;background: rgb(255, 255, 255) !important;}
#HeaderControl.RadDock_Default .rdMiddle .rdCenter, #HeaderControl.RadDock_Default .rdBottom .rdCenter {background-color: transparent !important;}
#MenuControl_C .bg-light {--bs-bg-opacity: 1;height: 100%;background-color: transparent !important;}
#MenuControl.RadDock_Default .rdMiddle .rdCenter, #MenuControl.RadDock_Default .rdBottom .rdCenter {background-color: transparent !important;}
#HeaderControl, #HeaderControl_C, #MenuControl, #MenuControl_C {height: 100px !important;}

#HeaderControl_C_ctl00_tr_HeaderBackImage { background: transparent}
@media (min-width: 320px) and (max-width: 768px) {
  .navbar-toggler {position: absolute;right: 15px;top: -75px;background: rgb(255, 255, 255);}
  #MenuControl, #MenuControl_C {height: 0px !important;}
  #HeaderControl, #HeaderControl_C {background: rgb(14 14 14);}
  .navbar-collapse {background: rgb(14 14 14);margin-top: -10px;}
  #WidgetControl4 {display: none;}
}

@media (min-width: 769px) {
  #HeaderControl {position: absolute;left: 0;top: 0;z-i;z-index: 3;width: 25%;text-align: center;background: rgb(0 0 0 / 50%);backdrop-filter: blur(2px);}
  #MenuControl {position: absolute;right: 0;top: 0;width: 75%;z-index: 8 !important;background: rgb(0 0 0 / 50%) !important;backdrop-filter: blur(2px);}
}
.dropdown-menu {
    border-radius: 0 !important;
    padding: 0;
    min-width: 240px;
}
header{
    padding-top: 20px;
}
header img {width: 370px;}

/* innr-pg-c Start */
.otherpagecss #RadDockZone1.container { max-width: 100%;}
.otherpagecss #RadDockZone1.container #HomepagecontentControl_C table { margin-top: 0 !important;}

.heading {font-size: 40px;color: #2c2c2c;font-weight: 300;margin: 0 0 30px 0;padding: 0 0 6px 0;border-bottom: 1px solid #cbcbcb;}
.heading span { color: #13808c;}    
.heading1 {font-size: 40px;color: #0a2a6e;font-weight: 300;padding: 5px 25px;margin: 0 0 30px 0;position: relative;}
.heading1::after {content: '';position: absolute;width: 6px;height: 100%;left: 0;top: 0;background: #c8952d;}
.heading1 span { font-style: italic; color: #13808c; font-weight: 500}
.custom-btn { display: inline-block; padding: 10px 30px; color: #c8952d; border: 1px solid #c8952d; border-radius: 30px; text-transform: uppercase; font-size: 14px; letter-spacing: 1px; transition: all .2s ease-in-out;}
.custom-btn:hover { background: #c8952d; color: #fff;}
.custom-btn1 { display: inline-block; padding: 8px 24px; color: #13808c; border: 1px solid #13808c; border-radius: 30px; text-transform: uppercase; font-size: 13px; letter-spacing: .5px; transition: all .2s ease-in-out;}
.custom-btn1:hover { background: #13808c; color: #fff;}


.banner-section { position: relative; overflow: hidden; height: 82vh;}
.banner-section::after { content: ''; position: absolute; width: 100%; height: 100%;  background:linear-gradient(90deg, rgb(20, 20, 20), rgb(18, 18, 18)); top: 0; left: 0; opacity: .1;}
.banner-section video{ width: 100%; object-fit: cover;}
.banner-section .banner-content {position: absolute;z-index: 2;top: 0;left: 0;width: 48%;height: 100%;background: #13808cb2;backdrop-filter: blur(12px);border-radius: 0 0 120px 0;}
.banner-section .banner-content .text {position: absolute;bottom: 3%;left: 15%;padding: 50px;}
.banner-section .banner-content .text h1 {color: #101010;font-size: 56px;font-weight: 400;letter-spacing: 1px;line-height: 66px;margin: 0 0 18px 0;} 
.banner-section .banner-content .text p {color: #000000;font-size: 20px;letter-spacing: .7px;width: 80%;line-height: 30px;}

.about-section { padding: 4% 0;}

.inner-page-banner { background: #0a2a6e;}
.inner-page-banner .text { padding: 0 0 4% 0;}
.inner-page-banner .text h1 {font-size: 50px;color: #fff;font-weight: 300;letter-spacing: .8px;margin: 0 0 20px 0;}
.inner-page-banner .text p {color: #e8e8e8;margin: 0;font-size: 16px;letter-spacing: .8px;line-height: 28px;}
.inner-page-banner .right-img img { border-radius: 0 0 0 150px;}

.journey-section .left-img img{ width: 80%; border-radius: 0 150px 0 0;}
.journey-section p { text-align: justify;}

.value-card {padding: 45px 0;border-top: 1px solid #c8942dc5;}
.value-card h6 { color: #858585; font-size: 13px; letter-spacing: .5px;}
.value-card h3 { color: #2c2c2c; font-size: 21px; margin: 20px 0 15px 0;}
.value-card p { margin: 0; font-size: 15px; line-height: 27px;}

footer {background: #222222;padding: 3% 0 0 0;}
footer .eyebrow { color: #13808c; font-size: 16px; text-transform: uppercase; font-weight: 500; letter-spacing: 1px}
.footer-heading { font-size: 33px; line-height: 1.1; margin: 25px 0 18px; font-weight: 500; color: #13808c;}
.footer-note { color: #aab2ad; max-width: 380px; font-size: 14px; line-height: 26px;}
.footer-brand { display: inline-block; margin-bottom: 5px}
.footer-heading em { color: #c8952d;}
footer h3 { font-size: 20px; font-weight: 500; color: #f3f3f3; letter-spacing: .6px;}
footer p { font-size: 14px; color: #c0c7c2}
footer a { color: #e8e8e1; text-decoration: none}
.footer-bottom { border-top: 1px solid #34403b; margin-top: 40px; padding-top: 20px; color: #9ba59f; font-size: 11px}

.team-card { background: #0a2a6e; height: 100%; overflow: hidden}
.team-card .text { padding: 35px 25px;}
.team-card .text h3 { color: #fff; font-size: 22px; font-weight: 400; letter-spacing: 1px; margin: 0 0 5px 0}
.team-card .text h6 { color: #c8952d; letter-spacing: .5px; font-size: 14px; margin: 0 0 15px 0}
.team-card .text p { color: #ddd; font-size: 14px; letter-spacing: .5px; line-height: 26px; margin: 0}

.contact-bx { background: #13808c; border-radius: 10px; margin-top: -120px; position: relative; z-index: 2;}
.contact-bx .contact-info { text-align: center; padding: 40px 30px; border-right: 1px solid #ffffff81;}
.contact-bx .contact-info i { color: #c8952d; font-size: 26px;}
.contact-bx .contact-info h5 { margin: 15px 0px 10px; color: rgb(255, 255, 255); font-size: 20px;}
.contact-bx .contact-info p, .contact-bx .contact-info p a { color: #e2e2e2; margin: 0px; font-size: 15px;}

.about-bx { padding: 40px 0;}
.about-bx .ser-title { width: 42%;}
.about-bx .ser-title h3 { color: #222222; font-size: 34px; margin: 10px 0 18px 0; position: relative; padding: 2px 20px;}
.about-bx .ser-title h3::after {content: '';position: absolute;width: 4px;height: 100%;left: 0;top: 0;background: #c8952d; border-radius: 3px;}
.about-bx .ser-title p{ color: #13808c; font-size: 19px; font-weight: 500;}
.about-bx .ser-content { width: 75%; margin: 0 0 3% 0;}
.about-section .about1 { width: 100%; height: 500px; background-image: url('image/about-us1.jpg'); border-radius: 20px; overflow: hidden; animation: ZoomOut 1s ease-in-out 200ms both;}

.section-2 { background: #0a2a6e; padding: 5% 0;}


/* =========================================
   RESPONSIVE TYPOGRAPHY
========================================= */

/* Main headings */
.heading {
    font-size: clamp(26px, 3vw, 40px);
    line-height: 1.25;
    margin-bottom: clamp(18px, 2.5vw, 30px);
}

.heading1 {
    font-size: clamp(26px, 3vw, 40px);
    line-height: 1.3;
    padding: 5px 20px;
    margin-bottom: clamp(18px, 2.5vw, 30px);
}

.heading1::after {
    width: 5px;
}

.custom-btn {
    font-size: clamp(12px, 1vw, 14px);
    padding: 10px clamp(18px, 2vw, 30px);
}

.custom-btn1 {
    font-size: clamp(12px, 0.95vw, 13px);
    padding: 8px clamp(16px, 1.8vw, 24px);
}

/* =========================================
   BANNER SECTION
========================================= */

.banner-section {
    position: relative;
    height: 82vh;
    height: 82vh;
    min-height: 450px;
    max-height: 850px;
}

.banner-section video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.banner-section .banner-content {
    width: 48%;
}

.banner-section .banner-content .text {
    left: 8%;
    bottom: 5%;
    padding: clamp(20px, 3vw, 50px);
    width: 90%;
}

.banner-section .banner-content .text h1 {
    font-size: clamp(30px, 4vw, 56px);
    line-height: 1.18;
    letter-spacing: 0.5px;
    margin-bottom: 18px;
    overflow-wrap: break-word;
}

.banner-section .banner-content .text p {
    width: 100%;
    font-size: clamp(14px, 1.5vw, 20px);
    line-height: 1.6;
    letter-spacing: 0.3px;
}

/* =========================================
   ABOUT SECTION
========================================= */

.about-section {
    padding: clamp(35px, 4vw, 65px) 0;
}

.about-bx {
    padding: clamp(25px, 4vw, 40px) 0;
}

.about-bx .ser-title {
    width: 42%;
    max-width: 100%;
}

.about-bx .ser-title h3 {
    font-size: clamp(24px, 2.5vw, 34px);
    line-height: 1.3;
    padding: 2px 18px;
}

.about-bx .ser-title p {
    font-size: clamp(15px, 1.5vw, 19px);
    line-height: 1.6;
}

.about-bx .ser-content {
    width: 75%;
    max-width: 100%;
}

.about-section .about1 {
    width: 100%;
    min-height: 300px;
    height: clamp(300px, 40vw, 500px);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

/* =========================================
   INNER PAGE BANNER
========================================= */

.inner-page-banner .text {
    padding-bottom: clamp(25px, 4vw, 55px);
}

.inner-page-banner .text h1 {
    font-size: clamp(28px, 3.5vw, 50px);
    line-height: 1.2;
    letter-spacing: 0.4px;
    margin-bottom: 15px;
}

.inner-page-banner .text p {
    font-size: clamp(14px, 1.25vw, 16px);
    line-height: 1.8;
}

.inner-page-banner .right-img img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 0 0 0 clamp(35px, 8vw, 150px);
}

/* =========================================
   JOURNEY SECTION
========================================= */

.journey-section .left-img img {
    width: 80%;
    max-width: 100%;
    height: auto;
    border-radius: 0 clamp(40px, 8vw, 150px) 0 0;
}

.journey-section p {
    font-size: clamp(14px, 1.2vw, 16px);
    line-height: 1.8;
}

/* =========================================
   VALUE CARDS
========================================= */

.value-card {
    padding: clamp(25px, 3.5vw, 45px) 0;
}

.value-card h6 {
    font-size: clamp(12px, 1vw, 13px);
    line-height: 1.5;
}

.value-card h3 {
    font-size: clamp(18px, 1.7vw, 21px);
    line-height: 1.4;
    margin: 15px 0 12px;
}

.value-card p {
    font-size: clamp(14px, 1.2vw, 15px);
    line-height: 1.8;
}

/* =========================================
   TEAM CARDS
========================================= */

.team-card {
    height: 100%;
}

.team-card img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.team-card .text {
    padding: clamp(20px, 2.5vw, 35px)
             clamp(18px, 2vw, 25px);
}

.team-card .text h3 {
    font-size: clamp(19px, 1.8vw, 22px);
    line-height: 1.4;
}

.team-card .text h6 {
    font-size: clamp(12px, 1.15vw, 14px);
    line-height: 1.5;
}

.team-card .text p {
    font-size: clamp(13px, 1.1vw, 14px);
    line-height: 1.8;
}

/* =========================================
   CONTACT BOX
========================================= */

.contact-bx {
    margin-top: -80px;
}

.contact-bx .contact-info {
    padding: clamp(25px, 3vw, 40px)
             clamp(15px, 2vw, 30px);
}

.contact-bx .contact-info i {
    font-size: clamp(22px, 2vw, 26px);
}

.contact-bx .contact-info h5 {
    font-size: clamp(17px, 1.6vw, 20px);
    line-height: 1.4;
}

.contact-bx .contact-info p,
.contact-bx .contact-info p a {
    font-size: clamp(13px, 1.2vw, 15px);
    line-height: 1.7;
    overflow-wrap: anywhere;
}

/* =========================================
   FOOTER
========================================= */

footer {
    padding: clamp(30px, 3vw, 50px) 0 0;
}

footer .eyebrow {
    font-size: clamp(13px, 1.3vw, 16px);
    line-height: 1.5;
}

.footer-heading {
    font-size: clamp(25px, 2.6vw, 33px);
    line-height: 1.2;
    margin: 20px 0 15px;
    overflow-wrap: break-word;
}

.footer-note {
    max-width: 380px;
    font-size: clamp(13px, 1.1vw, 14px);
    line-height: 1.8;
}

footer h3 {
    font-size: clamp(17px, 1.6vw, 20px);
    line-height: 1.4;
}

footer p,
footer a {
    font-size: clamp(13px, 1.1vw, 14px);
    line-height: 1.8;
}

.footer-bottom {
    margin-top: 30px;
    padding: 18px 0;
    font-size: 11px;
    line-height: 1.7;
}

/* =========================================
   SECTION 2
========================================= */

.section-2 {
    padding: clamp(35px, 5vw, 70px) 0;
}

/* =========================================
   LARGE LAPTOPS / DESKTOPS
========================================= */

@media (min-width: 1400px) {
    .banner-section .banner-content .text {
        left: 10%;
    }
}

/* =========================================
   TABLETS & SMALL LAPTOPS
   768px to 991px
========================================= */

@media (max-width: 991.98px) {

    .banner-section {
        height: 65vh;
        height: 65svh;
        min-height: 430px;
    }

    .banner-section .banner-content {
        width: 58%;
    }

    .banner-section .banner-content .text {
        left: 3%;
        bottom: 3%;
        width: 95%;
        padding: 25px;
    }

    .banner-section .banner-content .text h1 {
        font-size: clamp(30px, 4.5vw, 42px);
        line-height: 1.2;
    }

    .banner-section .banner-content .text p {
        font-size: 16px;
        line-height: 1.7;
    }

    .about-bx .ser-title {
        width: 100%;
    }

    .about-bx .ser-content {
        width: 100%;
    }

    .about-section .about1 {
        height: 380px;
    }

    .journey-section .left-img img {
        width: 100%;
    }

    .inner-page-banner .text h1 {
        font-size: clamp(30px, 4vw, 40px);
    }

    .contact-bx {
        margin-top: -50px;
    }

    .contact-bx .contact-info {
        border-right: none;
        padding: 25px 15px;
    }

    .team-card .text {
        padding: 22px 18px;
    }

    .value-card {
        padding: 25px 0;
    }
}

/* =========================================
   MOBILE PHONES
   576px and below
========================================= */

@media (max-width: 575.98px) {

    /* General headings */
    .heading {
        font-size: 27px;
        line-height: 1.3;
        margin-bottom: 20px;
        padding-bottom: 8px;
    }

    .heading1 {
        font-size: 26px;
        line-height: 1.3;
        padding: 5px 16px;
        margin-bottom: 20px;
    }

    .heading1::after {
        width: 4px;
    }

    /* Buttons */
    .custom-btn,
    .custom-btn1 {
        font-size: 12px;
        padding: 9px 18px;
        letter-spacing: 0.5px;
    }

    /* Header */
    header {
        top: 0;
    }

    /* Hero banner */
    .banner-section {
        height: 650px;
        height: 80svh;
        min-height: 520px;
        max-height: 720px;
    }

    .banner-section video {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .banner-section .banner-content {
        width: 100%;
        height: 100%;
        background: #13808cbf;
        border-radius: 0 0 65px 0;
        backdrop-filter: blur(8px);
    }

    .banner-section .banner-content .text {
        top: auto;
        bottom: 5%;
        left: 0;
        width: 100%;
        padding: 25px 22px;
    }

    .banner-section .banner-content .text h1 {
        font-size: clamp(30px, 8vw, 38px);
        line-height: 1.2;
        letter-spacing: 0;
        margin-bottom: 15px;
    }

    .banner-section .banner-content .text p {
        width: 100%;
        font-size: 15px;
        line-height: 1.7;
        letter-spacing: 0;
        margin-bottom: 20px;
    }

    /* About */
    .about-section {
        padding: 35px 0;
    }

    .about-bx {
        padding: 25px 0;
    }

    .about-bx .ser-title,
    .about-bx .ser-content {
        width: 100%;
    }

    .about-bx .ser-title h3 {
        font-size: 25px;
        line-height: 1.35;
        padding: 2px 15px;
    }

    .about-bx .ser-title p {
        font-size: 16px;
    }

    .about-section .about1 {
        height: 300px;
        min-height: 250px;
        border-radius: 15px;
        background-position: center;
    }

    /* Inner page banner */
    .inner-page-banner .text {
        padding-bottom: 25px;
    }

    .inner-page-banner .text h1 {
        font-size: 30px;
        line-height: 1.25;
        margin-bottom: 15px;
    }

    .inner-page-banner .text p {
        font-size: 14px;
        line-height: 1.8;
        letter-spacing: 0.2px;
    }

    .inner-page-banner .right-img img {
        width: 100%;
        border-radius: 0 0 0 55px;
    }

    /* Journey */
    .journey-section .left-img img {
        width: 100%;
        border-radius: 0 0 0 0;
    }

    .journey-section p {
        font-size: 14px;
        line-height: 1.8;
        text-align: left;
    }

    /* Values */
    .value-card {
        padding: 25px 0;
    }

    .value-card h6 {
        font-size: 12px;
    }

    .value-card h3 {
        font-size: 19px;
        line-height: 1.4;
        margin: 12px 0;
    }

    .value-card p {
        font-size: 14px;
        line-height: 1.8;
    }

    /* Team */
    .team-card .text {
        padding: 25px 20px;
    }

    .team-card .text h3 {
        font-size: 21px;
    }

    .team-card .text h6 {
        font-size: 13px;
    }

    .team-card .text p {
        font-size: 14px;
        line-height: 1.8;
    }

    /* Contact */
    .contact-bx {
        margin-top: 25px;
        border-radius: 10px;
    }

    .contact-bx .contact-info {
        padding: 25px 15px;
        border-right: none;
        border-bottom: 1px solid #ffffff50;
    }

    .contact-bx .contact-info:last-child {
        border-bottom: none;
    }

    .contact-bx .contact-info i {
        font-size: 24px;
    }

    .contact-bx .contact-info h5 {
        font-size: 18px;
        margin: 12px 0 8px;
    }

    .contact-bx .contact-info p,
    .contact-bx .contact-info p a {
        font-size: 14px;
        line-height: 1.7;
    }

    /* Footer */
    footer {
        padding: 35px 0 0;
    }

    footer .eyebrow {
        font-size: 13px;
    }

    .footer-heading {
        font-size: 27px;
        line-height: 1.25;
        margin: 18px 0 15px;
    }

    .footer-note {
        font-size: 14px;
        line-height: 1.8;
    }

    footer h3 {
        font-size: 18px;
    }

    footer p,
    footer a {
        font-size: 13px;
        line-height: 1.8;
    }

    .footer-bottom {
        margin-top: 20px;
        padding: 15px 0;
        font-size: 11px;
    }

    /* Other sections */
    .section-2 {
        padding: 35px 0;
    }
}

/* =========================================
   VERY SMALL MOBILE PHONES
   375px and below
========================================= */

@media (max-width: 375px) {

    .heading {
        font-size: 24px;
    }

    .heading1 {
        font-size: 23px;
        padding-left: 14px;
    }

    .banner-section .banner-content .text {
        padding: 20px 16px;
    }

    .banner-section .banner-content .text h1 {
        font-size: 29px;
    }

    .banner-section .banner-content .text p {
        font-size: 14px;
    }

    .inner-page-banner .text h1 {
        font-size: 27px;
    }

    .footer-heading {
        font-size: 24px;
    }

    .custom-btn,
    .custom-btn1 {
        padding: 8px 14px;
    }
}

.inner-banner { padding: 15% 0px 8%; background-image: url("/image/inner-banner.jpg"); background-size: cover; background-position: center center;}