.body
    {
        font-family: 'Inter', sans-serif;
    }
      #preloader {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: #0d0d0d;
      display: flex;
      justify-content: center;
      align-items: center;
      z-index: 9999;
      overflow: hidden;
    }

    .switchboard {
      position: relative;
      width: 160px;
      height: 220px;
      background: #222;
      border: 4px solid #555;
      border-radius: 12px;
      box-shadow: 0 0 15px #EE449E, inset 0 0 20px #111;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      animation: flicker 3s infinite alternate;
    }

    /* Switch */
    .switch {
      width: 60px;
      height: 120px;
      background: linear-gradient(145deg, #444, #222);
      border-radius: 8px;
      position: relative;
      cursor: pointer;
      overflow: hidden;
    }

    .switch::before {
      content: "";
      position: absolute;
      top: 10px;
      left: 10px;
      right: 10px;
      bottom: 10px;
      background: linear-gradient(145deg, #666, #111);
      border-radius: 4px;
      transition: transform 0.5s ease;
      animation: switchMove 2s infinite;
    }

    /* Spark effect */
    .spark {
      position: absolute;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: #EE449E;
      box-shadow: 0 0 15px #EE449E, 0 0 30px #EE449E;
      animation: sparkAnim 1.2s infinite;
    }

    .spark:nth-child(1) { top: 15%; left: 10%; animation-delay: 0s; }
    .spark:nth-child(2) { top: 30%; right: 15%; animation-delay: 0.3s; }
    .spark:nth-child(3) { bottom: 20%; left: 20%; animation-delay: 0.6s; }
    .spark:nth-child(4) { bottom: 30%; right: 20%; animation-delay: 0.9s; }

    @keyframes switchMove {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(50px); }
    }

    @keyframes flicker {
      0%, 100% { box-shadow: 0 0 20px #EE449E, inset 0 0 20px #111; }
      50% { box-shadow: 0 0 40px #EE449E, inset 0 0 30px #111; }
    }

    @keyframes sparkAnim {
      0%, 100% { transform: scale(1); opacity: 1; }
      50% { transform: scale(1.8); opacity: 0.2; }
    }
    .navbar-custom {
      background: #fff;
    }
    .navbar-logo {
      max-height: 90px;
    }
    .nav-link {
      font-weight: 700;
      color: #000;
      text-transform: uppercase;
      margin: 0 12px;
      font-size: 16px;
      margin-left: 40px;
    }
    .nav-link:hover {
      color: #EE449E ;
    }

    /* Center alignment (desktop) */
    .navbar-nav {
      align-items: center;
    }
    .left-gap {
      margin-right: 50px;
    }
    .right-gap {
      margin-left: 50px;
    }

    /* Offcanvas custom */
    .offcanvas-custom {
      background: #fff;
      width: 250px;
    }
    .offcanvas-custom .nav-link {
      margin: 10px 0;
      font-size: 18px;
    }
    /* Active Nav Item */
/* Base nav link */
.nav-link {
  font-weight: 600;
  color: #000;
  text-transform: uppercase;
  margin: 0 12px;
  font-size: 17px;
  margin-left: 40px;
  position: relative; /* Needed for ::before */
  transition: color 0.3s ease;
}

/* Hover and Active state */
.nav-link:hover,
.nav-link.active {
  color: #EE449E; /* Keep text black */
}

/* Rose line for hover and active */
.nav-link:hover::before,
.nav-link.active::before {
  content: "";
  position: absolute;
  left: -25px;   /* distance from text */
  top: 50%;
  transform: translateY(-50%);
  width: 20px;   /* line length */
  height: 3px;   /* line thickness */
  background-color: #EE449E;
  border-radius: 2px;
}

@media (max-width:1335px)
{
  .nav-link
  {
    font-size: 15px;
  }
}
@media (max-width: 1270px) {
     
      .nav-link
  {
    font-size: 13px;
  }
    }

    .banner {
      background: url("images/contactbanner.jpg") center/cover no-repeat;
      min-height: 500px;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      position: relative;
      color: #fff;
    }

    /* Dark overlay */
    .banner::before {
      content: "";
      position: absolute;
      top: 0; left: 0; right: 0; bottom: 0;
      background: rgba(0,0,0,0.5);
    }

    .banner h1 {
      position: relative;
      font-size: 3rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 2px;
    }

    @media (max-width: 768px) {
      .banner {
        min-height: 200px;
      }
      .banner h1 {
        font-size: 2rem;
      }
    }
    .contact-section {
      padding: 60px 0;
      background-color: #f9f9f9;
    }
    .contact-title {
      font-family: 'Inter', sans-serif;
      font-size: 2.5rem;
      font-weight: 700;
      margin-bottom: 30px;
      text-align: center;
    }
    .contact-image {
      width: 100%;
      border-radius: 10px;
    }
    .form-control {
      border-radius: 8px;
      padding: 12px;
    }
    .btn-custom {
      background-color: #d63384;
      border: none;
      color: #fff;
      padding: 12px 25px;
      font-weight: 600;
      transition: 0.3s;
    }
    .btn-custom:hover {
      background-color: #b52a6d;
    }
    .headcont
    {
        background-color: #000;
        color: #EE449E;
        padding: 10px;
    }
    .footer {
  background-color: #1c1c1c;
  position: relative; /* dark background */
}

.footer h6 {
  text-transform: uppercase;
}

.text-pink {
  color: #ff2d7a; /* match your pink icons */
}
.topbar {
      background: #1a1f25; /* dark background */
      color: #fff;
      font-size: 14px;
      padding: 8px 0;
    }
    .topbar a {
      color: #fff;
      text-decoration: none;
      margin-right: 15px;
    }
    .topbar a i {
      color: white; /* pink icons for phone/mail */
      margin-right: 6px;
    }
    .topbar .social-icons a {
      width: 38px;
      height: 38px;
      display: flex;
      align-items: center;
      justify-content: center;
      border: 1px solid #666;
      border-radius: 50%;
      margin-left: 10px;
      font-size: 16px;
      color: #e91e63; /* pink icons */
      transition: 0.3s;
    }
    .topbar .social-icons a:hover {
      background: #e91e63;
      color: #fff;
      border-color: #e91e63;
    }

    .banners h1 {
      font-size: 2.5rem;
      font-weight: 600;
    }
    .banners p {
      font-size: 1.1rem;
      margin: 15px 0 25px;
      margin-bottom: 50px;
    }
    .banners .btn-custom {
      background: #ee449e;
      color: #fff;
      font-weight: 600;
      padding: 18px 25px;
      transition: 0.3s;
      text-decoration: none;
    }
    .banners .btn-custom:hover {
      background: #EE449E;
    }
    .product-images {
      display: flex;
      gap: 15px;
      flex-wrap: wrap;
      justify-content: center;
      align-items: flex-end;
    }
    /* Uniform product images */
.product-images img {
  width: 160px;              /* fixed width */
  height: 160px;             /* fixed height */
  object-fit: contain;       /* keeps aspect ratio inside box */
  border-radius: 6px;
  padding: 8px;
  transition: transform 0.3s ease;
}

/* Hover effect */
.product-images img:hover {
  transform: scale(1.05);
}
/* make product-images a flex row and allow wrapping on small screens */
.carousel-item .banners .product-images {
  display: flex;
  gap: 1rem;
  align-items: center;
  justify-content: center; /* change to flex-end if you want them on right */
  flex-wrap: wrap;
}

/* default desktop sizes (bigger) */
.carousel-item .banners .product-images img {
  display: block;
  height: auto;
  object-fit: contain;
}

/* target each image with higher specificity */
.carousel-item .banners .product-images img.banonee  { width: 800px; max-width: 78%; }
.carousel-item .banners .product-images img.bantwo  { width: 160px; max-width: 40%; }
.carousel-item .banners .product-images img.banthree{ width: 150px; max-width: 44%; }
.carousel-item .banners .product-images img.banfour  { width: 240px; max-width: 48%; }
.carousel-item .banners .product-images img.banfive  { width: 150px; max-width: 40%; }
.carousel-item .banners .product-images img.bansix{ width: 280px; max-width: 48%; }
.carousel-item .banners .product-images img.banseven  { width: 350px; max-width: 48%; }
.carousel-item .banners .product-images img.baneight  { width: 250px; max-width: 40%; }

.carousel-item .banners .product-images img.banten  { width: 550px; max-width: 48%; }
.carousel-item .banners .product-images img.baneleven  { width: 200px; max-width: 40%; }
.carousel-item .banners .product-images img.bantwel{ width: 550px; max-width: 44%; }




/* Tablet */
@media (max-width: 992px) {
  .carousel-item .banners .product-images img.banone,
  .carousel-item .banners .product-images img.bantwo,
  .carousel-item .banners .product-images img.banthree 
  .carousel-item .banners .product-images img.banfour,
  .carousel-item .banners .product-images img.banfive,
  .carousel-item .banners .product-images img.bansix
  .carousel-item .banners .product-images img.banseven,
  .carousel-item .banners .product-images img.baneight,
  .carousel-item .banners .product-images img.bannine
  .carousel-item .banners .product-images img.banten,
  .carousel-item .banners .product-images img.baneleven,
  .carousel-item .banners .product-images img.bantwel{
    width: 170px;
    max-width: 33%;
  }
  .banners { padding: 45px 15px; } /* optional spacing tweak */
}

/* Mobile */
@media (max-width: 576px) {
  .carousel-item .banners .product-images { justify-content: center; gap: .5rem; }
  .carousel-item .banners .product-images img.banone,
  .carousel-item .banners .product-images img.bantwo,
  .carousel-item .banners .product-images img.banthree
  .carousel-item .banners .product-images img.banfour,
  .carousel-item .banners .product-images img.banfive,
  .carousel-item .banners .product-images img.bansix
  .carousel-item .banners .product-images img.banseven,
  .carousel-item .banners .product-images img.baneight,
  .carousel-item .banners .product-images img.bannine
  .carousel-item .banners .product-images img.banten,
  .carousel-item .banners .product-images img.baneleven,
  .carousel-item .banners .product-images img.bantwel
   {
    width: 110px;
    max-width: 32%;
  }
}

/* Last-resort override if another rule persists (uncomment to use) */
/*
.carousel-item .banners .product-images img.banone  { width: 320px !important; }
.carousel-item .banners .product-images img.bantwo  { width: 260px !important; }
.carousel-item .banners .product-images img.banthree{ width: 300px !important; }
*/


/* Make all banners same height */
.banners {
  background: url('images/backin.jpg') no-repeat center center/cover;
  color: #fff;
  padding: 60px 20px;
  min-height: 500px;   /* adjust to desired banner height */
  display: flex;
  align-items: center; /* vertically centers content */
}


    /* Keep different sizes but responsive */
   /* Default desktop sizes (larger than before) */
.banone { width: 360px; max-width: 45%; }
.bantwo { width: 200px; max-width: 40%; margin-bottom: 50px; }
.banthree { width: 220px; max-width: 42%; }

/* Tablet */
@media (max-width: 992px) {
  .banners h1 { font-size: 2rem; }
  .product-images { justify-content: center; }
  .banone, .bantwo, .banthree {
    width: 150px; max-width: 35%; margin-top: 15px;
  }
}

/* Mobile */
@media (max-width: 576px) {
  .banners { text-align: center; }
  .banone, .bantwo, .banthree {
    width: 150px; max-width: 42%; margin-top: 10px;
  }
}


    /* Force White Circle Indicators */
.carousel-indicators [data-bs-target] {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background-color: #ffffff !important;  /* force white */
  opacity: 0.5 !important;               /* faded when inactive */
  transition: all 0.3s ease;
  border: none;
}

.carousel-indicators .active {
  opacity: 1 !important;                 /* fully visible */
  background-color: white !important;  /* solid white active */
}



    .about-section {
  position: relative;
  padding: 80px 20px;
  overflow: hidden;
  z-index: 1;
}

/* Background image with opacity */
.about-section::after {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: url('images/abtnback.jpg') no-repeat center center/cover;
  opacity: 0.1;   /* 👈 Reduce background opacity here */
  z-index: -1;    /* Keeps it behind content */
}

/* Watermark text */
.about-section::before {
  content: "ABOUT";
  position: absolute;
  top: 12%;
  left: 63%;
  transform: translate(-50%, -50%);
  font-size: 120px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  z-index: 0; 
  white-space: nowrap;
}
.about-section {
  position: relative; /* Important to keep ::before positioned properly */
}

.about-section::before {
  content: "ABOUT";
  position: absolute;
  top: 12%;
  left: 63%;
  transform: translate(-50%, -50%);
  font-size: 120px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  z-index: 0; 
  white-space: nowrap;
  pointer-events: none; /* avoids interfering */
}

/* ✅ Responsive adjustments */
@media (max-width: 1200px) {
  .about-section::before {
    font-size: 90px;
    left: 60%;
  }
}

@media (max-width: 992px) {
  .about-section::before {
    font-size: 70px;
    top: 15%;
    left: 55%;
  }
}

@media (max-width: 768px) {
  .about-section::before {
    font-size: 50px;
    top: 18%;
    left: 50%;
  }
}
@media (max-width: 420px) {
  .about-section::before {
    font-size: 35px;
    top: 37%;
    left: 50%;
  }
}

@media (max-width: 360px) {
  .about-section::before {
    font-size: 35px;
    top: 30%;
    left: 50%;
  }
}
@media (max-width: 576px) {
  .about-title {
    margin-top: 1.5rem;
  }
}





    .about-content {
      position: relative;
      z-index: 1;
    }

    .about-title {
      color: #EE449E;
      font-weight: 600;
      margin-bottom: 10px;
      font-size: 20px;
      margin-bottom: 30px;
    }
    @media(max-width:920px)
    {
      .about-title
      {
        margin-top: 1rem;
      }
    }

    .about-content h2 {
      font-weight: 700;
      margin-bottom: 18px;
    }

    .about-content p {
      color: #333;
      font-size: 17px;
      line-height: 1.6;
    }

    /* Service badge (12+ years) */
/* Service badge */
.service-badge {
  background: #fff;
  padding: 35px 35px;
  border-radius: 12px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
  font-weight: 600;
  font-size: 18px;
  color: #555;
  position: absolute;
  bottom: -15px;   /* overlap */
  right: 15px;     /* adjust as needed */
  z-index: 2;
  color: #EE449E;
  font-weight: 700;
}

.service-badge span {
  font-size: 18px;
  font-weight: 700;
  color: #EE449E; /* highlight number */
}

/* Responsive */
@media (max-width: 767px) {
  .service-badge {
    bottom: -10px;
    right: 10px;
    font-size: 0.9rem;
    padding: 8px 16px;
  }

  .service-badge span {
    font-size: 1.2rem;
  }
}


    .service-badge span {
      font-size: 2rem;
      font-weight: 700;
      color: #EE449E;
    }

    .btn-customs {
      background: #EE449E;
      color: #fff;
      font-weight: 600;
      padding: 18px 50px;
      margin-top: 20px;
      display: inline-block;
      text-decoration: none;
      transition: 0.3s;
      font-size: 18px;
    }

    .btn-customs:hover {
      background: #EE449E;
    }

    /* Responsive */
    @media (max-width: 768px) {
      .about-section::before {
        font-size: 5rem;
      }
      .service-badge {
        margin: 20px auto 0;
        display: block;
        text-align: center;
      }
      .about-content {
        text-align: center;
      }
    }
    .partners-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

    /* Faded background text */
    .partners-section::before {
      content: "PARTNERS";
      position: absolute;
      top: 0%;
      left: 24%;
      transform: translateX(-50%);
      font-size: 120px;
      font-weight: 700;
      color: rgba(0, 0, 0, 0.05);
      white-space: nowrap;
      z-index: 0;
    }
    .partners-section::before {
  content: "PARTNERS";
  position: absolute;
  top: 0%;
  left: 24%;
  transform: translateX(-50%);
  font-size: 120px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
}

/* ✅ Responsive adjustments */
@media (max-width: 1200px) {
  .partners-section::before {
    font-size: 90px;
    left: 30%;
  }
}

@media (max-width: 992px) {
  .partners-section::before {
    font-size: 70px;
    top: 5%;
    left: 32%;
  }
}

@media (max-width: 768px) {
  .partners-section::before {
    font-size: 50px;
    top: 5%;
    left: 40%;
  }
}

@media (max-width: 576px) {
  .partners-section::before {
    font-size: 55px;
    top: 5%;
    left: 45%;
  }
}
    


    .partners-section h5 {
      font-weight: 600;
      color: #EE449E; /* pink color like in design */
      position: relative;
      z-index: 1;
      text-align: left;
    }

    .partners-logos {
      margin-top: 40px;
      position: relative;
      z-index: 1;
    }

    .partners-logos img {
  max-height: 130px; /* increased from 70px */
  object-fit: contain;
  margin: 20px auto;
  display: block;
  transition: transform 0.3s ease;
}

.partners-logos img:hover {
  transform: scale(1.15); /* hover effect slightly stronger */
}
 .services-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
      margin-top: -3rem;
    }

    /* Background faded text */
    .services-section::before {
  content: "PRODUCTS";
  position: absolute;
  top: 0%;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
}

/* ✅ Responsive adjustments */
@media (max-width: 1200px) {
  .services-section::before {
    font-size: 90px;
  }
}

@media (max-width: 992px) {
  .services-section::before {
    font-size: 70px;
    top: 2%;
  }
}

@media (max-width: 768px) {
  .services-section::before {
    font-size: 50px;
    top: 4%;
  }
}

@media (max-width: 576px) {
  .services-section::before {
    font-size: 35px;
    top: 6%;
  }
}
.services-section {
  position: relative;
}

.services-section::before {
  content: "PRODUCTS";
  position: absolute;
  top: 0%;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
}

/* ✅ Responsive adjustments */
@media (max-width: 1200px) {
  .services-section::before {
    font-size: 90px;
  }
}

@media (max-width: 992px) {
  .services-section::before {
    font-size: 70px;
    top: 2%;
  }
}

@media (max-width: 768px) {
  .services-section::before {
    font-size: 50px;
    top: 4%;
  }
}

@media (max-width: 576px) {
  .services-section::before {
    font-size: 55px;
    top: 2%;
  }
}



    .services-section h5 {
      font-weight: 600;
      color: #EE449E; /* pink */
      position: relative;
      z-index: 1;
      
    }

    .service-card {
      background: #fff;
      border-radius: 15px;
      box-shadow: 0px 4px 14px rgba(0, 0, 0, 0.2);
      padding: 30px 20px;
      margin-bottom: 30px;
      transition: transform 0.3s ease;
      position: relative;
      z-index: 1;
      height: 100%;
      
    }

    .service-card:hover {
      transform: translateY(-8px);
    }

    .service-card img {
      width: 140px;
      height: 140px;
      object-fit: cover;
      border-radius: 50%;
      margin-bottom: 20px;
    }

    .service-card h6 {
      font-weight: 700;
      margin-bottom: 10px;
      font-size: 20px;
    }

    .service-card p {
      font-size: 18px;
      color: #444;
      margin-top: 30px;
    }

    .services-btn {
      background: #EE449E;
      color: #fff;
      font-weight: 600;
      padding: 22px 40px;
      border: none;
      margin-top: 20px;
      transition: background 0.3s ease;
    }

    .services-btn:hover {
      background: #EE449E;
      color: #fff;
    }
     .why-choose-section {
      position: relative;
      padding: 80px 20px;
      background: url("images/whychoose.jpeg") no-repeat center center/cover;
      color: #fff;
      overflow: hidden;
    }

    /* Gradient overlay */
    .why-choose-section::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: linear-gradient(90deg, rgba(233, 30, 99, 0.2) 0%, rgba(255, 105, 180, 0.2) 100%);
      z-index: 0;
    }

    .why-choose-content {
      position: relative;
      z-index: 1;
    }

    .why-choose-section h5 {
      font-weight: 600;
      color: #fff;
      font-size: 25px;
    }

    .why-choose-section h2 {
      font-weight: 600;
      font-size: 40px;
      margin: 20px 0;
    }

    .why-choose-section p {
      font-size: 18px;
      color: #f1f1f1;
      margin-bottom: 20px;
    }

    .quote-btn {
      background: #fff;
      color: #EE449E;
      font-weight: 600;
      padding: 22px 40px;
      border: none;
      transition: all 0.3s ease;
      font-size: 18px;
    }

    

    /* Feature cards */
    .feature-card {
      background: #fff;
      border-radius: 15px;
      box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.1);
      padding: 15px;
      margin-bottom: 25px;
      color: #333;
      height: 100%;
      transition: transform 0.3s ease;
      text-align: left;
    }

    .feature-card:hover {
      transform: translateY(-5px);
    }

    .feature-card h6 {
      font-weight: 700;
      margin-bottom: 10px;
      font-size: 18px;
      margin-top: 10px;
    }
    @media (max-width:1400px)
    {
      .feature-card h6
      {
        font-size: 16px;
      }
    }
    .neme
    {
      font-size: 18px;
      
    }
    @media (max-width:1350px)
    {
      .neme
      {
        padding-left: 60px;
      }
    }
    
    
    .feature-card p {
      font-size: 17px;
      margin: 0;
      color: black;
      text-align: justify;
      hyphens: auto;
      line-height: 1.5;
    }

    /* Icon styles */
    .icon {
      font-size: 35px;
      color: #EE449E;
      margin-top: 10px;
      
      padding: 12px;
      border-radius: 10px;
      display: inline-block;
      
    }
    .stats-section {
      background-color: black; /* dark background */
      color: #fff;
      
    }
    .stats-img img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .stat-box {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      height: 100%;
      margin-bottom: 20px;
    }
    .stat-box i {
      font-size: 2.5rem;
      color: #fff;
      min-width: 40px;
      text-align: center;
    }
    .stat-text h3 {
      color: #EE449E; /* pink number */
      font-weight: 700;
      margin: 0;
      font-size: 30px;
    }
    .stat-text p {
      font-size: 18px;
      margin-top: 10px;
      text-transform: uppercase;
      font-weight: 600;
      color: #ccc;
      
    }
      .cta-section {
        position: relative;
        background: url('images/footerup.jpg') no-repeat center center/cover;
        color: #fff;
        padding: 80px 70px;
        border-radius: 5px;
        overflow: hidden;
        position: relative;
        
      
        
        
      }

      /* Black overlay */
      .cta-section::before {
        content: "";
        position: absolute;
        inset: 0;
        background: rgba(0, 0, 0, 0.4); /* black with 60% opacity */
        border-radius: 5px;
        z-index: 1;
        
      }

      /* Keep content above overlay */
      .cta-section .cta-text,
      .cta-section .cta-action {
        position: relative;
        z-index: 2;
      }

      .cta-text h2 {
        
        font-weight: 600;
        line-height: 1.3;
        margin: 0;
      }

      .cta-btn {
        background: #EE449E;
        color: #fff;
        border: none;
        padding: 24px 38px;
        font-weight: 500;
        transition: 0.3s;
      }

      .cta-btn:hover {
        background: #EE449E;
        color: #fff;
      }
      
    

      /* Responsive alignment */
      @media (max-width: 767px) {
        .cta-section {
          text-align: center;
        }
        .cta-btn {
          margin-top: 20px;
        }
      }
      @media (max-width: 767px) {
  .cta-section {
    flex-direction: column;     /* stack text and button */
    align-items: center;        /* center items horizontally */
    text-align: center;         /* center text */
  }

  .cta-action {
    margin-top: 20px;           /* spacing below text */
  }

  .cta-btn {
    display: inline-block;
    margin: 0 auto;             /* extra guarantee it's centered */
  }
}

     .testimonial-section {
      position: relative;
      background: url('images/reviewback.jpg') no-repeat center center/cover;
      padding: 60px 0;
    }

    /* White overlay */
    .testimonial-section::before {
      content: "";
      position: absolute;
      inset: 0;
      background: rgba(255, 255, 255, 0.9);
      z-index: 1;
    }

    .testimonial-section .container {
      position: relative;
      z-index: 2;
    }

    .testimonial-card {
      background: #fff;
      border-radius: 15px;
      padding: 30px;
      box-shadow: 0 5px 20px rgba(0,0,0,0.1);
      height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .testimonial-card img {
      width: 130px;
      height: 130px;
      border-radius: 50%;
      object-fit: cover;
    }
    
    .testimonial-card h5 {
      margin: 0;
      font-weight: 600;
    }
    .testimonial-card small {
      color: #777;
    }
    .testimonial-card .fa-star {
      color: #EE449E;
    }
    .testimonial-card p {
      margin-top: 15px;
      color: #333;
      font-size: 15px;
      line-height: 1.6;
    }
    .quote-mark {
      font-size: 40px;
      color: #bbb;
      position: absolute;
      right: 20px;
      top: 20px;
    }
    .carousel-indicators [data-bs-target] {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background-color: #333;
    }
    .carousel-indicators .active {
      background-color: #ff4d6d;
    }

    /* Fix image scaling */
    .testimonial-img {
      width: 100%;
      max-height: 350px;
      object-fit: cover;
      border-radius: 12px;
    }

    @media (max-width: 991px) {
      .testimonial-img {
        max-height: 250px;
      }
    }
    .novan
    {
      margin-top: 11rem;
    }
     @media (max-width: 575px) {
      .novan {
        margin-top: 2rem;
      }
    }
    .values-section {
      padding: 60px 20px;
      text-align: center;
    }
    .values-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }
    .values-section::before {
      content: "VALUES";
      position: absolute;
      top: 0%;
      left: 24%;
      transform: translateX(-50%);
      font-size: 120px;
      font-weight: 700;
      color: rgba(0, 0, 0, 0.05);
      white-space: nowrap;
      z-index: 0;
    }
    .values-section::before {
  content: "VALUES";
  position: absolute;
  top: 0%;
  left: 18%;
  transform: translateX(-50%);
  font-size: 120px;
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
}

