

     :root {



    --primary-color: #032d69;

    --secondary-color: #ffbf00;

    --white-color: #ffffff;

    --text-color: rgba(255, 255, 255, 0.78);



    --transition: all .4s ease;

    --radius: 4px;

}



* {

    margin: 0;

    padding: 0;

    box-sizing: border-box;

    font-family: 'Outfit', sans-serif;

}



body {

    background: #f2f2f2;

}



/* ===================================

        HERO SECTION

=================================== */



.hero-section {

    position: relative;

    width: 100%;

    min-height: 100%;

    overflow: hidden;

    display: flex;

    flex-direction: column;

}



/* Background */



.hero-bg {

    position: absolute;

    inset: 0;

    width: 100%;

    height: 100%;

    top:-120px;

}



.hero-bg img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    transform: scale(1.08);

    animation: zoomBg 12s linear infinite alternate;

}



@keyframes zoomBg {



    0% {

        transform: scale(1.05);

    }



    100% {

        transform: scale(1.15);

    }

}





.logo-sec {
    background: linear-gradient(135deg, #fff, #fff);
}

.logo-box {
  
    overflow: hidden;
    position: relative;

}

.second-box {
  
}

.logo-head {
    margin-bottom: 10px;
}

.logo-head span {
    display: inline-block;
    background: rgba(255,191,0,0.12);
    color: #ffbf00;
    padding: 8px 18px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 15px;
}

.logo-head h2 {
    font-size: 34px;
    font-weight: 700;
    color: #032d69;
    margin: 0;
}







.logo-card {

    background: #fff;

    border-radius: 24px;

    height: 140px;

    padding: 20px;



    display: flex;

    align-items: center;

    justify-content: center;



    transition: 0.4s ease;

    overflow: hidden;

}



.logo-card:hover {

    transform: translateY(-8px);

}



.logo-card img {

    width: 100%;

    height: 100%;

    object-fit: contain;

    transition: 0.4s ease;

}



.logo-card:hover img {

    transform: scale(1.05);

}



.swiper {

    overflow: visible;

}



/* RESPONSIVE */

@media(max-width:991px){



    .logo-head h2{

        font-size: 28px;

    }



    .logo-card{

        height: 190px;

    }

}



@media(max-width:767px){



    .logo-box{

        padding: 30px 20px;

        border-radius: 24px;

    }



    .logo-head h2{

        font-size: 24px;

    }



    .logo-card{

        height: 170px;

    }

}

/* Overlay */



.hero-overlay {

    position: absolute;

    inset: 0;

    background:

        linear-gradient(to right,

            rgba(3, 45, 105, .96),

            rgba(3, 45, 105, .75),

            rgba(3, 46, 105, 0));

    z-index: 1;

}

/* DROPDOWN */



.navbar .dropdown-menu{

    background: #fff;

    border: none;

    border-radius: 12px;

    padding: 12px;

    min-width: 290px;

    box-shadow: 0 15px 40px rgba(0,0,0,0.12);

    margin-top: 15px;

}



.navbar .dropdown-item{

    padding: 12px 16px;

    border-radius: 8px;

    font-size: 14px;

    font-weight: 500;

    color: var(--primary-color);

    transition: var(--transition);

}



.navbar .dropdown-item:hover{

    background: var(--secondary-color);

    color: #000;

}

.dropdown-toggle::after {
    display: block;
    margin-left: 0px;
    vertical-align: .255em;
    
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;
    opacity:0;
}

.navbar .dropdown-toggle::after{

    margin-left: 0px;

    vertical-align: middle;
    display:none;

}



/* ===========================
   NAVBAR HOVER UNDERLINE
=========================== */

.navbar .nav-link{
    position: relative;
    display: inline-block;
}

.navbar .nav-link::before{
    content: "";
    position: absolute;
    left: 50%;
    bottom: -5px;
    width: 0;
    height: 2px;
    background: #032d69;
    transform: translateX(-50%);
    transition: all .35s ease;
}

.navbar .nav-link:hover::before,
.navbar .nav-link.active::before,
.navbar .nav-item:hover > .nav-link::before{
    width: 80%;
}

.navbar .nav-link:hover{
    color: #032d69 !important;
}



.custom-navbar {

    position: relative;

    z-index: 50;

    background: var(--white-color);

    padding: 18px 0;

}



.navbar-brand img {

    width: 180px;

}



.navbar-nav .nav-link {

    color: #2a3550;

    font-size: 14px;

    font-weight: 600;

    margin: 0 12px;

    position: relative;

    transition: var(--transition);

}



/* .navbar-nav .nav-link::after {

    content: "";

    position: absolute;

    left: 0;

    bottom: -6px;

    width: 0%;

    height: 2px;

    background: var(--secondary-color);

    transition: var(--transition);

} */



.navbar-nav .nav-link:hover::after {

    width: 100%;

}



.navbar-nav .nav-link:hover {

    color: var(--primary-color);

}



/* Quote Button */



.quote-btn {

    border: none;

    outline: none;

    background: var(--primary-color);

    color: var(--white-color);

    padding: 14px 30px;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 1px;

    transition: var(--transition);

    position: relative;

    overflow: hidden;

}



.quote-btn::before {

    content: "";

    position: absolute;

    top: 0;

    left: -100%;

    width: 100%;

    height: 100%;

    background: var(--secondary-color);

    transition: .5s;

    z-index: -1;

}



.quote-btn:hover::before {

    left: 0;

}



.quote-btn:hover {

    color: #ffffff;

}



/* ===================================

        HERO CONTENT

=================================== */



.hero-content {

    position: relative;

    z-index: 10;

    flex: 1;

    align-items: center;

    padding: 100px 0;

}



.mini-tag {

    display: inline-block;

    background: var(--secondary-color);

    color: #000;

    padding: 7px 15px;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 2px;

    margin-bottom: 25px;

}



.hero-title {

    font-size: 68px;

    line-height: 1.1;

    font-weight: 800;

    color: var(--white-color);

    margin-bottom: 30px;

}



.hero-title span {

    color: var(--secondary-color);

}



.hero-text {

    max-width: 620px;

    color: var(--text-color);

    font-size: 16px;

    line-height: 1.9;

    margin-bottom: 45px;

}



/* Buttons */



.hero-btns {

    display: flex;

    gap: 18px;

    flex-wrap: wrap;

}



.primary-btn,

.outline-btn {

    padding: 16px 34px;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 1px;

    transition: var(--transition);

    border-radius: var(--radius);

    text-decoration: none;

}



.primary-btn {

    background: var(--white-color);

    color: var(--primary-color);

}



.primary-btn:hover {

    background: var(--secondary-color);

    color: #000;

    transform: translateY(-5px);

}



.outline-btn {

    border: 1px solid rgba(255, 255, 255, .2);

    color: var(--white-color);

}



.outline-btn:hover {

    background: var(--white-color);

    color: var(--primary-color);

    transform: translateY(-5px);

}



/* ===================================

        RESPONSIVE

=================================== */



@media(max-width:991px) {



    .navbar-nav {

        padding-top: 20px;

    }



    .quote-btn {

        margin-top: 15px;

    }



    .hero-content {

        padding: 80px 0;

    }



    .hero-title {

        font-size: 52px;

    }

}



@media(max-width:767px) {



    .hero-content {

        padding: 70px 10px;

    }



    .hero-title {

        font-size: 42px;

    }



    .hero-text {

        font-size: 15px;

    }



    .hero-btns {

        flex-direction: column;

    }



    .primary-btn,

    .outline-btn {

        width: 100%;

        text-align: center;

    }



    .navbar-brand img {

        width: 75px;

    }

}



@media(max-width:575px) {


.about-img {
    min-height: 450px;
     margin-top: 0px !important; 
}
.small-title {
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 3px;
    color: var(--primary-color);
    margin-bottom: 8px !important;
}
.section-text {
    font-size: 15px;
    margin-bottom:28px !important;
}
    .hero-title {

        font-size: 34px;

        margin-bottom: 20px;

    }
.competency-heading h2 {
    font-size: 26px !important;
}
.offering-heading h2 {
    font-size: 26px !important;
}
.offering-item {
    font-size: 12px !important;
    padding: 11px 11px !important;
    border-radius: 50px;
}
.eng-heading h2 {
    font-size: 26px;
}

.navbar-brand img {
    width: 130px;
}
.policy-title {
    font-size: 26px;
}
.policy-list li {
    position: relative;
    padding-left: 32px;
    margin-bottom: 15px;
    color: #555;
    line-height: 22px;
    text-align: start !important;
}
    .hero-text {

        line-height: 1.7;

    }

}





 .about-section {

            padding: 90px 0;

            background: #fff;

        }



  



        .small-title {

            font-size: 12px;

            font-weight: 700;

            color: var(--primary-color);

            letter-spacing: 1px;

            margin-bottom: 18px;

            text-transform: uppercase;

        }



        .main-title {

            font-size: 32px;

            line-height: 1.15;

            font-weight: 800;

            color: #032d69;

            /* margin-bottom: 25px; */

        }



        .about-text {

            color: #000;

            font-size: 16px;

            line-height: 1.9;

            margin-bottom: 28px;

        }



        .about-list {

            padding-left: 18px;

            margin-bottom: 35px;

        }



        .about-list li {

            color: #49566e;

            margin-bottom: 12px;

            font-size: 15px;

        }



        .stats-box {

            background: #eef3fb;

            border-radius: 14px;

            padding: 24px;

            height: 100%;

            transition: var(--transition);

        }



        .stats-box:hover {

            transform: translateY(-5px);

        }



        .stats-box h3 {

            font-size: 34px;

            font-weight: 800;

            color: var(--primary-color);

            margin-bottom: 8px;

        }



        .stats-box p {

            margin: 0;

            color: #5d6677;

            font-size: 14px;

            font-weight: 500;

        }



        .image-wrapper {

            position: relative;

        }



        .about-img {

            width: 100%;

            border-radius: 8px;

            object-fit: cover;

            min-height: 520px;

        }



        .quote-box {

            position: absolute;

            left: -20px;

            bottom: -20px;

            background: #021d44;

            padding: 28px;

            max-width: 280px;

            border-radius: 0px;

            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.18);

        }



        .quote-box h4 {

            color: var(--secondary-color);

            font-size: 32px;

            font-weight: 800;

            line-height: 1.2;

            margin-bottom: 12px;

        }



        .quote-box span {

            color: rgba(255, 255, 255, 0.7);

            font-size: 13px;

        }



        /* Mission Box */



        .mission-box {

            margin-top: 70px;

            background:

                linear-gradient(rgba(1, 26, 66, 0.92),

                    rgba(1, 26, 66, 0.92)),

                url('../images/bg-img.jpg');

            background-size: cover;

            background-position: center;

            border-radius: 0px;

            padding: 55px;

            overflow: hidden;

        }



        .mission-box h2 {

            color: #fff;

            font-size: 32px;

            font-weight: 700;

            margin-bottom: 20px;

        }



        .mission-box p {

            color: rgba(255, 255, 255, 0.78);

            font-size: 16px;

            line-height: 1.9;

            max-width: 900px;

        }



        /* Responsive */



        @media(max-width:991px) {



            .about-wrapper {

                padding: 35px;

            }



            .main-title {

                font-size: 38px;

            }



            .about-img {

                min-height: 450px;

                margin-top: 40px;

            }



            .quote-box {

                left: 20px;

                bottom: 20px;

            }

        }



        @media(max-width:767px) {



            .about-section {

                padding: 70px 0;

            }



            .main-title {

                font-size: 30px;

            }



            .mission-box {

                padding: 35px 25px;

            }



            .mission-box h2 {

                font-size: 30px;

            }



            .quote-box {

                position: relative;

                left: 0;

                bottom: 0;

                margin-top: -70px;

                margin-left: 20px;

            }

        }



        @media(max-width:575px) {



            .about-wrapper {

                padding: 25px;

            }



            .main-title {

                font-size: 26px !important;

            }

.about-wrapper {
    padding: 0px !important;
}
.mission-right-icon img {
    width: 100px !important;
}
            .about-text {

                font-size: 15px;

            }



            .stats-box h3 {

                font-size: 28px;

            }



            .mission-box h2 {

                font-size: 26px;

            }



            .quote-box {

                max-width: 220px;

                padding: 20px;

            }



            .quote-box h4 {

                font-size: 24px;

            }

        }

    





         .counter-section {

            background: var(--primary-color);

            padding: 55px 0;

        }



        .counter-box {

            text-align: center;

        }



        .counter-box h2 {

            color: var(--secondary-color);

            font-size: 44px;

            font-weight: 800;

            margin-bottom: 10px;

        }



        .counter-box p {

            color: rgba(255, 255, 255, 0.72);

            font-size: 12px;

            letter-spacing: 3px;

            text-transform: uppercase;

            margin: 0;

        }



        /* ===================================

                PURPOSE SECTION

        =================================== */



        .purpose-section {

            background: var(--light-bg);

            padding: 100px 0;

        }



        .section-title {

            font-size: 32px;

            line-height: 1.1;

            font-weight: 800;

            color: var(--primary-color);

            margin-bottom: 24px;

        }



        .section-text {

            color: #000;

            font-size: 17px;

            line-height: 1.9;

            margin-bottom: 45px;

            max-width: 700px;

        }



        /* Value Items */



        .value-item {

            display: flex;

            gap: 20px;

            margin-bottom: 42px;

        }



        .value-icon {

            width: 52px;

            height: 52px;

            background: var(--secondary-color);

            display: flex;

            align-items: center;

            justify-content: center;

            flex-shrink: 0;

        }



        .value-icon i {

            font-size: 22px;

            color: #000;

        }



        .value-content h4 {

            font-size: 30px;

            font-weight: 700;

             color: var(--primary-color);;

            margin-bottom: 10px;

        }



        .value-content p {

            color:#000;

            line-height: 1.8;

            margin: 0;

            font-size: 16px;

        }



        /* ===================================

                RIGHT CARD

        =================================== */



        .stats-card {

            background: #fff;

            border-radius: 18px;

            padding: 45px;

            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);

        }



        .mini-icon {

            font-size: 30px;

            color: var(--primary-color);

            margin-bottom: 35px;

        }



        .progress-item {

            margin-bottom: 35px;

        }



        .progress-header {

            display: flex;

            justify-content: space-between;

            margin-bottom: 12px;

        }



        .progress-header span {

            font-size: 14px;

            font-weight: 700;

            color: #1d1d1d;

            letter-spacing: 1px;

        }



        .progress {

            height: 12px;

            background: #ececec;

            border-radius: 30px;

            overflow: hidden;

        }



        .progress-bar-blue {

            background: var(--primary-color);

            border-radius: 30px;

        }



        .progress-bar-yellow {

            background: var(--secondary-color);

            border-radius: 30px;

        }



        /* Quote Box */



        /* CSS */



