:root{
  color:#090134;
  color:#ffffff;
}
a{
  text-decoration: none !important;
}
.bgLight{
  background-color: #ffffff;
}
body, html {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  background-color: #f8f9fa !important;
  font-family: "Roboto", sans-serif;
}
/* =========General Styles Start======= */
 .section-title {
  display: flex;
  align-items: center;
  justify-content: flex-start; /* Align the title to the left */
  margin: 30px 0; /* Spacing above and below the section title */
  position: relative;
  }

  .section-title::after {
      content: "";
      flex-grow: 1; 
      border-top: 2px dashed #ccc; /* Dashed line style */
      margin-left: 10px; 
  }

  .section-title span {
      font-family: 'Poppins',sans-serif;
      font-size: 2.2rem; /* Adjust font size */
      font-weight: bold; /* Make the title bold */
      text-transform: uppercase;
      color: #090134; /* Title color */
      background: transparent; 
      padding: 0 10px; /* Optional padding around the title */
  }
  .text-center{
      text-align: center !important;
  }
  .bold{
      font-weight: bold;
  }

/* =========General Styles Ends======= */
.navbar-brand img {
  height: 50px; /* Adjust logo height */
}
.offcanvas {
  max-width: 250px; /* Adjust offcanvas width */
}
.badge {
  font-size: 0.75rem;
  position: absolute;
  top: -5px;
  right: -10px;
  padding: 0.25rem 0.5rem;
}
.nav-icon {
  position: relative;
  display: inline-block;
}
.navbar-nav {
  margin: 0 auto; /* Center navigation links */
}
.navbar-collapse {
  justify-content: center; /* Center navigation links */
}
.navbar-toggler {
  order: -1; /* Move toggle button to the left */
}
.navbar-brand {
  margin-right: auto; /* Push logo to the left */
}
.navbar {
  padding: 0.5rem 1rem; /* Adjust navbar padding */
}
.nav-link {
  font-weight: 600; /* Make links slightly bold */
  margin: 0 0.75rem; /* Add spacing between links */
}
.nav-link:hover {
  color: #c03b32 !important; /* Add hover effect */
}

.banner {
  height: 50vh;
  background: url('../img/background.jpg') no-repeat center center/cover;
  position: relative;
  color: white;
  text-align: left;
  overflow: hidden;
  padding-top: 40px;
  margin-top: 60px;
}
.iphone-mockup {
  position: absolute;
  top: 10%;
  left: 50%;
  transform: translate(-50%, -10%);
  width: 500px;
  height: 590px;
  background: url('../img/iphone01.png') no-repeat center center/contain;
  opacity: 0.4;
  z-index: 0; /* Set a low z-index */
}
.hero-detailsWrapper{
  position: relative; 
  z-index: 10; 
  text-align: center;
  padding: 20px 0px;
  margin-top: 30px;
}
.hero-title{
  /* font-family: 'Playfair Display', serif; */
  font-family: 'Poppins';
  text-transform: uppercase;
  font-weight: bold;
  font-size: 3rem;
  z-index: 1;
}
.hero-text{
  font-size: 1.5rem;
  
}
.exploreBtn {
  font-family: 'Poppins', sans-serif;
  font-weight: bold;
  color: #fff;
  background-color: #c03b32;
  text-align: center;
  padding: 3px ;
  margin-top: 20px;
  width: 250px;
  text-decoration: none;
  border-radius: 50px;
  box-shadow: rgba(77, 77, 77, 0.24) 0px 3px 8px;
  display: inline-block;
}
.exploreBtn:hover{
  color: #ccc;
  opacity: 0.9;
}
/* Media Queries */
@media only screen and (min-width: 300px) and (max-width: 599px) {
  .banner {
    padding-top: 20px;
      height: 40vh;
  }
  .iphone-mockup {
      width: 400px;
      height: 500px;
  }
  .navigations-items .nav{
    display: none;
  }
  .hero-detailsWrapper{
    padding: 0px 0px;
    margin-top: 50px;
  }
  .hero-title{
    font-size: 1.6rem;
    z-index: 1;
    /* background-color: #090134; */
  }
  .hero-text{
    font-size: 1.4rem;
  }
  .exploreBtn {
    display: none;
  }
  .section-title span {
    font-size: 1.8rem; /* Adjust font size */
}
  .product-card {
      height: 300px !important;
  }
}