/* ========================================
   DEWATT ELECTRICAL SERVICES - STRUCTURED CSS
   ======================================== */

/* ========================================
   1. IMPORTS & FONTS
   ======================================== */
   @import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Inter+Tight:wght@100;200;300;400;500;600;700;800;900&display=swap');

   /* ========================================
      2. CSS VARIABLES
      ======================================== */
   :root {
     /* Primary Colors */
     --primary-color: #F29901;
     --secondary-color: #0B1D33;
     
     /* Text Colors */
     --text-dark: #1E293B;
     --text-light: #71717A;
     --white: #FFFFFF;
     
     /* Border & UI */
     --border-color: #404040;
     
     /* Gradients */
     --gradient-primary: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
     --gradient-secondary: linear-gradient(135deg, #ffd700 0%, #ffed4e 100%);
     
     /* Shadows */
     --shadow-light: 0 4px 6px rgba(0, 0, 0, 0.1);
     --shadow-medium: 0 8px 25px rgba(0, 0, 0, 0.15);
     --shadow-heavy: 0 15px 40px rgba(0, 0, 0, 0.2);
     
     /* Border Radius */
     --border-radius: 10px;
     
     /* Transitions */
     --transition: all 0.3s ease;
   }
   
   /* ========================================
      3. BASE STYLES (TRULY GLOBAL ONLY)
      ======================================== */
   * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
   }
   
   body {
     font-family: 'Inter', sans-serif;
     font-size: 16px;
     line-height: 1.5;
     color: var(--text-light);
     overflow-x: hidden;
   }
   
   a {
     text-decoration: none;
     color: inherit;
     transition: all 0.3s ease;
   }
   
   img {
     max-width: 100%;
     height: auto;
     display: block;
   }
   
   /* ========================================
      4. UTILITY CLASSES
      ======================================== */
   .text-accent {
     color: var(--primary-color);
   }
   
   .text-dark {
     color: var(--text-dark);
   }
   
   .text-center {
     text-align: center;
   }
   
   /* Button Utilities */
   .btn {
     display: inline-block;
     padding: 15px 35px;
     font-size: 17px;
     font-weight: 600;
     letter-spacing: -0.5px;
     line-height: 1;
     border-radius: 10px;
     border: 1px solid;
     transition: all 0.3s ease;
     cursor: pointer;
   }
   
   .btn-primary {
     background-color: var(--primary-color);
     color: var(--text-dark);
     border-color: var(--primary-color);
   }
   
   .btn-primary:hover {
     background-color: transparent;
     color: var(--text-dark);
     border-color: var(--text-dark);
   }
   
   /* ========================================
      5. HEADER SECTION
      ======================================== */
   .header {
     background-color: var(--secondary-color);
     position: relative;
     z-index: 1000;
   }
   
   /* Header Navigation */
   .header .navbar {
     padding: 15px 0;
   }
   
   .header .navbar-brand {
     display: flex;
     align-items: center;
  }
  
  .header .navbar-brand img {
    transition: transform 0.3s ease;
  }
  
  .header .navbar-brand:hover img {
/*     transform: scale(1.05); */
  }

  /* Mobile responsive navbar */
  @media (max-width: 768px) {
   .header .navbar-brand img {
    width: 250px !important;
    }
    
    .header .navbar {
      padding: 10px 0;
    }
   }
   
   .header .nav-link,
.header .navbar ul li a{
     color: var(--primary-color);
     font-size: 14px;
     font-weight: 600;
     letter-spacing: -0.5px;
     padding: 10px 15px;
   }

   
   .header .nav-link:hover,
   .header .nav-link.active,
.header .navbar ul li a:hover,
.header .navbar ul .current-menu-item a{
     color: var(--white);
   }
   
   /* Header Contact Info */
   .header .contact-icon {
     background: rgba(255, 255, 255, 0.3);
     border-radius: 50%;
     padding: 5px;
     width: 40px;
     height: 40px;
     display: flex;
     align-items: center;
     justify-content: center;
   }
   
   .header .contact-info h6 {
     color: var(--white);
     margin-bottom: 5px;
     font-size: 14px;
     font-weight: 500;
   }
   
   .header .contact-info p {
     color: var(--primary-color);
     font-size: 17px;
     font-weight: 600;
     letter-spacing: -0.5px;
     margin: 0;
   }
   
   /* ========================================
      6. HERO SECTION
      ======================================== */
   .hero {
     background: linear-gradient(90deg, rgba(17, 39, 64, 0.9) 0%, rgba(0, 0, 0, 0.4) 100%), 
                 url('../images/hero-background.jpg');
     background-size: cover;
     background-position: center;
     /* min-height: 100vh; */
     display: flex;
     align-items: center;
     /* padding: 80px 0; */
     position: relative;
   }
   
   .hero .container {
     position: relative;
     z-index: 2;
   }
   
   /* Hero Title */
   .hero .hero-title {
     color: var(--white);
     margin-bottom: 30px;
     font-size: 45px;
     line-height: 1.1;
     font-weight: 700;
     font-family: 'Inter Tight', sans-serif;
   }
   
   .hero .hero-title-accent {
     color: var(--primary-color);
     white-space: nowrap;
   }
   
   /* Hero Description */
   .hero .hero-description {
     color: var(--white);
     max-width: 100%;
     margin-bottom: 40px;
     font-size: 16px;
     line-height: 1.6;
   }
   
   /* Hero Call Button */
   .hero .hero-call {
     display: flex;
     align-items: center;
     gap: 15px;
     
     padding: 15px 20px;
     border-radius: 10px;
     
   }
   
   .hero .call-icon {
     background: var(--primary-color);
     border-radius: 50%;
     padding: 8px;
     width: 45px;
     height: 45px;
     display: flex;
     align-items: center;
     justify-content: center;
   }
   
   .hero .hero-call h5 {
     color: var(--white);
     margin-bottom: 5px;
     font-size: 16px;
     font-weight: 600;
   }
   
   .hero .hero-call p {
     color: var(--white);
     font-size: 17px;
     font-weight: 600;
     letter-spacing: -0.5px;
     margin: 0;
   }
   
   /* Hero Stats */
   .hero .hero-stats {
     display: flex;
     gap: 60px;
     flex-wrap: wrap;
     margin-top: 40px;
     align-self: flex-start;
   }
   
   .hero .stat-card {
     text-align: left;
   }
   
   .hero .stat-number {
     font-family: 'Inter Tight', sans-serif;
     font-size: 64px;
     font-weight: 700;
     color: var(--white);
     letter-spacing: -2px;
     line-height: 1;
     margin-bottom: 8px;
   }

	   .hero .banner-stats{
     font-family: 'Inter Tight', sans-serif;
     font-size: 64px;
     font-weight: 700;
     color: var(--white);
     letter-spacing: -2px;
     line-height: 1;
     margin-bottom: 8px;
}
   
   .hero .stat-label {
     color: var(--white);
     font-size: 18px;
     display: block;
     font-weight: 500;
     line-height: 1.2;
   }
   
   /* Hero Video */
   .hero .hero-video {
     background: rgba(0, 0, 0, 0.3);
     backdrop-filter: blur(10px);
     border: 1px solid rgba(255, 255, 255, 0.2);
     border-radius: 20px;
     overflow: hidden;
     max-width: 500px;
     width: 100%;
     display: flex;
     flex-direction: row;
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
     margin-top: 400px;
   }
   
   .hero .video-thumbnail {
     position: relative;
     aspect-ratio: 16/9;
     overflow: hidden;
     flex: 1;
     min-width: 200px;
   }

@media screen and (max-width:768px){
	.hero .video-thumbnail{
		 min-width: unset !important;
	}
}
   
   .hero .video-thumbnail img {
     width: 100%;
     height: 100%;
     object-fit: cover;
   }
   
   .hero .play-button {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     cursor: pointer;
     transition: transform 0.3s ease;
   }
   
   .hero .play-button:hover {
     transform: translate(-50%, -50%) scale(1.1);
   }
   
   .hero .play-button img {
     width: 80px;
     height: 80px;
     opacity: 0.9;
   }
   
   .hero .video-info {
     padding: 20px;
     flex: 1;
     display: flex;
     flex-direction: column;
     justify-content: center;
   }
   
   .hero .video-info h4 {
     color: var(--primary-color);
     margin-bottom: 10px;
     font-size: 18px;
     font-weight: 600;
     line-height: 1.3;
   }
   
   .hero .video-info p {
     color: var(--white);
     margin: 0;
     font-size: 13px;
     line-height: 1.5;
   }
   

@media screen and (max-width:768px){
	.hero .btn-primary{
		padding: 10px 15px;
	}
}
   /* ========================================
      7. FEATURES SECTION
      ======================================== */
   .features {
     padding: 48px 0;
   }
   
   /* Feature Card */
   .features .feature-card {
     background: var(--secondary-color);
     padding: 30px;
     border-radius: 25px;
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.35);
     text-align: center;
     transition: all 0.4s ease;
     position: relative;
     overflow: hidden;
     cursor: pointer;
   }
   
