/* ===== RESPONSIVE LAYOUT FIX =====
   Converts absolute-positioned sections to normal document flow
   and adds full responsive design + interactive enhancements
   ===== */

/* ===== BASE CONTAINER FIX ===== */
html,
body {
  background-color: #fff !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden;
}

.nabagunjara-website-homepage {
  width: 100%;
  overflow-x: hidden;
}

.body-euablink-icon {
  display: none !important;
}

/* ===== HERO SECTION ===== */
.content-block {
  position: relative !important;
  width: 100% !important;
  min-height: 100vh;
}

.content-block.hero-carousel .hero-slide-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* ===== ABOUT US SECTION ===== */
.frame-parent {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: 75rem;
  margin: 5rem auto;
  padding: 0 2rem;
  box-sizing: border-box;
  flex-wrap: wrap;
}

.frame-group {
  min-width: 0 !important;
}

.right-image-icon {
  width: 100%;
  max-width: 35rem;
  height: auto;
}

/* ===== LINE DIVIDERS ===== */
.line,
.line2 {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 60%;
  max-width: 43rem;
  margin: 0 auto;
}

/* ===== EXPLORE BY EXPERIENCE ===== */
.frame-section {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: 75rem;
  margin: 3rem auto;
  padding: 0 2rem;
  box-sizing: border-box;
}

/* ===== MOST LOVED DESTINATIONS ===== */
.loved-container {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  margin: 3rem auto;
  padding: 2rem 2rem 3rem;
  box-sizing: border-box;
  background-color: #0f1722;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow: hidden;
}