.testimonial-box {

    margin-top: 45px;

    background: #f5f7fc;

    padding: 28px;

    border-left: 5px solid var(--secondary-color);

}



.testimonial-box p {

    color: #000;

    line-height: 1.8;

    margin-bottom: 18px;

    font-size: 15px;

}



.testimonial-box h6 {

    margin: 0;

    color: var(--primary-color);

    font-size: 14px;

    font-weight: 800;

    letter-spacing: 1px;

}

        /* ===================================

                RESPONSIVE

        =================================== */



        @media(max-width:991px) {



            .section-title {

                font-size: 42px;

            }



            .stats-card {

                margin-top: 40px;

            }



            .counter-box h2 {

                font-size: 52px;

            }

        }



        @media(max-width:767px) {



            .counter-section {

                padding: 45px 0;

            }



            .counter-box {

                margin-bottom: 35px;

            }



            .purpose-section {

                padding: 70px 0;

            }



            .section-title {

                font-size: 34px;

            }



            .section-text {

                font-size: 15px;

            }



            .value-content h4 {

                font-size: 24px;

            }



            .stats-card {

                padding: 30px 24px;

            }

        }



        @media(max-width:575px) {



            .counter-box h2 {

                font-size: 42px;

            }



            .section-title {

                font-size: 28px;

            }



            .value-item {

                gap: 15px;

            }



            .value-icon {

                width: 45px;

                height: 45px;

            }



            .value-content h4 {

                font-size: 21px;

            }



            .value-content p {

                font-size: 14px;

            }



            .quote-box {

                padding: 22px;

            }

        }



        .service-section{

    background: #fff;

    overflow: hidden;

}



