/* =======================
    Root Colors
    ======================= */
 :root {
   --primary-green: #2E7D32;
   --secondary-green: #20c997;
   --dark-green: #155724;
   --light-green: #d4edda;
   --warning-color: #ffc107;
 }

 /* =======================
    Global Styles
    ======================= */
 * {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
 }

 body {
   font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
   line-height: 1.6;
   color: #333;
   scroll-behavior: smooth;
 }

 /* =======================
    Navbar
    ======================= */
 .navbar {
   transition: all 0.3s ease;
   backdrop-filter: blur(10px);
 }

 .navbar.scrolled {
   background-color: rgba(255, 255, 255, 0.95) !important;
   box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
 }

 .navbar-brand {
   transition: transform 0.3s ease;
 }

 .navbar-brand:hover {
   transform: scale(1.05);
 }

 .nav-link {
   font-weight: 500;
   color: #333 !important;
   transition: all 0.3s ease;
   position: relative;
   margin: 0 10px;
 }

 .nav-link:hover,
 .nav-link.active {
   color: var(--primary-green) !important;
 }

 .nav-link::after {
   content: '';
   position: absolute;
   width: 0;
   height: 2px;
   bottom: -5px;
   left: 50%;
   background-color: var(--primary-green);
   transition: all 0.3s ease;
   transform: translateX(-50%);
 }

 .nav-link:hover::after,
 .nav-link.active::after {
   width: 100%;
 }

 /* =======================
       Hero Section (without slider)
       ======================= */
 .hero-section {
   position: relative;
   overflow: hidden;
   min-height: 37px;
 }

 .hero-overlay {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: linear-gradient(135deg, rgba(40, 167, 69, 0.7), rgba(21, 87, 36, 0.8));
   z-index: 1;
 }

 .hero-content {
   position: relative;
   z-index: 2;
   padding-top: 80px;
 }

 /* =======================
       Hero Animations
       ======================= */
 @keyframes fadeInUp {
   from {
     opacity: 0;
     transform: translateY(50px);
   }

   to {
     opacity: 1;
     transform: translateY(0);
   }
 }

 .animate-text {
   animation: fadeInUp 1s ease-out;
 }

 .animate-text-delay {
   animation: fadeInUp 1s ease-out 0.3s both;
 }

 .animate-buttons {
   animation: fadeInUp 1s ease-out 0.6s both;
 }

 /* =======================
       Buttons
       ======================= */
 .btn {
   border-radius: 50px;
   padding: 12px 30px;
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 1px;
   transition: all 0.3s ease;
   border: 2px solid transparent;
 }

 .btn-warning {
   background-color: #f8c200;
   border-color: #f8c200;
   color: #333;
 }

 .btn-warning:hover {
   background-color: #e0a800;
   border-color: #e0a800;
   transform: translateY(-2px);
   box-shadow: 0 5px 15px rgba(255, 193, 7, 0.4);
 }

 .btn-outline-light:hover {
   background-color: white;
   color: #333;
   transform: translateY(-2px);
   box-shadow: 0 5px 15px rgba(255, 255, 255, 0.3);
 }

 /* =======================
       Image Styles
       ======================= */
 .hero-img {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
   z-index: 0;
 }

 /* =======================
       Mobile and Tablet Responsiveness
       ======================= */
 @media (max-width: 767px) {
   .hero-section {
     text-align: center;
   }

   .hero-buttons {
     display: flex;
     flex-direction: column;
     align-items: center;
     margin-top: 20px;
   }

   .col-lg-8 {
     text-align: center;
   }

   .hero-img {
     display: none;
   }
 }

 @media (min-width: 768px) and (max-width: 991px) {
   .hero-content {
     padding-top: 60px;
   }

   .hero-buttons .btn {
     font-size: 1rem;
   }

   .hero-img {
     height: 50%;
   }
 }

 /* =======================
    Who We Are Section
    ======================= */
 .who-we-are-section {
   background-color: #f9f9f9;
   padding: 40px 0;
 }

 .who-we-are-section h2 {
   color: var(--primary-green);
   font-weight: bold;
   animation: fadeIn 1.5s ease-in-out;
 }

 .who-we-are-section p {
   font-size: 1.1rem;
   color: #555;
   animation: fadeIn 1.5s ease-in-out;
   text-align: justify;
 }

 .image-container img {
   animation: slideIn 1.5s ease-in-out;
 }

 /* Fade-in Animation */
 @keyframes fadeIn {
   0% {
     opacity: 0;
   }

   100% {
     opacity: 1;
   }
 }

 /* Slide-in Animation for the Image */
 @keyframes slideIn {
   0% {
     transform: translateX(100%);
   }

   100% {
     transform: translateX(0);
   }
 }

 /* Media Query for Mobile Screens */
 @media (max-width: 768px) {
   .image-container img {
     width: 100%;
   }
 }

 /* =======================
    Section Title
    ======================= */
 .section-title {
   text-align: center;
   font-size: 2rem;
   color: var(--primary-green);
   font-weight: bold;
 }

 .section-subtitle {
   text-align: center;
   font-size: 1.1rem;
   color: #555;
 }

 .section-info {
   max-width: 1000px;
   margin: auto;
   margin-bottom: 30px;
   color: #777777;
   text-align: center;
 }

 /* =======================
    Product Slider Styles
    ======================= */
 .carousel-item {
   position: relative;
 }

 .carousel-item img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   height: 300px;
 }

 /* Overlay gradient */
 .carousel-item .contact-section h2 {
   position: absolute;
   bottom: 0;
   left: 0;
   right: 0;
   height: 50%;
   background: linear-gradient(to top, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0));
 }

 /* Product Name Styling */
 .product-name {
   position: absolute;
   bottom: 15px;
   left: 50%;
   transform: translateX(-50%);
   font-size: 1.2rem;
   color: white;
   font-weight: bold;
   text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
 }

 /* Carousel Controls */
 .carousel-control-prev-icon,
 .carousel-control-next-icon {
   background-color: var(--primary-green);
 }

 .carousel-indicators button {
   background-color: var(--primary-green);
 }

 .carousel-indicators .active {
   background-color: var(--dark-green);
 }

 /* =======================
    Media Queries for Responsiveness
    ======================= */
 @media (max-width: 768px) {
   .carousel-item img {
     object-fit: contain;
   }
 }

 /* =======================
    Services Cards Styles
    ======================= */
 .service-card {
   background-color: #F9F9F9;
   border-radius: 10px;
   padding: 30px;
   min-height: -webkit-fill-available;
 }

 .service-card h5 {
   font-size: 1.2rem;
   font-weight: bold;
   margin-bottom: 15px;
 }

 .service-card p {
   font-size: 1rem;
   color: #555;
   text-align: justify;
 }

 /* =======================
    Media Queries for Responsiveness
    ======================= */
 @media (max-width: 768px) {
   .service-card {
     padding: 15px;
   }
 }

 /* =======================
    Section Title
    ======================= */
 .info-section-title {
   text-align: center;
   font-size: 2.5rem;
   color: white;
   font-weight: bold;
 }

 .info-section-subtitle {
   text-align: center;
   font-size: 1.2rem;
   color: white;
   margin-bottom: 30px;
 }

 /* =======================
    Background Image and Overlay
    ======================= */
 .background-section {
   position: relative;
   background-image: url('../img/industry.jpg');
   background-size: cover;
   background-position: center;
   padding: 80px 0;
   color: white;
 }

 .background-overlay {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: #2e7d32d4;
   z-index: 1;
 }

 .content {
   position: relative;
   z-index: 2;
 }

 /* =======================
    Card Styles
    ======================= */
 .feature-card {
   background-color: #fff;
   padding: 30px;
   box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
   border-radius: 10px;
   transition: transform 0.3s ease, box-shadow 0.3s ease;
   text-align: center;
   min-height: -webkit-fill-available;
 }

 .feature-card:hover {
   transform: translateY(-10px);
   box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
 }

 .feature-card h5 {
   font-size: 1.5rem;
   color: var(--primary-green);
   font-weight: bold;
   margin-bottom: 20px;
 }

 .feature-card p {
   font-size: 1rem;
   color: #555;
 }

 /* =======================
    Hover Animations
    ======================= */
 .feature-card {
   opacity: 0;
   transform: translateY(30px);
   animation: fadeInUp 1s ease-out forwards;
 }

 .feature-card:nth-child(1) {
   animation-delay: 0.2s;
 }

 .feature-card:nth-child(2) {
   animation-delay: 0.4s;
 }

 .feature-card:nth-child(3) {
   animation-delay: 0.6s;
 }

 @keyframes fadeInUp {
   0% {
     opacity: 0;
     transform: translateY(30px);
   }

   100% {
     opacity: 1;
     transform: translateY(0);
   }
 }

 /* =======================
    Media Queries for Responsiveness
    ======================= */
 @media (max-width: 768px) {
   .feature-card {
     padding: 20px;
   }

   .info-section-title {
     font-size: 2rem;
   }

   .info-section-subtitle {
     font-size: 1rem;
   }
 }

 /* =======================
    Services Cards Styles
    ======================= */
 .info-service-card {
   border-radius: 10px;
   padding: 30px;
   min-height: -webkit-fill-available;
 }

 .info-service-title {
   text-align: center;
   font-size: 2rem;
   color: var(--primary-green);
   font-weight: bold;
   margin-bottom: 37px;

 }

 .info-service-card h5 {
   font-size: 1.2rem;
   font-weight: bold;
   margin-bottom: 15px;
 }

 .info-service-card p {
   font-size: 1rem;
   color: #555;
   text-align: justify;
 }

 /* =======================
    Media Queries for Responsiveness
    ======================= */
 @media (max-width: 768px) {
   .info-service-card {
     padding: 15px;
   }
 }

 /* =======================
    Global Presence Map
    ======================= */
 .map-section {
   position: relative;
   text-align: center;
   background-color: #f9f9f9;
   padding: 60px 0;
 }

 .map-image {
   width: 100%;
   max-width: 100%;
   margin-top: 30px;
 }

 /* =======================
    Animated Number Count Section
    ======================= */
 .count-container {
   display: flex;
   justify-content: space-around;
   margin-top: 40px;
 }

 .count-box {
   background-color: #fff;
   padding: 30px;
   border-radius: 10px;
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
   text-align: center;
   width: 200px;
   transition: transform 0.3s ease, box-shadow 0.3s ease;
 }

 .count-box:hover {
   transform: translateY(-10px);
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
 }

 .count-box h4 {
   font-size: 2rem;
   color: var(--primary-green);
   font-weight: bold;
   margin-bottom: 10px;
 }

 .count-box p {
   font-size: 1rem;
   color: #555;
 }

 /* =======================
    Responsive Design
    ======================= */
 @media (max-width: 768px) {
   .count-container {
     flex-direction: column;
   }

   .count-box {
     margin-bottom: 20px;
   }

   .section-title {
     font-size: 2rem;
   }

   .section-subtitle {
     font-size: 1rem;
   }
 }

 /* =======================
    Section Title
    ======================= */
 .blog-section-title {
   font-size: 2.5rem;
   color: var(--primary-green);
   font-weight: bold;
 }

 .blog-section-subtitle {
   font-size: 1.2rem;
   color: #555;
 }

 /* =======================
    Custom Blog Card Styles
    ======================= */
 .blog-card {
   background-color: #fff;
   border-radius: 10px;
   overflow: hidden;
   box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
   transition: transform 0.3s ease, box-shadow 0.3s ease;
  min-height: 300px;
 }

 .blog-card:hover {
   transform: translateY(-10px);
   box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
 }

 .blog-card img {
   width: 100%;
   height: auto;
   transition: transform 0.3s ease;
   min-height: 300px;
   max-height: 300px;
 }

 .blog-card:hover img {
   transform: scale(1.1);
 }

 .blog-card .card-body {
   padding: 20px;
 }

 .blog-card .card-title {
   font-size: 1.2rem;
   color: var(--primary-green);
   font-weight: bold;
   margin-bottom: 10px;
   max-height: 45px;
   overflow: hidden;
 }

 .blog-card .card-text {
   font-size: 1rem;
   color: #555;
   margin-bottom: 20px;
 }

 .blog-card .read-more {
   font-size: 1rem;
   color: var(--primary-green);
   font-weight: bold;
   text-decoration: none;
 }

 .blog-card .read-more:hover {
   text-decoration: underline;
 }

 .blog-card .date {
   position: absolute;
   top: 10px;
   right: 10px;
   background-color: #7CB342;
   color: white;
   padding: 5px 10px;
   border-radius: 5px;
   font-size: 0.9rem;
 }

 /* =======================
    Responsive Design
    ======================= */
 @media (max-width: 768px) {
   .blog-section-title {
     font-size: 2rem;
   }

   .blog-section-subtitle {
     font-size: 1rem;
   }
 }

 :root {
   --dark-green: #1B5E20;
   --medium-green: #2d5f4a;
   --light-green: #7CB342;
   --accent-green: #8fbc8f;
   --text-light: #e0f0e9;
 }

 .footer-container {
   background-color: var(--dark-green);
   color: var(--text-light);
   padding: 50px 0 0;
   position: relative;
   overflow: hidden;
 }

 .footer-container::before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 5px;
   background: linear-gradient(90deg, var(--light-green), var(--accent-green));
   animation: gradient 5s ease infinite;
 }

 @keyframes gradient {
   0% {
     background-position: 0% 50%;
   }

   50% {
     background-position: 100% 50%;
   }

   100% {
     background-position: 0% 50%;
   }
 }

 .footer-title {
   font-size: 2rem;
   font-weight: bold;
   margin-bottom: 15px;
   color: white;
   position: relative;
   display: inline-block;
 }

 .footer-title::after {
   content: "";
   position: absolute;
   bottom: -5px;
   left: 0;
   width: 0;
   height: 2px;
   background-color: var(--accent-green);
   transition: width 0.5s ease;
 }

 .footer-title:hover::after {
   width: 100%;
 }

 .footer-subtitle {
   font-size: 1rem;
   margin-bottom: 20px;
   opacity: 0.9;
 }

 .newsletter-btn {
   background-color: var(--light-green);
   color: white;
   border: none;
   padding: 10px 20px;
   border-radius: 4px;
   font-weight: 600;
   transition: all 0.3s ease;
   position: relative;
   overflow: hidden;
 }

 .newsletter-btn::before {
   content: "";
   position: absolute;
   top: 0;
   left: -100%;
   width: 100%;
   height: 100%;
   background: rgba(255, 255, 255, 0.2);
   transition: left 0.5s ease;
 }

 .newsletter-btn:hover::before {
   left: 100%;
 }

 .newsletter-btn:hover {
   background-color: var(--accent-green);
   transform: translateY(-2px);
   box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
 }

 .footer-heading {
   font-size: 1.2rem;
   font-weight: 600;
   margin-bottom: 20px;
   color: white;
   position: relative;
   padding-bottom: 10px;
 }

 .footer-heading::after {
   content: "";
   position: absolute;
   bottom: 0;
   left: 0;
   width: 40px;
   height: 2px;
   background-color: var(--accent-green);
 }

 .footer-links {
   list-style: none;
   padding: 0;
 }

 .footer-links li {
   margin-bottom: 10px;
   position: relative;
   padding-left: 20px;
   transition: transform 0.3s ease;
 }

 .footer-links li::before {
   content: "›";
   position: absolute;
   left: 0;
   color: var(--accent-green);
   font-weight: bold;
   transition: transform 0.3s ease;
 }

 .footer-links li:hover {
   transform: translateX(5px);
 }

 .footer-links li:hover::before {
   transform: translateX(5px);
 }

 .footer-links a {
   color: var(--text-light);
   text-decoration: none;
   transition: color 0.3s ease;
 }

 .footer-links a:hover {
   color: var(--accent-green);
 }

 .contact-info {
   margin-bottom: 15px;
   display: flex;
   align-items: flex-start;
 }

 .contact-info i {
   margin-right: 10px;
   color: var(--accent-green);
   width: 20px;
 }

 .copyright-bar {
   background-color: var(--light-green);
   padding: 15px 0;
   text-align: center;
   margin-top: 40px;
 }

 .copyright-text {
   margin: 0;
   font-size: 0.9rem;
   opacity: 0.9;
 }

 .social-icons {
   margin-top: 20px;
 }

 .social-icons a {
   display: inline-block;
   width: 36px;
   height: 36px;
   background-color: rgba(255, 255, 255, 0.1);
   border-radius: 50%;
   text-align: center;
   line-height: 36px;
   margin-right: 10px;
   color: white;
   transition: all 0.3s ease;
 }

 .social-icons a:hover {
   background-color: var(--accent-green);
   transform: translateY(-3px);
 }

 /* Animation for elements on scroll */
 .fade-in {
   transform: translateY(20px);
   transition: opacity 0.6s ease, transform 0.6s ease;
 }

 .fade-in.visible {
   opacity: 1;
   transform: translateY(0);
 }

 /* Responsive adjustments */
 @media (max-width: 768px) {
   .footer-title {
     font-size: 1.5rem;
   }

   .footer-container {
     padding: 30px 0 0;
   }

   .footer-column {
     margin-bottom: 30px;
   }
 }

 .margin-info-fix {
   margin-top: 150px;
 }

 @media (max-width: 767px) {
   .margin-info-fix {
     margin-top: 70px;
   }
 }

 .main-image-container {
   position: relative;
   border-radius: 12px;
   overflow: hidden;
   box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
 }

 .main-image {
   width: 100%;
   height: 300px;
   object-fit: cover;
   display: block;
 }

 .stats-section {
   background: #7CB342;
   border-radius: 12px;
   padding: 0;
   overflow: hidden;
 }

 .stat-item {
   text-align: center;
   padding: 20px 15px;
   color: white;
   border-right: 1px solid rgba(255, 255, 255, 0.2);
   height: 100%;
   display: flex;
   flex-direction: column;
   justify-content: center;
   min-height: 120px;
 }

 .stat-item:last-child {
   border-right: none;
 }

 .stat-number {
   font-size: 1.8rem;
   font-weight: bold;
   margin-bottom: 8px;
   line-height: 1.2;
 }

 .stat-label {
   font-size: 0.9rem;
   font-weight: 500;
   line-height: 1.3;
   opacity: 0.95;
 }

 /* Mobile Responsive */
 @media (max-width: 767.98px) {
   .main-image {
     height: 250px;
   }

   .stat-item {
     padding: 15px 10px;
     min-height: 100px;
     border-right: none;
     border-bottom: 1px solid rgba(255, 255, 255, 0.2);
   }

   .stat-item:nth-child(2n) {
     border-right: 1px solid rgba(255, 255, 255, 0.2);
   }

   .stat-item:nth-child(3),
   .stat-item:nth-child(4) {
     border-bottom: none;
   }

   .stat-number {
     font-size: 1.5rem;
   }

   .stat-label {
     font-size: 0.8rem;
   }
 }

 /* Tablet Responsive */
 @media (min-width: 768px) and (max-width: 991.98px) {
   .main-image {
     height: 280px;
   }

   .stat-number {
     font-size: 1.6rem;
   }
 }

 /* Desktop Responsive */
 @media (min-width: 992px) {
   .main-image {
     height: 37rem;
   }

   .stat-number {
     font-size: 2rem;
   }

   .stat-label {
     font-size: 1rem;
   }
 }

 /* Hover Effects */
 .stat-item {
   transition: background-color 0.3s ease;
 }

 .stat-item:hover {
   background-color: rgba(255, 255, 255, 0.1);
 }

 .about-section-title {
   font-size: 37px;
   font-weight: bold;
   margin-bottom: 27px;
   color: var(--primary-green);
   text-align: center;
 }

 .about-section-info {
   text-align: center;
   line-height: 37px;
   max-width: 770px;
   margin: auto;
 }

 .info-title {
   font-size: 37px !important;
   color: var(--primary-green);
   font-weight: bold;
 }

 .info {
   text-align: justify;
   line-height: 30px;
 }

 /* Section styling */
 .info-history {
   background-color: #1B5E20;
   color: white;
   padding: 50px 0;
   border-radius: 15px;
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
   margin-top: 40px;
 }

 .info-history .row {
   align-items: center;
 }

 /* Left side image section */
 .info-history .col-left {
   text-align: left;
 }

 .info-history .col-left h2 {
   font-size: 2.5rem;
   font-weight: bold;
   margin-bottom: 20px;
 }

 .info-history .col-left p {
   text-align: justify;
   margin-bottom: 20px;
   line-height: 30px;
 }

 .info-history .col-left .btn {
   background-color: #f8f9fa;
   color: #7CB342;
   border: none;
   font-weight: bold;
 }

 .info-history .col-left .btn:hover {
   background-color: #7CB342;
   color: white;
 }

 /* Right side video section */
 .info-history .col-right {
   text-align: center;
 }

 .info-history .col-right video {
   width: 100%;
   max-width: 600px;
   border-radius: 10px;
 }

 /* Responsive design for mobile */
 @media (max-width: 767px) {

   .info-history .col-left,
   .info-history .col-right {
     text-align: center;
     margin-bottom: 20px;
   }
 }

 .innovation-section-title {
   color: var(--primary-green);
   font-size: 2rem;
   font-weight: bold;
 }

 .innovation-section .lead {
   font-size: 1.1rem;
   color: #333;
   line-height: 30px;
   text-align: justify;
 }

 .focus-areas h5 {
   font-weight: bold;
   color: var(--primary-green);
   margin-top: 20px;
 }

 .focus-areas ul {
   margin-top: 10px;
 }

 .focus-areas ul li {
   font-size: 1rem;
   color: #555;
   margin-bottom: 8px;
   font-weight: 500;
 }

 .innovation-section img {
   max-width: 100%;
   height: 370px;
   object-fit: cover;
   border-radius: 12px;
   box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
 }

 /* Mobile Responsiveness */
 @media (max-width: 767px) {
   .innovation-section .row {
     text-align: center;
   }

   .innovation-section img {
     margin-top: 20px;
   }
 }

 /* Tablet and Desktop Responsiveness */
 @media (min-width: 768px) {
   .innovation-section .row {
     display: flex;
     justify-content: space-between;
     align-items: center;
   }
 }

 .gallery-section {
   padding: 60px 0;
   background-color: #f8f9fa;
 }

 .gallery-title {
   text-align: center;
   margin-bottom: 40px;
   font-weight: 700;
   color: #2c3e50;
   position: relative;
   padding-bottom: 15px;
 }

 .gallery-title:after {
   content: '';
   position: absolute;
   bottom: 0;
   left: 50%;
   transform: translateX(-50%);
   width: 80px;
   height: 3px;
   background-color: #3498db;
 }

 .gallery-item {
   margin-bottom: 30px;
   overflow: hidden;
   border-radius: 8px;
   box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
   transition: transform 0.3s ease, box-shadow 0.3s ease;
 }

 .gallery-item:hover {
   transform: translateY(-5px);
   box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
 }

 .gallery-item img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform 0.5s ease;
 }

 .gallery-item:hover img {
   transform: scale(1.05);
 }

 .img-overlay {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: rgba(0, 0, 0, 0.5);
   display: flex;
   align-items: center;
   justify-content: center;
   opacity: 0;
   transition: opacity 0.3s ease;
 }

 .gallery-item:hover .img-overlay {
   opacity: 1;
 }

 .overlay-content {
   color: white;
   text-align: center;
 }

 .overlay-content i {
   font-size: 24px;
   margin-bottom: 10px;
 }

 .overlay-content h5 {
   font-size: 18px;
   margin: 0;
 }

 /* Custom height for gallery items */
 .gallery-item {
   height: 250px;
 }

 /* Lightbox styles */
 .lightbox {
   display: none;
   position: fixed;
   z-index: 9999;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.9);
   animation: fadeIn 0.3s;
 }

 .lightbox-content {
   position: relative;
   margin: auto;
   padding: 0;
   width: 90%;
   max-width: 1200px;
   top: 50%;
   transform: translateY(-50%);
 }

 .lightbox-content img {
   width: 100%;
   border-radius: 8px;
 }

 .close-lightbox {
   position: absolute;
   top: 15px;
   right: 35px;
   color: #f1f1f1;
   font-size: 40px;
   font-weight: bold;
   cursor: pointer;
   transition: 0.3s;
 }

 .close-lightbox:hover {
   color: #bbb;
 }

 @keyframes fadeIn {
   from {
     opacity: 0
   }

   to {
     opacity: 1
   }
 }

 .product-card {
   background: #ffffff;
   border-radius: 20px;
   overflow: hidden;
   box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
   transition: transform 0.3s ease, box-shadow 0.3s ease;
   margin: 0 auto;
 }

 .product-card:hover {
   transform: translateY(-5px);
   box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
 }

 .product-image-container {
   position: relative;
   overflow: hidden;
   height: 300px;
   background: linear-gradient(135deg, #f5f5f5 0%, #e8e8e8 100%);
 }

 .product-image {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: transform 0.3s ease;
 }

 .product-card:hover .product-image {
   transform: scale(1.05);
 }

 .overlay {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: rgba(0, 0, 0, 0.4);
   display: flex;
   align-items: center;
   justify-content: center;
   opacity: 0.7;
   transition: opacity 0.3s ease;
 }

 .product-card:hover .overlay {
   opacity: 1;
 }

 .overlay-btn {
   background: #8BC34A;
   color: white;
   border: none;
   padding: 12px 24px;
   border-radius: 25px;
   font-weight: 600;
   font-size: 16px;
   transition: all 0.3s ease;
   transform: translateY(20px);
 }

 .product-card:hover .overlay-btn {
   transform: translateY(0);
 }

 .overlay-btn:hover {
   background: #7CB342;
   transform: translateY(-2px);
   box-shadow: 0 5px 15px rgba(139, 195, 74, 0.4);
 }

 .product-info {
   background: linear-gradient(135deg, #8BC34A 0%, #7CB342 100%);
   padding: 20px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   min-height: 80px;
 }

 .product-title {
   color: white;
   font-size: 17px;
   font-weight: 700;
   margin: 0;
   letter-spacing: 0.5px;
 }

 .arrow-icon {
   color: white;
   transition: transform 0.3s ease;
 }

 .product-card:hover .arrow-icon {
   transform: translateX(5px);
 }

 /* Responsive adjustments */
 @media (max-width: 768px) {
   .product-card {
     max-width: 100%;
     margin: 0 15px;
   }

   .product-image-container {
     height: 250px;
   }

   .product-title {
     font-size: 20px;
   }

   .overlay-btn {
     padding: 10px 20px;
     font-size: 14px;
   }
 }

 @media (max-width: 576px) {
   .product-image-container {
     height: 200px;
   }

   .product-info {
     padding: 15px;
     min-height: 70px;
   }

   .product-title {
     font-size: 18px;
   }
 }

 /* Additional hover effects */
 .product-card {
   cursor: pointer;
 }

 .product-card::before {
   content: '';
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: linear-gradient(45deg, transparent 30%, rgba(255, 255, 255, 0.1) 50%, transparent 70%);
   transform: translateX(-100%);
   transition: transform 0.6s ease;
   z-index: 1;
   pointer-events: none;
 }

 .product-card:hover::before {
   transform: translateX(100%);
 }

 .contact-section {
   background-color: #7CB342;
   color: white;
   padding: 60px 30px;
   text-align: center;
   border-radius: 10px;
   box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
 }

 .contact-section h2 {
   font-size: 3rem;
   font-weight: bold;
   margin-bottom: 20px;
 }

 .contact-section p {
   font-size: 1.1rem;
   margin-bottom: 30px;
 }

 .contact-section .btn {
   background-color: white;
   color: #28a745;
   padding: 12px 30px;
   font-size: 1.1rem;
   border-radius: 5px;
   transition: background-color 0.3s, color 0.3s;
   border: 2px solid #28a745;
 }

 .contact-section .btn:hover {
   background-color: #218838;
   color: white;
   border: 2px solid #218838;
 }

 /* Mobile responsiveness */
 @media (max-width: 767px) {
   .contact-section h2 {
     font-size: 2rem;
   }

   .contact-section p {
     font-size: 1rem;
   }

   .contact-section .btn {
     font-size: 1rem;
   }
 }

 .header-section {
   position: relative;
   background-size: cover;
   background-position: center;
   height: 60vh;
   display: flex;
   justify-content: center;
   align-items: center;
   color: white;
   text-align: center;
 }

 /* Overlay color with opacity */
 .header-section::before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: rgba(0, 128, 0, 0.5);
   z-index: 1;
 }

 .header-section h1 {
   font-size: 3rem;
   font-weight: bold;
   text-transform: uppercase;
   text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
   z-index: 2;
 }

 @media (max-width: 768px) {
   .header-section h1 {
     font-size: 2rem;
   }
 }

 .custom-section {
   position: relative;
   background-image: url('../img/capability.png');
   background-size: cover;
   background-position: center;
   height: 70vh;
   display: flex;
   align-items: center;
   justify-content: center;
   color: white;
   text-align: center;
   padding: 20px;
 }

 .custom-section .export-overlay {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: #2e7d32db;
   z-index: 1;
 }

 .custom-section .content {
   z-index: 2;
   max-width: 800px;
 }

 .custom-section h2 {
   font-size: 3rem;
   margin-bottom: 20px;
   font-weight: bold;
 }

 .custom-section p {
   font-size: 1.3rem;
   margin-bottom: 30px;
 }

 .custom-section .btn {
   padding: 10px 30px;
   font-size: 1rem;
   border-radius: 5px;
   margin: 10px;
   background-color: #7CB342;
   color: white;
   border: none;
 }

 .custom-section .btn:hover {
   padding: 10px 30px;
   font-size: 1rem;
   border-radius: 5px;
   margin: 10px;
   background-color: transparent;
   border: solid 3px #7CB342;
   color: white;
 }

 @media (max-width: 768px) {
   .custom-section h2 {
     font-size: 2rem;
   }

   .custom-section p {
     font-size: 1rem;
   }
 }

 .export-content {
   z-index: 1;
 }

 .certifications-images {
   display: flex;
   justify-content: center;
   align-items: center;
   flex-wrap: wrap;
   gap: 20px;
 }

 .certifications-images img {
   width: 300px;
   height: 300px;
   object-fit: contain;
 }

 @media (max-width: 768px) {
   .certifications-images img {
     width: 120px;
     height: 120px;
   }
 }

 .flag-slider {
   width: 100%;
   overflow: hidden;
   background-color: #f8f9fa;
   padding: 20px 0;
   position: relative;
 }

 .flag-slider-inner {
   display: flex;
   animation: scrollFlags 20s linear infinite;
   width: fit-content;
 }

 .flag-slider:hover .flag-slider-inner {
   animation-play-state: paused;
 }

 .flag-item {
   display: flex;
   justify-content: center;
   align-items: center;
   margin: 0 15px;
 }

 .flag-item img {
   height: 80px;
   width: auto;
   object-fit: contain;
   filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.2));
 }

 @keyframes scrollFlags {
   0% {
     transform: translateX(0);
   }

   100% {
     transform: translateX(-50%);
   }
 }

 @media (max-width: 768px) {
   .flag-item img {
     height: 60px;
   }

   .flag-item {
     margin: 0 10px;
   }
 }

 .global-partner-section {
   background-color: #7CB342;
   color: white;
   padding: 60px 20px;
   text-align: center;
 }

 .global-partner-section h2 {
   font-size: 2.5rem;
   margin-bottom: 20px;
 }

 .global-partner-section p {
   font-size: 1.2rem;
   margin-bottom: 30px;
 }

 .global-partner-section .btn {
   padding: 12px 30px;
   font-size: 1rem;
   margin: 10px;
   border-radius: 5px;
 }

 .global-partner-section .btn-contact {
   background-color: #ffffff;
   color: #7CB342;
   border: 2px solid #7CB342;
 }

 .global-partner-section .btn-dealer {
   background-color: transparent;
   color: #ffffff;
   border: 2px solid #ffffff;
 }

 .global-partner-section .btn:hover {
   opacity: 0.8;
 }

 @media (max-width: 768px) {
   .global-partner-section h2 {
     font-size: 2rem;
   }

   .global-partner-section p {
     font-size: 1rem;
   }
 }

 .blog-style-info {
   margin-top: 100px;
 }

 /* Custom styles for blog cards */
 .blog-card {
   border: 1px solid #ddd;
   border-radius: 10px;
   overflow: hidden;
   transition: transform 0.3s ease, box-shadow 0.3s ease;
 }

 .blog-card img {
   width: 100%;
   height: 200px;
   object-fit: cover;
 }

 .blog-card-body {
   padding: 20px;
 }

 .blog-card-title {
   font-size: 1.25rem;
   font-weight: bold;
   margin-bottom: 10px;
   max-height: 45px;
   overflow: hidden;
 }

 .blog-card-description {
   font-size: 1rem;
   color: #555;
   margin-bottom: 10px;
   max-height: 45px;
   overflow: hidden;
 }

 .blog-card-footer {
   font-size: 0.875rem;
   color: #888;
   margin-top: 17px;
 }

 /* Hover effect */
 .blog-card:hover {
   transform: translateY(-10px);
   box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
 }

 .video-section {
   margin-top: 100px;
 }

 .video-card {
   position: relative;
   overflow: hidden;
   border-radius: 10px;
   cursor: pointer;
   transition: transform 0.3s ease, box-shadow 0.3s ease;
 }

 .video-card img {
   width: 100%;
   height: 250px;
   object-fit: cover;
 }

 .video-card .overlay-text {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   color: white;
   font-size: 1.5rem;
   font-weight: bold;
   text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7);
 }

 .video-card:hover {
   transform: scale(1.05);
   box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2);
 }

 .video-map {
   border-radius: 10px;
   overflow: hidden;
   background-color: #f0f0f0;
 }

 .youtube-video iframe {
   width: 100%;
   height: 300px;
   border: none;
   border-radius: 10px;
 }

 /* Responsive Layout */
 @media (max-width: 767px) {
   .video-container {
     display: block;
   }

   .video-card {
     margin-bottom: 20px;
   }
 }

 @media (min-width: 768px) {
   .video-container {
     display: flex;
     justify-content: space-between;
   }

   .video-card {
     width: 48%;
   }
 }

 @media (min-width: 1200px) {
   .video-card {
     width: 30%;
   }
 }

 /* Custom styles for the section */
 .events-media-section {
   padding: 50px 17px;
   background-color: #d1f7d1;
   border-radius: 10px;
 }

 .event-text h2 {
   font-size: 1.75rem;
   font-weight: bold;
   color: #333;
 }

 .event-text p {
   font-size: 1rem;
   color: #555;
   line-height: 30px;
   text-align: justify;
 }

 .carousel-item img {
   width: 100%;
   height: 300px;
   object-fit: cover;
   border-radius: 10px;
 }

 /* Responsive Layout */
 @media (max-width: 767px) {
   .event-image {
     margin-top: 20px;
   }
 }

 @media (min-width: 768px) {
   .event-text {
     padding: 40px;
   }

   .event-image {
     margin-left: 20px;
   }
 }

 /* Custom styles for the newsletter section */
 .newsletter-section {
   padding: 60px 0;
   background-color: #f9f9f9;
 }

 .newsletter-title {
   font-size: 2rem;
   font-weight: bold;
   color: #2a7f2a;
   margin-bottom: 20px;
 }

 .newsletter-description {
   font-size: 1rem;
   color: #555;
   margin-bottom: 30px;
   max-width: 700px;
 }

 .newsletter-form {
   display: flex;
   align-items: center;
   gap: 10px;
 }

 .newsletter-form input[type="email"] {
   padding: 10px;
   font-size: 1rem;
   width: 250px;
   border-radius: 5px;
   border: 1px solid #ddd;
 }

 .newsletter-form button {
   padding: 10px 20px;
   font-size: 1rem;
   background-color: #2a7f2a;
   color: white;
   border: none;
   border-radius: 5px;
   cursor: pointer;
 }

 .newsletter-form button:hover {
   background-color: #246c24;
 }

 /* Responsive Layout */
 @media (max-width: 767px) {
   .newsletter-form input[type="email"] {
     width: 100%;
   }
 }

 .career-section {
   position: relative;
   background: #ffffff;
 }

 @media (max-width: 768px) {
   .btn-group-custom {
     justify-content: center;
   }
 }

 .culture-area {
   position: relative;
   background-color: #78b443;
   padding: 80px 0;
 }

 .culture-title {
   font-size: 37px;
   font-weight: bold;
   text-align: center;
   color: #fff;
   margin-bottom: 40px;
 }

 .culture-card {
   background: #ffffff;
   padding: 30px;
   border-radius: 10px;
   box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.10);
   transition: 0.3s ease-in-out;
   height: 100%;
 }

 .culture-card:hover {
   transform: translateY(-6px);
 }

 .culture-card h6 {
   font-weight: 600;
   margin-bottom: 10px;
   font-size: 1.37rem;
 }

 .culture-card p {
   text-align: justify;
   color: #555;
 }

 @media (max-width: 768px) {
   .culture-area {
     padding: 50px 0;
   }
 }

 .vacancy-section {
   position: relative;
   background: #ffffff;
 }

 .vacancy-title {
   font-size: 1.37rem;
   font-weight: bold;
   color: #2a7a32;
   margin-bottom: 10px;
 }

 .vacancy-desc {
   color: #444;
   margin-bottom: 30px;
   max-width: 700px;
 }

 .vacancy-box {
   border-bottom: 1px solid #eee;
   padding: 25px 0;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 15px;
 }

 .vacancy-info {
   text-align: justify;
 }

 .vacancy-info h6 {
   font-weight: 600;
   margin: 2px 0;
 }

 .vacancy-info small {
   color: #555;
 }

 .vacancy-icon img {
   width: 70px;
   height: auto;
 }

 .apply-btn {
   background: #7db442;
   color: #fff;
   border-radius: 6px;
   padding: 6px 25px;
 }

 .apply-btn:hover {
   background: #669a39;
   color: #fff;
 }

 @media(max-width:768px) {
   .vacancy-box {
     flex-direction: column;
     text-align: center;
   }
 }

 .leader-section {
   position: relative;
   background: #ffffff;
 }

 .leader-title {
   font-size: 1.37rem;
   font-weight: bold;
   color: #2b7a32;
   margin-bottom: 35px;
 }

 /* Video Card */
 .leader-video {
   position: relative;
   border-radius: 10px;
   overflow: hidden;
   cursor: pointer;
   transition: 0.3s ease-in-out;
 }

 .leader-video img {
   width: 100%;
   height: 300px;
   object-fit: cover;
 }

 /* Play Icon Overlay */
 .play-icon {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 55px;
   height: 55px;
   background: rgba(0, 0, 0, 0.55);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 .play-icon i {
   font-size: 22px;
   color: #ffffff;
 }

 .leader-video:hover img {
   opacity: 0.85;
 }

 .leader-caption {
   font-size: 0.9rem;
   margin-top: 7px;
   text-align: center;
   font-weight: 500;
   color: #333;
 }

 @media (max-width: 768px) {
   .leader-title {
     text-align: center;
   }
 }

 .apply-section {
   background: #7db442;
   padding: 90px 0;
   position: relative;
 }

 .apply-card {
   background: #ffffff;
   border-radius: 10px;
   padding: 35px;
   box-shadow: 0 6px 20px rgba(0, 0, 0, 0.10);
 }

 .apply-card input,
 .apply-card textarea,
 .apply-card select {
   font-size: 0.9rem;
   padding: 10px;
 }

 .form-apply-btn {
   width: 100%;
   background: #5c932e;
   color: #fff;
   border-radius: 6px;
   padding: 10px;
   margin-top: 10px;
   font-weight: 500;
 }

 .form-apply-btn:hover {
   background: #4d7d27;
   color: #fff;
 }

 .apply-text {
   color: #fff;
   font-size: 37px;
   font-weight: 500;
   line-height: 1.6;
   text-align: justify;
 }

 @media (max-width: 768px) {
   .apply-text {
     text-align: center;
     margin-top: 30px;
     font-size: 1.7rem;
   }
 }

 .title-info-responsive {
   font-size: 37px !important;
 }

 @media (max-width: 768px) {
   .title-info-responsive {
     font-size: 30px !important;
   }
 }

 .contactpage-info .col-md-4 {
   margin-bottom: 30px;
 }

 .contactpage-info h5 {
   font-weight: bold;
   color: #333;
 }

 .contactpage-info i {
   font-size: 37px;
   color: #2E7D32;
 }

 .contactpage-info .iconpage-box {
   margin-bottom: 10px;
 }

 .contactpage-info .infopage-box {
   padding: 30px;
   background-color: #F9F9F9;
 }

 .contactpage-info .infopage-box p {
   font-size: 14px;
   color: #555;
   margin-bottom: 0px;
 }

 .contact-form-container {
   max-width: 700px;
   margin: 50px auto;
   padding: 30px;
   background-color: #fff;
   border-radius: 8px;
   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
 }

 .contact-form-container h2 {
   text-align: center;
   color: #2E7D32;
   margin-bottom: 30px;
 }

 .contact-form-container .form-group {
   margin-bottom: 15px;
 }

 .contact-form-container label {
   font-weight: bold;
   color: #555;
 }

 .contact-form-container input,
 .contact-form-container textarea {
   width: 100%;
   padding: 10px;
   border-radius: 5px;
   border: 1px solid #ddd;
   margin-top: 5px;
 }

 .contact-form-container textarea {
   height: 120px;
 }












 .contact-form-container button {
   background-color: #2E7D32;
   color: white;
   border: none;
   padding: 10px 20px;
   border-radius: 5px;
   font-size: 16px;
   cursor: pointer;
   width: 100%;
 }

 .contact-form-container button:hover {
   background-color: #2E7D32;
 }

 @media (max-width: 576px) {
   .contact-form-container {
     padding: 20px;
   }
 }


 
     

        .slider-container {
            position: relative;
            overflow: hidden;
            padding: 30px 0;
        }

        .slider-wrapper {
            display: flex;
            transition: transform 0.5s ease;
        }

        .equipment-card {
            flex: 0 0 20%;
            padding: 0 15px;
            transition: transform 0.3s ease;
        }

        .equipment-card:hover {
            transform: translateY(-10px);
        }

        .card-content {
            position: relative;
            border-radius: 15px;
            overflow: hidden;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
            height: 300px;
            cursor: pointer;
            transition: all 0.3s ease;
        }

        .card-content:hover {
            box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
        }

        .card-image {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.5s ease;
        }

        .card-content:hover .card-image {
            transform: scale(1.1);
        }

        .card-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.4) 50%, rgba(0, 0, 0, 0.2) 100%);
            display: flex;
            align-items: flex-end;
            padding: 20px;
            transition: background 0.3s ease;
        }

        .card-content:hover .card-overlay {
            background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.6) 50%, rgba(0, 0, 0, 0.3) 100%);
        }

        .equipment-name {
            color: white;
            font-weight: 600;
            font-size: 20px;
            text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
            transform: translateY(0);
            transition: transform 0.3s ease;
        }

        .card-content:hover .equipment-name {
            transform: translateY(-5px);
        }

        .equipment-category {
            color: rgba(255, 255, 255, 0.8);
            font-size: 14px;
            margin-top: 5px;
            opacity: 0;
            transform: translateY(10px);
            transition: all 0.3s ease;
        }

        .card-content:hover .equipment-category {
            opacity: 1;
            transform: translateY(0);
        }

        .slider-nav {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            width: 100%;
            display: flex;
            justify-content: space-between;
            padding: 0 10px;
            pointer-events: none;
            z-index: 10;
        }

        .slider-nav button {
            width: 45px;
            height: 45px;
            border-radius: 50%;
            background-color: rgba(255, 255, 255, 0.9);
            border: none;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            pointer-events: all;
            transition: all 0.3s ease;
        }

        .slider-nav button:hover {
            background-color: white;
            transform: scale(1.1);
            box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
        }

        .slider-nav button:focus {
            outline: none;
            box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.25);
        }

        .slider-nav button:disabled {
            opacity: 0.5;
            cursor: not-allowed;
        }

        .slider-nav button:disabled:hover {
            transform: scale(1);
        }

        .slider-dots {
            display: flex;
            justify-content: center;
            margin-top: 30px;
        }

        .dot {
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background-color: #ddd;
            margin: 0 6px;
            cursor: pointer;
            transition: all 0.3s ease;
        }

        .dot:hover {
            background-color: #bbb;
            transform: scale(1.2);
        }

        .dot.active {
            background-color: #007bff;
            transform: scale(1.2);
        }

        @media (max-width: 992px) {
            .equipment-card {
                flex: 0 0 33.333%;
            }
        }

        @media (max-width: 768px) {
            .equipment-card {
                flex: 0 0 50%;
            }
            .card-content {
                height: 250px;
            }
        }

        @media (max-width: 576px) {
            .equipment-card {
                flex: 0 0 100%;
            }
            .card-content {
                height: 200px;
            }
        }