.text-stripe-parent {
  height: auto !important;
  min-height: auto !important;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/* Scrolling text stripe - horizontally centered behind card */
.text-stripe {
  position: absolute !important;
  top: 50% !important;
  left: 0 !important;
  right: 0;
  transform: translateY(-50%) !important;
  height: auto !important;
  margin: 0 !important;
  width: 100% !important;
  z-index: 0 !important;
  pointer-events: none;
  overflow: hidden !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lined-up {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 0 !important;
  min-height: auto !important;
  margin-bottom: 0 !important;
  width: max-content;
  animation: marqueeDestinations 30s linear infinite;
}

.marquee-track {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 3rem;
  padding: 0 1.5rem;
}

.item-text {
  opacity: 1 !important;
  white-space: nowrap;
  font-family: "Cal Sans", sans-serif;
  font-size: 3.5rem;
  letter-spacing: -0.56px;
  line-height: 3.85rem;
  text-transform: capitalize;
  font-weight: 400;
  color: #fff;
}

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

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

/* Card centered with higher z-index */
.destinations-carousel-wrapper {
  margin: 1rem auto !important;
  position: relative;
  z-index: 2;
}

/* ===== TOUR PACKAGES SECTION ===== */
.frame-parent3 {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: 75rem;
  margin: 4rem auto;
  padding: 0 2rem;
  box-sizing: border-box;
}

.packages-grid-container {
  width: 100%;
}

.packages-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  width: 100%;
}

.package-card-item {
  height: 27.731rem;
  overflow: hidden;
  cursor: pointer;
  display: flex;
  flex-direction: column;
}

.package-card-item>a {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: inherit;
  gap: 0.75rem;
}


.image-box {
  position: relative;
  width: 100%;
  height: 23.557rem;
  overflow: hidden;
  border-radius: 24px;
  flex-shrink: 0;
}

.pkg-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.package-card-item:hover .pkg-image {
  transform: scale(1.05);
}

.days-badge {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  backdrop-filter: blur(4px);
  border-radius: 1000px;
  background-color: rgba(5, 5, 5, 0.45);
  border: 1px solid rgba(255, 255, 255, 0.25);
  padding: 0.35rem 0.75rem;
  z-index: 2;
  width: max-content;
  white-space: nowrap;
}

.days-text {
  font-family: Inter, sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.4px;
  line-height: 1;
  color: #fff;
  font-weight: 500;
}

.pkg-details {
  padding: 0rem 0rem 1rem;
}

.pkg-title {
  margin: 0;
  font-family: "Cal Sans", sans-serif;
  font-size: 1.25rem;
  letter-spacing: -0.2px;
  line-height: 1.625rem;
  font-weight: 400;
  color: #000;
}

.pkg-price-row {
  display: flex;
  align-items: baseline;
  gap: 0.25rem;
  margin-top: 0.4rem;
  font-family: Inter, sans-serif;
  color: #404040;
  font-size: 0.9rem;
  flex-wrap: wrap;
}

.price-from {
  letter-spacing: -0.32px;
  line-height: 1.25rem;
}

.price-currency {
  font-size: 1.5rem;
  letter-spacing: -0.32px;
  line-height: 1.25rem;
  font-weight: 400;
}

.price-val {
  font-family: "Cal Sans", sans-serif;
  font-size: 1.125rem;
  letter-spacing: -0.36px;
  line-height: 1.575rem;
  color: #191919;
}

.price-per {
  letter-spacing: -0.32px;
  line-height: 1.25rem;
  font-size: 0.875rem;
}

/* ===== WHY TRAVEL WITH US ===== */
.section-why-us {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  margin: 0;
  padding: 5rem 2rem;
  box-sizing: border-box;
}

.overlay-silhouette-of-trees {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: bottom !important;
  filter: brightness(1.1);
  z-index: 0 !important;
}

.section-why-us-inner {
  max-width: 75rem;
  margin: 0 auto;
}

.envato-market {
  max-width: 75rem;
  margin: 0 auto;
}

.image5 {
  width: 100% !important;
  max-width: 33.5rem;
  padding: 0 !important;
  border-radius: 24px;
  overflow: hidden;
  height: 33.5rem;
  flex-shrink: 0;
}

.image5 .figure-venice-grand-canal-i {
  position: relative !important;
  width: 100%;
  height: 100%;
  border-radius: 24px;
}

.image5 .figure-culinary-a-plate-of {
  display: none;
}

.left-content {
  min-width: 0 !important;
}

/* Desktop active items hover */
.desktop-active,
.desktop-active3 {
  transition: background-color 0.3s ease;
  cursor: pointer;
}

.desktop-active:hover,
.desktop-active3:hover {
  background-color: rgba(255, 255, 255, 0.08);
}

/* ===== TESTIMONIALS SECTION ===== */
.who-traveled-parent {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: 75rem;
  margin: 5rem auto;
  padding: 0 2rem;
  box-sizing: border-box;
}

.desktop-1-main-container {
  min-height: 28rem;
}

/* ===== NAV OVERLAY RESPONSIVE FIX ===== */
.nav-overlay-container {
  width: 100vw;
  max-width: none;
  margin: 0;
  min-height: 100vh;
  height: 100%;
  padding: 40px 60px;
  box-sizing: border-box;
  color: #ffffff;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.nav-overlay-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.nav-overlay-main {
  display: flex;
  gap: 30px;
  flex: 1 1 auto;
  align-items: stretch;
}

.overlay-grid-column {
  flex: 1.2 1 0px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  align-items: center;
  justify-content: center;
}

.top-grid-row,
.bottom-grid-row {
  width: 100%;
  display: flex;
  gap: 10px;
  justify-content: center;
  flex-wrap: wrap;
}

.grid-card.large {
  width: calc(33% - 10px);
  height: 140px;
  background-size: cover;
  background-position: center;
  border-radius: 8px;
}

.grid-card.small {
  width: calc(16% - 10px);
  height: 70px;
  background-size: cover;
  background-position: center;
  border-radius: 6px;
}

.overlay-nav-column {
  flex: 1 1 0px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.overlay-nav-links {
  width: 100%;
}

.overlay-links-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
  align-items: center;
}

.overlay-links-list li a {
  font-family: 'Poppins', sans-serif;
  font-size: 2.8rem;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  line-height: 1.1;
  text-align: center;
}

.nav-overlay-footer {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding-top: 10px;
  gap: 20px;
}

.overlay-footer-left .label {
  text-transform: uppercase;
  opacity: 0.75;
  font-size: 0.9rem;
  margin-bottom: 6px;
}

.contact-val {
  margin: 0;
  font-size: 1rem;
}

.social-circles {
  display: flex;
  gap: 12px;
}

.social-circle img {
  width: 18px;
  height: 18px;
  filter: invert(1);
}

@media (max-width: 991px) {
  .nav-overlay-container {
    padding: 24px 20px;
  }

  .nav-overlay-main {
    flex-direction: column;
    gap: 18px;
    align-items: center;
    justify-content: flex-start;
    overflow-y: auto;
  }

  .grid-card.large,
  .grid-card.small {
    width: 30%;
    height: auto;
    min-height: 60px;
  }

  .overlay-links-list li a {
    font-size: 2.2rem;
    padding: 6px 12px;
  }

  .nav-overlay-footer {
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }
}

@media (max-width: 480px) {
  .overlay-links-list li a {
    font-size: 1.6rem;
  }

  .grid-card.large,
  .grid-card.small {
    width: 28%;
    min-height: 48px;
  }
}

/* ===== BLOGS SECTION ===== */
.blogs-heading-parent {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: 75rem;
  margin: 4rem auto;
  padding: 0 2rem;
  box-sizing: border-box;
}

.image-parent {
  height: auto !important;
  min-height: 20rem;
}

.image6 {
  min-height: 20rem;
}

/* Blog card hover */
.image6 {
  transition: transform 0.3s ease;
}

.image6:hover {
  transform: scale(1.02);
}

.content4 {
  min-width: 0 !important;
  transition: transform 0.3s ease;
  cursor: pointer;
}

.content4:hover {
  transform: translateX(4px);
}

/* ===== FAQ SECTION ===== */
.frame-parent11 {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  max-width: 75rem;
  margin: 4rem auto;
  padding: 0 2rem;
  box-sizing: border-box;
}

.faq {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  width: 100%;
}

.faqs-left {
  display: contents;
}

.faq-item-box {
  border-radius: 24px;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.2);
  padding: 2rem;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  flex-direction: column;
  grid-column: span 1;
  user-select: none;
}

.faq-item-box:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  transform: translateY(-4px);
  border-color: rgba(3, 61, 74, 0.3);
}

.faq-item-box:focus {
  outline: 2px solid #033d4a;
  outline-offset: 2px;
}

.faq-question {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1rem;
  font-weight: 600;
}

.faq-question .title-heading {
  flex: 1;
  word-break: break-word;
}

.faq-answer {
  margin-top: 1rem;
  color: #555;
  line-height: 1.6;
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  transition: all 0.3s ease;
}

.faq-item-box.active .faq-answer {
  max-height: 500px;
  opacity: 1;
}

.faq-toggle {
  width: 32px;
  height: 32px;
  background: #033d4a;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 1.2rem;
  font-weight: bold;
  flex-shrink: 0;
  transition: transform 0.3s ease;
}

.faq-item-box.active .faq-toggle {
  transform: rotate(45deg);
}

/* ===== NEW BOOKING FAQ SECTION STYLES (Contact & Front Page Match) ===== */
.booking-faq-section {
  padding: 100px 0;
  background: #fafafa;
}

.listing-container {
  max-width: 75rem;
  margin: 0 auto;
  padding: 0 2rem;
  box-sizing: border-box;
}