/* ✅ Responsive adjustments */
@media (max-width: 1200px) {
  .values-section::before {
    font-size: 90px;
    left: 30%;
  }
}

@media (max-width: 992px) {
  .values-section::before {
    font-size: 70px;
    top: 4%;
    left: 23%;
  }
}

@media (max-width: 768px) {
  .values-section::before {
    font-size: 50px;
    top: 5%;
    left: 40%;
  }
}

@media (max-width: 576px) {
  .values-section::before {
    font-size: 55px;
    top: 3%;
    left: 32%;
  }
}
   

    .section-title {
      color: #EE449E;
      font-weight: bold;
      font-size: 1.25rem;
      margin-bottom: 40px;
      text-align: start;
    }

    .value-card {
      background-color: #fff;
      border: 15px solid #1A1F25;
      padding: 30px 20px 60px;
      position: relative;
      max-width: 270px;
      width: 100%;
    }

    .value-card .icon img {
      width: 30px;
      height: 30px;
      margin-bottom: 15px;
    }

    .value-card h5 {
      font-weight: bold;
      margin-bottom: 10px;
    }

    .value-card .card-text {
      font-size: 0.95rem;
      color: #000;
    }

    .triangle-up {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 60px;
      background-color: transparent;
      overflow: hidden;
    }

    .triangle-up::before {
      content: '';
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 0;
      height: 0;
      border-left: 135px solid transparent;
      border-right: 135px solid transparent;
      border-bottom: 60px solid #1A1F25;
      z-index: 1;
    }

    .triangle-up span {
      position: absolute;
      top: 12px;
      left: 50%;
      transform: translateX(-50%);
      color: white;
      font-weight: bold;
      font-size: 1.2rem;
      z-index: 2;
    }

    @media (max-width: 768px) {
      .triangle-up::before {
        border-left: 50% solid transparent;
        border-right: 50% solid transparent;
      }
    }
    .section-title {
      position: relative;
      margin-bottom: 60px;
    }
    .section-title h1 {
      font-size: 90px;
      font-weight: 800;
      color: rgba(0, 0, 0, 0.05);
      margin: 0;
    }
    .sectionse-title h2 {
      font-size: 25px;
      font-weight: 700;
      color: #EE449E;
      position: absolute;
      top: 43%;
      left: 50%;
      transform: translate(-50%, -50%);
      margin: 0;
    }
    .sectionses-title h2 {
      font-size: 25px;
      font-weight: 700;
      color: #EE449E;
      position: absolute;
      top: 43%;
      left: 50%;
      transform: translate(-50%, -50%);
      margin: 0;
    }
    .founder-card {
      position: relative;
      border: none;
      border-radius: 15px;
      box-shadow: 0px 4px 10px rgba(0,0,0,0.1);
      overflow: hidden;
      transition: transform 0.3s ease;
      
    }
    .founder-card:hover {
      transform: translateY(-5px);
    }
    .founder-img {
      width: 100%;
      padding: 40px;
    }
    .founder-info {
      position: relative;
      bottom: -20px;
      background: #EE449E;
      color: white;
      padding: 19px 48px;
      border-radius: 12px;
      font-weight: 600;
      font-size: 18px;
      line-height: 1.4;
      text-align: center;
      min-width: 140px;
      display: inline-block;
    }
    .founder-wrapper {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
     .section-title {
      position: relative;
      margin-bottom: 60px;
    }
    .section-title h1 {
      font-size: 90px;
      font-weight: 800;
      color: rgba(0, 0, 0, 0.05);
      margin: 0;
    }
    .section-title h2 {
      font-size: 20px;
      font-weight: 700;
      color: #e91e63;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      margin: 0;
    }
    .certificate-card {
      border: 2px solid #f1f1f1;
      border-radius: 12px;
      overflow: hidden;
      box-shadow: 0px 4px 12px rgba(0,0,0,0.1);
      transition: transform 0.3s ease;
      background: #fff;
      border: 1px solid #EE449E;
    }
    .certificate-card:hover {
      transform: translateY(-5px);
    }
    .certificate-img {
      width: 100%;
      height: auto;
      display: block;
    }
    
    .about-banner {
      position: relative;
      background: url('images/aboutbanner.jpg') no-repeat center center/cover;
      min-height: 60vh;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      color: #fff;
      border-radius: 8px;
      overflow: hidden;
    }

    /* Dark overlay */
    .about-banner::before {
      content: "";
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.5);
      z-index: 1;
    }

    /* Heading */
    .about-banner h1 {
      position: relative;
      z-index: 2;
      font-size: clamp(28px, 6vw, 60px); /* responsive font */
      font-weight: 700;
      margin: 0;
    }

    /* Responsive spacing */
    @media (max-width: 768px) {
      .about-banner {
        min-height: 40vh;
        padding: 40px 15px;
      }
    }


     .ind-banner {
      position: relative;
      background: url('images/indbanner.jpg') no-repeat center center/cover;
      min-height: 60vh;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      color: #fff;
      border-radius: 8px;
      overflow: hidden;
    }

    /* Dark overlay */
    .ind-banner::before {
      content: "";
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.5);
      z-index: 1;
    }

    /* Heading */
    .ind-banner h1 {
      position: relative;
      z-index: 2;
      font-size: clamp(28px, 6vw, 60px); /* responsive font */
      font-weight: 700;
      margin: 0;
    }

    /* Responsive spacing */
    @media (max-width: 768px) {
      .ind-banner {
        min-height: 40vh;
        padding: 40px 15px;
      }
    }
       .sectionss-title {
      font-size: 6rem;
      font-weight: 800;
      color: rgba(0,0,0,0.05);
      position: absolute;
      top: -30px;
      left: 0;
      z-index: 0;
      text-transform: uppercase;
      line-height: 1;
    }

    /* Container Box */
    .content-box {
      position: relative;
      z-index: 1;
      padding: 60px 20px 20px;
    }

    /* Image + Icon */
    .image-box {
      position: relative;
      display: inline-block;
    }
    .image-box img {
      border-radius: 6px;
      width: 100%;
      max-width: 320px;
      height: auto;
      object-fit: cover;
    }
    .icon-circle {
      width: 100px;
      height: 100px;
      background: #fff;
      border-radius: 50%;
      display: flex;
      justify-content: center;
      align-items: center;
      box-shadow: 0 4px 12px rgba(0,0,0,0.15);
      position: absolute;
      top: 50%;
      right: -45px;
      transform: translateY(-50%);
      z-index: 2;
    }
    .icon-circle i {
      font-size: 34px;
      color: #EE449E;
    }

    /* Highlighted Title */
    .text-highlight {
      color: #EE449E;
      font-weight: 700;
    }

    /* Section Spacing */
    .sections-wrapper {
      margin-bottom: 120px;
    }

    /* Responsive Adjustments */
    @media (max-width: 768px) {
      .sectionss-title {
        font-size: 3.5rem;
        top: -20px;
      }
      .image-box img {
        max-width: 280px;
      }
      .icon-circle {
        width: 70px;
        height: 70px;
        right: -35px;
      }
      .icon-circle i {
        font-size: 26px;
      }
    }
    .iconss
    {
      color: #EE449E;
    }

    .icons-circle {
      width: 100px;
      height: 100px;
      background: #fff;
      border-radius: 50%;
      display: flex;
      justify-content: center;
      align-items: center;
      box-shadow: 0 4px 12px rgba(0,0,0,0.15);
      position: absolute;
      top: 50%;
      left: -30px;
      transform: translateY(-50%);
      z-index: 2;
    }
    .icons-circle i {
      font-size: 34px;
      color: #e91e63;
    }
    .nop
    {
         padding-right: 100px;
         text-align: justify;
    }
   @media(max-width:1000px) {
  .nop {
    padding: 0px;
    margin-top: 2rem;
  }

  /* Center the image-box without using col */
  .image-box {
    display: flex;
    justify-content: center;
    margin: 0 auto;
  }
}
.indoasian-section {
      position: relative;
      padding: 60px 0;
    }
    
    .indoasian-subtitle {
      position: absolute;
      top: 60px;
      left: 50%;
      transform: translateX(-50%);
      font-size: 25px;
      font-weight: 700;
      color: #EE449E;
    }
    .indoasian-text {
      font-size: 15px;
      line-height: 1.7;
      color: #333;
      text-align: left;
      padding: 20px;
    }
    .indoasian-text b {
      font-weight: 700;
    }
    .indoasian-logo img {
      max-width: 100%;
      height: auto;
    }
   
    .sections-title {
      position: relative;
      margin-bottom: 50px;
      text-align: center;
    }
    
    .sections-title h2 {
      font-size: 25px;
      font-weight: 700;
      color: #EE449E;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      margin-top: 15px;

    }

   .product-card {
  position: relative;
  border: 2px solid #f6cce1;
  border-radius: 12px;
  overflow: hidden;
  text-align: center;
  padding: 20px;
  transition: all 0.4s ease;
  height: 280px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-card img {
  max-height: 250px;
  transition: all 0.4s ease;
  z-index: 0;   /* image stays behind */
  position: relative;
}

.product-overlay {
  position: absolute;
  inset: 0;
  background: rgba(238, 68, 158, 0.80); /* overlay color */
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 20px;
  text-align: center;
  opacity: 0;
  transition: opacity 0.4s ease;
  z-index: 1;   /* overlay stays on top */
}


.product-overlay h4 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 10px;
}