/* Heading */



.sub-heading{

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 2px;

    color: var(--primary-color);

    display: inline-block;

    margin-bottom: 10px;

}



.main-heading{

    font-size: 32px !important;

    font-weight: 700;

    color: var(--primary-color);

    margin-bottom: 10px;

}



.heading-line{

    width: 50px;

    height: 4px;

    background: var(--secondary-color);

    border-radius: 10px;

    margin-bottom: 25px;

}



/* Segment Box */



.segment-box{

    background: #f5f6fb;

    border-radius: 10px;

    padding: 45px 20px;

    text-align: center;

    transition: var(--transition);

    height: 100%;

}



.segment-box i{

    font-size: 42px;

    color: var(--primary-color);

    margin-bottom: 15px;

}



.segment-box h5{

    font-size: 18px;

    font-weight: 600;

    margin: 0;

    color: #111;

}



.segment-box:hover{

    transform: translateY(-8px);

    background: var(--primary-color);

}



.segment-box:hover i,

.segment-box:hover h5{

    color: var(--white-color);

}



/* Bottom Section */



.engineering-section{

    background: var(--primary-color);

    padding: 70px;

  

    position: relative;

    overflow: hidden;

}



.engineering-img{

    position: relative;

}



.engineering-img::before{

    content: "";

    position: absolute;

    width: 70px;

    height: 70px;

    background: var(--secondary-color);

    top: -15px;

    left: -15px;

    z-index: 0;

}



.engineering-img img{

    width: 100%;

    height: 460px;

    border-radius: 10px;

    position: relative;

    z-index: 1;

    object-fit: cover;

}



.engineering-heading{

    font-size: 32px;

    font-weight: 700;

    color: var(--white-color);

    line-height: 1.2;

    margin-bottom: 30px;

}



.service-list{

    display: flex;

    flex-direction: column;

    gap: 14px;

}



.service-item{

    display: flex;

    align-items: center;

    gap: 14px;

    color: var(--white-color);

    font-size: 16px;

    font-weight: 500;

}



.service-item span{

    width: 38px;

    height: 38px;

    background: #fff;

    color: var(--primary-color);

    border-radius: 8px;

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 14px;

    flex-shrink: 0;

}



/* Responsive */



@media(max-width:991px){



    .engineering-section{

        padding: 40px 25px;

    }



    .main-heading,

    .engineering-heading{

        font-size: 28px;

    }



}



@media(max-width:576px){



    .segment-box{

        padding: 35px 15px;

    }



    .segment-box i{

        font-size: 34px;

    }



    .segment-box h5{

        font-size: 16px;

    }



    .main-heading,

    .engineering-heading{

        font-size: 24px;

    }



}



.expertise-section{

    padding: 100px 0;

    background: #f5f7fc;

    overflow: hidden;

}



.sub-heading{

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 2px;

    color: var(--primary-color);

    margin-bottom: 12px;

    display: inline-block;

}



.section-heading{

    font-size: 32px;

    font-weight: 700;

    color: #032d69;

    margin-bottom: 25px;

    line-height: 1.2;

}



.expertise-content p{

    font-size: 16px;

    line-height: 1.9;

    color: #4c5a6d;

    margin-bottom: 20px;

}



/* Image */



.expertise-image{

    position: relative;

    padding-left:15px;

}



.expertise-image::before{

    content: "";

    position: absolute;

    width: 240px;

    height: 240px;

    background: var(--secondary-color);

    top: -16px;

    left: 0;

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

}



.expertise-image img{

    width: 100%;

    border-radius: 12px;

    position: relative;

    z-index: 2;

    object-fit: cover;

    box-shadow: 0 20px 50px rgba(0,0,0,0.15);

}



/* ========================= */

/* CTA SECTION */

/* ========================= */



.cta-section{

    background: var(--primary-color);

    padding: 110px 0;

    text-align: center;

}



.cta-box h2{

    font-size: 32px;

    font-weight: 700;

    color: var(--white-color);

    margin-bottom: 20px;

}



.cta-box p{

    color: var(--text-color);

    max-width: 700px;

    margin: auto;

    line-height: 1.8;

    font-size: 17px;

}



.cta-btns{

    margin-top: 40px;

    display: flex;

    justify-content: center;

    gap: 20px;

    flex-wrap: wrap;

}



.btn-yellow{

    background: var(--secondary-color);

    color: #111;

    padding: 15px 35px;

    font-size: 14px;

    font-weight: 700;

    text-transform: uppercase;

    text-decoration: none;

    border-radius: 6px;

    transition: var(--transition);

}



.btn-yellow:hover{

    background: #fff;

    color: var(--primary-color);

}



.btn-border{

    border: 1px solid rgba(255,255,255,0.3);

    color: #fff;

    padding: 15px 35px;

    font-size: 14px;

    font-weight: 700;

    text-transform: uppercase;

    text-decoration: none;

    border-radius: 6px;

    transition: var(--transition);

}



.btn-border:hover{

    background: #fff;

    color: var(--primary-color);

}



/* ========================= */

/* ABOUT PAGE */

/* ========================= */



.about-hero-section {

    position: relative;

    width: 100%;

    min-height: 60vh;

    overflow: hidden;

    display: flex;

    flex-direction: column;

}



/* Background */



.about-bg {

    position: absolute;

    inset: 0;

    width: 100%;

    height: 100%;

}

/* ========================= */

/* ABOUT IMAGE */

/* ========================= */



.about-image-box{

    position: relative;

    padding-top: 30px;

    padding-right: 30px;

}



/* Yellow Element */



.about-top-shape{

    position: absolute;

    top: 0;

    right: 0;



    width: 180px;

    height: 180px;



    background: #fee9aa;



   



    z-index: 1;

}



/* Main Image */



.about-main-img{

    width: 100%;

    border-radius: 14px;



    position: relative;

    z-index: 2;



    object-fit: cover;



    box-shadow: 0 20px 50px rgba(0,0,0,0.15);

}

.about-bg img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    transform: scale(1.08);

    animation: zoomBg 12s linear infinite alternate;

}



@keyframes zoomBg {



    0% {

        transform: scale(1.05);

    }



    100% {

        transform: scale(1.15);

    }

}



/* Overlay */



.about-overlay {

    position: absolute;

    inset: 0;

    background:

        linear-gradient(to right,

            rgba(3, 45, 105, .96),

            rgba(3, 45, 105, .75),

            rgba(3, 45, 105, .45));

    z-index: 1;

}



.about-banner-section{

    min-height: 260px;

    padding: 140px 0 70px;

    position: relative;

    overflow: hidden;



    display: flex;

    align-items: center;



    text-align: left; /* left align */

}



/* Content */



.about-banner-content{

    position: relative;

    z-index: 2;

}



/* Badge */



.about-mini-badge{

    display: inline-block;

    padding: 10px 20px;

    border-radius: 50px;

    background: rgba(255,255,255,0.08);

    border: 1px solid rgba(255,255,255,0.15);

    color: #fff;

    font-size: 13px;

    font-weight: 600;

    letter-spacing: 1px;

    margin-bottom: 20px;

}



/* Title */



.about-banner-title{

    font-size: 60px;

    font-weight: 700;

    color: #fff;

    margin-bottom: 20px;

    line-height: 1.1;

    margin-top: 40px;

}



/* Text */



.about-banner-text{

    font-size: 17px;

    line-height: 1.8;

    color: rgba(255,255,255,0.78);

    max-width: 650px;

    margin: 0; /* remove auto center */

}







/* ========================= */

/* CORE COMPETENCIES */

/* ========================= */



.competency-section{

    padding: 60px 0;

    background: #fff;

}



/* Heading */



.competency-heading{

    margin-bottom: 50px;

}



.competency-tag{

    display: inline-block;

    font-size: 14px;

    font-weight: 700;

    letter-spacing: 6px;

    color: #032d69;

    margin-bottom: 18px;

}