.text-center {
  text-align: center;
}

.faq-badge {
  background: #eee;
  padding: 6px 15px;
  border-radius: 100px;
  font-size: 0.8rem;
  font-weight: 600;
  margin-bottom: 15px;
  display: inline-block;
}

.faq-circle {
  display: inline-flex;
  width: 24px;
  height: 24px;
  background: #033d4a;
  color: #fff;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  font-size: 0.7rem;
  margin-right: 5px;
}

.faq-section-title {
  font-family: "Cal Sans", sans-serif;
  font-size: 2.5rem;
  color: #033d4a;
  margin-top: 15px;
  line-height: 1.1;
  margin-bottom: 40px;
}

.faq-grid-modern {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px 40px;
  margin-top: 50px;
  align-items: start;
}

.faq-col {
  display: flex;
  flex-direction: column;
}

.faq-item-box {
  background: #fff;
  border: 1px solid #eef0f2;
  border-radius: 24px;
  padding: 24px 30px;
  margin-bottom: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.faq-item-box:hover {
  border-color: #033d4a;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
}

.faq-question {
  font-family: "Cal Sans", sans-serif;
  font-size: 1.15rem;
  color: #033d4a;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  font-weight: 600;
}

.faq-plus {
  font-size: 1.5rem;
  color: #033d4a;
  font-weight: 300;
  margin-left: 1rem;
  flex-shrink: 0;
  transition: transform 0.3s ease;
  cursor: pointer;
}

.faq-item-box.active .faq-plus {
  transform: rotate(45deg);
}

.faq-answer-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease, margin 0.3s ease, opacity 0.3s ease;
  font-family: "Poppins", sans-serif;
  font-size: 0.95rem;
  color: #666;
  line-height: 1.6;
  opacity: 0;
}

.faq-item-box.active .faq-answer-content {
  max-height: 500px;
  margin-top: 15px;
  opacity: 1;
}

.close5:hover,
.close6:hover,
.close7:hover,
.close8:hover {
  background-color: #f0f9fa !important;
  border-color: #033d4a !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(3, 61, 74, 0.1);
}

.plus-button-icon {
  transition: transform 0.3s ease;
}

.close:hover .plus-button-icon,
.close2:hover .plus-button-icon,
.close3:hover .plus-button-icon,
.close5:hover .plus-button-icon,
.close6:hover .plus-button-icon,
.close7:hover .plus-button-icon,
.close8:hover .plus-button-icon {
  transform: rotate(45deg);
}

/* ===== FOOTER SECTION ===== */
.footer {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: auto !important;
  margin: 0 !important;
  margin-top: 0 !important;
  padding-bottom: 0 !important;
}

.footer-desktop {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  height: auto !important;
  padding: 0 !important;
}

/* ===== TRAVEL STORIES / VIBE WITH US ===== */
.section-travel-stories {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: auto !important;
  padding: 2rem 2rem;
  /* REDUCED PADDING */
  box-sizing: border-box;
  background-color: #fff;
  z-index: 1;
}

.stories-header {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  justify-content: center;
  margin-bottom: 0.2rem;
}

.real-travel-stories {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  text-align: center;
  width: 100%;
  margin-bottom: 1.5rem;
}

.frame-parent21 {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  gap: 1rem;
  margin-top: 1rem;
  overflow: hidden;
}

.the-world-wrapper {
  padding: 0 !important;
  justify-content: center !important;
}

.story-items {
  flex-wrap: nowrap;
  width: max-content;
  overflow: hidden;
  scroll-snap-type: none;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 0.5rem;
  padding-right: 0;
  gap: 1.5rem;
  justify-content: flex-start;
  animation: vibeStoryScroll 28s linear infinite;
}

.story-items::-webkit-scrollbar {
  display: none;
}

/* Hide empty placeholder items */
.story-items>.item,
.story-items>.item2 {
  display: none;
}

.item12,
.item14 {
  flex: 0 0 17.625rem !important;
  max-width: 17.625rem !important;
  min-width: 17.625rem !important;
  height: 23.557rem;
  scroll-snap-align: start;
  transition: transform 0.3s ease;
  overflow: hidden;
  border-radius: 24px;
}

.item12:hover,
.item14:hover {
  transform: scale(1.03);
}

.item12 img,
.item14 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

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

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

.subtext-tag-vibewithtravell-parent {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100%;
  max-width: 75rem;
  margin: 2rem auto 0;
  padding: 0 !important;
}

.line-wrapper8 {
  min-width: 0 !important;
}

/* ===== CTA / CONVERSION SECTION ===== */
.section-conversion {
  padding: 3rem 2rem 0 !important;
  /* REDUCED TOP PADDING */
  align-items: center;
  position: relative;
  background-color: #000;
}

.travel-dreams-parent {
  max-width: 35rem;
  margin: 0 auto;
}