@media screen and (min-width:991px){
	.features .feature-card {
		min-height: 277px;
	}
}
   .features .feature-card::before {
     content: '';
     position: absolute;
     top: 0;
     left: -100%;
     width: 100%;
     height: 100%;
     background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
     transition: left 0.6s ease;
   }
   
   .features .feature-card:hover::before {
     left: 100%;
   }
   
   .features .feature-card:hover {
     transform: translateY(-10px) scale(1.02);
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
     background: linear-gradient(135deg, var(--secondary-color) 0%, #1a2332 100%);
   }
   
   .features .feature-card img {
     width: 30%;
     margin: 0 auto 20px;
     transition: all 0.4s ease;
     filter: grayscale(0);
   }
   
   .features .feature-card:hover img {
     transform: scale(1.1) rotate(5deg);
     filter: grayscale(0) brightness(1.1);
   }
   
   .features .feature-card h4 {
     color: var(--primary-color);
     margin-bottom: 10px;
     font-size: 20px;
     font-weight: 600;
     font-family: 'Inter Tight', sans-serif;
     transition: all 0.3s ease;
   }
   
   .features .feature-card:hover h4 {
     color: #ffed4e;
     transform: translateY(-2px);
   }
   
   .features .feature-card p {
     color: var(--white);
     margin: 0;
     font-size: 16px;
     transition: all 0.3s ease;
   }
   
   .features .feature-card:hover p {
     color: #f0f0f0;
     transform: translateY(-2px);
   }
   
   
   /* ========================================
      9. PROJECTS SECTION
      ======================================== */
   .projects {
     padding: 96px 0;
     background: var(--white);
   }
   
   /* Projects Title */
   .projects .projects-heading {
     font-size: 47px;
     line-height: 1.1;
     color: var(--text-dark);
     margin-bottom: 10px;
     font-family: 'Inter Tight', sans-serif;
     font-weight: 600;
   }
   
   .projects .projects-heading-accent {
     font-size: 47px;
     line-height: 1.1;
     color: var(--primary-color);
     margin-bottom: 20px;
     font-family: 'Inter Tight', sans-serif;
     font-weight: 600;
   }
   
   .projects .projects-description {
     margin-top: 20px;
     font-size: 16px;
     line-height: 1.6;
     color: var(--text-light);
     max-width: 80%;
   }
   
  /* Project Card - Index Page Style */
   .projects .project-card {
     background-size: cover;
     background-position: center;
     padding: 30px;
     border-radius: 20px;
     min-height: 350px;
     display: flex;
     flex-direction: column;
     justify-content: flex-end;
     position: relative;
     overflow: hidden;
    transition: all 0.4s ease;
    cursor: pointer;
  }
  
  .projects .project-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.3);
   }
   
   .projects .project-card::before {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(17, 39, 64, 0.9) 100%);
     border-radius: 20px;
     opacity: 1;
    transition: all 0.4s ease;
    z-index: 1;
  }
  
  .projects .project-card::after {
    content: '';
    position: absolute;
    inset: 0;
    background: inherit;
    background-size: cover;
    background-position: center;
    border-radius: 20px;
    transform: scale(1);
    transition: transform 0.6s ease;
    z-index: 0;
  }
  
  .projects .project-card:hover::after {
    transform: scale(1.1);
  }
  
  .projects .project-card:hover::before {
    background: linear-gradient(rgba(0, 0, 0, 0.2) 0%, rgba(17, 39, 64, 0.95) 100%);
  }
  
  .projects .project-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.3);
   }
   
   .projects .project-card h4,
   .projects .project-card h6 {
     position: relative;
    z-index: 2;
    transition: all 0.3s ease;
  }
  
  .projects .project-card:hover h4,
  .projects .project-card:hover h6 {
    transform: translateY(-3px);
   }
   
   .projects .project-card h4 {
     color: var(--primary-color);
     margin-bottom: 10px;
     font-size: 18px;
     font-weight: 600;
     line-height: 1.3;
     font-family: 'Inter Tight', sans-serif;
   }
  
  .projects .project-card:hover h4 {
    color: #ffed4e;
   }
   
   .projects .project-card h6 {
     color: var(--white);
     font-weight: 400;
     font-size: 14px;
     line-height: 1.4;
   }
  
  .projects .project-card:hover h6 {
    color: #f0f0f0;
   }
   
   /* ========================================
      10. SERVICES SECTION
      ======================================== */
   .services {
    padding: 96px 0 192px;
    position: relative;
    overflow: hidden;
  }

  .services .parallax-bg {
    position: absolute;
    top: -10%;
    left: 0;
    width: 100%;
    height: 120%;
     background: linear-gradient(rgba(17, 39, 64, 0.8), rgba(17, 39, 64, 0.8)), 
                url('../images/hero-background.jpg');
     background-size: cover;
     background-position: center;
    background-attachment: fixed;
    will-change: transform;
    z-index: -1;
    transform: translateZ(0);
    backface-visibility: hidden;
  }

  /* Disable parallax on mobile for better performance */
  @media (max-width: 768px) {
    .services .parallax-bg {
      background-attachment: scroll;
      transform: none !important;
    }
   }
   
   /* Services Title */
   .services .services-heading {
     color: var(--white);
     font-size: 47px;
     line-height: 1.1;
     margin-bottom: 10px;
     font-family: 'Inter Tight', sans-serif;
     font-weight: 600;
   }
   
   .services .services-heading-accent {
     color: var(--primary-color);
     font-size: 47px;
     line-height: 1.1;
     margin-bottom: 20px;
     font-family: 'Inter Tight', sans-serif;
     font-weight: 600;
   }
   
   .services .services-description {
     color: var(--white);
     max-width: 60%;
     margin: 20px auto 0;
     font-size: 16px;
     line-height: 1.6;
     text-align: center;
   }
   
   /* Service Card */
   .services .service-card {
     background: rgba(255, 255, 255, 0.1);
     backdrop-filter: blur(10px);
     border: 1px solid rgba(255, 255, 255, 0.2);
     border-radius: 20px;
     padding: 30px;
     display: flex;
     gap: 20px;
     text-align: left;
     transition: all 0.3s ease;
     cursor: pointer;
     user-select: none;
     position: relative;
     overflow: hidden;
     text-decoration: none;
     color: inherit;
   }
   
   .services .service-card:hover {
     text-decoration: none;
     color: inherit;
   }
   
   .services .service-card::before {
     content: '';
     position: absolute;
     top: 0;
     left: -100%;
     width: 100%;
     height: 100%;
     background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
     transition: left 0.6s ease;
   }
   
   .services .service-card:hover::before {
     left: 100%;
   }
   
   .services .service-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
     background: rgba(255, 255, 255, 0.15);
     border-color: var(--primary-color);
   }
   
   .services .service-card:active {
     transform: translateY(-2px) scale(0.98);
     box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
   }
   
   .services .service-card:focus {
     outline: 2px solid var(--primary-color);
     outline-offset: 2px;
   }
   
   .services .service-card.active {
     background: rgba(248, 219, 19, 0.2);
     border-color: var(--primary-color);
     transform: translateY(-5px);
     box-shadow: 0 15px 35px rgba(248, 219, 19, 0.3);
   }
   
   .services .service-card img {
     width: 60px;
     height: 60px;
     flex-shrink: 0;
     align-self: flex-start;
   }
   
   .services .service-content h4 {
     color: var(--primary-color);
     margin-bottom: 10px;
     font-size: 18px;
     font-weight: 600;
     line-height: 1.3;
     font-family: 'Inter Tight', sans-serif;
   }
   
   .services .service-content p {
     color: var(--white);
     margin: 0;
     font-size: 14px;
     line-height: 1.5;
	 display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    position: relative;
   }
   
   /* Service Modal */
   .service-modal {
     display: none;
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: rgba(0, 0, 0, 0.8);
     z-index: 10000;
     align-items: center;
     justify-content: center;
     padding: 20px;
   }
   
   .service-modal-content {
     background: var(--white);
     border-radius: 20px;
     max-width: 500px;
     width: 100%;
     max-height: 80vh;
     overflow-y: auto;
     box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
     animation: modalSlideIn 0.3s ease;
   }
   
   @keyframes modalSlideIn {
     from {
       opacity: 0;
       transform: translateY(-50px) scale(0.9);
     }
     to {
       opacity: 1;
       transform: translateY(0) scale(1);
     }
   }
   
   .service-modal-header {
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 25px 30px 20px;
     border-bottom: 1px solid #eee;
   }
   
   .service-modal-title {
     color: var(--text-dark);
     font-size: 24px;
     font-weight: 600;
     margin: 0;
     font-family: 'Inter Tight', sans-serif;
   }
   
   .service-modal-close {
     background: none;
     border: none;
     font-size: 28px;
     color: #999;
     cursor: pointer;
     padding: 0;
     width: 30px;
     height: 30px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 50%;
     transition: all 0.3s ease;
   }
   
   .service-modal-close:hover {
     background: #f5f5f5;
     color: var(--text-dark);
   }
   
   .service-modal-body {
     padding: 20px 30px 30px;
   }
   
   .service-modal-description {
     color: var(--text-light);
     font-size: 16px;
     line-height: 1.6;
     margin-bottom: 25px;
   }
   
   .service-modal-actions {
     display: flex;
     gap: 15px;
     flex-wrap: wrap;
   }
   
   .service-modal-actions .btn {
     flex: 1;
     min-width: 120px;
     text-align: center;
   }
   
   /* ========================================
      11. TESTIMONIALS SECTION
      ======================================== */
   .testimonials {
     padding: 48px 0;
     margin-top: -60px;
   }
   
   .testimonials .testimonial-card {
     background: var(--primary-color);
     border-radius: 30px;
     padding: 50px;
     box-shadow: 0 10px 20px rgba(0, 0, 0, 0.35);
     width: 100%;
     margin: 0 auto;
   }
   
   /* Testimonials Title */
   .testimonials .testimonials-heading {
     color: var(--text-dark);
     margin-bottom: 10px;
     font-size: 36px;
     line-height: 1.1;
     font-weight: 600;
     font-family: 'Inter Tight', sans-serif;
   }
   
   .testimonials .testimonials-heading-accent {
     color: var(--text-dark);
     margin-bottom: 30px;
     font-size: 36px;
     line-height: 1.1;
     font-weight: 600;
     font-family: 'Inter Tight', sans-serif;
   }
   
   /* Testimonial Slider */
   .testimonials .testimonial-slider {
     margin-top: 20px;
     position: relative;
     overflow: hidden;
     height: 200px;
   }
   
   .testimonials .testimonial-item {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     opacity: 0;
     transform: translateX(100%);
     transition: all 0.5s ease-in-out;
   }
   
   .testimonials .testimonial-item.active {
     opacity: 1;
     transform: translateX(0);
   }
   
   .testimonials .testimonial-text {
     font-size: 16px;
     font-weight: 400;
     color: var(--text-dark);
     line-height: 1.6;
     margin-bottom: 30px;
   }
   
   .testimonials .testimonial-author {
     display: flex;
     align-items: center;
     gap: 15px;
   }
   
   .testimonials .testimonial-author img {
     width: 60px;
     height: 60px;
     border-radius: 50%;
     object-fit: cover;
   }
   
   .testimonials .testimonial-author strong {
     display: block;
     color: var(--text-dark);
     font-size: 18px;
     font-weight: 600;
     margin-bottom: 5px;
   }
   
   .testimonials .testimonial-author span {
     font-size: 14px;
     color: var(--text-light);
   }
   
   /* Testimonial Center */
   .testimonials .testimonial-center img {
     width: 100%;
     height: 400px;
     object-fit: cover;
     border-radius: 20px;
   }
   
   /* Testimonial Right */
   .testimonials .testimonial-stat .stat-number {
     font-size: 72px;
     color: var(--text-dark);
     margin-bottom: 10px;
     font-weight: 700;
     line-height: 1;
     font-family: 'Inter Tight', sans-serif;
   }
   
   .testimonials .testimonial-stat .stat-label {
     font-size: 18px;
     font-weight: 600;
     color: var(--text-dark);
     display: block;
     margin-bottom: 10px;
   }
   
   .testimonials .testimonial-stat h6 {
     color: var(--text-dark);
     margin-bottom: 20px;
     font-size: 14px;
     font-weight: 400;
   }
   
   .testimonials .testimonial-avatars img {
     width: 40px;
     height: 40px;
     border-radius: 50%;
     border: 2px solid var(--text-dark);
   }
   
   .testimonials .testimonial-video .video-thumbnail {
     position: relative;
     border-radius: 15px;
     overflow: hidden;
   }
   
   .testimonials .testimonial-video .video-thumbnail img {
     width: 100%;
     height: 120px;
     object-fit: cover;
   }
   
   .testimonials .testimonial-video .play-button {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     cursor: pointer;
   }
   
   .testimonials .testimonial-video .play-button img {
     width: 60px;
     height: 60px;
     opacity: 0.9;
   }
   
   /* ========================================
      12. PARTNERS SECTION
      ======================================== */
   .partners {
     padding: 48px 0;
    overflow: hidden;
   }
   
   .partners .partners-description {
     max-width: 50%;
     margin: 0 auto 30px;
     font-size: 16px;
     line-height: 1.6;
     color: var(--text-light);
   }
   
  .partners-carousel {
    overflow: hidden;
    position: relative;
  }
  
  .partners-track {
    display: flex;
    animation: scroll 20s linear infinite;
    width: calc(200% + 20px);
  }
  
  .partners-track:hover {
    animation-play-state: paused;
  }
  
  .partner-item {
    flex: 0 0 auto;
    width: 150px;
    height: 80px;
    margin-right: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .partner-item img {
     width: 100%;
    height: 100%;
    object-fit: contain;
     opacity: 0.7;
     transition: opacity 0.3s ease;
   }
   
  .partner-item img:hover {
     opacity: 1;
   }
  
  @keyframes scroll {
    0% {
      transform: translateX(0);
    }
    100% {
      transform: translateX(-50%);
    }
   }
   
   /* ========================================
      13. STATS SECTION
      ======================================== */
   .stats {
     padding: 96px 0;
   }
   
   /* Stats Title */
   .stats .stats-heading {
     font-size: 47px;
     line-height: 1.1;
     color: var(--text-dark);
     margin-bottom: 10px;
     font-family: 'Inter Tight', sans-serif;
     font-weight: 600;
   }
   
   .stats .stats-heading-accent {
     font-size: 47px;
     line-height: 1.1;
     color: var(--primary-color);
     margin-bottom: 30px;
     font-family: 'Inter Tight', sans-serif;
     font-weight: 600;
   }
   
   .stats .stats-description {
     margin-bottom: 30px;
     font-size: 16px;
     line-height: 1.6;
     color: var(--text-light);
   }
   
   /* Stats Progress */
   .stats .progress-item {
     margin-bottom: 30px;
   }
   
   .stats .progress-item span {
     display: block;
     font-size: 17px;
     font-weight: 600;
     color: var(--text-dark);
     letter-spacing: -0.5px;
     margin-bottom: 15px;
   }
   
   .stats .progress-bar {
     background: var(--secondary-color);
     height: 15px;
     border-radius: 5px;
     position: relative;
     overflow: hidden;
   }
   
   /* Animated Progress Bar */
   .stats .animated-progress {
     background: #e0e0e0;
     width: 100% !important;
     transition: width 2s ease-in-out;
     position: relative;
     overflow: hidden;
   }
   
   /* Moving completion bar */
   .stats .animated-progress::before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     height: 100%;
     width: 0%;
     background: linear-gradient(90deg, var(--primary-color) 0%, #ffed4e 100%);
     transition: width 2s ease-in-out;
   }
   
   /* Moving blue completion indicator */
   .stats .animated-progress::after {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     height: 100%;
     width: 4px;
     background: #007bff;
     box-shadow: 0 0 8px rgba(0, 123, 255, 0.6);
     transform: translateX(-100%);
     transition: transform 2s ease-in-out;
     z-index: 2;
   }
   
   /* When progress bar is filled, show the moving bar */
   .stats .animated-progress.animate-complete::before {
     width: var(--progress-width, 0%);
   }
   
   .stats .animated-progress.animate-complete::after {
     transform: translateX(calc(var(--progress-width, 0%) - 4px));
   }
   
   @keyframes shimmer {
     0% {
       transform: translateX(-100%);
     }
     100% {
       transform: translateX(100%);
     }
   }
   
   /* Progress Percentage Animation */
   .stats .progress-percentage {
     font-weight: 600;
     color: var(--text-dark);
     transition: all 0.3s ease;
   }
   
   /* Stats Images */
   .stats .stats-images {
     position: relative;
   }
   
   .stats .stats-img-main {
     width: 85%;
     height: 650px;
     object-fit: cover;
     border-radius: 25px;
     margin-left: auto;
   }
   
   .stats .stats-img-small {
     position: absolute;
     bottom: 10%;
     left: 0;
     width: 40%;
     height: 305px;
     object-fit: cover;
     border-radius: 25px;
     border: 10px solid var(--white);
   }
   
   .stats .stats-badge {
     position: absolute;
     bottom: 100px;
     left: 50%;
     transform: translateX(-50%);
     background: var(--primary-color);
     padding: 20px;
     border-radius: 25px;
     text-align: center;
     width: 28%;
   }
   
   .stats .badge-number {
     font-family: 'Inter Tight', sans-serif;
     font-size: 42px;
     font-weight: 700;
     color: var(--text-dark);
     letter-spacing: -1px;
     line-height: 1;
     margin-bottom: 8px;
   }
   
   .stats .badge-text {
     font-size: 14px;
     font-weight: 600;
     color: var(--text-dark);
     letter-spacing: -0.5px;
     line-height: 1.3;
   }
   
   /* ========================================
      14. BLOG SECTION
      ======================================== */
   .blog {
     padding: 96px 0;
     background: var(--white);
   }
   
   /* Blog Title */
   .blog .blog-heading {
     font-size: 47px;
     line-height: 1.1;
     color: var(--text-dark);
     margin-bottom: 10px;
     font-family: 'Inter Tight', sans-serif;
     font-weight: 600;
   }
   
   .blog .blog-heading-accent {
     font-size: 47px;
     line-height: 1.1;
     color: var(--primary-color);
     margin-bottom: 20px;
     font-family: 'Inter Tight', sans-serif;
     font-weight: 600;
   }
   
   .blog .blog-description {
     max-width: 60%;
     margin: 20px auto 0;
     font-size: 16px;
     line-height: 1.6;
     color: var(--text-light);
   }
   
   /* Blog Card */
   .blog .blog-card {
     background: var(--white);
     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;
   }
   
   .blog .blog-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
   }
   
   .blog .blog-image {
     position: relative;
     aspect-ratio: 16/9;
     overflow: hidden;
   }
   
   .blog .blog-image img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: transform 0.3s ease;
   }
   
   .blog .blog-card:hover .blog-image img {
     transform: scale(1.05);
   }
   
   .blog .blog-date {
     position: absolute;
     bottom: 20px;
     left: 20px;
     background: var(--secondary-color);
     color: var(--white);
     width: 60px;
     height: 60px;
     border-radius: 12px;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     font-size: 14px;
     z-index: 2;
   }
   
   .blog .blog-date strong {
     font-size: 18px;
     font-weight: 700;
     display: block;
     line-height: 1;
   }
   
   .blog .blog-date span {
     font-size: 12px;
     font-weight: 500;
     margin-top: 2px;
   }
   
   .blog .blog-content {
     padding: 30px;
   }
   
   .blog .blog-meta {
     display: flex;
     gap: 15px;
     color: var(--text-light);
     font-size: 13px;
     margin-bottom: 15px;
     align-items: center;
   }
   
   .blog .blog-meta span:first-child {
     background: var(--secondary-color);
     color: var(--white);
     padding: 4px 8px;
     border-radius: 4px;
     font-size: 11px;
     font-weight: 500;
   }
   
   .blog .blog-content h4 {
     margin-bottom: 15px;
     font-size: 20px;
     font-weight: 600;
     line-height: 1.3;
     color: var(--text-dark);
     font-family: 'Inter Tight', sans-serif;
	       display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    position: relative;
   }
   
   .blog .blog-content p {
     margin-bottom: 20px;
     font-size: 14px;
     line-height: 1.6;
     color: var(--text-light);
	  display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    position: relative;
   }
   
   /* ========================================
      15. CONTACT SECTION
      ======================================== */
   .contact {
     padding: 80px 0;
     background: #ffffff;
   }
   
   /* Contact Form */
   .contact .contact-form form {
     background: #1a1a2e;
     padding: 50px;
     border-radius: 20px;
     box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
   }
   
   .contact .contact-form .form-label {
     color: #ffffff;
     font-weight: 600;
     margin-bottom: 10px;
     font-size: 16px;
   }
   
   .contact .contact-form .form-control {
     background: #2d2d44;
     border: 1px solid #3d3d5c;
     border-radius: 10px;
     padding: 15px 20px;
     color: #ffffff;
     font-size: 16px;
     margin-bottom: 20px;
   }
   
   .contact .contact-form .form-control:focus {
     background: #2d2d44;
     border-color: #ffd700;
     box-shadow: 0 0 0 0.2rem rgba(255, 215, 0, 0.25);
     color: #ffffff;
   }
   
   .contact .contact-form .form-control::placeholder {
     color: #a0a0a0;
     font-size: 14px;
   }
   
   .contact .contact-form .btn-primary {
     background: var(--primary-color);
     border: none;
     color: #1a1a2e;
     font-weight: 700;
     padding: 15px 40px;
     border-radius: 10px;
     font-size: 16px;
     transition: all 0.3s ease;
   }
   
   .contact .contact-form .btn-primary:hover {
     background: #ffed4e;
     transform: translateY(-2px);
     box-shadow: 0 5px 15px rgba(255, 215, 0, 0.3);
   }
   
   /* Contact Info */
   .contact .contact-heading {
     font-size: 3rem;
     font-weight: 700;
     color: #1a1a2e;
     margin-bottom: 0;
     line-height: 1.2;
     font-family: 'Inter Tight', sans-serif;
   }
   
   .contact .contact-heading-accent {
     font-size: 3rem;
     font-weight: 700;
     color: var(--primary-color);
     margin-bottom: 20px;
     line-height: 1.2;
     font-family: 'Inter Tight', sans-serif;
   }
   
   .contact .contact-description {
     color: #666;
     font-size: 16px;
     line-height: 1.6;
     margin-bottom: 40px;
   }
   
   .contact .contact-item {
     display: flex;
     align-items: flex-start;
     gap: 15px;
     margin-bottom: 30px;
   }
   
   .contact .contact-icon {
     width: 50px;
     height: 50px;
     background: #1a1a2e;
     border-radius: 12px;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
   }
   
   .contact .contact-icon i {
     color: #ffd700;
     font-size: 20px;
   }
   
   .contact .contact-item h5 {
     color: #1a1a2e;
     font-weight: 600;
     font-size: 18px;
     margin-bottom: 5px;
   }
   
   .contact .contact-item p {
     color: #666;
     font-size: 14px;
     margin-bottom: 0;
   }
   
   /* ========================================
      16. CTA SECTION
      ======================================== */
   .cta-section {
     background: linear-gradient(90deg, var(--secondary-color) 0%, var(--secondary-color) 66%, var(--primary-color) 66%, var(--primary-color) 100%);
/*      padding: 80px 0; */
     position: relative;
   }
