* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
body {
  font-family: "Poppins", sans-serif;
}
/* ROOT COLORS */
:root {
  --bg-color: #1c1e27;
  --bg-color-2: #f8f8f8;
  --bg-color-3: #33353d;
  --pink-color: #f5014f;
  --dark-pink-color: #e10048;
  --border-color: #dce0e0;
  --light-green-color: #e5f7ff;
  --grey-color: #565656;
}

/* ROOT COLORS */

/* Custom Navbar Mobile Slide */
.mobile-nav {
  transition: transform 0.3s ease-in-out;
}
.mobile-nav.closed {
  transform: translateX(-100%);
}
.mobile-nav.open {
  transform: translateX(0);
}
/* Custom Navbar Mobile Slide */
.main-container {
  width: 95% !important;
  margin: auto !important;
  max-width: 1500px !important;
}
@media (max-width: 767px) {
  .filter-section {
    margin-top: 50px !important;
  }
  .main-section {
    padding-bottom: 280px !important;
  }
  .second-section {
    padding-top: 195px !important;
  }
}
/* Force slick thumbnails to stay in one row */
/* === Main slider === */
.main-slider img {
  width: 100%;
  height: 600px; /* lock height */
  object-fit: cover; /* crop without stretching */
  border-radius: 8px;
}

@media (max-width: 768px) {
  .main-slider img {
    height: 300px; /* smaller height on tablets/phones */
  }
}

@media (max-width: 480px) {
  .main-slider img {
    height: 250px; /* even smaller for mobiles */
  }
}

/* === Thumbnails === */
.thumb-slider .slick-track {
  display: flex !important;
  align-items: center;
}

.thumb-slider .slick-slide {
  height: auto !important;
}

.thumb-slider img {
  width: 80px;
  height: 60px;
  object-fit: cover;
  border-radius: 6px;
  cursor: pointer;
}