.competency-heading h2{

    font-size: 32px;

    font-weight: 700;

    color: #032d69;

    line-height: 1.1;

    margin: 0;

}



/* Cards */



.competency-card{

    border: 2px solid #5e6d88;

    border-radius: 20px;



    padding: 30px 30px;



    text-align: center;



    height: 100%;



    transition: 0.4s ease;



    background: #f8f9fc;

}



/* Active Card */



.active-card{

    background: #032d69;

    border-color: #032d69;

}



.active-card h3,

.active-card .competency-icon i{

    color: #fff;

}



/* Icon */



.competency-icon{

    margin-bottom: 8px;

}



.competency-icon i{

    font-size: 38px;

    color: #032d69;

    transition: 0.4s ease;

}



/* Text */



.competency-card .active-card  h3{

    font-size: 16px !important;

    line-height: 1.5;

    font-weight: 700;

    color: #ffffff;

    margin: 0;

    transition: 0.4s ease;

}



.competency-card h3{

    font-size: 20px;

}

/* Hover */



.competency-card:hover{

    transform: translateY(-10px);

    background: #032d69;

    border-color: #032d69;

}



.competency-card:hover h3,

.competency-card:hover .competency-icon i{

    color: #fff;

}



/* Responsive */



@media(max-width:991px){



    .competency-section{

        padding: 70px 0;

    }



    .competency-heading h2{

        font-size: 56px;

    }



}



@media(max-width:576px){



    .competency-heading h2{

        font-size: 40px;

    }



    .competency-card{

        padding: 35px 20px;

    }



    .competency-card h3{

        font-size: 20px;

    }



    .competency-icon i{

        font-size: 46px;

    }



}

/* ========================= */

/* RESPONSIVE */

/* ========================= */



@media(max-width:991px){



    .about-banner-section{

        min-height: 280px;

        padding: 120px 0 60px;

    }



    .about-banner-title{

        font-size: 46px;

    }



}



@media(max-width:576px){



    .about-banner-section{

        min-height: 240px;

        padding: 110px 0 50px;

    }



    .about-banner-title{

        font-size: 34px;

    }



    .about-banner-text{

        font-size: 15px;

    }



}





/* ========================= */

/* OFFERING SECTION */

/* ========================= */



.offering-section{

    padding: 100px 0;

    background: #fff;

}



/* Heading */



.offering-heading{

    margin-bottom: 60px;

}



.offering-heading h2{

    font-size: 32px;

    font-weight: 700;

    color: #032d69;

    margin: 0;

    line-height: 1.2;

}



/* Image */



.offering-image{

    position: relative;

    overflow: hidden;

    border-radius: 18px;

}



.offering-image img{

    width: 100%;

    border-radius: 6px;

    object-fit: cover;

    transition: 0.5s ease;

}



.offering-image:hover img{

    transform: scale(1.05);

}



/* Right Side */



.offering-list{

    display: flex;

    flex-direction: column;

    gap: 10px;

}



/* Item */



.offering-item{

    border: 3px solid #1f4b8f;



    border-radius: 80px;



    padding: 8px 10px;



    text-align: center;



    font-size: 20px;

    font-weight: 500;



    color: #1f4b8f;



    transition: 0.4s ease;



    background: #f8f9fc;

}



/* Hover */



.offering-item:hover{

    background: #032d69;

    color: #fff;

    transform: translateX(10px);

}



/* Responsive */



@media(max-width:991px){



    .offering-section{

        padding: 70px 0;

    }



    .offering-heading{

        margin-bottom: 40px;

    }



    .offering-heading h2{

        font-size: 46px;

    }



    .offering-item{

        font-size: 20px;

        padding: 20px 24px;

    }



}



@media(max-width:576px){



    .offering-heading h2{

        font-size: 34px;

    }



    .offering-item{

        font-size: 17px;

        padding: 18px 20px;

        border-radius: 50px;

    }



}







/* ========================= */

/* ENGINEERING SERVICES */

/* ========================= */



.engineering-service-section{

    padding: 80px 0;

    background: #f5f7fc;

}



/* Left Box */



.engineering-service-box{

    position: relative;

    overflow: hidden;

    border-radius: 20px;

    min-height: 500px;



    display: flex;

    align-items: center;

}



/* Background Image */



.engineering-bg-img{

    position: absolute;

    inset: 0;



    width: 100%;

    height: 100%;



    object-fit: cover;

}



/* Overlay */



.engineering-overlay{

    position: absolute;

    inset: 0;



    background: rgba(3, 45, 105, 0.78);



    z-index: 1;

}



/* Content */



.engineering-service-content{

    position: relative;

    z-index: 2;



    padding: 60px;

}



/* Heading */



.engineering-service-content h2{

    font-size: 32px;

    line-height: 1.2;

    font-weight: 700;



    color: #fff;



    margin-bottom: 30px;

}



/* Paragraph */



.engineering-service-content p{

    font-size: 17px;

    



    color: rgba(255,255,255,0.82);



    margin-bottom: 20px;

}



/* Arrow */



.engineering-arrow{

    width: 55px;

    height: 55px;



    border-radius: 50%;



    border: 2px solid rgba(255,255,255,0.2);



    display: flex;

    align-items: center;

    justify-content: center;



    text-decoration: none;



    margin-top: 30px;



    transition: 0.4s ease;

}



.engineering-arrow i{

    font-size: 22px;

    color: #fff;

}



.engineering-arrow:hover{

    background: #ffbf00;

    border-color: #ffbf00;

}



/* Right Image */



.engineering-side-image{

    height: 100%;

    border-radius: 20px;

    overflow: hidden;

}



.engineering-side-image img{

    width: 100%;

    height: 100%;



    min-height: 530px;



    object-fit: cover;



    border-radius: 20px;



    transition: 0.5s ease;

}



.engineering-side-image:hover img{

    transform: scale(1.05);

}



/* Responsive */



@media(max-width:991px){



    .engineering-service-content{

        padding: 40px;

    }



    .engineering-service-content h2{

        font-size: 40px;

    }



    .engineering-side-image img{

        min-height: 400px;

    }



}



@media(max-width:576px){



    .engineering-service-section{

        padding: 60px 0;

    }



    .engineering-service-box{

        min-height: auto;

    }



    .engineering-service-content{

        padding: 30px 20px;

    }



    .engineering-service-content h2{

        font-size: 28px;

    }



    .engineering-service-content p{

        font-size: 15px;

    }



    .engineering-side-image img{

        min-height: 300px;

    }



}









/* ========================= */

/* ENGINEERING FEATURE */

/* ========================= */





/* Wrapper */



.engineering-feature-wrapper{

    background: #f1f3f8;

    padding: 100px 0px;

    border-radius: 12px;

}



/* ========================= */

/* IMAGE */

/* ========================= */



.engineering-feature-image{

    position: relative;

    overflow: hidden;

    border-radius: 14px;

}



.engineering-feature-image img{

    width: 100%;

    height: 760px;

    object-fit: cover;

    border-radius: 14px;

}



/* Bottom Card */



.engineering-image-card{

    position: absolute;

    left: 25px;

    right: 25px;

    bottom: 25px;



    background: rgba(255,255,255,0.95);



    border-radius: 10px;



    padding: 20px 22px;

}



/* Top */



.engineering-card-top{

    display: flex;

    justify-content: space-between;

    align-items: center;



    margin-bottom: 14px;

}



.engineering-model{

    font-size: 13px;

    font-weight: 700;

    color: #032d69;

}



.engineering-badge{

    background: #2d2200;

    color: #fff;



    font-size: 11px;

    font-weight: 700;



    padding: 6px 10px;

    border-radius: 4px;

}



.engineering-image-card h4{

    font-size: 16px;

    font-weight: 600;

    color: #111;

    margin: 0;

}



/* ========================= */

/* CONTENT */

/* ========================= */



.engineering-feature-content h2{

    font-size: 32px;

    font-weight: 700;

    color: #032d69;

    margin-bottom: 50px;

}



/* Service Item */



.engineering-service-item{

    display: flex;

    gap: 22px;



    margin-bottom: 45px;

}