.cta-section:before{
	content: '';
	position: absolute;
	width: 380px;
	height: 100%;
	background: var(--primary-color);
	right: 0;
	top: 0;
}
   .cta-section .container {
     position: relative;
     z-index: 2;
   }
   
   .cta-content {
     padding-right: 40px;
   }
   
   .cta-title {
     color: var(--white);
     font-size: 48px;
     font-weight: 700;
     line-height: 1.2;
     margin-bottom: 15px;
     font-family: 'Inter Tight', sans-serif;
   }
   
   .cta-subtitle {
     color: var(--primary-color);
    
     font-weight: 600;
     line-height: 1.2;
     margin-bottom: 40px;
     font-family: 'Inter Tight', sans-serif;
   }
@media screen and (min-width:991px){
	.cta-subtitle {
		font-size: 47px;
	}
}
   .cta-actions {
     display: flex;
     align-items: center;
     gap: 30px;
     flex-wrap: wrap;
   }
   
/*    .cta-contact {
     background: rgba(255, 255, 255, 0.1);
     padding: 15px 20px;
     border-radius: 10px;
     backdrop-filter: blur(10px);
   } */
   
   .cta-contact .contact-icon {
     background: var(--primary-color);
     border-radius: 50%;
     padding: 8px;
     width: 45px;
     height: 45px;
     display: flex;
     align-items: center;
     justify-content: center;
   }
   
   .cta-contact .contact-icon i {
     color: var(--text-dark);
     font-size: 18px;
   }
   
   .cta-contact h5 {
     color: var(--primary-color);
     margin-bottom: 5px;
     font-size: 16px;
     font-weight: 600;
   }
   
   .cta-contact p {
     color: var(--text-dark);
     font-size: 17px;
     font-weight: 600;
     letter-spacing: -0.5px;
     margin: 0;
   }
   
   .cta-image {
     position: relative;
     height: 100%;
     display: flex;
     align-items: center;
     justify-content: center;
   }
   
   .cta-image img {
     max-height: 600px;
     width: auto;
     object-fit: cover;
     border-radius: 20px;
    
   }