.travel-dreams {
  height: auto !important;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.turn-your-travel,
.dreams-into-reality {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: auto !important;
  height: auto !important;
}

.design-remember {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: auto !important;
  margin-top: 1rem;
  text-align: center;
}

.design-forever {
  padding: 0 !important;
  justify-content: center;
}

.frame-wrapper7 {
  justify-content: center;
}

.content-parent2 {
  justify-content: center;
}

/* Proper global container class for centering page content */
.container {
  width: 100%;
  max-width: 1200px;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
}

/* Scrolling marquee in CTA - localized class name */
.marquee-scroller {
  margin-left: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  overflow: hidden !important;
}

/* ===== FILL / FOOTER BOTTOM ===== */
.fill {
  padding: 2.5rem 2rem !important;
}

.frame-parent12 {
  max-width: 75rem;
  margin: 0 auto;
  width: 100%;
  flex-wrap: wrap;
}

.pages-parent {
  flex-wrap: wrap;
  gap: 2rem !important;
}

.bottom {
  max-width: 75rem;
  margin: 0 auto;
  width: 100%;
  flex-wrap: wrap;
}

.social {
  padding: 0 !important;
}

.social-parent {
  margin-left: 0 !important;
}

.social2 {
  width: auto !important;
  transform: none !important;
}

.pages2 {
  width: auto !important;
  margin-left: 0 !important;
  transform: none !important;
}

.documentation {
  width: auto !important;
}

.line15 {
  position: absolute;
  width: 100% !important;
  left: 0 !important;
}

/* ===== LOGO IMAGE AT BOTTOM ===== */
.nabagunjara-website-homepage-child {
  display: none !important;
}

/* ===== BUTTON INTERACTIONS ===== */
.content,
.content2,
.content6,
.content7 {
  transition: all 0.3s ease;
}

.content:hover,
.content2:hover,
.content6:hover {
  background-color: #06586a !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(3, 61, 74, 0.3);
}

.content7:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

.icon,
.icon2,
.icon5 {
  transition: transform 0.3s ease;
}

.content-parent:hover .icon,
.content-group:hover .icon2,
.content-container:hover .icon2,
.content-parent2:hover .icon5 {
  transform: rotate(45deg);
}

/* ===== RESPONSIVE BREAKPOINTS ===== */

/* Large tablets and small desktops */
@media screen and (max-width: 1200px) {

  .frame-parent,
  .frame-section,
  .frame-parent3,
  .who-traveled-parent,
  .blogs-heading-parent,
  .frame-parent11 {
    max-width: 100%;
    padding: 0 3rem;
  }

  .packages-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .envato-market {
    flex-wrap: wrap;
  }

  .image5 {
    max-width: 100%;
    width: 100% !important;
    height: 20rem;
  }

  .left-content {
    min-width: 100% !important;
  }

  .section-why-us {
    padding: 4rem 3rem;
  }

  .fill {
    padding: 2.5rem 3rem !important;
  }

  .section-conversion {
    padding: 6rem 3rem 3rem !important;
  }
}

/* Tablets */
@media screen and (max-width: 925px) {
  .frame-parent {
    flex-direction: column;
    gap: 2rem;
    margin: 3rem auto;
  }

  .frame-group {
    min-width: 100% !important;
  }

  .right-image-icon {
    max-width: 100%;
    width: 100%;
  }

  .exceptional-cards,
  .packages-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1.25rem !important;
  }

  .package-card-item {
    height: auto !important;
    min-height: 18rem !important;
  }

  .pkg-title {
    font-size: 1.125rem !important;
    line-height: 1.3 !important;
  }

  .price-val {
    font-size: 1rem !important;
  }

  .image-box {
    height: 15rem !important;
  }

  /* Tours listing grid: tablet breakpoint */
  .tours-listing-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    padding: 16px 0 40px;
  }

  .tours-listing-grid .package-card {
    display: block;
    width: 100%;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
  }

  .tours-listing-grid .package-image-box img,
  .tours-listing-grid img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    object-fit: cover !important;
  }

  .tours-listing-grid .package-info {
    padding: 0.875rem 1rem !important;
  }

  .tours-listing-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1rem !important;
    padding: 0.75rem 0 2rem !important;
  }

  .tours-listing-grid .package-card {
    width: 100% !important;
    min-width: 0 !important;
    gap: 0.55rem !important;
  }

  .tours-listing-grid .package-image-box {
    height: 15rem !important;
    border-radius: 18px !important;
  }

  .tours-listing-grid .package-info h3 {
    font-size: 1rem !important;
    line-height: 1.2 !important;
    margin-bottom: 0.2rem !important;
  }

  .tours-filters-container {
    gap: 10px;
  }

  .faq {
    grid-template-columns: 1fr;
  }

  .faq-grid-modern {
    grid-template-columns: 1fr;
    gap: 20px;
  }

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

  .image-parent {
    flex-direction: column;
  }

  .image6 {
    min-width: 100% !important;
    min-height: 16rem;
  }

  .content4 {
    min-width: 100% !important;
  }

  .blogs-contents {
    flex-direction: column;
  }

  .desktop-1-main-container {
    min-height: 22rem;
  }

  .overlay {
    gap: 4rem;
    padding: 2rem;
  }

  .rating-content {
    width: 100%;
  }

  .frame-parent10 {
    min-width: 0 !important;
  }

  .line-wrapper {
    min-width: 0 !important;
  }

  .explor-stories {
    gap: 1.5rem;
  }

  .first-theme-parent {
    gap: 2rem !important;
    height: auto !important;
    flex-wrap: wrap;
  }

  .content-block {
    padding: 10rem 3rem 5rem !important;
    gap: 3rem !important;
  }

  .content-block-inner {
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    transform: translateY(-50%) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 0 1rem !important;
    box-sizing: border-box !important;
  }

  .section-conversion {
    padding: 5rem 2rem 3rem !important;
  }

  .turn-your-travel,
  .dreams-into-reality {
    font-size: 2.5rem !important;
    line-height: 3rem !important;
  }

  .pages-parent {
    width: 100% !important;
  }

  .social {
    width: 100%;
  }
}