/* Icon */



.engineering-service-icon{

    width: 62px;

    height: 62px;



    min-width: 62px;



    border-radius: 14px;



    background: #e4e6ec;



    display: flex;

    align-items: center;

    justify-content: center;

}



.engineering-service-icon i{

    font-size: 28px;

    color: #111;

}



/* Text */



.engineering-service-text h4{

    font-size: 24px;

    font-weight: 700;

    color: #111;

    margin-bottom: 10px;

}



.engineering-service-text p{

    font-size: 18px;

    line-height: 1.8;

    color: #4b4b4b;

    margin: 0;

}



/* ========================= */

/* RESPONSIVE */

/* ========================= */



@media(max-width:991px){



    .engineering-feature-section{

        padding: 70px 0;

    }



    .engineering-feature-wrapper{

        padding: 25px;

    }



    .engineering-feature-content h2{

        font-size: 44px;

        margin-bottom: 35px;

    }



    .engineering-feature-image img{

        height: 500px;

    }



    .engineering-service-text h4{

        font-size: 24px;

    }



    .engineering-service-text p{

        font-size: 16px;

    }



}



@media(max-width:576px){



    .engineering-feature-wrapper{

        padding: 18px;

    }



    .engineering-feature-content h2{

        font-size: 34px;

    }



    .engineering-service-item{

        gap: 15px;

        margin-bottom: 30px;

    }



    .engineering-service-icon{

        width: 52px;

        height: 52px;

        min-width: 52px;

    }



    .engineering-service-icon i{

        font-size: 22px;

    }



    .engineering-service-text h4{

        font-size: 20px;

    }



    .engineering-service-text p{

        font-size: 15px;

        line-height: 1.7;

    }



    .engineering-feature-image img{

        height: 350px;

    }



    .engineering-image-card{

        left: 15px;

        right: 15px;

        bottom: 15px;

        padding: 15px;

    }



    .engineering-image-card h4{

        font-size: 20px;

    }



}





/* ========================= */

/* PRODUCT SHOWCASE */

/* ========================= */

.product-main-title{

    font-size: 52px;

    font-weight: 700;

    color: #032d69;

    margin-bottom: 20px;

}



.product-main-para{

    font-size: 18px;

    line-height: 1.8;

    color: #555;

}



/* FAQ HEAD */



.product-faq-head{

    display: flex;

    align-items: center;

    justify-content: space-between;

    cursor: pointer;

}



.faq-icon{

    font-size: 34px;

    font-weight: 300;

    color: #fff;

    transition: 0.4s ease;

}



/* FAQ BODY */



.product-faq-body{

    max-height: 0;

    overflow: hidden;

    transition: 0.5s ease;

}



.active-product .product-faq-body{

    max-height: 1000px;

    margin-top: 25px;

}



.active-product .faq-icon{

    transform: rotate(45deg);

}



/* PRODUCT BOX */



.product-item-box{

    overflow: hidden;

}



/* RESPONSIVE */



@media(max-width:991px){



    .product-main-title{

        font-size: 42px;

    }



}



@media(max-width:576px){



    .product-showcase-section{

        padding: 70px 0;

    }



    .product-main-title{

        font-size: 34px;

    }



    .product-main-para{

        font-size: 15px;

    }



    .product-item-box{

        padding: 18px;

    }



    .product-item-inner span{

        font-size: 16px;

    }



    .faq-icon{

        font-size: 28px;

    }



    .preview-image{

        height: 200px;

    }



    .preview-content{

        padding: 18px;

    }



}













.infrastructure-section{

    background: #f3f5fa;

    padding: 100px 0;

    overflow: hidden;

}



.section-tag{

    font-size: 12px;

    letter-spacing: 2px;

    text-transform: uppercase;

    color: #777;

    margin-bottom: 10px;

    display: inline-block;

}



.main-heading{

    font-size: 68px;

    font-weight: 800;

    line-height: 1;

    color: var(--primary-color);

    text-transform: uppercase;

    margin-bottom: 0;

}



.section-info{

    border-left: 1px solid #dcdcdc;

    padding-left: 30px;

    color: #555;

    font-size: 15px;

    line-height: 1.9;

}



.contact-card{

    background: #eef0f7;

    padding: 35px;

    border-radius: 12px;

  

}



.card-title{

    font-size: 22px;

    font-weight: 700;

    color: #111;

    margin-bottom: 30px;

}



.contact-card label{

    font-size: 11px;

    font-weight: 700;

    text-transform: uppercase;

    color: #777;

    margin-bottom: 8px;

}



.form-control,

.form-select{

    height: 52px;

    border: none;

    border-radius: var(--radius);

    background: var(--white-color);

    font-size: 14px;

    box-shadow: none !important;

}



textarea.form-control{

    height: 140px;

    resize: none;

    padding-top: 15px;

}



.btn-submit{

    background: var(--primary-color);

    color: var(--white-color);

    height: 54px;

    border-radius: var(--radius);

    border: none;

    width: 100%;

    text-transform: uppercase;

    font-weight: 700;

    letter-spacing: 1px;

    transition: var(--transition);

}



.btn-submit:hover{

    background: #021f48;

}



.global-card{

    background: var(--white-color);

    border-radius: 14px;

    padding: 25px;

    box-shadow: 0 10px 30px rgba(0,0,0,.05);

}



.global-title{

    font-size: 22px;

    font-weight: 700;

    margin-bottom: 20px;

    color: #111;

}



.address-label{

    font-size: 10px;

    text-transform: uppercase;

    letter-spacing: 2px;

    color: #777;

    margin-bottom: 10px;

}



.address{

    color: var(--primary-color);

    font-weight: 700;

    line-height: 1.5;

}



.map-box{

    margin-top: 25px;

    border-radius: 10px;

    overflow: hidden;

    position: relative;

}



.map-box img{

    width: 100%;

    height: 220px;

    object-fit: cover;

}



.map-badge{

    position: absolute;

    bottom: 12px;

    left: 12px;

    background: rgba(255,255,255,.9);

    padding: 8px 14px;

    border-radius: 30px;

    font-size: 12px;

    font-weight: 600;

}



.status-box{

    background: #f5f7fc;

    padding: 20px;

    border-radius: 10px;

    margin-top: 20px;

}



.status-item{

    margin-bottom: 18px;

}



.status-item:last-child{

    margin-bottom: 0;

}



.status-head{

    display: flex;

    justify-content: space-between;

    margin-bottom: 8px;

    font-size: 13px;

    font-weight: 600;

}



.progress{

    height: 6px;

    background: #dce2ef;

    border-radius: 20px;

}



.progress-bar{

    border-radius: 20px;

}



.support-box{

    background: #eef0f7;

    border-radius: 10px;

    padding: 25px;

    height: 100%;

    transition: var(--transition);

}



.support-box:hover{

    transform: translateY(-5px);

}



.support-box h5{

    font-size: 20px;

    font-weight: 700;

    margin-bottom: 15px;

    color: #111;

}



.support-box p{

    color: #555;

    margin-bottom: 15px;

    font-size: 14px;

}



.support-link{

    color: var(--primary-color);

    font-weight: 700;

    text-decoration: none;

}



.operations{

    margin-top: 30px;

}



.operations span{

    display: inline-block;

    background: #e8edf8;

    padding: 10px 16px;

    border-radius: 30px;

    margin: 5px;

    font-size: 12px;

    font-weight: 700;

    color: var(--primary-color);

}



@media(max-width:991px){



    .main-heading{

        font-size: 45px;

    }



    .section-info{

        margin-top: 30px;

    }



    .global-card{

        margin-top: 30px;

    }

}



@media(max-width:576px){



    .main-heading{

        font-size: 34px;

    }



    .contact-card,

    .global-card{

        padding: 20px;

    }

}

/* ========================= */

/* FULL WIDTH MAP */

/* ========================= */



.contact-map-wrapper{

    width: 100%;

    height: 200px;

    overflow: hidden;

    position: relative;

}



/* Map */



.contact-map-wrapper iframe{

    width: 100%;

    height: 100%;

    border: 0;



    filter: grayscale(10%) contrast(1.05);

}



/* Responsive */