.cta-section .cta-actions .btn-primary:hover{
	color: #fff;
	border: 1px solid #fff;
}
   /* ========================================
      17. FOOTER SECTION
      ======================================== */
   .footer {
     background: var(--secondary-color);
     padding: 80px 0 30px;
     color: var(--white);
   }
   
   .footer-brand {
     margin-bottom: 30px;
   }
   
   .footer-logo .logo-text {
     font-size: 36px;
     font-weight: 700;
     color: var(--white);
     margin-bottom: 5px;
     font-family: 'Inter Tight', sans-serif;
   }
   
   .footer-logo .logo-accent {
     color: var(--primary-color);
     font-size: 40px;
   }
   
   .footer-logo .logo-subtitle {
     color: var(--white);
     font-size: 14px;
     font-weight: 500;
     margin: 0;
   }
   
   .footer-description {
     color: #a0a0a0;
     font-size: 14px;
     line-height: 1.6;
     margin-bottom: 0;
   }
   
   .social-links {
     display: flex;
     gap: 15px;
   }
   
   .social-link {
     width: 40px;
     height: 40px;
     background: var(--primary-color);
     border-radius: 8px;
     display: flex;
     align-items: center;
     justify-content: center;
     color: var(--text-dark);
     font-size: 18px;
     transition: all 0.3s ease;
   }
   
   .social-link:hover {
     background: #ffed4e;
     transform: translateY(-2px);
     color: var(--text-dark);
   }
   
   .footer-heading {
     color: var(--white);
     font-size: 18px;
     font-weight: 600;
     margin-bottom: 25px;
     font-family: 'Inter Tight', sans-serif;
   }
   
   .footer-list {
     list-style: none;
     padding: 0;
     margin: 0;
   }
   
   .footer-list li {
     margin-bottom: 12px;
   }
   
   .footer-list a {
     color: #a0a0a0;
     text-decoration: none;
     font-size: 14px;
     display: flex;
     align-items: center;
     transition: color 0.3s ease;
   }
   
   .footer-list a:hover {
     color: var(--primary-color);
   }
   
   .footer-list i {
     color: var(--primary-color);
     margin-right: 8px;
     font-size: 12px;
   }
   
   .footer-contact .contact-item {
     margin-bottom: 20px;
   }
   
   .footer-contact .contact-icon {
     width: 20px;
     height: 20px;
     background: var(--primary-color);
     border-radius: 4px;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-shrink: 0;
   }
   
   .footer-contact .contact-icon i {
     color: var(--text-dark);
     font-size: 12px;
   }
   
   .footer-contact p {
     color: #a0a0a0;
     font-size: 14px;
     margin: 0;
   }
   
   .footer-divider {
     height: 2px;
     background: var(--primary-color);
     margin: 40px 0 20px;
   }
   
   .footer-bottom {
     text-align: center;
   }
   
   .copyright {
     color: #a0a0a0;
     font-size: 14px;
   }
   
   /* ========================================
      18. INNER PAGES STYLES
      ======================================== */
   
   /* Page Hero Section */
   .page-hero {
     background: linear-gradient(90deg, rgba(17, 39, 64, 0.9) 0%, rgba(0, 0, 0, 0.4) 100%), 
                 url('../images/hero-background.jpg');
     background-size: cover;
     background-position: center;
     padding: 120px 0 80px;
     color: var(--white);
   }
   
   .page-hero-title {
     font-size: 48px;
     font-weight: 700;
     margin-bottom: 20px;
     line-height: 1.2;
   }
   
   .page-hero-accent {
     color: var(--primary-color);
   }
   
   .page-hero-description {
     font-size: 18px;
     margin-bottom: 0;
     opacity: 0.9;
   }
   
   .page-hero-image img {
     border-radius: 15px;
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
   }
   
   /* Mission & Vision Section */
   .mission-vision {
     padding: 80px 0;
     background: #f8f9fa;
   }
   
   .mission-card, .vision-card {
     background: var(--white);
     padding: 40px;
     border-radius: 15px;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
     text-align: center;
     height: 100%;
   }
   
   .mission-icon, .vision-icon {
     width: 80px;
     height: 80px;
     margin: 0 auto 20px;
     display: flex;
     align-items: center;
     justify-content: center;
     background: var(--primary-color);
     border-radius: 50%;
   }
   
   .mission-title, .vision-title {
     font-size: 24px;
     font-weight: 600;
     margin-bottom: 15px;
     color: var(--text-dark);
   }
   
   .mission-description, .vision-description {
     color: #666;
     line-height: 1.6;
     margin: 0;
   }
   
   /* Team Section */
   .team {
     padding: 80px 0;
     background: var(--white);
   }
   
   .team-heading {
     color: var(--text-dark);
     font-size: 42px;
     font-weight: 700;
     margin-bottom: 10px;
   }
   
   .team-heading-accent {
     color: var(--primary-color);
   }
   
   .team-description {
     color: #666;
     font-size: 16px;
     margin-bottom: 0;
   }
   
   .team-card {
     background: var(--white);
     border-radius: 15px;
     overflow: hidden;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
     transition: transform 0.3s ease;
   }
   
   .team-card:hover {
     transform: translateY(-5px);
   }
   
   .team-image {
     height: 250px;
     overflow: hidden;
   }
   
   .team-image img {
     width: 100%;
     height: 100%;
     object-fit: cover;
   }
   
   .team-content {
     padding: 30px;
   }
   
   .team-name {
     font-size: 20px;
     font-weight: 600;
     margin-bottom: 5px;
     color: var(--text-dark);
   }
   
   .team-position {
     color: var(--primary-color);
     font-weight: 500;
     margin-bottom: 15px;
   }
   
   .team-bio {
     color: #666;
     font-size: 14px;
     line-height: 1.5;
     margin: 0;
   }
   
   /* Contact Form Styles */
   .contact-form-section {
     background: var(--white);
     padding: 40px;
     border-radius: 15px;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
   }
   
   .contact-form .form-label {
     font-weight: 600;
     color: var(--text-dark);
     margin-bottom: 8px;
   }
   
   .contact-form .form-control, .contact-form .form-select {
     border: 2px solid #e9ecef;
     border-radius: 8px;
     padding: 12px 15px;
     transition: border-color 0.3s ease;
   }
   
   .contact-form .form-control:focus, .contact-form .form-select:focus {
     border-color: var(--primary-color);
     box-shadow: 0 0 0 0.2rem rgba(248, 219, 19, 0.25);
   }
   
   .contact-info-section {
     position: sticky;
     top: 100px;
   }
   
   .contact-info-card {
     background: var(--white);
     padding: 40px;
     border-radius: 15px;
     box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
     margin-bottom: 30px;
   }
   
   .contact-info-title {
     font-size: 24px;
     font-weight: 600;
     margin-bottom: 30px;
     color: var(--text-dark);
   }
   
   .contact-item {
     display: flex;
     align-items: flex-start;
     margin-bottom: 25px;
   }
   
   .contact-item .contact-icon {
     width: 50px;
     height: 50px;
     background: var(--primary-color);
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-right: 15px;
     flex-shrink: 0;
   }
   
   .contact-item .contact-icon i {
     color: var(--text-dark);
     font-size: 18px;
   }
   
   .contact-details h5 {
     font-size: 16px;
     font-weight: 600;
     margin-bottom: 5px;
     color: var(--text-dark);
   }
   
   .contact-details p {
     color: #666;
     margin: 0;
     line-height: 1.5;
   }
   
   .emergency-contact {
     background: linear-gradient(135deg, var(--primary-color), #e6c200);
     padding: 30px;
     border-radius: 15px;
     text-align: center;
     color: var(--text-dark);
   }
   
   .emergency-title {
     font-size: 20px;
     font-weight: 600;
     margin-bottom: 10px;
   }
   
   .emergency-description {
     margin-bottom: 20px;
     opacity: 0.9;
   }
   
   /* Map Section */
   .map-section {
     padding: 0;
   }
   
   .map-container {
     width: 100%;
     height: 400px;
   }
   
   .map-container iframe {
     width: 100%;
     height: 100%;
     border: none;
   }
   
   /* Projects Filter */
   .projects-filter {
     padding: 40px 0;
     background: #f8f9fa;
   }
   
   .filter-buttons {
     display: flex;
     justify-content: center;
     gap: 15px;
     flex-wrap: wrap;
   }
   
   .filter-btn {
     background: var(--white);
     border: 2px solid #e9ecef;
     color: var(--text-dark);
     padding: 10px 25px;
     border-radius: 25px;
     font-weight: 500;
     transition: all 0.3s ease;
     cursor: pointer;
   }
   
  .filter-btn:hover, .filter-btn.active {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: var(--text-dark);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(248, 219, 19, 0.3);
  }
  
  .filter-btn {
    transition: all 0.3s ease;
  }
  
  .filter-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  }
   
   
   
   /* ========================================
      19. RESPONSIVE STYLES
      ======================================== */
   @media (max-width: 768px) {
     /* Hero Section Mobile */
     .hero .hero-title {
       font-size: 34px;
     }
	   .hero .hero-title-accent {
    white-space: unset;
}


   
     .hero .hero-video {
       margin-top: 0;
     }
   
     .hero .hero-stats {
/*        flex-direction: column; */
       gap: 30px;
       align-items: center;
       margin-top: 30px;
     }
   
     .hero .stat-card {
       text-align: center;
     }
   
     .hero .stat-number {
       font-size: 48px;
     }
   
    
   
     /* Projects Section Mobile */
     .projects .projects-heading,
     .projects .projects-heading-accent {
       font-size: 36px;
     }
   
     .projects .projects-description {
       max-width: 100%;
     }
   
     .projects .project-card {
       min-height: 250px;
       padding: 20px;
     }
   
     .projects .project-card h4 {
       font-size: 16px;
     }
   
     .projects .project-card h6 {
       font-size: 13px;
     }
   
     /* Services Section Mobile */
     .services .services-heading,
     .services .services-heading-accent {
       font-size: 36px;
     }
   
     .services .services-description {
       max-width: 100%;
     }
   
     .services .service-card {
       padding: 20px;
     }
   
     .services .service-card img {
       width: 50px;
       height: 50px;
     }
   
     .services .service-content h4 {
       font-size: 16px;
     }
   
     .services .service-content p {
       font-size: 13px;
     }
   
     /* Testimonials Section Mobile */
     .testimonials .testimonial-card {
       padding: 30px;
     }
   
     .testimonials .testimonials-heading,
     .testimonials .testimonials-heading-accent {
       font-size: 36px;
     }
   
     .testimonials .testimonial-center img {
       height: 250px;
     }
   
     .testimonials .testimonial-stat .stat-number {
       font-size: 56px;
     }
   
     /* Partners Section Mobile */
     .partners .partners-description {
       max-width: 100%;
     }
    
    .partner-item {
      width: 120px;
      height: 60px;
      margin-right: 30px;
    }
    
    .partners-track {
      animation-duration: 15s;
    }
   
     /* Stats Section Mobile */
     .stats .stats-heading,
     .stats .stats-heading-accent {
       font-size: 36px;
     }
   
     .stats .stats-img-main {
       width: 100%;
       height: 320px;
     }
   
     .stats .stats-img-small {
       width: 65%;
       height: 215px;
       bottom: 100px;
     }
   
     .stats .stats-badge {
       width: 45%;
       bottom: 0;
     }
   
     /* Blog Section Mobile */
     .blog .blog-heading,
     .blog .blog-heading-accent {
       font-size: 36px;
     }
   
     .blog .blog-description {
       max-width: 100%;
     }
   
     .blog .blog-content {
       padding: 20px;
     }
   
     .blog .blog-content h4 {
       font-size: 18px;
     }
   
     /* Contact Section Mobile */
     .contact .contact-heading,
     .contact .contact-heading-accent {
       font-size: 2rem;
     }
   
     /* CTA Section Mobile */
     .cta-section {
       background: var(--secondary-color);
       padding: 60px 0;
     }
   
     .cta-content {
       padding-right: 0;
       margin-bottom: 40px;
     }
   
     .cta-title {
       font-size: 32px;
     }
   
     .cta-subtitle {
       font-size: 24px;
     }
   
     .cta-actions {
       flex-direction: column;
       align-items: flex-start;
       gap: 20px;
     }
   
     .cta-image img {
       max-height: 400px;
     }
   
     /* Footer Section Mobile */
     .footer {
       padding: 60px 0 30px;
     }
   
     .footer-logo .logo-text {
       font-size: 28px;
     }
   
     .footer-logo .logo-accent {
       font-size: 32px;
     }
   
     .social-links {
       justify-content: center;
       margin-top: 20px;
     }
   
     .footer-heading {
       font-size: 16px;
       margin-bottom: 20px;
     }
   
     .footer-list a {
       font-size: 13px;
     }
   
     .footer-contact .contact-item {
       margin-bottom: 15px;
     }
   
     .footer-contact p {
       font-size: 13px;
     }
   }