.product-overlay p {
  font-size: 14px;
  line-height: 1.5;
}

.product-card:hover img {
  transform: scale(0.9);
}

.product-card:hover .product-overlay {
  opacity: 1;  /* overlay fades in */
}

    .choose-section {
      position: relative;
      padding: 80px 0;
      text-align: center;
    }

    .choose-title {
      position: relative;
      margin-bottom: 60px;
    }

    

    .choose-title h2 {
      font-size: 25px;
      font-weight: 700;
      color: #EE449E;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      margin: 0;
    }

    .choose-card {
      background: #1A1F25;
      border: 1.5px solid #EE449E;
      border-radius: 12px;
      padding: 25px;
      height: 100%;
      text-align: left;
      transition: all 0.3s ease;
      margin-right: 65px;
      
    }
    @media(max-width:550px)
    {
      .choose-card
      {
        margin-right: 0px;
      }
    }

    .choose-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 6px 20px rgba(238, 68, 158, 0.2);
    }

    .choose-icon {
      width: 55px;
      height: 55px;
      background: #EE449E;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 20px;
      font-size: 22px;
      color: #fff;
    }

    .choose-card h4 {
      font-size: 18px;
      font-weight: 700;
      margin-bottom: 12px;
      color: #fff;
    }

    .choose-card p {
      font-size: 15px;
      
      color: #ccc;
      margin: 0;
      text-align: justify;
      hyphens: auto;
      
    }


    .indoasian-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

    /* Faded background text */
   
   /* ✅ Prevent horizontal scroll */