@media(max-width:768px){



    .contact-map-wrapper{

        height: 450px;

    }



}



@media(max-width:576px){



    .contact-map-wrapper{

        height: 350px;

    }



}







/* ========================= */

/* BACK TO TOP BUTTON */

/* ========================= */



#backToTopBtn{

    position: fixed;



    right: 25px;

    bottom: 100px;



    width: 58px;

    height: 58px;



    border: none;

    border-radius: 50%;



    background: #032d69;

    color: #fff;



    font-size: 22px;



    display: flex;

    align-items: center;

    justify-content: center;



    cursor: pointer;



    z-index: 999;



    opacity: 0;

    visibility: hidden;



    transform: translateY(20px);



    transition: all 0.4s ease;



    box-shadow: 0 10px 25px rgba(0,0,0,0.18);

}



/* Show Button */



#backToTopBtn.show{

    opacity: 1;

    visibility: visible;



    transform: translateY(0);

}



/* Hover */



#backToTopBtn:hover{

    background: #ffbf00;

    color: #111;

}



/* ========================= */

/* WHATSAPP BUTTON */

/* ========================= */



.whatsapp-float{

    position: fixed;



    right: 25px;

    bottom: 25px;



    width: 58px;

    height: 58px;



    border-radius: 50%;



    background: #25D366;

    color: #fff;



    display: flex;

    align-items: center;

    justify-content: center;



    font-size: 30px;



    text-decoration: none;



    z-index: 999;



    box-shadow: 0 10px 25px rgba(0,0,0,0.18);



    transition: all 0.4s ease;



    animation: whatsappPulse 2s infinite;

}



/* Hover */



.whatsapp-float:hover{

    transform: translateY(-6px) scale(1.08);

    color: #fff;

}



/* Pulse Animation */



@keyframes whatsappPulse{



    0%{

        box-shadow: 0 0 0 0 rgba(37,211,102,0.5);

    }



    70%{

        box-shadow: 0 0 0 18px rgba(37,211,102,0);

    }



    100%{

        box-shadow: 0 0 0 0 rgba(37,211,102,0);

    }



}



/* Responsive */



@media(max-width:576px){



    #backToTopBtn,

    .whatsapp-float{

        width: 50px;

        height: 50px;

    }



    #backToTopBtn{

        bottom: 85px;

        right: 15px;

    }



    .whatsapp-float{

        right: 15px;

        bottom: 20px;

        font-size: 26px;

    }



}





/* ========================= */

/* QUOTE MODAL */

/* ========================= */



.quote-modal-content{

    border: none;

    border-radius: 18px;

    overflow: hidden;

    position: relative;

}



/* Close */



.custom-close{

    position: absolute;

    top: 20px;

    right: 20px;

    z-index: 99;

    background-color: #fff;

    opacity: 1;

}



/* Left Side */



.quote-left{

      background:

        linear-gradient(

            135deg,

            rgba(3,45,105,0.92),

            rgba(3, 46, 105, 0.858),

            rgba(8, 0, 255, 0.578)

        ),

        url("../images/transmission.jpg");



    background-position: center;

    background-size: cover;

    background-repeat: no-repeat;

    height: 100%;

    padding: 50px 35px;



    display: flex;

    flex-direction: column;

    justify-content: center;

}



.quote-left span{

    color: #ffbf00;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 2px;

    margin-bottom: 15px;

}



.quote-left h2{

    font-size: 42px;

    font-weight: 700;

    color: #fff;

    margin-bottom: 20px;

}



.quote-left p{

    color: rgba(255,255,255,0.75);

    line-height: 1.8;

    font-size: 15px;

}



/* Right */



.quote-form-box{

    padding: 45px 35px;

    background: #fff;

}



/* Input */



.quote-input{

    height: 54px;

    border-radius: 10px;

    border: 1px solid #dfe4ec;

    box-shadow: none !important;

    padding: 12px 16px;

}



textarea.quote-input{

    height: auto;

}



/* Button */



.submit-quote-btn{

    width: 100%;

    height: 56px;



    border: none;

    border-radius: 10px;



    background: #ffbf00;

    color: #111;



    font-size: 14px;

    font-weight: 700;



    transition: 0.3s;

}



.submit-quote-btn:hover{

    background: #032d69;

    color: #fff;

}















/* ===== POLICY SECTION ===== */



.policy-section{

    background:var(--primary-color);

    padding:100px 0;

    position:relative;

    overflow:hidden;

}



.policy-section::before{

    content:"";

    position:absolute;

    width:400px;

    height:400px;

    background:rgba(255,191,0,0.10);

    filter:blur(140px);

    top:-100px;

    left:-100px;

    border-radius:50%;

}



.policy-section::after{

    content:"";

    position:absolute;

    width:350px;

    height:350px;

    background:rgba(255,255,255,0.05);

    filter:blur(120px);

    bottom:-120px;

    right:-100px;

    border-radius:50%;

}



/* Heading */



.policy-heading{

    margin-bottom:70px;

}



.policy-subtitle{

    color:var(--secondary-color);

    letter-spacing:2px;

    font-size:14px;

    display:inline-block;

    margin-bottom:18px;

    font-weight:600;

}



.policy-heading h2{

    color:var(--white-color);

    font-size:60px;

    line-height:1.1;

    font-weight:700;

    margin-bottom:20px;

}



.policy-heading p{

    color:var(--text-color);

    max-width:700px;

    margin:auto;

    line-height:1.9;

}



/* Layout */



.policy-wrapper{

    display:grid;

    grid-template-columns:320px 1fr;

    gap:35px;

    align-items:start;

}



/* Left Tabs */



.policy-tabs{

    background:rgba(255,255,255,0.04);

    border:1px solid rgba(255,255,255,0.08);

    padding:25px;

    border-radius:20px;

    position:sticky;

    top:100px;

    backdrop-filter:blur(12px);

}



.policy-tab{

    width:100%;

    border:none;

    background:rgba(255,255,255,0.04);

    color:var(--text-color);

    padding:18px 20px;

    margin-bottom:12px;

    text-align:left;

    border-radius:12px;

    transition:var(--transition);

    font-size:15px;

    font-weight:500;

    border:1px solid transparent;

}

.sus-span{

    color:var(--secondary-color);

}

.policy-tab:hover{

    background:rgba(255,191,0,0.10);

    color:var(--white-color);

    border-color:rgba(255,191,0,0.25);

}



.policy-tab.active{

    background:var(--secondary-color);

    color:#000;

    font-weight:600;

}



/* Right Content */



.policy-content-area{

    background:rgba(255,255,255,0.04);

    border:1px solid rgba(255,255,255,0.08);

    border-radius:24px;

    padding:50px;

    min-height:600px;

    backdrop-filter:blur(10px);

    position:relative;

}



.policy-content{

    display:none;

}



.policy-content.active{

    display:block;

    animation:fadeEffect .5s ease;

}



@keyframes fadeEffect{



    from{

        opacity:0;

        transform:translateY(15px);

    }



    to{

        opacity:1;

        transform:translateY(0);

    }

}



.policy-badge{

    display:inline-block;

    padding:10px 18px;

    background:rgba(255,191,0,0.12);

    color:var(--secondary-color);

    border-radius:50px;

    margin-bottom:22px;

    font-size:14px;

    font-weight:600;

    border:1px solid rgba(255,191,0,0.2);

}



.policy-content h3{

    color:var(--white-color);

    font-size:40px;

    margin-bottom:25px;

    line-height:1.3;

}


p {
    margin-top: 0;
    margin-bottom: 4px !important;
}
.policy-content p{

    color:var(--text-color);

    line-height:22px;

  

    font-size:16px;

}



.policy-content ul{

    padding-left:20px;

}



.policy-content ul li{

    color:var(--white-color);

    margin-bottom:18px;

    line-height:1.8;

    position:relative;

}



/* Responsive */



@media(max-width:991px){



    .policy-wrapper{

        grid-template-columns:1fr;

    }



    .policy-tabs{

        position:relative;

        top:0;

    }



    .policy-heading h2{

        font-size:42px;

    }



}