/* Addtional CSS */
.services .services-wrapper .slick-dots li button{
	font-size: 0 !important;
	
}
.services .services-wrapper .slick-dots{
	font-size: 0;
	display: flex;
	justify-content: center;
	margin-top: 20px;
}
.services .services-wrapper .slick-dots li button{
	width: 15px;
	height: 15px;
	margin: 0 15px;
	border: 1px solid var(--primary-color) !important;
	border: none;
	border-radius: 50px;
}
.services .services-wrapper .slick-active button{
	background: var(--primary-color);
}


/* homepage contact form section */
.contact .contact-form label,
.contact .contact-form legend{
	color: #fff !important;
}
.wpforms-submit{
	background: var(--primary-color) !important;
	width: 100% !important;
	padding: 15px 35px !important;
	border-radius: 10px !important;
}


/*-----------------------------------
    Page Banner CSS
------------------------------------*/
.page-banner{
	height: 50vh !important;
}
.page-banner h1{
    color: var(--primary-color);
}
.page-banner .breadcrumb{
	margin-bottom: 0 !important;
	padding: 15px 0;
}
@media screen and (min-width:991px){
    .page-banner h1{
        font-size: 48px;
    }
}
.page-banner .breadcrumb li a {
    color: #fff;
}
.page-banner .breadcrumb li{
    color: #fff;
}



