:root {
    --primary-color: #ef7f1a;
    --secondary-color: #7d2323;  
}

html {
  scroll-behavior: smooth;
}
a {
  text-decoration: none !important;
}

/* Navbar */

.navbar {
    transition: background-color 0.3s, box-shadow 0.3s;
    padding: 0.75rem 1rem;
}

.navbar.scrolled {
    background-color: #ffffff !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.navbar-logo {
    height: 90px;
    width: auto;
    transition: height .25s ease, transform .25s ease;
}

.navbar.scrolled .navbar-logo {
    height: 70px;
    transform: translateY(-4px);
}

.navbar .nav-link {
    font-size: 22px;
    font-weight: 400;
    color: #333;
    transition: color 0.2s;
}

.navbar .nav-link:hover,
.navbar .nav-link.active {
    color: #ef7f1a !important;
}

/* Make the collapsed menu solid on mobile */
.navbar .collapse.show {
    background-color: #ffffff;  /* Solid background for mobile menu */
    padding: 1rem;
    border-radius: 8px; /* optional rounded corners */
}

/* Navbar */


/* Common */


  .hero-heading h1{
    color: var(--primary-color) ;
    font-size: 50px;
  }
  .hero-heading  p{
    font-size: 20px;
  
  }


 .btn-all {
     background-color: var(--primary-color) ;
    color: #F9FAFB ;
    border: none;
    border-radius: 20px;
    padding: 8px 15px;
    font-weight: 500;
    text-decoration: none;

 }

 .btn-all:hover{
   background-color: var(--secondary-color);
    transition: background-color 0.3s;
 }

 #loader-wrapper{
  position: fixed;
  inset: 0;
  background:#ffffff;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
}

#loader-logo{
  width:450px;    /* Change size as you want */
  height:auto;
  animation: pulse 1.4s infinite ease-in-out;
}

/* logo pulse animation */
@keyframes pulse{
  0%{ opacity: .3; transform:scale(.9); }
  50%{ opacity: 1; transform:scale(1); }
  100%{ opacity: .3; transform:scale(.9); }
}

/* Fade out when page loaded */
.fade-out{
  opacity:0;
  visibility:hidden;
  transition:all .6s ease;
}
/* Common */








/* Home Page */
.hero-section {
    background-image: url('/assets/img/hero.webp');
    background-size: cover;
    background-position: center right;

  }
  .hero-content {
    background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%);
  }

 .counter{
  color: var(--secondary-color);
 }
  
/* Home Page */


/* HOME ABOUTUS */
.home-aboutus{
  padding-top: 100px;
  padding-bottom: 100px;
}
/* HOME ABOUTUS */





.card-home-title  {
    font-weight: 500 ;
    font-size: 22px;
  
}
.card-body h5{
  font-weight: 700 ;
}

/* Home Product */
.btn-home-card{
    background-color: var(--primary-color) ;
    color: #F9FAFB ;
    border: none;
    border-radius: 18px;
    padding: 5px 11px;
    font-weight: 500
}
.btn-home-card:hover{
    background-color: var(--secondary-color) ;
    transition: background-color 0.3s;
}

.feature-products .card{
    border: none;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;

}


/* Home Product */

/* Testimonial */
.carousel-btn{
    font-size: 30px;
    color:#ffffff;
    background-color: var(--primary-color);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
}

.carousel-btn:hover{
    background-color: var(--secondary-color);
    transition: background-color 0.3s;
}
/* Testimonial */

 /*ABOUT US PAGE  */

 .aboutus-section {
    background-image: url('/assets/img/aboutus.webp');
    background-size: cover;
    background-position: center right;

  }

  .aboutus-content {
  background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%);
}

.about-icon i{ 
  color:var(--primary-color) !important;
}

.core-icon{
  color: var(--secondary-color);
}
.core-iconbg{
    background-color: rgba(83, 85, 84, 0.1);
}




 /*ABOUT US PAGE  */




 /* PRODCUTS PAGE */

.products-section {
  background-image: url('/assets/img/products.webp');
  background-size: cover;
  background-position: center right;

}

.products-content {
 background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%);
}

.product-card{
   max-width: 270px;
}

 .product-title {
  font-size: 22px;  
  font-weight: 700;
 }
.product-img{
  width: 270px;
}

 .product-description {
  font-size: 15px;  
 }
 
 .product-list li{
  font-size: 14px; 
 }


 .product-cricle{
  width: 64px;
  height: 64px; 
  background-color: #fff1d4;
}

 .product-info{
    border: none !important;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 12px;
 }


 .card-body .product-btn{
    background-color: var(--primary-color) ;
    color: #F9FAFB ;
    border: none;
    border-radius: 20px;
    padding: 5px 11px;
    font-weight: 500;
 }
 

 .card-body .product-btn:hover{
  color: #ffffff;
  background-color: var(--secondary-color);
  transition: background-color 0.3s;
 }

.btn-view{
    background-color: var(--secondary-color) ;
    color: #F9FAFB ;
    border: none;
    border-radius: 20px;
    padding: 8px 15px;
    font-weight: 500;
    text-decoration: none;
}
.btn-view:hover{
   background-color: var(--secondary-color);
    transition: background-color 0.3s;
 }





.product-c h3{
  font-size: 1.5rem;
  font-weight: 600;
}


.product-name{
  color: var(--primary-color) !important;
  font-weight: 500;
}


 

 /* PRODCUTS PAGE */


/* BLOGS */
.blogs-section {
    background-image: url('/assets/img/blogs.webp');
    background-size: cover;
    background-position: center right;

  }
  .blogs-content {
     background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%);
  }
 



/* BLOGS */



 /* CAREER */

.career-section {
    background-image: url('/assets/img/career.webp');
    background-size: cover;
    background-position: center right;

  }
  .career-content {
     background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%);
  }
 

.btn-career{
  color: #ffffff !important;
  background-color: var(--primary-color)!important;
}

.btn-career:hover{
  color: #ffffff !important;
  background-color: var(--secondary-color)!important;
}


.career-box h4{
  color: var(--primary-color);
  font-size: 22px;
  font-weight: 600;

}

 /* CAREER */


 /* CONTACTUS */


.contact-section {
    background-image: url('/assets/img/contact.webp');
    background-size: cover;
    background-position: center right;

  }
  .contact-content {
     background: linear-gradient(90deg, rgba(255,255,255,0.8) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%);
  }
 


.contact-box{
 background: #ffffff;
 border-radius: 10px;
}

.contact-box h5{
  color: var(--primary-color);
  font-weight: 700;
  font-size: 22px;
}
.contact-box p{
  font-size: 18px;
}



form .btn-contact {
    color: #ffffff;
    background-color: var(--primary-color);
}

form .btn-contact:hover {
    color: #ffffff;
    background-color: var(--secondary-color);
}

.contcaree .btn-contact {
    color: #ffffff;
    background-color: var(--primary-color);
}

.contcaree .btn-contact:hover{
    color: #ffffff;
    background-color: var(--secondary-color);
}

 /* CONTACTUS */
 

 footer{
  background-color: #363636;
 }