/* Mobile */
@media screen and (max-width: 600px) {
  html {
    font-size: 14px !important;
  }

  .frame-parent,
  .frame-section,
  .frame-parent3,
  .who-traveled-parent,
  .blogs-heading-parent,
  .frame-parent11 {
    padding: 0 1rem;
    margin: 2rem auto;
  }

  .content-block,
  .tours-hero,
  .tours-hero-carousel,
  .single-tour-hero {
    min-height: 0 !important;
  }

  .content-block.hero-carousel {
    min-height: 78vh !important;
    padding: 10rem 1rem 2rem !important;
    align-items: center !important;
  }

  .content-block.hero-carousel .hero-slide {
    padding-top: 0 !important;
  }

  .content-block.hero-carousel .content-block-inner {
    width: 100% !important;
    padding: 0 !important;
    margin-top: 0.75rem !important;
  }

  .content-block.hero-carousel .title-box-parent {
    width: 100% !important;
    gap: 0.4rem !important;
    align-items: center !important;
    padding-top: 0.25rem !important;
  }

  .content-block.hero-carousel .title-box {
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .content-block.hero-carousel .explore-odishaaaaa {
    font-size: clamp(1.45rem, 6vw, 1.9rem) !important;
    line-height: 1.05 !important;
    text-align: center !important;
    margin: 0 auto !important;
    width: 100% !important;
    overflow-wrap: anywhere !important;
  }

  .content-block.hero-carousel .and-unravel-the-secrets-parent {
    width: 100% !important;
    align-items: center !important;
    gap: 0.35rem !important;
  }

  .content-block.hero-carousel .and-unravel-the {
    font-size: clamp(0.95rem, 3.5vw, 1.1rem) !important;
    line-height: 1.12 !important;
    text-align: center !important;
    margin: 0 auto !important;
    width: 100% !important;
  }

  .content-block.hero-carousel .history-description {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    display: flex;
    justify-content: center;
  }

  .content-block.hero-carousel .odisha-is-rich {
    width: 100% !important;
    max-width: 34rem !important;
    font-size: clamp(0.82rem, 3vw, 0.92rem) !important;
    line-height: 1.32 !important;
    text-align: center !important;
    padding: 0 0.75rem;
    box-sizing: border-box;
    margin: 0 auto !important;
  }

  .content-block.hero-carousel .first-theme-parent {
    margin-top: 0 !important;
    width: 100% !important;
    gap: 0.75rem !important;
    height: auto !important;
    padding: 1rem 0.75rem 0 !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  .content-block.hero-carousel .first-theme,
  .content-block.hero-carousel .second-theme {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    align-items: center !important;
    text-align: center !important;
  }

  .tours-listing-grid {
    grid-template-columns: 1fr !important;
    gap: 0.9rem !important;
    padding: 0.5rem 0 1.5rem !important;
  }

  .tours-listing-grid .package-card {
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    gap: 0.45rem !important;
  }

  .tours-listing-grid .package-image-box {
    height: 13rem !important;
    border-radius: 16px !important;
  }

  .tours-listing-grid .package-badge {
    top: 0.6rem !important;
    left: 0.6rem !important;
    right: auto !important;
    font-size: 0.7rem !important;
    padding: 0.25rem 0.6rem !important;
  }

  .tours-listing-grid .package-info {
    padding: 0.3rem 0.05rem 0 !important;
  }

  .tours-listing-grid .package-price {
    margin-top: 0.15rem !important;
  }

  .tours-listing-grid .package-info h3 {
    font-size: 0.95rem !important;
    line-height: 1.15 !important;
    margin-bottom: 0.1rem !important;
  }

  .tours-listing-grid .package-price {
    font-size: 0.82rem !important;
    line-height: 1.3 !important;
  }

  /* Single tour - Related journeys: make related cards responsive on mobile */
  .related-journeys-section .packages-grid {
    grid-template-columns: 1fr !important;
    gap: 0.85rem !important;
    padding: 0 !important;
  }

  .related-journeys-section .packages-grid .package-card {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    gap: 0.5rem !important;
  }

  .related-journeys-section .packages-grid .package-image-box {
    height: 12.5rem !important;
    border-radius: 14px !important;
  }

  .related-journeys-section .packages-grid .package-info {
    padding: 0.35rem 0.4rem !important;
  }

  .content-block.hero-carousel .history-and-heritage-parent,
  .content-block.hero-carousel .group-div {
    width: 100% !important;
    height: auto !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.45rem !important;
    text-align: center !important;
  }

  .content-block.hero-carousel .people-and-culture-wrapper,
  .content-block.hero-carousel .culture-desription {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    justify-content: center !important;
    align-items: center !important;
  }

  .content-block.hero-carousel .history-and-heritage,
  .content-block.hero-carousel .people-and-culture {
    font-size: clamp(0.95rem, 3vw, 1rem) !important;
    line-height: 1.15 !important;
    width: 100% !important;
    height: auto !important;
    text-align: center !important;
    display: block !important;
    margin: 0 auto !important;
  }

  .content-block.hero-carousel .odisha-has-long,
  .content-block.hero-carousel .odisha-has-a {
    width: 100% !important;
    max-width: 32rem !important;
    height: auto !important;
    text-align: center !important;
    line-height: 1.4 !important;
    font-size: clamp(0.82rem, 2.8vw, 0.92rem) !important;
    margin: 0 auto !important;
  }

  .one-planet-wrapper,
  .travel-style-wrapper,
  .who-traveled2,
  .with-peace-of-mind-wrapper,
  .before-you-travel-wrapper,
  .popular-destinations-wrapper,
  .next-travel2 {
    padding: 0 !important;
  }

  .section-why-us {
    padding: 3rem 1.25rem !important;
  }

  .single-tour-hero,
  .tours-hero,
  .tours-hero-carousel {
    min-height: 320px !important;
    height: 42vh !important;
  }

  .single-hero-content,
  .tours-hero-content {
    padding: 0 1rem !important;
  }

  .single-tour-title,
  .tours-hero-content h1 {
    font-size: clamp(1.55rem, 5vw, 1.9rem) !important;
    line-height: 1.08 !important;
  }

  .single-hero-content,
  .tours-hero-content {
    padding-top: 3.5rem !important;
  }

  .tours-hero-content p,
  .single-hero-content p {
    font-size: clamp(0.85rem, 2.8vw, 0.95rem) !important;
    line-height: 1.35 !important;
  }

  .desktop-active,
  .desktop-active3 {
    flex-direction: column;
    align-items: flex-start !important;
    gap: 0.75rem;
  }

  .desktop-1-main-container {
    min-height: 18rem;
    border-radius: 16px;
  }

  .overlay {
    padding: 1.5rem;
    gap: 3rem;
  }

  .heading-5 {
    font-size: 1rem !important;
  }

  .div-leftsidebar-parent {
    flex-wrap: wrap;
  }

  .border6,
  .default-woman-in-black-long,
  .selective-focus-photo-of-man-s {
    height: 3.5rem !important;
    width: 3.5rem !important;
  }

  .faq {
    gap: 1rem;
  }

  .faq-grid-modern {
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .faq-section-title {
    font-size: 1.5rem;
  }

  .faq-badge {
    font-size: 0.7rem;
  }

  .faq-item-box {
    padding: 15px 20px;
    margin-bottom: 10px;
  }

  .faq-question {
    font-size: 1rem;
  }

  .faq-plus {
    font-size: 1.2rem;
  }

  .faq-answer-content {
    font-size: 0.9rem;
  }

  .section-travel-stories {
    padding: 3rem 1rem;
  }
}

/* Tablet & Mobile (Standard Breakpoint) */
@media screen and (max-width: 768px) {

  .frame-parent,
  .frame-section,
  .frame-parent3,
  .who-traveled-parent,
  .blogs-heading-parent,
  .frame-parent11 {
    padding: 0 0.75rem;
    margin: 2rem auto;
  }

  .exceptional-cards,
  .packages-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1.25rem !important;
  }

  .package-card-item {
    height: auto !important;
    min-height: auto !important;
  }

  .image-box {
    height: 15rem !important;
  }

  .item12,
  .item14 {
    flex: 0 0 15rem !important;
    max-width: 15rem !important;
    min-width: 15rem !important;
    height: 20rem !important;
  }

  .section-conversion {
    padding: 4rem 1.25rem 2.5rem !important;
  }

  .turn-your-travel,
  .dreams-into-reality {
    font-size: 2rem !important;
    line-height: 2.5rem !important;
  }

  .fill {
    padding: 2rem 1.25rem !important;
  }

  .frame-parent12 {
    flex-direction: column;
    gap: 2rem;
  }

  .pages-parent {
    flex-direction: column;
    width: 100% !important;
    gap: 1.5rem !important;
  }

  .bottom {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.5rem !important;
  }

  .all-rights-reserved {
    width: auto !important;
    text-align: center;
  }

  .designed-by {
    width: auto !important;
    text-align: center;
    justify-content: center;
  }

  .social {
    justify-content: center;
    flex-wrap: wrap;
  }

  .subtext-tag-vibewithtravell-parent {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .explor-stories {
    flex-direction: column;
    gap: 1rem;
  }

  .frame-parent2,
  .frame-parent6 {
    flex-direction: column;
    align-items: flex-start;
  }

  .nav-links {
    height: auto !important;
    padding-bottom: 0 !important;
  }

  .nav-links2 {
    height: auto !important;
    padding-bottom: 0 !important;
  }
}

/* Very small mobile */
@media screen and (max-width: 380px) {
  html {
    font-size: 13px !important;
  }

  .content-block {
    padding: 5rem 0.85rem 2rem !important;
  }

  .content-block.hero-carousel {
    min-height: 76vh !important;
    padding: 10.5rem 0.85rem 1.5rem !important;
  }

  /* Tours listing grid: mobile single column */
  .tours-listing-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    padding: 8px 0 20px !important;
  }

  .tours-listing-grid .package-card {
    border-radius: 12px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 0 !important;
  }

  .tours-listing-grid .package-info h3 {
    font-size: 1.05rem !important;
    line-height: 1.25 !important;
    margin-bottom: 0.35rem !important;
  }

  /* Reduce image height and internal paddings to remove large gaps */
  .tours-listing-grid .package-image-box {
    height: 160px !important;
    border-radius: 12px !important;
  }

  .tours-listing-grid .package-image-box img {
    height: 100% !important;
    object-fit: cover !important;
  }

  .tours-listing-grid .package-info {
    padding: 0.6rem 0.75rem !important;
  }

  .single-tour-title,
  .tours-hero-content h1 {
    font-size: 1.45rem !important;
  }
}

/* ===== SMOOTH SCROLL ===== */
html {
  scroll-behavior: smooth;
}

/* ===== MARQUEE SCROLLING STRIP ===== */
.marquee-scroller {
  display: flex !important;
  width: 100vw !important;
  overflow: hidden !important;
  animation: marqueeScroll 20s linear infinite;
  white-space: nowrap;
}

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

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

.item-heading,
.item-heading2 {
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  width: auto !important;
}

/* ===== SECTION TRAVEL STORIES (now outside footer) ===== */
.section-travel-stories {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: auto !important;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #012830;
  font-family: "Cal Sans", sans-serif;
  font-size: 1rem;
  overflow: hidden;
}

/* ===== HAMBURGER MENU TOGGLE ===== */
.menu-toggle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-end;
  width: 40px;
  height: 40px;
  background: none;
  border: none;
  cursor: pointer;
  z-index: 1001;
  padding: 0;
  gap: 6px;
  /* FIXED GAP FOR ALL 3 BARS */
}

.hamburger-line {
  width: 30px;
  height: 2px;
  background-color: #012830;
  transition: all 0.3s ease;
}

.hamburger-line:nth-child(2) {
  width: 20px;
  /* STYLISH OFFSET FOR MIDDLE BAR */
}

/* ===== NEW 3+6 NAV OVERLAY GRID ===== */
/* ===== FULL SCREEN 3+6 NAV OVERLAY (ZERO SCROLL) ===== */
.nav-overlay-blur {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10000;
  background: rgba(0, 20, 40, 0.4);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.nav-overlay-blur.active {
  display: flex !important;
}

.nav-overlay-container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 0px 40px;
  box-sizing: border-box;
  background: rgba(1, 40, 50, 0.6);
  color: #fff;
  overflow: hidden;
  border: none;
}

.nav-overlay-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* margin-bottom: 25px; */
  /* REDUCED SPACE */
  width: 100%;
}