/*================================
 <-- Single Service -->
==================================*/ 
.single-service .single-service-sidebar h3,
.single-service .single-service-sidebar-contacts h3{
	color: var(--primary-color);
	position: relative;
	margin-bottom: 30px;
	text-transform: capitalize;
	padding-bottom: 15px;
}
.single-service .single-service-sidebar h3:before,
.single-service .single-service-sidebar-contacts h3:before{
	content: '';
	position: absolute;
	width: 100%;
	height: 2px;
	background: var(--primary-color);
	top: 100%;
}
.single-service .single-service-sidebar ul{
	list-style: none;
	padding-left: 0;
/* 	border: 1px solid #d7d7d7; */
	}
.single-service .single-service-sidebar ul{
	background: #F6F6F6;
}
.single-service .single-service-sidebar ul li a{
/* 	background: #f5f5f5; */
	color: var(--text-white);
	padding: 18px 30px;
	text-transform: capitalize;
	font-weight: 500;
/* 	border-bottom: 1px solid #d7d7d7; */
	position: relative;
	z-index: 9999 !important;
	display: block;
	transition: all .5s ease-in-out;
    margin: 10px 0;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
}
.single-service .single-service-sidebar ul li a:before{
	content: '';
	position: absolute;
	width: 0%;
	height: 100%;
	left: 50%;
	top: 0;
	background: var(--primary-color);
	transition: all .5s ease-in-out;
	z-index: -1;
	
}
.single-service .single-service-sidebar ul .current-menu-item a{
	
	background: var(--primary-color);
	transition: all .5s ease-in-out;
	z-index: 1;
	color: #fff;
}
.single-service .single-service-sidebar ul li:hover a:before{
	width: 100%;
	left: 0;
	border-left: 4px solid #000;
}
.single-service .single-service-sidebar ul li:hover a{
	color: #fff;
}
.single-service .single-service-sidebar ul li a:after{
	content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 32 32'%3E%3Cpath fill='none' stroke='%232C4A28' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m22 6l8 10l-8 10m8-10H2'/%3E%3C/svg%3E");
	position: absolute;
	right: 20px;
}

.single-service .single-service-sidebar-contacts .single-service-sidebar-info svg{
	width: 44px;
	height: 45px;
	color: var(--primary-color);
}
.single-service .single-service-sidebar-contacts .single-service-sidebar-info a{
	color: #777;
	transition: all .5s ease-in-out;
}
.single-service .single-service-sidebar-contacts .single-service-sidebar-info a:hover{
	color: var(--primary-color);
}
.single-service .single-service-content-img img{
	border-radius: 5px;
}
.single-service .single-service-sidebar-contacts .single-service-sidebar-info h4{
	font-size: 18px;

}
.single-service .single-service-content-img{
	position: relative;
	overflow: hidden;
	
}
/* .single-service .single-service-content-img:before{
	content: '';
	position: absolute;
	width: 0;
	height: 100%;
	background: linear-gradient(rgba(180, 16, 23, 0.5),rgba(180, 16, 23, 0.5));
	transition: all .5s ease-in-out;
	border-radius: 10px;
} */
.single-service .col-md-8:hover .single-service-content-img:before{
	width: 100%;
}
	.single-service .single-service-content-img img{
		width: 100%;
		height: 450px;
		object-fit: cover;
		border-radius: 10px;
        border: 8px solid var(--primary-color);
	}
