@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
body {
    font-family: "Open Sans", sans-serif!important; 
    a {text-decoration: none;color: unset;}
}

.logo-section {
    font-size: 16px;font-weight: 700;color: #fff;
    i {background-color:  #fff;color: #42629B; padding: 5px;border-radius: 4px;font-size: 15px;}
}
.float {position: fixed;z-index: 1000;top: 50%;left: 0px;transform: translateY(-50%);}
.float img {width: 40px;}

/* Floating phone icon */
.phone-icon {
          position: fixed;top: 50%;right: 4px;transform: translateY(-50%);background: #DD9E4A;color: white;padding: 6px 14px;font-size: 16px;font-weight: bold;
          box-shadow: 12px 0px 0px 6px #42629B;cursor: pointer;display: flex;align-items: center;gap: 10px;transition: background 0.3s ease-in-out;z-index: 1000;}

.navbar { background-color: #fff;}
.navbar li a {color:  #42629B;text-transform: capitalize;font-size: 16px;font-weight: 700;}
.navbar-nav .nav-link.show, .navbar-nav .nav-link:hover {color: #42629B;}
.navbar li a i {padding: 5px;border-radius: 4px;}
.navbar li a:hover {color: #42629B;}
.navbar .dropdown-toggle::after {font-size: 16px;}
.navbar .dropdown-menu {border-radius: unset;--bs-dropdown-border-width: 0;}
.navbar .dropdown-menu .dropdown-item {font-size: 15px;padding: 6px 15px;}
.navbar .dropdown-menu .dropdown-item:hover {background-color: #42629B;color: #fff;}
/* Make dropdown appear directly below the parent link */
.nav-item.dropdown .dropdown-menu {
    left: 0 !important; /* Align dropdown left edge with parent */
    right: auto !important; /* Disable right alignment */
    top: 100%; /* Position right below the parent item */
}

.sticky-header {position: sticky; top: 0;z-index: 1020;background-color: white;box-shadow: 0 2px 5px rgba(0,0,0,0.1);}

footer {background: linear-gradient(to right, #42629B, #DD9E4A);color: #fff;}
footer h5 {color:  #000;font-size: 18px;font-weight: 600;margin-bottom: 6px;}
footer p{font-size: 13px;font-weight: 600;}
footer .nav .nav-link{padding: 0 18px 0 0;color: #fff;font-size: 14px;font-weight: 600;}
footer .copyright {font-size: 14px;font-weight: 600;}
footer p a i {font-weight: 700;color: #2e2e2d;background-color:  #fff;padding: 3px;border-radius: 4px;font-size: 8px;}

.home-banner {
    background: url(../images/home_banner.jpg) no-repeat center center/cover;
    height: 90vh;display: flex;align-items: center;justify-content: center;text-align: start;position: relative;width: 100%;}
.home-banner .banner-overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(to right, #42629B, #DD9E4A);display: block;width: 100%;opacity: .5;}
.home-banner .banner-content {position: relative;z-index: 2;color: #fff;} 
.home-banner .banner-content h1 {font-size: 60px;color: #fff;font-weight: 900;text-align: start;margin-bottom: 20px;}
.home-banner .banner-content p {font-size: 20px;font-weight: 400;}
.home-banner .banner-content .btn {font-size: 18px;font-weight: 600; color: #fff;background-color: #DD9E4A;padding: 6px 20px;border-radius: 30px;}

.company-banner {
    height: 60vh;display: flex;align-items: center;justify-content: center;text-align: start;position: relative;width: 100%;}
.company-banner .banner-overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(to right, #42629B, #DD9E4A);display: block;width: 100%;}
.company-banner .banner-content {position: relative;z-index: 2;color: #fff;} 
.company-banner .banner-content h1 {font-size: 60px;color: #fff;font-weight: 900;text-align: start;margin-bottom: 20px;}
.company-banner .banner-content .btn {font-size: 18px;font-weight: 600; color: #fff;background-color: #DD9E4A;padding: 6px 20px;border-radius: 30px;}

.company-banner-1 {
    height: 60vh;display: flex;align-items: center;justify-content: center;text-align: start;position: relative;width: 100%;}
.company-banner-1 .banner-overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(to right, #42629B, #DD9E4A);display: block;width: 100%;}
.company-banner-1 .banner-content {position: relative;z-index: 2;color: #fff;} 
.company-banner-1 .banner-content h1 {font-size: 60px;color: #fff;font-weight: 900;text-align: start;margin-bottom: 20px;}
.company-banner-1 .banner-content .btn {font-size: 18px;font-weight: 600; color: #fff;background-color: #DD9E4A;padding: 6px 20px;border-radius: 30px;}

.product-banner {
    height: 60vh;display: flex;align-items: center;justify-content: center;text-align: start;position: relative;width: 100%;}
.product-banner .banner-overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(to right, #42629B, #DD9E4A);display: block;width: 100%;}
.product-banner .banner-content {position: relative;z-index: 2;color: #fff;} 
.product-banner .banner-content h1 {font-size: 60px;color: #fff;font-weight: 900;text-align: start;margin-bottom: 20px;}
.product-banner .banner-content .btn {font-size: 18px;font-weight: 600; color: #fff;background-color: #DD9E4A;padding: 6px 20px;border-radius: 30px;}

.facility-banner {
    height: 60vh;display: flex;align-items: center;justify-content: center;text-align: start;position: relative;width: 100%;}
.facility-banner .banner-overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(to right, #42629B, #DD9E4A);display: block;width: 100%;}
.facility-banner .banner-content {position: relative;z-index: 2;color: #fff;} 
.facility-banner .banner-content h1 {font-size: 60px;color: #fff;font-weight: 900;text-align: start;margin-bottom: 20px;}
.facility-banner .banner-content .btn {font-size: 18px;font-weight: 600; color: #fff;background-color: #DD9E4A;padding: 6px 20px;border-radius: 30px;}

.quality-banner {
    height: 60vh;display: flex;align-items: center;justify-content: center;text-align: start;position: relative;width: 100%;}
.quality-banner .banner-overlay {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(to right, #42629B, #DD9E4A);display: block;width: 100%;}
.quality-banner .banner-content {position: relative;z-index: 2;color: #fff;} 
.quality-banner .banner-content h1 {font-size: 60px;color: #fff;font-weight: 900;text-align: start;margin-bottom: 20px;}
.quality-banner .banner-content .btn {font-size: 18px;font-weight: 600; color: #fff;background-color: #DD9E4A;padding: 6px 20px;border-radius: 30px;}


.home-about h2 .blue {color: #42629B;font-weight: bold;font-size: 32px;text-align: center;}
.home-about h2 .orange {color: #DD9E4A;font-weight: bold;font-size: 32px;text-align: center;}
.home-about .content p {font-size: 18px;color: #000;font-weight: 500;text-align: justify;}

.why-choose {background-color: #42629B;}
.why-choose .content h3 .blue {color: #fff;font-weight: bold;font-size: 32px;text-align: center;}
.why-choose .content h3 .orange {color: #DD9E4A;font-weight: bold;font-size: 32px;text-align: center;}
.why-choose .content p {font-size: 16px;color: #fff;}
.why-choose .card {background-color: #8095BB;padding: 30px;}
.why-choose .card h4 {font-size: 20px;color: #fff;font-weight: 700;}
.why-choose .card p {font-size: 16px;color: #fff;text-align: justify;}

.logo-section {background-color: #fff;}
.logo-section h2 .blue {color: #42629B;font-weight: bold;font-size: 32px;text-align: center;}
.logo-section h2 .orange {color: #DD9E4A;font-weight: bold;font-size: 32px;text-align: center;}
.logo-section p {font-size: 18px;color: #000;font-weight: 500;}
.logo-section .card {background-color: #F3F4F6;padding: 15px;height: 200px;
 position: relative;
  border-radius: 12px;border: unset;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);}
.logo-section .card img {background-color: #DD9E4A;border-radius: 8px;padding: 10px;width: 60px;}
.logo-section .card .img_1 {background-color: #42629B;border-radius: 8px;padding: 10px;width: 60px;}
.logo-section .card h4 {font-size: 18px;font-weight: 600;}
.logo-section .card .icon-box {display: flex;}
.logo-section .card .icon-box h4 {font-size: 18px;margin-left: 10px;}
.logo-section .card .circle {position: absolute;top: -15px;right: -15px;width: 45px;height: 45px;background: rgba(202, 122, 36, 0.32);border-radius: 50%;z-index: 0;}
.logo-section .card .circle1 {position: absolute;top: -15px;right: -15px;width: 45px;height: 45px;background: rgba(76, 121, 204, 0.32);border-radius: 50%;z-index: 0;}
.logo-section .card .learn-link {font-size: 14px;position: relative;bottom: -90px;color: #000;text-decoration: none;font-weight: 500;}
.logo-section .card i {background-color: unset;color: #000;font-size: 12px;}

.logo-content .col-lg-12{padding: 30px;background-color: #F3F4F6;border-radius: 20px;}
.logo-content p {font-size: 16px;color: #42629B;font-weight: 600;text-align: justify;}

.products h3 .blue {color: #42629B;font-weight: bold;font-size: 32px;text-align: center;}
.products h3 .orange {color: #DD9E4A;font-weight: bold;font-size: 32px;text-align: center;}
.products .swiper {width: 100%;height: 100%; }
.products .swiper .swiper-slide img {display: block;width: 100%; height: 100%;object-fit: cover; }

.company_logo {display: none;}
.company_logo h3 .blue {color: #42629B;font-weight: bold;font-size: 32px;text-align: center;}
.company_logo h3 .orange {color: #DD9E4A;font-weight: bold;font-size: 32px;text-align: center;}
.company_logo .company-card {position: relative;text-align: center;}
.company_logo .bg-shape {width: 120px;height: 120px;border-radius: 10px;position: absolute;top: -25px;left: -25px;z-index: 0;}
.company_logo .bg-blue {background: #dde3ed;}
.company_logo .bg-orange {background: #f9eede;}
.company_logo .card {border: unset;box-shadow: unset;background-color: unset;}
.company_logo .card-content {position: relative;background: #f3f4f6;border-radius: 12px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);z-index: 1;}
.company_logo .card-content img {max-width: 150px;height: auto;display: block;margin: 0 auto 10px;}
.company_logo .card .blue {color: #42629B;font-size: 26px;font-weight: 800;margin-top: 15px;}
.company_logo .card .orange {color: #DD9E4A;font-size: 26px;font-weight: 800;margin-top: 15px;}

.company_logo_1 h3 .blue {color: #42629B;font-weight: bold;font-size: 32px;text-align: center;}
.company_logo_1 h3 .orange {color: #DD9E4A;font-weight: bold;font-size: 32px;text-align: center;}
.company_logo_1 .company-card {position: relative;text-align: center;}
.company_logo_1 .bg-shape {width: 120px;height: 120px;border-radius: 10px;position: absolute;top: -25px;left: -25px;z-index: 0;}
.company_logo_1 .bg-blue {background: #dde3ed;}
.company_logo_1 .bg-orange {background: #f9eede;}
.company_logo_1 .card {border: unset;box-shadow: unset;background-color: unset;}
.company_logo_1 .card-content {position: relative;background: #f3f4f6;border-radius: 12px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);z-index: 1;}
.company_logo_1 .card-content img {max-width: 150px;height: auto;display: block;margin: 0 auto 10px;}
.company_logo_1 .card .blue {color: #42629B;font-size: 26px;font-weight: 800;margin-top: 15px;}
.company_logo_1 .card .orange {color: #DD9E4A;font-size: 26px;font-weight: 800;margin-top: 15px;}

.group-offer {background-color: #fff;}
.group-offer h4 .blue {color: #42629B;font-weight: bold;font-size: 32px;text-align: center;}
.group-offer h4 .orange {color: #DD9E4A;font-weight: bold;font-size: 32px;text-align: center;}
.group-offer p {font-size: 16px;color: #000;}
.group-offer .custom-card {background-color: #fff;border-radius: 20px;position: relative;}
.group-offer .custom-card.box {border: 2px solid rgba(63, 108, 192, 0.32);}
.group-offer .custom-card.box1 {border: 2px solid rgba(202, 122, 36, 0.32);}
.group-offer .custom-card .circle {position: absolute;top: -15px;right: -15px;width: 45px;height: 45px;background: rgba(202, 122, 36, 0.32);border-radius: 50%;z-index: 0;}
.group-offer .custom-card .circle1 {position: absolute;top: -15px;right: -15px;width: 45px;height: 45px;background: rgba(63, 108, 192, 0.32);border-radius: 50%;z-index: 0;}

.inner-content h2 .blue {color: #42629B;font-weight: bold;font-size: 32px;text-align: center;}
.inner-content h2 .orange {color: #DD9E4A;font-weight: bold;font-size: 32px;text-align: center;}
.inner-content h5 {font-size: 28px;font-weight: 800;color: #DD9E4A;margin-bottom: 10px;}
.inner-content p {font-size: 18px;color: #42629B;font-weight: 600;text-align: justify;}
.inner-content_1 h2 .blue {color: #42629B;font-weight: bold;font-size: 32px;text-align: center;}
.inner-content_1 h2 .orange {color: #DD9E4A;font-weight: bold;font-size: 32px;text-align: center;}
.inner-content_1 h5 {font-size: 28px;font-weight: 800;color: #DD9E4A;margin-bottom: 10px;}
.inner-content_1 p {font-size: 18px;color: #42629B;font-weight: 600;}
.hr {width: 100%;height: 4px;background-color: #AAB8D2;margin: 30px 0; }

.about-section {position: relative;background: #f3f4f5;padding: 40px;border-radius: 30px;box-shadow: 0 4px 10px 6px rgba(0,0,0,0.05);margin: auto;}
.about-section::before, .about-section::after {content: "";position: absolute;width: 150px;height: 150px;border-radius: 8px;z-index: -1;}
.about-section::before {background: #e3ebf9;top: -30px;left: -30px;}
.about-section::after {background: #fde9d9;bottom: -30px;right: -30px;}
.about-section h2 .blue {color: #42629B;font-weight: bold;font-size: 32px;}
.about-section h2 .orange {color: #DD9E4A;font-weight: bold;font-size: 32px;}
.about-section p {font-size: 18px;color: #000;font-weight: 600;text-align: justify;}

.management-team {background-color: #42629B;position: relative;}
.management-team h3 .blue {color: #fff;font-weight: bold;font-size: 32px;}
.management-team h3 .orange {color: #DD9E4A;font-weight: bold;font-size: 32px;}
.management-team p {font-size: 16px;color: #fff;}
.management-team .content .custom-underline {position: relative;display: inline-block;font-weight: 900;
  padding-bottom: 8px;font-size: 30px;color: #fff;font-weight: 700;margin-bottom: 0;}
.management-team .content .custom-underline::after {content: "";position: absolute;left: 50%;bottom: 0;transform: translateX(-50%);width: 100%;height: 3px;background-color: #DD9E4A;border-radius: 2px;}
.management-team .content h5 {color: #fff;font-size: 18px;font-weight: 700;margin-bottom: 12px;margin-top: 10px;}
.management-team .content p {font-size: 18px;color: #fff;font-weight: 600;text-align: justify;}
.management-team .card {position: relative;background: #fff;border-radius: 16px;min-height: 220px;box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);overflow: visible;top: 100px;}
.management-team .card img {position: absolute;bottom: 0;left: 20px;}
.management-team .card .circle {position: absolute;top: -15px;right: -15px;width: 45px;height: 45px;background: rgba(202, 122, 36, 0.32);border-radius: 50%;z-index: 0;}

.team p {font-size: 16px;color: #42629B;}
.team .content .custom-underline {position: relative;display: inline-block;font-weight: 900;padding-bottom: 8px;font-size: 30px;color: #42629B;font-weight: 700;margin-bottom: 0;}
.team .content .custom-underline::after {content: "";position: absolute;left: 50%;bottom: 0;transform: translateX(-50%);width: 100%;height: 3px;background-color: #DD9E4A;border-radius: 2px;}
.team .content h5 {color: #42629B;font-size: 18px;font-weight: 700;margin-bottom: 12px;margin-top: 10px;}
.team .content p {font-size: 18px;color: #42629B;font-weight: 600;text-align: justify;}
.team .card {position: relative;background: #42629B;border-radius: 16px;min-height: 220px;box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);overflow: visible;top: 100px;}
.team .card img {position: absolute;bottom: 0;left: 20px;}
.team .card .circle {position: absolute;top: -15px;left: -15px;width: 45px;height: 45px;background: rgba(202, 122, 36, 0.32);border-radius: 50%;z-index: 0;}

.contact {background-color: #e3ebf9;}
.contact .icon {background-color: #DD9E4A;}
.contact h3 {font-size: 26px;margin-bottom: 20px;font-weight: 800;}
.contact h5 {font-size: 20px;margin-bottom: 15px;font-weight: 800;color: #DD9E4A;}
.contact .bg_1 {padding: 50px;background-color: #42629B;color: #fff;border-radius: 20px;}
.contact .bg {padding: 50px;background-color: #fff;box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);border-radius: 20px;}
.contact .bg h5 {font-size: 20px;margin-bottom: 15px;font-weight: 800;color: #000;}

.logo-b-section1 {background: linear-gradient(to bottom, white, #f5f5f5);}
.logo-b-section1 h4 {font-size: 14px;color: #dd934a;font-weight: 700;margin-top: 10px;}
.global-presence h3 {font-size: 30px;font-weight: 700;margin: 10px;color: #dd9e4a;}

.global-presence1 {background: linear-gradient(to bottom, #fff, #fff, #fff);padding: 10px 0;text-align: center;}
.global-presence1 h2 {font-size: 40px;font-weight: 800;text-transform: uppercase;margin: 10px;}
.global-presence1 .blue-text {color: #42629b;}
.global-presence1 .gold-text {color: #dd9e4a; }

.banner-b-content .first_row img {border: 2px solid #dd934a;border-radius: 30px;}
.banner-b-content h1 {font-size: 50px;color: #dd934a;font-weight: bold;text-align: center;margin-bottom: 20px;}
.banner-b-content p {color: #42629b;font-size: 18px;line-height: 1.4;font-weight: 700;text-align: justify;}

.mixing {background: linear-gradient(to bottom, #f5f5f5, #fff, #f5f5f5);padding: 10px 0;}
.mixing h2 {font-size: 30px;font-weight: 800;text-transform: uppercase;margin: 2px;}
.mixing .blue-text {color: #42629b;}
.mixing .gold-text {color: #dd9e4a; }

@media (max-width: 992px) {
    .navbar-collapse {position: absolute;padding: 0 15px;top: 100%;left: 0;width: 100%;background: #fff;z-index: 1000;box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);}
    .navbar-nav .nav-link.show, .navbar-nav .nav-link:hover {color: #2e2e2d;}

    .home-banner {height: 70vh;background-size: cover;} 
    .company-banner, .company-banner-1, .product-banner, .quality-banner, .facility-banner {height: 50vh;background-size: cover;}

    .company_logo .bg-shape, .company_logo_1 .bg-shape {top: -15px;left: -15px;}

    .management-team .card, .team .card {position: unset;min-height: unset;overflow: hidden;top: 0;}
    .management-team .card img, .team .card img {position: unset;}
    .management-team .card .circle, .team .card .circle {position: unset;display: none;}

    .company_logo_1 {display: none;}
    .company_logo {display: block;}
}
@media (max-width: 768px) { 
    .float {top: 54%;left: unset;right: 4px;}
    .logo-section {font-size: 18px;}
    .navbar li a {font-size: 18px;}
    .navbar{
        --bs-navbar-toggler-border-color: rgba(var(--bs-emphasis-color-rgb), 0.12); 
        --bs-navbar-toggler-border-radius: var(--bs-border-radius); 
        --bs-navbar-toggler-focus-width: unset;
    }
    .banner .banner-content h1, .home-banner .banner-content h1, .company-banner .banner-content h1, .company-banner-1 .banner-content h1,
    .facility-banner .banner-content h1, .product-banner .banner-content h1, .quality-banner .banner-content h1 {font-size: 40px;}

    .company_logo .bg-shape, .company_logo_1 .bg-shape {top: -25px;left: -25px;}

    .about-section::before {top: -20px;left: -20px;}
    .about-section::after {bottom: -20px;right: -20px;}

    .logo-section .card .circle {top: -10px;right: -10px;}
    .logo-section .card .circle1 {top: -10px;right: -10px;}


}
@media (max-width: 576px) { 
    .phone-icon {display: none !important;}
    .logo-section, footer p {font-size: 16px;}
    .navbar li a {font-size: 15px;}   
    .logo-section .card .circle {right: -10px;}
    .about-section {padding: 20px;}
    .about-section::before {top: 0px;left: 0px;}
    .about-section::after {bottom: 0px;right: 0px;}
    .global-presence1 h2 {font-size: 30px;}
    .mixing h2 {font-size: 26px;}

}