.overlay-logo a {
  display: flex;
  align-items: center;
  gap: 15px;
  text-decoration: none;
  color: #fff;
}

.blue-logo {
  height: 45px;
  /* SMALLER LOGO */
  width: auto;
}

.logo-text {
  font-family: 'Cal Sans';
  font-size: 1.4rem;
  line-height: 1.1;
}

.nav-overlay-main {
  display: flex;
  gap: 60px;
  /* REDUCED GAP */
  flex: 1;
  align-items: center;
  min-height: 0;
  /* Important for flex-shrink */
}

.overlay-grid-column {
  flex: 1.8;
  display: flex;
  flex-direction: column;
  gap: 15px;
  height:100%;
  /* REDUCED GAP */
}

.top-grid-row {
  display: flex;
  gap: 15px;
  width: 100%;
  height: 100%;
}

.grid-card {
  background-size: cover;
  background-position: center;
  border: none !important;
  /* REMOVED BORDER */
  transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  border-radius: 8px !important;
}

.grid-card:hover {
  transform: scale(1.02);
}

.grid-card.large {
  flex: 1;
  height: 100%;
  /* height: 320px; */
  /* SIGNIFICANTLY SMALLER */
}

.grid-card.small {
  flex: 1;
  height: 220px;
}

.bottom-grid-row {
  display: flex;
  gap: 12px;
  width: 100%;
}