@media screen and (min-width:991px){
	.single-service .single-service-content-img img{
		width: 100%;
		height: 450px;
		object-fit: cover;
	}
}
.single-service .single-service-content p{
	color: #777;
	line-height: 1.5;
	text-align: justify;
}
.single-service .single-service-content h2,
.single-service .single-service-content h3,
.single-service .single-service-content h4{
	color: var(--primary-color);
}
.single-service .single-service-content ul li,
.single-service .single-service-content ol li{
	color:  #777;
}.single-service .single-service-content ul {
	list-style: none;
	padding-left: 0;
}
.single-service .single-service-content ul li:before{
	content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1.5em' height='1.5em' viewBox='0 0 256 256'%3E%3Cpath fill='%232c4a28' d='M225.86 102.82c-3.77-3.94-7.67-8-9.14-11.57c-1.36-3.27-1.44-8.69-1.52-13.94c-.15-9.76-.31-20.82-8-28.51s-18.75-7.85-28.51-8c-5.25-.08-10.67-.16-13.94-1.52c-3.56-1.47-7.63-5.37-11.57-9.14C146.28 23.51 138.44 16 128 16s-18.27 7.51-25.18 14.14c-3.94 3.77-8 7.67-11.57 9.14c-3.25 1.36-8.69 1.44-13.94 1.52c-9.76.15-20.82.31-28.51 8s-7.8 18.75-8 28.51c-.08 5.25-.16 10.67-1.52 13.94c-1.47 3.56-5.37 7.63-9.14 11.57C23.51 109.72 16 117.56 16 128s7.51 18.27 14.14 25.18c3.77 3.94 7.67 8 9.14 11.57c1.36 3.27 1.44 8.69 1.52 13.94c.15 9.76.31 20.82 8 28.51s18.75 7.85 28.51 8c5.25.08 10.67.16 13.94 1.52c3.56 1.47 7.63 5.37 11.57 9.14c6.9 6.63 14.74 14.14 25.18 14.14s18.27-7.51 25.18-14.14c3.94-3.77 8-7.67 11.57-9.14c3.27-1.36 8.69-1.44 13.94-1.52c9.76-.15 20.82-.31 28.51-8s7.85-18.75 8-28.51c.08-5.25.16-10.67 1.52-13.94c1.47-3.56 5.37-7.63 9.14-11.57c6.63-6.9 14.14-14.74 14.14-25.18s-7.51-18.27-14.14-25.18m-52.2 6.84l-56 56a8 8 0 0 1-11.32 0l-24-24a8 8 0 0 1 11.32-11.32L112 148.69l50.34-50.35a8 8 0 0 1 11.32 11.32'/%3E%3C/svg%3E");
	position: relative;
	top: 6px;
	margin-right: 5px;
}
/*-----------------------------------
      contact section style
------------------------------------*/
.services-contact-section{
    background: #f3f3f3;
}
.services-contact-section h3{
	 
}
.services-contact-section .contact-section-content p{
    font-size: 13px;
    line-height: 23px;
    color: #7F7F7F;
}
.services-contact-section .contact-section-form{
    background: var(--primary-color);
    position: relative;
/*     transform: translateY(-29px); */
    /* margin-bottom: -50px; */
	border-radius: 10px;
}
.services-contact-section .contact-section-form:before{
    top: 0;
    left: -25px;
    width: 25.63px;
    height: 29px;
    position: absolute;
    content: "";
    /* background: var(--primary-color); */
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
    transition: all .5s ease-in-out;
    z-index: 1;
}

.services-contact-section .contact-section-form input,
.services-contact-section .contact-section-form select{
    height: 40px;
    border-radius: 3px;
    color: var(--primary-color);
}

.services-contact-section .contact-section-form input::placeholder{
    color: #9E9E9E;
    font-size: 16px;
	
}
.services-contact-section .contact-section-form select{
    color: #9E9E9E;

    font-size: 13px;
}
.services-contact-section .contact-section-form input:focus{
    box-shadow: none;
}
.services-contact-section .contact-section-form .theme-btn {
    cursor: pointer;
    position: relative;
    padding: 10px 24px;
    color: var(--primary-color);
    border: 2px solid rgb(255, 255, 255);
    border-radius: 34px;
    background-color: #fff;
    transition: all 0.3s cubic-bezier(0.23, 1, 0.320, 1);
    overflow: hidden;
    font-size: 15px;
    border-radius: 4px;

  }
  @media screen and (min-width:991px){
  .sticky2 {
    position: fixed !important;
	background: #fff;
    width: 400px;
    top: 5%;
    z-index: 10;
   transition: all .5s ease-in-out;
   box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
   padding: 10px;
	  left: 5%;
  }
  }
  #sidebar-service.sticky2{
   opacity: 1;
  
  }
#sidebar-service {
  position: sticky;
  top: 100px;         /* adjust for your header height */
  transition: top 0.3s ease; /* smooth feel when snapping */
}



/*================================
 <-- Single Blog -->
==================================*/
.single-blog .single-blog-img {
	margin-bottom: 20px;
}
@media screen and (min-width:991px){
	.single-blog .single-blog-img img{
		width: 100% !important;
	height: 398.13px;
		object-fit: cover;
}
}
.single-blog .single-blog-img-content{
	border-left: 2px solid var(--primary-color);
	padding-left: 15px;
	
}
.single-blog .single-blog-img-content span,
.single-blog .single-blog-img-content span a{
	color: var(--primary-color);
}
.single-blog .single-blog-img-content span{
	margin-bottom: 5px;
}
.single-blog .single-blog-img-content p{
	color: var(--secondary-color);
	font-weight: 500;
}
.single-blog .single-blog-title h2{
	color: var(--primary-color);
	font-weight: 700;
}
@media screen and (min-width:991px){
	.single-blog .single-blog-title h2{
		font-size: 35px;
	}
}
.single-blog .single-blog-content p{
	color: #565969;
	line-height: 1.7;
	font-size: 17px;
	text-align: justify;
}
.single-blog-sidebar-wrapper {
	margin-bottom: 30px;
    background-color: #f6f6f6;
    padding: 25px 25px 25px;
}
.single-blog-sidebar-wrapper h2{
	color: var(--primary-color);
	border-left: 2px solid var(--primary-color);
	padding-left: 15px;
	text-transform: capitalize;

}
@media screen and (min-width:991px){
	.single-blog-sidebar-wrapper h2{
		font-size: 20px;
	}
}
.single-blog-post-inner ul{
	list-style: none;
	padding-left: 0;
	display: flex;
	padding: 10px 0;
	border-bottom: 1px solid #cccccc;
}
.single-blog-post-inner li img{
/* 	width: 91.5px; */
	width: 150px;
	height: 114.08px;
	object-fit: cover;
	border-radius: 4px;
	max-width: 120px;
}
.single-blog-post-inner li h3{
	padding-left: 10px;
	line-height: 0.9;
}
.single-blog-post-inner li span{
	padding-left: 10px;
	color: #565969;
}
.single-blog-post-inner li a{
	font-size: 18px;
	color: var(--secondary-color);
	transition: all .5s ease-in-out;
	
}
.single-blog-post-inner li a:hover{
		color: var(--primary-color);
}


/*-----------------------------------
Why Choose Us Styling
------------------------------------*/
.why-choose-us{
    padding-bottom: 70px;
}
.why-choose-us .why-choose-us-img-wrapper{
    position: relative;
}
.why-choose-us .why-choose-us-img-wrapper:before{
    content: '';
    position: absolute;
    width:100%;
    height: 100%;
    border-radius: 10px;
    background: linear-gradient(rgba(0,0,0,0.35),rgba(0,0,0,0.35));
}

.why-choose-us .why-choose-us-img-wrapper img{
    border-radius: 10px;
}
.why-choose-us .why-choose-us-img-wrapper .why-choose-us-wrapper-btn{
    position: absolute;
    bottom: 30px;
    left: 20px;
}
@media screen and (max-width:768px){
	.why-choose-us .why-choose-us-img-wrapper .why-choose-us-wrapper-btn{
		top: 50%;
		transform: translateY(-50%);
		left: 20px;
	}
}
.why-choose-us .why-choose-us-img-wrapper .why-choose-us-wrapper-btn .why-choose-btn-1{
    background: #fff;
    padding: 10px;
    border-radius: 5px;
    color: #171717;
    text-transform: uppercase;
/*      font-family: "Montserrat", sans-serif; */
}
.why-choose-us .why-choose-us-img-wrapper .why-choose-us-wrapper-btn .why-choose-btn-2{
    background: var(--primary-color);
    padding: 10px;
    border-radius: 5px;
    color: #fff;
    text-transform: uppercase;
/*      font-family: "Montserrat", sans-serif; */
}
.why-choose-us .why-choose-us-img-wrapper .why-choose-us-img-content{
    position: absolute;
    bottom: 15px;
    right: 10px;
    color: #fff;
}
@media screen and (max-width:768px){
	.why-choose-us .why-choose-us-img-wrapper .why-choose-us-img-content{
		left: 20px;
		bottom: 10%;
		
	}
}
.why-choose-us .why-choose-us-img-wrapper .why-choose-us-img-content h3{
    text-transform: uppercase;
/*     font-family: "Anton", sans-serif !important; */
    font-weight: 400;
}
@media screen and (min-width:991px){
   .why-choose-us .why-choose-us-img-wrapper .why-choose-us-img-content{
    width:308.05px;
   } 
}
 .why-choose-us .why-choose-content{
    background: var(--secondary-color);
    border-radius: 10px;
    padding: 24px;
 }
   .why-choose-us .why-choose-content .why-choose-content-icon{
    width: 64px;
    height: 64px;
    min-width: 64px;
    height: 64px;
    line-height: 64px;
    text-align: center;
    border-radius: 10px;
    background: var(--primary-color);
   }
     .why-choose-us .why-choose-content .why-choose-content-icon .reveal{
        padding-bottom: 0;
        vertical-align: middle;
        margin-bottom: 0;
     }
  .why-choose-us .why-choose-content .why-choose-content-icon img,