@media(max-width:576px){



    .policy-section{

        padding:70px 0;

    }



    .policy-heading h2{

        font-size:32px;

    }



    .policy-content-area{

        padding:30px 20px;

    }



    .policy-content h3{

        font-size:26px;

    }



    .policy-tab{

        font-size:14px;

        padding:15px;

    }



}

/* ========================= */

/* FOOTER */

/* ========================= */



.main-footer{

    background: #04142f;

    padding: 80px 0 30px;

}



.footer-logo{

    font-size: 28px;

    font-weight: 700;

    color: #fff;

    margin-bottom: 20px;

}



.footer-text{

    color: rgba(255,255,255,0.65);

    line-height: 1.9;

    font-size: 15px;

    margin-bottom: 25px;

}



.footer-social{

    display: flex;

    gap: 12px;

}



.footer-social a{

    width: 40px;

    height: 40px;

    border-radius: 50%;

    background: rgba(255,255,255,0.08);

    color: #fff;

    display: flex;

    align-items: center;

    justify-content: center;

    text-decoration: none;

    transition: var(--transition);

}



.footer-social a:hover,

.active-social{

    background: var(--secondary-color) !important;

    color: #111 !important;

}



.footer-title{

    color: var(--secondary-color);

    font-size: 15px;

    text-transform: uppercase;

    margin-bottom: 25px;

    letter-spacing: 1px;

}



.footer-links{

    padding: 0;

    margin: 0;

    list-style: none;

}



.footer-links li{

    margin-bottom: 14px;

}



.footer-links li a{

    color: rgba(255,255,255,0.7);

    text-decoration: none;

    transition: var(--transition);

    font-size: 15px;

}



.footer-links li a:hover{

    color: var(--secondary-color);

    padding-left: 5px;

}



.newsletter-form{

    display: flex;

    overflow: hidden;

    border-radius: 6px;

}



.newsletter-form input{

    width: 100%;

    border: none;

    outline: none;

    background: rgba(255,255,255,0.08);

    color: #fff;

    padding: 14px 15px;

    font-size: 14px;

}



.newsletter-form button{

    border: none;

    background: var(--secondary-color);

    color: #111;

    padding: 0 24px;

    font-size: 13px;

    font-weight: 700;

}



/* Bottom */



.footer-bottom{

    border-top: 1px solid rgba(255,255,255,0.08);

    margin-top: 60px;

    padding-top: 25px;



    display: flex;

    justify-content: space-between;

    align-items: center;

    flex-wrap: wrap;

    gap: 15px;

}



.footer-bottom p{

    margin: 0;

  color: rgba(255,255,255,0.7);

  font-size: 12px;

}

.footer-bottom-right span{

   color: rgba(255,255,255,0.7);

   font-size: 12px;

}



@media (max-width:500px) {

    .cta-section {

    background: var(--primary-color);

    padding: 53px 0;

    text-align: center;

}

.about-banner-title {

 

    font-weight: 700;

    color: #fff;

    margin-bottom: 20px;

    line-height: 1.1;

    margin-top: 21px;

}

.quote-box {

    position: relative;

    left: -7px;

    bottom: 0;

    margin-top: -70px;

    margin-left: 20px;

}

.engineering-img img{

    width: 100%;

    height: 100%;

    border-radius: 10px;

    position: relative;

    z-index: 1;

    object-fit: cover;

}

}

.footer-logo img{

    width: 220px;

}







/* =========================

GENERAL

========================= */



.eng-services{

    padding:120px 0;

    background:#071426;

    overflow:hidden;

    position:relative;

}



.eng-services::before{

    content:"";

    position:absolute;

    width:500px;

    height:500px;

    background:rgba(0,174,255,0.08);

    border-radius:50%;

    filter:blur(120px);

    top:-200px;

    left:-150px;

}



.container{

    width:96%;

    max-width:1320px;

    margin:auto;

}



/* =========================

HEADING

========================= */



.eng-heading{

    text-align:center;

    margin-bottom:70px;

}



.eng-heading span{

    color:#ffbf00;

    font-size:14px;

    font-weight:700;

    letter-spacing:3px;

}



.eng-heading h2{

    color:#fff;

    font-size:32px;

    line-height:1.2;

    margin:20px 0;

    font-weight:800;

}



.eng-heading p{

    color:#b8c1cc;

    max-width:760px;

    margin:auto;

    line-height:1.9;

}



/* =========================

WRAPPER

========================= */



.eng-wrapper{

    display:grid;

    grid-template-columns:320px 1fr;

    gap:35px;

    align-items:start;

}



/* =========================

SIDEBAR

========================= */



.eng-sidebar{

    display:flex;

    flex-direction:column;

    gap:18px;

}



.eng-tab{

    background:rgba(255,255,255,0.05);

    border:1px solid rgba(255,255,255,0.08);

    padding:18px;

    border-radius:22px;

    display:flex;

    align-items:center;

    gap:16px;

    cursor:pointer;

    transition:0.4s ease;

}



.eng-tab.active,