html, body {
  overflow-x: hidden;
}

/* ✅ Fix background text scaling */
.indoasian-section::before {
  content: "INDOASIAN";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .indoasian-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .indoasian-section::before {
    font-size: 15vw;
    top: 4%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .indoasian-section::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}

.sections-title {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.sections-title::before {
  content: "PRODUCTS";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .sections-title::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .sections-title::before {
    font-size: 15vw;
    top: 27%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .sections-title::before {
    font-size: 13vw;
    top: 35%; /* shrink further on mobiles */
  }
}


.choose-section {
      position: relative;
      padding: 80px 20px;
      
      overflow: hidden;
      text-align: center;
    }

.choose-section::before {
  content: "WHY CHOOSE";
  position: absolute;
  top: 2%;
  left: 50%;
  transform: translateX(-50%);
  font-size: 90px;   /* responsive instead of fixed px */
  font-weight: 700;
    color: rgba(255, 255, 255, 0.08); 
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .choose-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .choose-section::before {
    font-size: 12vw;
    top: 2%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .choose-section::before {
    font-size: 12vw;
    top: 2%; /* shrink further on mobiles */
  }
}
.sectionse-title {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.sectionse-title::before {
  content: "FOUNDERS";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 90px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

@media (max-width: 920px) {
  .sectionse-title::before {
    top: 6%;
     /* shrink further on mobiles */
  }
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .sectionse-title::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .sectionse-title::before {
    font-size: 15vw;
    top: 6%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .sectionse-title::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}


.sectionses-title {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.sectionses-title::before {
  content: "CERTIFICATIONS";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 90px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;

}
@media (max-width: 912px) {
  .sectionses-title::before {
    top: 9%; /* shrink further on mobiles */
  }
}


/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .sectionses-title::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .sectionses-title::before {
    font-size: 10vw;
    top: 18%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .sectionses-title::before {
    font-size: 10px;
    top: 40%; /* shrink further on mobiles */
  }
}
.dropdown-item
{
  font-size: 18px;
  font-weight: 600;
}
.dropdown-item:hover
{
  color: #EE449E;
  background-color: #1A1F25;
}
 .mini-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.mini-section::before {
  content: "MINILEC";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .mini-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .mini-section::before {
    font-size: 15vw;
    top: 4%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .mini-section::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}


 .selc-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.selc-section::before {
  content: "SELC";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .selc-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .selc-section::before {
    font-size: 15vw;
    top: 4%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .selc-section::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}

.lapp-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.lapp-section::before {
  content: "LAPP";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .lapp-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .lapp-section::before {
    font-size: 15vw;
    top: 4%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .lapp-section::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}
  
.elmex-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.elmex-section::before {
  content: "ELMEX";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .elmex-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .elmex-section::before {
    font-size: 15vw;
    top: 4%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .elmex-section::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}

.three-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.three-section::before {
  content: "3D";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .three-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .three-section::before {
    font-size: 15vw;
    top: 4%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .three-section::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}

.lau-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.lau-section::before {
  content: "LAURITZ KNUDSEN";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .lau-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .lau-section::before {
    font-size: 15vw;
    top: 4%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .lau-section::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}

.sal-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.sal-section::before {
  content: "SALZER";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .sal-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .sal-section::before {
    font-size: 15vw;
    top: 4%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .sal-section::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}
 
.esbee-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.esbee-section::before {
  content: "ESBEE";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .esbee-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .esbee-section::before {
    font-size: 15vw;
    top: 4%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .esbee-section::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}

.gic-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.gic-section::before {
  content: "GIC";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .gic-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .gic-section::before {
    font-size: 15vw;
    top: 4%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .gic-section::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}
 
.wago-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.wago-section::before {
  content: "WAGO";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .wago-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .wago-section::before {
    font-size: 15vw;
    top: 4%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .wago-section::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}

.cri-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.cri-section::before {
  content: "CRI";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .cri-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .cri-section::before {
    font-size: 15vw;
    top: 4%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .cri-section::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}
.cs-section {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.cs-section::before {
  content: "CRI";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   /* responsive instead of fixed px */
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .cs-section::before {
    font-size: 15vw; /* shrink further on mobiles */
  }
}
@media (max-width: 412px) {
  .cs-section::before {
    font-size: 15vw;
    top: 4%; /* shrink further on mobiles */
  }
}
@media (max-width: 360px) {
  .cs-section::before {
    font-size: 15vw;
    top: 5%; /* shrink further on mobiles */
  }
}
 #scrollTopBtn {
      position: fixed;
      bottom: 30px;
      right: 30px;
      z-index: 999;
      background:  #EE449E;
      color: white;
      border: none;
      outline: none;
      width: 50px;
      height: 50px;
      border-radius: 50%;
      cursor: pointer;
      font-size: 22px;
      display: none; /* Hidden by default */
      transition: all 0.3s ease-in-out;
    }

    #scrollTopBtn:hover {
      background: #EE449E;
      color: #fff;
      box-shadow: 0 0 25px  #EE449E, 0 0 50px  #EE449E;
      transform: scale(1.1);
    }

     .products-card {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      width: 100%;
      max-width: 350px;
      height: 320px; 
      border-radius: 12px;
      overflow: hidden;
      background: #fff;
      box-shadow: 0 4px 12px rgba(0,0,0,0.3);
      transition: transform 0.3s ease, box-shadow 0.3s ease;
      margin: auto;
    }
    .product-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 6px 18px rgba(0,0,0,0.15);
    }
    .product-img {
      flex: 1;
      width: 100%;
      height: 250px;
      object-fit: cover;
      background-color: rgba(0, 0, 0, 0.5)
    }
    .product-footer {
      border-top: 5px solid #EE449E;
      padding: 15px;
      text-align: center;
      background: #fff;
    }
    .product-footer h5 {
      margin: 0;
      font-size: 1rem;
      font-weight: 600;
      color: #EE449E;
    }
 .pro-banner {
      position: relative;
      background: url('images/productban.jpg') no-repeat center center/cover;
      min-height: 60vh;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      color: #fff;
      border-radius: 8px;
      overflow: hidden;
    }

    /* Dark overlay */
    .pro-banner::before {
      content: "";
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.5);
      z-index: 1;
    }

    /* Heading */
    .pro-banner h1 {
      position: relative;
      z-index: 2;
      font-size: clamp(28px, 6vw, 60px); 
      font-weight: 700;
      margin: 0;
    }

    /* Responsive spacing */
    @media (max-width: 768px) {
      .pro-banner {
        min-height: 40vh;
        padding: 40px 15px;
      }
    }

      .gt-section {
      padding: 60px 0;
      background: url('images/backin.jpg') no-repeat center center/cover; /* ✅ Section-only background */
      color: #fff;
    }
    .gt-image {
      width: 100%;
      height: 100%;
      border-radius: 15px;
      object-fit: cover;
      box-shadow: 0 6px 15px rgba(0,0,0,0.2);
    }
    .gt-form-box {
      background: transparent;
      padding: 20px;
    }
    .gt-form-box h3 {
      font-weight: 700;
      margin-bottom: 25px;
      color: #fff;
    }
    .gt-input {
      padding: 12px 15px;
      border: none;
      box-shadow: 0 2px 6px rgba(0,0,0,0.1);
      margin-bottom: 20px;
      border-radius: 0px;
    }
    .gt-input:focus {
      outline: none;
      box-shadow: 0 0 0 3px rgba(233, 30, 99, 0.3);
    }
    .gt-btn-submit {
      background: #EE449E;
      border: none;
      padding: 12px 30px;
      font-weight: 600;
      color: #fff;
      transition: background 0.3s ease;
    }
    .gt-btn-submit:hover {
      background: #EE449E;
    }
    .client-title h2 {
      font-size: 25px;
      font-weight: 700;
      color: #EE449E;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      margin-top: 15px;

    }

    .client-title {
      position: relative;
      padding: 80px 20px;
      background: #fff;
      overflow: hidden;
      text-align: center;
    }

.client-title::before {
  content: "CLIENTS";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-size: 120px;   
  font-weight: 700;
  color: rgba(0, 0, 0, 0.05);
  white-space: nowrap;
  z-index: 0;
  pointer-events: none;
  text-align: center;
  width: 100%;
  overflow-wrap: break-word;
}

/* ✅ Responsive fixes */
@media (max-width: 768px) {
  .client-title::before {
    font-size: 15vw; 
  }
}
@media (max-width: 412px) {
  .client-title::before {
    font-size: 15vw;
    top: 27%;
  }
}
@media (max-width: 360px) {
  .client-title::before {
    font-size: 13vw;
    top: 35%; 
  }
}
 body {
      font-family: Arial, sans-serif;
      background: #fff;
      color: #333;
    }
    .partners-sections {
      padding: 0px 20px;
      text-align: center;
    }
    .partners-sections p {
      font-size: 15px;
      line-height: 1.8;
      margin-bottom: 50px;
      color: #444;
    }
    .logos-box {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
      border: 2px solid #EE449E;
      
    }
    .logos-box img {
      max-width: 350px;
      max-height: 150px;
      object-fit: contain;
      filter: drop-shadow(0px 1px 2px rgba(0,0,0,0.15));
      transition: transform 0.3s ease;
    }
    .logos-box img:hover {
      transform: scale(1.05);
    }
    @media (max-width: 768px) {
      .partners-section p {
        font-size: 14px;
      }
    }

     .client-banner {
      position: relative;
      background: url('images/clientban.jpg') no-repeat center center/cover;
      min-height: 60vh;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      color: #fff;
      border-radius: 8px;
      overflow: hidden;
    }

    /* Dark overlay */
    .client-banner::before {
      content: "";
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.5);
      z-index: 1;
    }

    /* Heading */
    .client-banner h1 {
      position: relative;
      z-index: 2;
      font-size: clamp(28px, 6vw, 60px); 
      font-weight: 700;
      margin: 0;
    }

    /* Responsive spacing */
    @media (max-width: 768px) {
      .client-banner {
        min-height: 40vh;
        padding: 40px 15px;
      }
    }
 
    .cons
    {
      font-size: 18px;
    }

    @media (max-width:1400px)
    {
      .cons
      {
        font-size: 14px;
      }
    }
    @media (max-width:1200px)
    {
      .cons
      {
        font-size: 12px;
      }
    }