.why-choose-us .why-choose-content .why-choose-content-icon svg{
    width: 40px;
    height: 40px;
	color: var(--text-dark);
  }
   .why-choose-us .why-choose-content .why-choose-content-title h3{
    font-size: 18px;
    color: #fff;
/*          font-family: "Anton", sans-serif !important; */
         text-transform: uppercase;
         font-weight: 600;
   }
      .why-choose-us .why-choose-content .why-choose-content-para p{
        color: #fff;
/*          font-family: "Montserrat", sans-serif; */

   }




 .why-choose-us .title-box h5{
    color: var(--primary-color);
    text-transform: uppercase;
	 font-weight: 700;
      font-size: 16px;
}
 .why-choose-us .title-box h2{
   color: var(--text-dark);
     font-weight: 600;
}
@media screen and (min-width:991px){
  .why-choose-us  .title-box h2{
 font-size: 42px;
   } 
}
 .why-choose-us .title-box p{
    font-size: 20px;
    color: #6a6a6a;
}



 /* ========================================
   6. ABOUT SECTION
   ======================================== */
.about {
  padding: 60px 0;
  background: #f8f9fa;
}

/* .about .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 15px;
}

.about .row {
  margin: 0 -15px;
  align-items: center;

} */

/* About section uses Bootstrap's default column padding */

.about .about-images {
  position: relative;
  flex: 1;
}

.about .about-img-main {
  width: 100%;
  height: 650px;
  object-fit: cover;
  border-radius: 20px;
  box-shadow: var(--shadow-medium);
}

.about .about-img-small {
  position: absolute;
 bottom: 10%;
    left: -10%;
    width: 258px;
    height: 305px;
  object-fit: cover;
  border-radius: 15px;
  box-shadow: var(--shadow-medium);
  border: 4px solid var(--white);
}

.about .about-badge {
  position: absolute;
    bottom: 5%;
    left: 20%;
  background: var(--primary-color);
  color: var(--text-dark);
  padding: 20px;
  border-radius: 25px;
  font-weight: 700;
  font-size: 1.2rem;
  box-shadow: var(--shadow-medium);
}
.about  .about-badge .badge-number{
	font-size: 56px;
	font-weight: 700;
}
.about  .about-badge .badge-text{
	font-size: 17px;
}
.about .about-text {
  flex: 1;
  padding-left: 40px;
}
@media screen and (max-width:768px){
	.about .about-text {
  padding-left: unset;
}
}
.about .about-text h2 {
  font-family: 'Inter Tight', sans-serif;
  font-size: 2.5rem;
  color: var(--text-dark);
  margin-bottom: 20px;
  line-height: 1.2;
}

.about .about-text h2.text-accent {
  color: var(--primary-color);
  margin-bottom: 30px;
}

.about .about-text > p {
  font-size: 1.1rem;
  color: var(--text-light);
  margin-bottom: 40px;
  line-height: 1.8;
}

.about .about-item {
  display: flex;
  align-items: flex-start;
  margin-bottom: 30px;
  gap: 20px;
}

.about .about-icon {
  width: 75px;
  height: 75px;
  background: var(--secondary-color);
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.about .about-icon img {
  width: 45px;
  height: 45px;
  object-fit: contain;
}

.about .about-item-text h4 {
  font-family: 'Inter Tight', sans-serif;
  color: var(--text-dark);
  font-size: 1.3rem;
  margin-bottom: 10px;
  font-weight: 600;
}

.about .about-item-text p {
  color: var(--text-light);
  font-size: 1rem;
  line-height: 1.6;
  margin: 0;
}

/* Areas we Serves */
.areas-section .areas-btn a{
	background: #0261A1;
	width: 180px;
	color: #fff;
	border: 1px solid  #0261A1;
}



/* Additonal for Mobile view */

  .navbar  .menu-toggle-btn {
      font-size: 24px;
      background: none;
      border: none;
      cursor: pointer;
      color: var(--primary-color);
    }
    /* ============================
       Fullscreen Sidebar (Mobile)
    ============================ */
    .fullscreen-sidebar {
      position: fixed;
      top: 0;
      left: -100%;
      width: 100%;
      height: 100vh;
      background: linear-gradient(rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.85));
      z-index: 1200;
      transition: left 0.4s ease;
      display: flex;
      flex-direction: column;
      padding: 80px 20px 20px;
    }

    .fullscreen-sidebar.active {
      left: 0;
    }

    .fullscreen-sidebar a {
      padding: 15px 0;
      font-size: 1.25rem;
      font-weight: 500;
      text-decoration: none;
      color: #333;
/*       border-bottom: 1px solid #eee; */
    }

    .fullscreen-sidebar a:hover {
/*       background-color: #f9f9f9; */
		color: #fff;
    }

   .navbar  .close-btn {
      position: absolute;
      top: 20px;
      right: 20px;
      font-size: 30px;
      cursor: pointer;
      color: #fff;
    }
.fullscreen-sidebar ul {
	list-style: none;
	line-height: 2.8;
}

/* additional for sub menu services in navbar */
/* ============================
   Submenu Sliding from Right (Mobile)
============================ */

.fullscreen-sidebar ul li {
  position: relative;
}

/* Parent menu links */
.fullscreen-sidebar ul li.menu-item-has-children > a {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* Submenu container - hidden off screen by default */
.fullscreen-sidebar ul.sub-menu {
  position: fixed;
  top: 0;
  right: -100%;
  width: 100%;
  height: 100vh;
  background: linear-gradient(rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.85));
  display: flex;
  flex-direction: column;
  padding: 80px 25px;
  transition: right 0.4s ease;
  z-index: 1300;
  overflow-y: auto;
}

/* Active state - slides in */
.fullscreen-sidebar ul.sub-menu.active {
  right: 0;
}

/* Submenu links */
.fullscreen-sidebar ul.sub-menu a {
  font-size: 1.1rem;
  padding: 12px 0;
  color: #333;
  border-bottom: 1px solid #eee;
}

.fullscreen-sidebar ul.sub-menu a:hover {
  color: #000;
}

/* Arrow icon */
.fullscreen-sidebar .submenu-toggle {
  font-size: 18px;
  cursor: pointer;
  padding-left: 10px;
  color: #555;
  transition: transform 0.3s ease;
}

.fullscreen-sidebar .submenu-toggle.rotate {
  transform: rotate(90deg);
}

/* Back button inside submenu */
.fullscreen-sidebar .submenu-back {
  font-size: 1rem;
  color: #fff;
  font-weight: 600;
  margin-bottom: 20px;
  cursor: pointer;
  display: inline-block;
}


/*================================
 <-- Single Area Section -->
==================================*/
.single-area-section .single-area-section-content h2{
	position: relative;
	padding-left: 30px;
}
.single-area-section .single-area-section-content h2:before{
	content: '';
	position: absolute;
	width: 3px;
	height: 100%;
	background: var(--primary-color);
	left: -5px;
}
.single-area-section .single-area-section-content p{
	color: #606060 !important;
	line-height: 2;
}

.about-page-second{
	padding: 20px 0 !important;
}


/*-----------------------------------
Gallery Styling
------------------------------------*/
.gallery .filter-button-group{
	list-style: none;
	padding-left: 0;
}
 .gallery .filter-button-group li {
    background: #fff;
     border: 2px solid var(--secondary-color);
     color: var(--secondary-color);
     padding: 8px 25px;
     cursor: pointer;
     font-size: 13px;
     text-transform: uppercase;
     transition: all .5s ease-in-out;
     -webkit-transition: all .5s ease-in-out;
     -moz-transition: all .5s ease-in-out;
     -ms-transition: all .5s ease-in-out;
     -o-transition: all .5s ease-in-out;
     border-radius: 6px;
}
@media screen and (max-width:768px){
	.gallery .filter-button-group li{
		 padding: 5px 15px;
	}
}

 .gallery .filter-button-group li.active,  .gallery .filter-button-group li:hover{
     background:var(--primary-color);
     color: var(--secondary-color);
    border: 2px solid var(--primary-color);
 }
.gallery .gallery-img{
	position: relative;
}
.gallery .gallery-img-wrapper{
	position: relative;
	overflow: hidden;
}
.gallery .gallery-img-wrapper img{
	transition: all .5s ease-in-out;
	width: 100%;
	height: 356px;
	object-fit: cover;
	border-radius: 6px;
}
.gallery .gallery-img-wrapper img:hover{
	transform: scale(1.2);
	border-radius: 6px;
}
.gallery .gallery-img .icon-search{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	opacity: 0;
	transition: all .5s ease-in-out;
	padding : 26px;
	border-radius: 6px;


}
.gallery .gallery-img .icon-search svg{
	width: 3em;
	height: 3em;
	color: #fff;
	
}
.gallery .gallery-img .icon-search h3,
.gallery .gallery-img .icon-search p{
	color: #2c4a28;
}
@media screen and (min-width:991px){
	.gallery .gallery-img .icon-search h3{
	 
		font-size: 24px;
}
}
.gallery .gallery-img:hover .icon-search{
	opacity: 1;
}