.overlay-nav-column {
  flex: 1;
  text-align: left;
  padding-top: 10px;
  align-items: center;
  justify-content: center;
  flex: 1 1 0%;
  display: flex;
}

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

.overlay-links-list li {
  margin-bottom: 12px;
  /* TIGHTER SPACING */
}

.overlay-links-list li a {
  font-family: 'Cal Sans';
  font-size: 3rem;
  /* SMALLER FONT */
  color: #fff;
  text-decoration: none;
  transition: all 0.3s ease;
  display: block;
}

.overlay-links-list li a:hover {
  opacity: 0.7;
}

.nav-overlay-footer {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  /* margin-top: 25px; */
  /* border-top: none;
  padding-top: 15px; */
}

.overlay-footer-left .label {
  font-family: 'Inter';
  font-size: 0.9rem;
  opacity: 0.6;
  text-transform: uppercase;
  display: block;
  margin-bottom: 12px;
}

.contact-val {
  font-family: 'Cal Sans';
  font-size: 1.3rem;
  margin: 4px 0;
}

.social-circles {
  display: flex;
  gap: 20px;
}

.social-circle {
  width: 45px;
  height: 45px;
  border: 1px solid #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.social-circle:hover {
  background: #fff;
}

.social-circle:hover img {
  filter: invert(1) !important;
}

.nav-overlay-close {
  background: rgba(255, 255, 255, 0.1);
  border: none;
  cursor: pointer;
  padding: 5px;
  border-radius: 50%;
  transition: background 0.3s ease;
}

.nav-overlay-close:hover {
  background: rgba(255, 255, 255, 0.2);
}

@media screen and (max-width: 1024px) {
  .nav-overlay-container {
    padding: 24px 28px;
  }

  .nav-overlay-main {
    gap: 24px;
    align-items: flex-start;
  }

  .overlay-grid-column {
    flex: 1.2;
    gap: 12px;
  }

  .grid-card.large {
    height: 220px;
  }

  .grid-card.small {
    height: 120px;
  }

  .overlay-links-list li a {
    font-size: 2.2rem;
  }

  .nav-overlay-footer {
    gap: 18px;
    align-items: center;
    flex-wrap: wrap;
  }

  .contact-val {
    font-size: 1.05rem;
    word-break: break-word;
  }

  .social-circles {
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-end;
  }
}