.eng-tab:hover{

    background:linear-gradient(135deg,#ffbf00,#c29202);

    transform:translateX(10px);

}



.eng-icon{

    width:60px;

    height:60px;

    border-radius:18px;

    background:#0b2038;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    font-size:24px;

    flex-shrink:0;

}



.eng-tab.active .eng-icon,

.eng-tab:hover .eng-icon{

    background:#fff;

    color:#071426;

}



.eng-text h4{

    color:#fff;

    font-size:18px;

    margin-bottom:6px;

}



.eng-text span{

    color:#cfd6de;

    font-size:14px;

}



.eng-tab.active .eng-text h4,

.eng-tab.active .eng-text span{

    color:#071426;

}



/* =========================

CONTENT AREA

========================= */



.eng-content-area{

    background:rgba(255,255,255,0.05);

    border:1px solid rgba(255,255,255,0.08);

    border-radius:30px;

    padding:30px;

    backdrop-filter:blur(20px);

}



.eng-content{

    display:none;

    animation:fade 0.5s ease;

}



.eng-content.active{

    display:block;

}



@keyframes fade{

    from{

        opacity:0;

        transform:translateY(15px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}



/* =========================

IMAGE

========================= */



.eng-image{

    height:420px;

    border-radius:25px;

    overflow:hidden;

    margin-bottom:30px;

}



.eng-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:0.5s ease;

}



.eng-content:hover img{

    transform:scale(1.08);

}



/* =========================

CONTENT BOX

========================= */



.mini-tag{

    background:#ffbf002e;

    color:#ffbf00;

    padding:8px 18px;

    border-radius:50px;

    display:inline-block;

    margin-bottom:18px;

    font-size:14px;

    font-weight:600;

}



.eng-content-box h3{

    color:#fff;

    font-size:42px;

    margin-bottom:20px;

}



.eng-content-box p{

    color:#c6d0da;

    line-height:1.9;

    margin-bottom:35px;
    text-align: justify;

}



/* =========================

GRID

========================= */



.eng-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:18px;

}



.eng-card{

    background:rgba(255,255,255,0.05);

    border:1px solid rgba(255,255,255,0.08);

    padding:22px;

    border-radius:18px;

    color:#fff;

    transition:0.4s ease;

    position:relative;

    padding-left:60px;

}



.eng-card::before{

    content:"✓";

    position:absolute;

    left:20px;

    top:20px;

    width:26px;

    height:26px;

    border-radius:50%;

    background:linear-gradient(135deg,#ffbf00,#c29202);

    color:#071426;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:13px;

    font-weight:bold;

}



.eng-card:hover{

    transform:translateY(-8px);

    box-shadow:0 15px 35px rgba(0,217,255,0.12);

}



/* =========================

RESPONSIVE

========================= */



@media(max-width:1100px){



    .eng-wrapper{

        grid-template-columns:1fr;

    }



    .eng-sidebar{

        display:grid;

        grid-template-columns:repeat(2,1fr);

    }



}



@media(max-width:768px){



    .eng-services{

        padding:80px 0;

    }



    .eng-heading h2{

        font-size:34px;

    }



    .eng-sidebar{

        grid-template-columns:1fr;

    }



    .eng-image{

        height:240px;

    }



    .eng-content-box h3{

        font-size:28px;

    }



    .eng-grid{

        grid-template-columns:1fr;

    }



    .eng-content-area{

        padding:20px;

    }



}











.feed-table-wrap{

    margin-top: 30px;

    overflow-x: auto;

}



.feed-table{

    width: 100%;

    border-collapse: collapse;

    border-radius: 14px;

    overflow: hidden;

    background: #fff;

}



.feed-table th{

    background:#ffbf00;

    color: #fff;

    padding: 18px;

    font-size: 18px;

    font-weight: 600;

    text-align: center;

}

.owner-heading{

    color:#ffbf00;

}

.feed-table td{

    padding: 16px;

    border: 1px solid #e5e5e5;

    text-align: center;

    font-size: 15px;

    color: #444;

}



.feed-table tr:nth-child(even){

    background: #f8f9fb;

}



@media(max-width:768px){



    .feed-table th,

    .feed-table td{

        font-size: 14px;

        padding: 12px;

    }



}



.pmo-image{

    overflow:hidden;

}



.pmo-image img{

    height:540px;

    object-fit:cover;

}





.value-section{

    padding: 100px 0;

    background: #f5f7fc;

}



/* TOP */



.value-mini-title{

    display: inline-block;



    font-size: 14px;

    font-weight: 700;

    letter-spacing: 4px;



    color: var(--primary-color);



    margin-bottom: 18px;

}



.value-main-title{

    font-size: 48px;

    font-weight: 700;

    line-height: 1.2;



    color: var(--primary-color);



    margin: 0;

}



/* CARD */



.value-card{

    background: #fff;



    border-radius: 24px;



    overflow: hidden;



    height: 100%;



    transition: var(--transition);



    box-shadow: 0 10px 40px rgba(0,0,0,0.05);

}



.value-card:hover{

    transform: translateY(-10px);

    box-shadow: 0 20px 60px rgba(0,0,0,0.1);

}



.value-image{

    height: 200px;

    overflow: hidden;

}



.value-image img{

    width: 100%;

    height: 100%;

    object-fit: cover;



    transition: 0.5s ease;

}



.value-card:hover .value-image img{

    transform: scale(1.08);

}



.value-card-content{

    padding: 28px;

}



.value-card-content h4{

    font-size: 24px;

    line-height: 1.3;



    color: var(--primary-color);



    margin-bottom: 18px;



    font-weight: 700;

}



.value-card-content p{

    font-size: 15px;

    line-height: 1.8;



    color: #555;



    margin: 0;

}



/* RESPONSIVE */



@media(max-width:991px){



    .value-section{

        padding: 70px 0;

    }



    .value-main-title{

        font-size: 38px;

    }



}



@media(max-width:576px){



    .value-main-title{

        font-size: 28px;

    }



    .value-card-content{

        padding: 22px;

    }



    .value-card-content h4{

        font-size: 20px;

    }



}



.news-update-section{

    padding: 100px 0;

    background: #f5f7fc;

}



/* LEFT CONTENT */



.news-content{

    padding-right: 30px;

}



.small-title{

    display: inline-block;



    font-size: 14px;

    font-weight: 700;

    letter-spacing: 3px;



    color: var(--primary-color);



    margin-bottom: 30px;

}



.news-block{

    margin-bottom: 0px;

}



.news-block h3{

    font-size: 28px;

    line-height: 1.4;



    color: var(--primary-color);



    margin-bottom: 20px;



    font-weight: 700;

}



.news-block p{

    font-size: 16px;

    line-height: 1.9;



    color: #555;



    margin-bottom: 16px;

}



.event-link{

    display: inline-block;



    color: #0d6efd;



    font-size: 15px;

    font-weight: 600;



    text-decoration: none;



    word-break: break-word;

}



.event-link:hover{

    text-decoration: underline;

}



/* UPCOMING */



.upcoming-event ul{

    padding-left: 20px;

    margin-top: 25px;

}



.upcoming-event ul li{

    margin-bottom: 18px;



    font-size: 17px;

    font-weight: 600;



    color: var(--primary-color);

}



/* RIGHT IMAGES */



.event-images{

    display: flex;

    flex-direction: column;

    gap: 25px;

}



.event-image-box{

    overflow: hidden;

    border-radius: 22px;



    box-shadow: 0 15px 40px rgba(0,0,0,0.08);

}



.event-image-box img{

    width: 100%;

    height: 260px;



    object-fit: cover;



    transition: 0.5s ease;

}



.event-image-box:hover img{

    transform: scale(1.08);

}



/* RESPONSIVE */



@media(max-width:991px){



    .news-update-section{

        padding: 70px 0;

    }



    .news-content{

        padding-right: 0;

    }



    .news-block h3{

        font-size: 24px;

    }



}



@media(max-width:576px){



    .news-block h3{

        font-size: 20px;

    }



    .news-block p{

        font-size: 15px;

    }



    .event-image-box img{

        height: 220px;

    }



}




   
.mission-box{

    padding: 40px;

}

/* Main Flex */

.mission-content-wrap{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 30px;
}

/* Left Content */

.mission-left-content{
    flex: 1;
}

.mission-left-content h2{
    font-size: 32px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 20px;
}

.mission-left-content p{
    color: rgba(255,255,255,0.78);
    font-size: 16px;
    line-height: 1.9;
    margin: 0;
}

/* Right Icon */

.mission-right-icon{
    width: 200px;
    height: 200px;

    border-radius: 50%;

    

    display: flex;
    align-items: center;
    justify-content: center;

    flex-shrink: 0;
}

.mission-right-icon img{
width:200px ;
}

/* Responsive */

@media(max-width:768px){

    .mission-content-wrap{
        flex-direction: column;
    }

    .mission-right-icon{
        width: 70px;
        height: 70px;
    }

    .mission-right-icon i{
        font-size: 28px;
    }

}

@media(max-width:576px){

    .mission-box{
        padding: 30px 20px;
    }

    .mission-left-content h2{
        font-size: 26px;
    }

    .mission-left-content p{
        font-size: 15px;
    }
    .mission-right-icon {
    width: 70px;
    height: 70px;
    margin: auto;
}
.expertise-image::before {
    content: "";
    position: absolute;
    width: 104px;
    height: 109px;
    background: var(--secondary-color);
    top: -16px;
    left: 0;
    clip-path: polygon(0 0, 100% 0, 0 100%);
}
.about-hero-section {
    position: relative;
    width: 100%;
    min-height: 70vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

}

.breadcrum-icon{
    width:100px;
}

.pmo-content p{
    text-align: justify;
}


.icon-box img{
    max-width: 120px; /* apne hisab se */
    height: auto;
}


/* ==========================
   COOKIE BANNER
========================== */

.cookie-banner{
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #ffffff;
    padding: 25px;
    box-shadow: 0 -5px 25px rgba(0,0,0,.12);
    z-index: 999999;
    border-top: 4px solid var(--primary-color);
    animation: slideUp .5s ease;
}

.cookie-content{
    max-width: 1400px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

.cookie-text h4{
    color: var(--primary-color);
    font-size: 24px;
    margin-bottom: 10px;
    font-weight: 700;
}

.cookie-text p{
    color: #666;
    margin: 0;
    line-height: 1.8;
    font-size: 15px;
}

.cookie-buttons{
    display: flex;
    gap: 15px;
    flex-shrink: 0;
}

.cookie-btn{
    min-width: 180px;
    padding: 14px 25px;
    border: none;
    cursor: pointer;
    font-size: 15px;
    font-weight: 600;
    border-radius: 6px;
    transition: .3s;
}

.accept-btn{
    background: var(--primary-color);
    color: #fff;
}

.accept-btn:hover{
    background: #021f48;
}

.deny-btn{
    background: transparent;
    border: 2px solid var(--primary-color);
    color: var(--primary-color);
}

.deny-btn:hover{
    background: var(--primary-color);
    color: #fff;
}

@keyframes slideUp{
    from{
        transform: translateY(100%);
    }
    to{
        transform: translateY(0);
    }
}

@media(max-width:768px){

    .cookie-content{
        flex-direction: column;
        text-align: center;
    }

    .cookie-buttons{
        width: 100%;
        flex-direction: column;
    }

    .cookie-btn{
        width: 100%;
    }
}