@media screen and (max-width: 768px) {
  .nav-overlay-container {
    padding: 18px 18px 20px;
    overflow-y: auto;
  }

  .nav-overlay-header {
    margin-bottom: 18px;
  }

  .blue-logo {
    height: 36px;
  }

  .nav-overlay-main {
    flex-direction: column;
    gap: 18px;
    align-items: stretch;
  }

  .overlay-grid-column,
  .overlay-nav-column {
    width: 100%;
    flex: none;
    text-align: center;
    height:fit-content;
  }

  .top-grid-row {
    gap: 10px;
    height: auto !important;
    align-items: stretch !important;
  }

  /* Prevent grid-cards from forcing the overlay to be very tall on mobile */
  .grid-card,
  .grid-card.large,
  .grid-card.small {
    height: auto !important;
    min-height: 80px !important;
    display: block !important;
  }

  /* Right-side nav: show links in a horizontal row on mobile */
  /* On mobile, stack nav links vertically and center them */
  .overlay-nav-column .overlay-nav-links .overlay-links-list {
    display: block !important;
    text-align: center !important;
    padding: 0 !important;
    margin: 8px 0 0 0 !important;
  }

  .overlay-nav-column .overlay-links-list li {
    margin-bottom: 18px !important;
    list-style: none !important;
  }

  .overlay-nav-column .overlay-links-list li a {
    font-size: 2rem !important;
    line-height: 1.1 !important;
    padding: 0 !important;
    display: block !important;
    font-weight: 600 !important;
  }

  .bottom-grid-row {
    gap: 8px;
  }

  .grid-card.large {
    height: 160px;
  }

  .grid-card.small {
    height: 100px;
  }

  .overlay-links-list li {
    margin-bottom: 8px;
  }

  .overlay-links-list li a {
    font-size: 1.9rem;
    line-height: 1.05;
  }

  .nav-overlay-footer {
    margin-top: 8px;
    padding-top: 10px;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: column !important;
  }

  .overlay-footer-left,
  .overlay-footer-right {
    width: 100%;
  }

  .contact-val {
    font-size: 1rem;
  }

  .social-circles {
    justify-content: center;
    margin-top: 8px;
  }

  .social-circle {
    width: 40px;
    height: 40px;
  }
}

@media screen and (max-width: 480px) {
  .nav-overlay-container {
    padding: 14px 14px 16px;
  }

  .nav-overlay-header {
    margin-bottom: 14px;
  }

  .blue-logo {
    height: 32px;
  }

  .nav-overlay-close {
    padding: 8px;
  }

  .grid-card.large {
    height: auto !important;
  }

  .grid-card.small {
    height: auto !important;
  }

  .overlay-links-list li a {
    font-size: 1.25rem !important;
  }

  .contact-val {
    font-size: 0.92rem;
  }

  .social-circles {
    gap: 10px;
  }


  /* Tighten the small-screen right-side nav row further */
  .overlay-nav-column .overlay-nav-links .overlay-links-list {
    gap: 8px !important;
  }

  .overlay-nav-column .overlay-links-list li a {
    font-size: 1rem !important;
    padding: 4px 8px !important;
  }
  .social-circle {
    width: 36px;
    height: 36px;
  }
  /* Additional tweaks to ensure the mobile nav overlay doesn't overlap page content
     and that links/cards scale down on very small screens. */
  .nav-overlay-container {
    min-height: 100vh !important;
    box-sizing: border-box !important;
    padding-bottom: 80px !important; /* spare room for footer and close button */
    justify-content: flex-start !important;
  }

  .nav-overlay-main {
    padding-bottom: 16px !important;
    gap: 12px !important;
    height:100%;
  }

  .overlay-links-list li a {
    font-size: 1.25rem !important;
    line-height: 1.1 !important;
    padding: 6px 0 !important;
  }

  .overlay-links-list li {
    margin-bottom: 6px !important;
  }

  .nav-overlay-footer {
    position: relative !important;
    margin-top: 12px !important;
    padding-top: 8px !important;
  }

  .nav-overlay-close {
    z-index: 10010 !important;
  }
}

/* ===== SECTION FADE-IN ANIMATIONS ===== */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }

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


.faq-item.active .faq-body,
.itinerary-item.active .itinerary-body {
  max-height: 500px;
  padding-bottom: 1.5rem;
}

.faq-item.active .plus-button-icon,
.itinerary-item.active .plus-minus {
  transform: rotate(45deg);
}

.plus-button-icon,
.plus-minus {
  transition: transform 0.3s ease;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ===== FIX STICKY TRIP DETAILS Sidebar ===== */
@media (min-width: 993px) {
  .single-tour-sidebar {
    align-self: start;
    height: fit-content;
    position: sticky;
    top: 92px;
    z-index: 2;
  }
}

/* ===== SINGLE TOUR PAGE DESIGN SYNC ===== */

.single-gallery-grid {
  gap: 1.5rem !important;
}

.single-gallery-grid img {
  height: 23.557rem !important;
  border-radius: 24px !important;
  object-fit: cover !important;
  box-shadow: none !important;
}

/* Related Packages Card Sync */
.packages-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem !important;
}

.package-card {
  height: 27.731rem !important;
  display: flex !important;
  flex-direction: column !important;
  text-decoration: none !important;
  color: inherit !important;
  gap: 0.75rem !important;
  overflow: hidden !important;
  background: transparent !important;
}

.package-image-box {
  position: relative !important;
  width: 100% !important;
  height: 23.557rem !important;
  overflow: hidden !important;
  border-radius: 24px !important;
  flex-shrink: 0 !important;
  
}

.package-image-box img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform 0.5s ease !important;
}

.package-card:hover .package-image-box img {
  transform: scale(1.05) !important;
}

.package-badge {
  width: fit-content;
  position: absolute !important;
  top: 0.75rem !important;
  right: 0.75rem !important;
  backdrop-filter: blur(4px) !important;
  border-radius: 1000px !important;
  background-color: rgba(5, 5, 5, 0.35) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  padding: 0.25rem 0.625rem !important;
  z-index: 2 !important;
  color: #fff !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 0.813rem !important;
  letter-spacing: 0.98px !important;
}

.package-info {
  padding: 0 0 1rem !important;
  display: flex !important;
  flex-direction: column !important;
  text-align: left !important;
}

.package-info h3 {
  font-family: 'Cal Sans', sans-serif !important;
  font-size: 1.25rem !important;
  margin: 0 !important;
  color: #000 !important;
  letter-spacing: -0.2px !important;
}

.package-price {
  color: #404040 !important;
  font-size: 1rem !important;
  font-family: 'Inter', sans-serif !important;
  margin: 0.2rem 0 0 !important;
  letter-spacing: -0.32px !important;
}