/* ============================================================
   DESIGN TOKENS – change these two lines to retheme the site
   ============================================================ */
:root {
  /* ── Brand colours ── */
  --primary-color:   #C98400;          /* deep gold */
  --primary-light:   #D4A017;
  --primary-dark:    #8B6508;
  --secondary-color: #000;          /* deep navy */
  --secondary-light: #1A2D55;

  /* ── Neutral palette ── */
  --white:           #FFFFFF;
  --off-white:       #FAF8F4;
  --light-gray:      #F5F3EF;
  --mid-gray:        #C8C4BC;
  --dark-gray:       #4A4540;
  --text-main:       #1C1814;
  --text-muted:      #6B635C;

  /* ── Background ── */
  --background-color: #FFFFFF;
  --footer-bg:        #0C1A33;

  /* ── Typography ── */
  --primary-font:  'DM Serif Display', sans-serif;   /* elegant headings */
  --body-font:     'Geist', sans-serif;          /* clean body text */

  /* ── Spacing / radius / shadow ── */
  --radius-sm:  6px;
  --radius-md:  12px;
  --radius-lg:  20px;
  --shadow-sm:  0 2px 8px rgba(0,0,0,.08);
  --shadow-md:  0 8px 24px rgba(0,0,0,.12);
  --shadow-lg:  0 20px 60px rgba(0,0,0,.18);

  /* ── Transitions ── */
  --transition: .35s cubic-bezier(.4,0,.2,1);
}

/* ============================================================
   RESET + BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--body-font);
  color: var(--text-main);
  background: var(--background-color);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
  text-decoration: none;
  transition: var(--transition);
}

img { max-width: 100%; height: auto; display: block; }

section { overflow: hidden; }

ul, ol { list-style: none; }

p {
  margin: 0 0 15px;
  font-size: 15px;
  color: var(--text-muted);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--primary-font);
  font-weight: 700;
  line-height: 1.2;
  color: var(--text-main);
}

::selection { background: var(--primary-color); color: var(--white); }

/* ============================================================
   UTILITY
   ============================================================ */
.mainContainer {
  max-width: 1550px;
  margin: 0 auto;
  padding: 0 80px;
  position: relative;
}

.section-label {
  display: inline-block;
  font-family: var(--body-font);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--primary-color);
  margin-bottom: 12px;
    @media (max-width: 1199px) {
 font-size: 13px;
    }
}

.section-title {
  font-size: clamp(26px, 4vw, 48px);
  color: var(--text-main);
  margin-bottom: 16px;
  font-weight: 400;
}

.section-sub {
  font-size: 16px;
  color: var(--text-muted);
  max-width: 600px;
  margin: 0 auto 48px;
}

.btn-primary-gold {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--primary-color);
  color: var(--white);
  font-family: var(--body-font);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 14px 32px;
  border: 2px solid var(--primary-color);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: var(--transition);
}
.btn-primary-gold:hover {
  background: transparent;
  color: var(--primary-color);
}

.btn-outline-gold {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  color: var(--white);
  font-family: var(--body-font);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 14px 32px;
  border: 2px solid var(--white);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: var(--transition);
}
.btn-outline-gold:hover {
  background: var(--white);
  color: var(--secondary-color);
}

/* ============================================================
   HEADER / NAV
   ============================================================ */
#mainHeader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  padding: 0 40px;
  background: transparent;
  border-bottom: none;
  transition: var(--transition);
  backdrop-filter: blur(27px);
}

#mainHeader.sticky {
  background: rgba(12,26,51,.85);
  backdrop-filter: blur(14px);
  box-shadow: var(--shadow-md);
}

.headerMainFlex {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 72px;
}

.logoFooter img {  width: auto; }

.brandMark {
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1;
  color: var(--white);
}
.brandMark .brandName {
  font-family: var(--primary-font);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 2px;
}
.brandMark .brandDot {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin: 0 1px;
  border-radius: 50%;
  border: 2px solid currentColor;
  text-indent: -9999px;
  overflow: hidden;
  vertical-align: -2px;
}
.brandMark .brandSub {
  font-family: var(--body-font);
  font-size: 8px;
  letter-spacing: 4px;
  text-transform: uppercase;
  margin-top: 4px;
  color: var(--primary-light);
}
.brandMark--dark { color: var(--secondary-color); }
.brandMark--dark .brandSub { color: var(--primary-color); }

.menuTopMain {
  display: flex;
  align-items: center;
  gap: 0;
  margin-bottom: 0px;
  @media (max-width: 1199px) {
    display: none;

  }
}

.menuTopMain li a {
  font-family: var(--body-font);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .4px;
  color: var(--white);
  padding: 8px 12px;
  position: relative;
  display: block;
}

.menuTopMain li a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 18px;
  right: 18px;
  height: 2px;
  background: var(--primary-color);
  transform: scaleX(0);
  transition: var(--transition);
}

.menuTopMain li a:hover { color: var(--primary-color); }
.menuTopMain li a:hover::after { transform: scaleX(1); }

/* header icons */
.searchDivallFlex {
  display: flex;
  align-items: center;
  gap: 12px;
}

.searchBorderAll {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--mid-gray);
  border-radius: 40px;
  padding: 7px 16px;
  cursor: pointer;
  transition: var(--transition);
}
.searchBorderAll:hover { border-color: var(--primary-color); }
.searchBorderAll button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: var(--text-main);
  display: flex;
}
.searchBorderAll button svg { width: 16px; height: 16px; fill: currentColor; }
.searchBorderAll input {
  border: none;
  outline: none;
  font-family: var(--body-font);
  font-size: 13px;
  color: var(--text-main);
  background: transparent;
  width: 150px;
}

.profileIconmain {
  background: none;
  border: none;
  cursor: pointer;
  color: var(--text-main);
  display: flex;
  align-items: center;
  padding: 6px;
  transition: var(--transition);
}
.profileIconmain:hover { color: var(--primary-color); }

.flexMainCartIcon {
  display: flex;
  align-items: center;
  gap: 8px;
}

.whislistIconHedaerDiv,
.cartIconHedaerDiv {
  position: relative;
  cursor: pointer;
  color: var(--text-main);
  display: flex;
  align-items: center;
  padding: 6px;
  transition: var(--transition);
}
.whislistIconHedaerDiv:hover,
.cartIconHedaerDiv:hover { color: var(--primary-color); }

.cartIconHedaerDiv svg { width: 20px; height: 20px; fill: currentColor; }

.whislistIconHedaerDiv span,
.cartIconHedaerDiv span {
  position: absolute;
  top: -4px;
  right: -4px;
  background: var(--primary-color);
  color: var(--white);
  font-size: 9px;
  font-weight: 700;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* mobile header */
.mobileHeaderMain {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  background: var(--white);
  border-bottom: 1px solid rgba(0,0,0,.08);
  padding: 14px 20px;
  align-items: center;
  justify-content: space-between;
}

.mobileBtn {
  cursor: pointer;
  font-size: 22px;
  color: var(--text-main);
  display: flex;
  align-items: center;
}

/* offcanvas */
.offcanvas {
  background: var(--secondary-color) !important;
}
.offcanvas-header .btn-close {
  opacity: 1;
  padding: 0;
  width: auto;
  height: auto;
  padding: 10px;
}
.offcanvas-header .btn-close i { color: var(--white); font-size: 24px; }
.btn-close:focus { box-shadow: none !important; }
.headerMainFlexMobile ul li a {
  display: block;
  padding: 14px 0;
  font-family: var(--body-font);
  font-size: 16px;
  font-weight: 500;
  color: var(--white);
  border-bottom: 1px solid rgba(255,255,255,.1);
}

/* ============================================================
   HERO BANNER
   ============================================================ */
.heroBannerSection {
  position: relative;
  height: 100vh;
  min-height: 620px;
  overflow: hidden;
}

.heroSlide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1s ease;
}
.heroSlide.active { opacity: 1; }

.heroSlide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.heroOverlay {
  position: absolute;
  inset: 0;
background: linear-gradient(252.86deg, rgba(0, 0, 0, 0) 57.21%, rgba(0, 0, 0, 0.87) 88.65%);
}

.heroContent {
  position: absolute;
  bottom: 50px;
  left: 0;
  right: 0;
}

.heroContent .mainContainer {
  position: static;
  max-width: none;
  padding: 0 40px;
  margin: 0;
}

.heroTagline {
display: inline-block;
border: 2px solid #EEEEEEC9;
  color: var(--white);
  font-family: var(--body-font);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 14px 27px;
  border-radius: 43px;
  margin-bottom: 22px;
  backdrop-filter: blur(4px);
  background: #00000091;
  @media (max-width: 1199px) {
font-size: 10px;
margin-bottom: 8px;
border: 1px solid #EEEEEEC9;
padding: 9px 18px;
  }
}

.heroTitle { margin-bottom: 18px; }
.heroDesc { margin-bottom: 26px; max-width: 460px; }
.heroBtns .btn-primary-gold,
.heroBtns .btn-outline-gold {
  padding: 12px 24px;
  font-size: 13px;
}

.heroTitle {
font-family: var(--primary-font);
  font-size: clamp(38px, 6vw, 76px);
  color: var(--white);
  line-height: 1.05;
  margin-bottom: 24px;
  max-width: 680px;
  font-weight: 400;
   @media (max-width: 1199px) {
font-size: 44px;
margin-bottom: 15px;
   }

}

.heroDesc {
font-size: 18px;
  color: #fff;
  max-width: 621px;
  margin-bottom: 24px;
  line-height: 1.7;
  font-weight: 500;
    @media (max-width: 1199px) {
 margin-bottom: 15px;
 font-size: 15px;
    }
}

.heroBtns {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
   @media (max-width: 1199px) {
justify-content: center;
   }
}

/* Hero-specific button styles */
.heroBtns .btn-primary-gold {
  background: var(--white);
  color: var(--secondary-color);
  border-color: var(--white);
  text-transform: none;
  letter-spacing: .3px;
  font-weight: 600;
  padding: 14px 28px;
    border: none;
}
.heroBtns .btn-primary-gold:hover {
  background: var(--primary-color);
  color: var(--white);
  border-color: var(--primary-color);
  border: none;
}

.heroBtns .btn-outline-gold {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.6);
  text-transform: none;
  letter-spacing: .3px;
  font-weight: 600;
  padding: 12px 28px;
  backdrop-filter: blur(6px);
  border: none;
}
.heroBtns .btn-outline-gold:hover {
  background: var(--white);
  color: var(--secondary-color);
  border-color: var(--white);
}

/* hero dots */
.heroDots {
  position: absolute;
  bottom: 36px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
}

.heroDot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255,255,255,.4);
  cursor: pointer;
  border: none;
  transition: var(--transition);
}
.heroDot.active {
  background: var(--primary-color);
  width: 24px;
  border-radius: 4px;
}

/* ============================================================
   WHY KERALA SECTION
   ============================================================ */
.whyKeralaSection {
  padding: 100px 0 100px;
  background: var(--white);
  text-align: center;
    @media (max-width: 1199px) {
  padding:40px 0 20px;
    }
}

.whyKeralaSection .section-label {
font-size: 15px;
  letter-spacing: 5px;
  font-weight: 600;
  margin-bottom: 16px;
   @media (max-width: 1199px) {
font-size: 13px;
  margin-bottom: 14px;
   }
}

.whyKeralaSection .section-title {
  font-family: var(--primary-font);
  font-size: clamp(26px, 3.2vw, 48px);
  font-weight: 400;
  line-height: 1.25;
  color: var(--secondary-color);
  margin-bottom: 24px;
     @media (max-width: 1199px) {
margin-bottom: 15px;
     }
    
}

.whyKeralaSection .sectionDivider,
.destinationsSection .sectionDivider,
.sectionDivider {
  width: 220px;
  height: 2px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(201,132,0,0) 15%,
    var(--primary-color) 50%,
    rgba(201,132,0,0) 85%,
    transparent 100%
  );
  border-radius: 0;
  margin: 0 auto 56px;
   @media (max-width: 1199px) {
 margin: 0 auto 15px;
   }
}

.whyKeralaGrid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 19px;

  margin: 0 auto;
  text-align: center;
}

/* Top row — 3 cards, each spans 2 of 6 columns */
.whyKeralaGrid > .whyCard:nth-child(1) { grid-column: 1 / span 2; }
.whyKeralaGrid > .whyCard:nth-child(2) { grid-column: 3 / span 2; }
.whyKeralaGrid > .whyCard:nth-child(3) { grid-column: 5 / span 2; }

/* Bottom row — 2 cards, each spans 3 of 6 columns */
.whyKeralaGrid > .whyCard:nth-child(4) { grid-column: 1 / span 3; }
.whyKeralaGrid > .whyCard:nth-child(5) { grid-column: 4 / span 3; }

.whyCard {
  padding:40px 16px;
  background: #FAFBFB;
  border-radius: 24px;
  transition: var(--transition);
  border: 1px solid transparent;
}
.whyCard:hover {
  background: #fff;
  border-color: rgba(201,132,0,.18);
  transform: translateY(-4px);
  box-shadow: var(--shadow-sm);
}

.whyIcon {
  width: auto;
  height: auto;
  background: transparent;
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  font-size: 30px;
  color: var(--primary-color);
  transition: var(--transition);
  @media (max-width: 1199px) {
  svg{
width: 40px;
      height: 40px;
  }
  }

}
.whyCard:hover .whyIcon { transform: translateY(-2px); }

.whyCard h3 {
   font-family: var(--body-font);
  font-size: 24px;
  font-weight: 500;
  color: var(--secondary-color);
  margin-bottom: 12px;
  line-height: 1.3;
  @media (max-width: 1199px) {
  font-size: 17px;
  }
}

.whyCard p {
font-family: var(--body-font);
  font-size: 18px;
  line-height: 1.7;
  color: var(--text-muted);

  max-width: 429px;
  margin: 0 auto 0px;
    @media (max-width: 1199px) {
  font-size: 14px;
    }
}

/* ============================================================
   DESTINATIONS
   ============================================================ */
.destinationsSection {
  padding: 90px 0 100px;
  background: var(--white);
  text-align: center;
      @media (max-width: 1199px) {
padding: 40px 0 20px;
      }
}

.destinationsSection .section-label {
  font-size: 15px;
  letter-spacing: 5px;
  font-weight: 600;
  margin-bottom: 16px;
  @media (max-width: 1199px) {
 font-size: 13px;
 margin-bottom: 14px;
  }
}
.destinationsSection .section-title {
font-family: var(--primary-font);
  font-size: clamp(26px, 3.2vw, 48px);
  font-weight: 400;
  line-height: 1.25;
  color: var(--secondary-color);
  margin-bottom:56px;
    @media (max-width: 1199px) {
 margin-bottom:25px;
    }
}
/* destinations divider uses shared gradient style above */

.destGrid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;

  margin: 0 auto;
}

.destCard {
  position: relative;
  border-radius: 18px;
  overflow: hidden;
  cursor: pointer;
  aspect-ratio: 4/5;
  background: var(--light-gray);
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
  transition: var(--transition);
}
.destCard:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); }

.destCard img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s ease;
}
.destCard:hover img { transform: scale(1.06); }

/* Top-right arrow pill */
.destTag {
  position: absolute;
  top: 14px;
  right: 14px;
  left: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255,255,255,.95);
  color: var(--secondary-color);
  font-size: 12px;
  padding: 0;
  z-index: 3;
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
  transition: var(--transition);
}
.destCard:hover .destTag {
  background: var(--primary-color);
  color: var(--white);
}
.destCard:hover .destTag svg path{
 stroke: #fff;
}
.destTag i {
  font-size: 13px;
  transform: rotate(45deg);
}

/* Bottom dark info chip */
.destInfo {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 16px 18px 18px;
  background: linear-gradient(180deg, rgba(12,26,51,0) 0%, rgba(12,26,51,.85) 55%, rgba(12,26,51,.95) 100%);
  z-index: 2;
  text-align: left;
}

.destInfo h3 {
  font-family: var(--body-font);
  color: var(--white);
  font-size: 23px;
  font-weight: 700;
  margin: 0 0 4px;
  line-height: 1.2;
  letter-spacing: .2px;
}

.destInfo p {
  color: rgba(255,255,255,.75);
  font-size: 14px;
  font-family: var(--body-font);
  margin: 0;
  letter-spacing: .2px;
  font-weight: 500;
}

/* ============================================================
   WHAT SETS US APART
   ============================================================ */
.setsApartSection {
  padding: 100px 0;
  background: var(--white);
  overflow: hidden;
    @media (max-width: 1199px) {
  padding: 40px 0;
    }
}

.setsApartInner {
  display:flex;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
   @media (max-width: 1199px) {
flex-direction: column;
gap: 20px;
display: block;
   }

}

.setsApartHeader {
  margin-bottom: 48px;
  text-align: left;
   @media (max-width: 1199px) {
margin-bottom: 20px;
   }

}
.setsApartHeader .section-label {
font-size: 15px;
  letter-spacing: 5px;
  font-weight: 600;
  margin-bottom: 16px;
   @media (max-width: 1199px) {
    margin-bottom: 14px;
    font-size: 13px;
   }
}
.setsApartHeader .section-title {
font-family: var(--primary-font);
  font-size: clamp(30px, 3.2vw, 48px);
  font-weight: 400;
  line-height: 1.25;
  color: var(--secondary-color);
  margin-bottom: 56px;
   @media (max-width: 1199px) {
    margin-bottom: 25px;
   }
}

.setsApartList { display: flex; flex-direction: column; gap: 0; width: 100%; }

.setsApartItem {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 22px 0px;
  border: none;
  border-bottom: 1px solid rgba(0,0,0,.08);
  background: transparent;
  border-radius: 0;
  transition: var(--transition);
}
.setsApartItem:first-child{ padding-top: 0px;}
.setsApartItem:last-child { border-bottom: none; }
.setsApartItem:hover {
  border-color: rgba(0,0,0,.08);
  background: transparent;
  box-shadow: none;
}
.setsApartItem:hover .setsApartItemIcon {
  background: var(--primary-color);
  color: var(--white);
}

.setsApartItemIcon {
  flex-shrink: 0;
  width: 72px;
  height: 72px;
  background: #F4F4F4;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--secondary-color);
padding: 16px;
  transition: var(--transition);
  @media (max-width: 570px) {
 width: 54px;
  height: 54px;
  }
}

.setsApartItemText {
  padding-top: 2px;
}
.setsApartItemText h4 {
  font-family: var(--body-font);
  font-size: 24px;
  font-weight: 500;
  color: var(--secondary-color);
  margin-bottom: 10px;
  letter-spacing: .1px;
  @media (max-width: 570px) {
font-size: 18px;
  }
}
.setsApartItemText p {
font-family: var(--body-font);
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-muted);
  margin: 0;
  font-weight: 400;
  max-width: 617px;
  @media (max-width: 1199px) {
max-width: 100%;
  font-size: 14px;
  }
}

.setsApartImage {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: visible;
    @media (max-width: 1199px) {
margin-top: 40px;
    }
}
.setsApartImage > img {
  width: 100%;
  height: 560px;
  object-fit: cover;
}
.setsApartImage::before {
  content: '';
  position: absolute;
  inset: -3px;
  border-radius: var(--radius-lg);
  background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
  z-index: -1;
}

/* ============================================================
   PROCESS SECTION
   ============================================================ */
.processSection {
  padding: 100px 0;
  background: #F5F4F2;
  text-align: center;
  @media (max-width: 1199px) {
  padding: 40px 0;
  }
}

.processSteps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin-top: 60px;
  position: relative;

  margin-left: auto;
  margin-right: auto;
}

/* remove old single full-width line */
.processSteps::before { content: none; }

.processStep {
  position: relative;
  padding: 0 16px;
background: #F5F4F2;
  border: none;
  border-radius: 0;
  text-align: center;
  transition: var(--transition);
}
.processStep:hover {
  transform: none;
  box-shadow: none;
  border: none;
}

/* connector line between each pair of steps — sits at the vertical center of the circles */
.processStep:not(:last-child)::after {
content: '';
  position: absolute;
  top: 111px;
  left: calc(73% + 47px);
  right: calc(-95% + 51px);
  height: 2px;
  background: #CEDAEC;
}

.stepNumber {
  width: 78px;
  height: 78px;
  border-radius: 50%;
  background: linear-gradient(135deg, #050201 0%, #1A0B04 30%, #4A2610 65%, #7A3F16 90%, #8C4A1A 100%);
  color: var(--white);
  font-family: var(--body-font);
  font-size: 16px;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 22px;
  position: relative;
  z-index: 1;
  border: 5px solid var(--white);
box-shadow: 0px 4px 18px 0px #00000040;

}

.processStep h4 {
font-family: var(--body-font);
  font-size: 19px;
  font-weight: 500;
  color: var(--secondary-color);

  line-height: 1.3;
  background: #F5F4F2;
  max-width: 160px;
  margin: 0 auto 20px;
}
.processStep p {
font-size: 15px;
  line-height: 1.6;
  color: #646464;
  margin: 0;
  max-width: 256px;
  margin-inline: auto;
  background: #f5f4f2;
    @media (max-width: 1199px) {
max-width: 100%;
    }
}

/* ============================================================
   CTA BANNER
   ============================================================ */
.ctaBannerSection {
  padding: 80px 0;
background: #F2F2F2;
margin-top: 80px;
    @media (max-width: 1199px) {
padding: 40px 0;
margin-top: 20px;
    }
}

.ctaBannerCard {
  position: relative;
  overflow: hidden;
  border-radius: 22px;
  min-height: 387px;
  box-shadow: 0 20px 50px rgba(0,0,0,.15);
  @media (max-width: 767px) {
min-height: auto;
  }
}

.ctaBannerCard .ctaBg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.ctaBannerOverlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(0,0,0,.80) 0%,
    rgba(0,0,0,.55) 45%,
    rgba(0,0,0,.15) 100%
  );
  z-index: 1;
}

.ctaBannerInner {
position: relative;
  z-index: 2;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 40px;
  padding: 183px 48px 80px;
  @media (max-width: 992px) {
padding: 120px 38px 70px;
flex-direction: column; align-items: flex-start; gap: 28px; 
  }
    @media (max-width: 767px) {
padding: 30px;
text-align: center;
    }
}

.ctaBannerText {
  flex: 1;
  max-width: 640px;
}

.ctaBannerText h2 {
  font-family: var(--body-font);
  font-size: clamp(26px, 3vw, 38px);
  font-weight: 600;
  color: var(--white);
  margin-bottom: 14px;
  line-height: 1.2;
  letter-spacing: -.3px;
}

.ctaBannerText p {
  color: rgba(255,255,255,.82);
  font-size: 14.5px;
  line-height: 1.6;
  margin: 0;
  max-width: 520px;
}

.ctaBtns {
  display: flex;
  gap: 12px;

      @media (max-width: 767px) {
width: 100%;
justify-content: center;
align-items: center;
      }
}

/* CTA button tweaks — compact, no uppercase */
.ctaBtns .btn-primary-gold {
  background: var(--white);
  color: var(--secondary-color);
  border: 1px solid var(--white);
  text-transform: none;
  letter-spacing: .2px;
  font-weight: 600;
  padding: 9px 24px;
  font-size: 14px;
}
.ctaBtns .btn-primary-gold:hover {
  background: var(--primary-color);
  color: var(--white);
  border-color: var(--primary-color);
}
.ctaBtns .btn-outline-gold {
  background: transparent;
  color: var(--white);
  border: 1px solid rgba(255,255,255,.7);
  text-transform: none;
  letter-spacing: .2px;
  font-weight: 600;
  padding: 9px 24px;
  font-size: 14px;
}
.ctaBtns .btn-outline-gold:hover {
  background: var(--white);
  color: var(--secondary-color);
  border-color: var(--white);
}

/* ============================================================
   FOOTER
   ============================================================ */
.mainFooter {
  position: relative;
  padding: 80px 0 100px;
  overflow: hidden;
  isolation: isolate;
  color: var(--white);
    @media (max-width: 1199px) {
  padding: 40px 0 20px;
    }
}
.mainFooter .mainContainer { position: relative; z-index: 2; }

.footerBg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image:url(../images/footer-img.jpg);
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
}
.footerOverlay {
  position: absolute;
  inset: 0;
  z-index: 1;
 background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.86) 100%);

}

.footerGrid {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 60px;
  flex-wrap: wrap;
  margin-bottom: 64px;
  @media (max-width: 768px) {
 margin-bottom: 30px;
  }
}

.footerBrand { flex: 0 1 340px; }
.footerGrid .footerCols {
  display: flex;
  gap: 80px;
  flex: 0 0 auto;
}
.footerCol { min-width: 140px; }

.footerBrand .footerLogo { display: inline-block; margin-bottom: 24px; }
.footerBrand .footerLogo img { height: 36px; filter: brightness(0) invert(1); }

.footerBrand p {
  color: rgba(255,255,255,.72);
  font-size: 14px;
  font-family: var(--body-font);
  margin: 0;
  line-height: 1.5;
}

.footerCol h5 {
font-family: var(--body-font);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 1.5px;
  text-transform: capitalize;
  color: #FAFAFA99;
  margin-bottom: 18px;
}
 
.footerLinks { display: flex; flex-direction: column; gap: 6px; }

.footerLinks a {
  color: #fff;
  font-size: 14px;
  font-family: var(--body-font);
  transition: var(--transition);
}
.footerLinks a:hover { color: var(--primary-light); }

.footerBottom {



  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
}

.footerBottom p {
  color: rgba(255,255,255,.6);
  font-size: 13px;
  margin: 0;
  font-family: var(--body-font);
}

.footerMeta { display: flex; gap: 28px; align-items: center; 
@media (max-width: 570px) {
  flex-direction: column;
  gap: 10px;
}

}
.footerMeta a {
  color: #fff;
  font-size: 13px;
  transition: var(--transition);
}
.footerMeta a:hover { color: var(--primary-light); }
.footerMeta span b { color: var(--white); font-weight: 700; }

/* ============================================================
   SEARCH MODAL
   ============================================================ */
#fullModal .modal-dialog { max-width: 600px; }
#fullModal .modal-content {
  border: none;
  border-radius: var(--radius-md);
  overflow: hidden;
}
#fullModal .modal-header {
  background: var(--secondary-color);
  border: none;
  padding: 20px 28px;
}
#fullModal .modal-title { color: var(--white); font-family: var(--primary-font); }
#fullModal .btn-close { filter: invert(1); }
#fullModal .modal-body { padding: 32px 28px; }
#fullModal .form-control {
  border: 2px solid var(--light-gray);
  border-radius: var(--radius-sm);
  padding: 14px 18px;
  font-family: var(--body-font);
  font-size: 15px;
  transition: var(--transition);
}
#fullModal .form-control:focus {
  border-color: var(--primary-color);
  box-shadow: none;
}

/* ============================================================
   AOS RESET
   ============================================================ */
[data-aos] { transition-timing-function: cubic-bezier(.4,0,.2,1); }

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

/* 1200px */
@media (max-width: 1200px) {
  .mainContainer { padding: 0 30px; }
  #mainHeader { padding: 0 20px; }
  .destGrid { grid-template-columns: repeat(2, 1fr); }
  .processSteps { grid-template-columns: repeat(2, 1fr); row-gap: 20px; margin-top: 20px; }
  .processSteps::before { display: none; }
  .processStep:not(:last-child)::after { display: none; }
  .footerGrid { grid-template-columns: 1fr 1fr; }
}

/* 992px */
@media (max-width: 992px) {
  .setsApartInner { grid-template-columns: 1fr; gap: 40px; }
  .setsApartImage > img { height: 360px; }
  .whyKeralaGrid { grid-template-columns: repeat(2, 1fr); }
  .whyKeralaGrid > .whyCard:nth-child(1),
  .whyKeralaGrid > .whyCard:nth-child(2),
  .whyKeralaGrid > .whyCard:nth-child(3),
  .whyKeralaGrid > .whyCard:nth-child(4),
  .whyKeralaGrid > .whyCard:nth-child(5) { grid-column: auto; }
}

/* 768px */
@media (max-width: 768px) {

  .mobileHeaderMain { display: flex; }



  .heroTitle { font-size: clamp(28px, 8vw, 48px); }
  .heroContent { bottom: 60px; }

  .destGrid { grid-template-columns: repeat(2, 1fr); }
  .whyKeralaGrid { grid-template-columns: 1fr;  }
  .processSteps { grid-template-columns: 1fr; }
  .footerGrid { grid-template-columns: 1fr; gap: 32px; }
  .footerBottom { flex-direction: column; text-align: center; }

 
}

/* 480px */
@media (max-width: 480px) {
  .mainContainer { padding: 0 16px; }
  .destGrid { grid-template-columns: 1fr; }
  .heroBtns, .ctaBtns { flex-direction: column; width: 100%; }

  .btn-primary-gold, .btn-outline-gold { width: 100%; justify-content: center; }
  .heroTagline { font-size: 10px; }
}

/* ============================================================
   ADD-ONS (hero location, collage, scroll-top)
   ============================================================ */
.heroLocation {

  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 14px;
  color: rgba(255,255,255,.85);
  font-size: 12px;
  letter-spacing: .5px;
  pointer-events: none;
  width: 40%;
    @media (max-width: 1199px) {
width: 100%;
justify-content: center;
    }
}
.heroLocation::before {
content: '';
  width: 100%;
  height: 2px;
  background: #fff;
  right: -18px;
  position: relative;
  @media (max-width: 1199px) {
display: none;
  }
}

.heroLocation .locPill { pointer-events: auto; }
.heroLocation .locPill {
display: inline-flex;
  align-items: center;
  gap: 3px;
padding: 3px 15px 3px 5px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px;
  background: rgba(0,0,0,.45);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  color: var(--white);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: .2px;
  white-space: nowrap;
  transition: var(--transition);
}
.heroLocation .locPill:hover {
  background: rgba(0,0,0,.6);
  border-color: rgba(255,255,255,.35);
}
.heroLocation .locPill i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.18);
  color: var(--white);
  font-size: 11px;
}
.setsApartCollage{
  width: 566px;
  img{
      @media (max-width: 1199px) {
width: 100%;
      }
  }
  @media (max-width: 1199px) {
width: 100%;
  }
}


.setsApartCollage .collageA { grid-column: 1 / 2; grid-row: 1 / 2; }
.setsApartCollage .collageB { grid-column: 2 / 3; grid-row: 1 / 2; }
.setsApartCollage .collageC { grid-column: 1 / 3; grid-row: 2 / 3; }

.setsApartImage::before { display: none; }
.setsApartImage { overflow: visible; background: transparent; }

#scrollTopBtn {
  position: fixed;
  right: 24px;
  bottom: 24px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--primary-color);
  color: var(--white);
  border: none;
  cursor: pointer;
  box-shadow: var(--shadow-md);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: var(--transition);
  z-index: 999;
}
#scrollTopBtn.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
#scrollTopBtn:hover { background: var(--primary-dark); }

@media (max-width: 768px) {
  .heroLocation { right: 16px; bottom: 60px; font-size: 11px; padding: 6px 14px; }
  .setsApartCollage { grid-template-rows: 160px 200px; }
}

.bannerFlexTxtmain{
  display: flex;
  align-items: end;
  justify-content: space-between;
  @media (max-width: 1199px) {
flex-direction: column;
align-items: center;
gap:20px;
text-align: center;
justify-content: center;
  }
}

.mobileBtn{
  display: none;
  i{
    color: #fff;
  }
  @media (max-width: 1199px) {display: block;
  }
}
.mobileMenuMain{
   margin: 0!important;
    padding: 0!important;
    a{
      font-size: 20px!important;
      &::after{
        display: none!important;
      }
    }
   @media (max-width: 1199px) {display: block;
  }

}

/* ============================================================
   CONTACT PAGE
   ============================================================ */


.menuTopMain li a.active { color: var(--primary-color); }
.menuTopMain li a.active::after { transform: scaleX(1); }

/* ---- Contact Hero ---- */
.contactHeroSection {
  position: relative;
  height: 520px;
  overflow: hidden;
}
.contactHeroImg {
  position: absolute;
  inset: 0;
}
.contactHeroImg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.contactHeroOverlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.45) 50%, rgba(0,0,0,.55) 100%);
}
.contactHeroContent {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding-top: 60px;
}
.contactHeroContent h1 {
  font-family: var(--body-font);
  font-weight: 500;
  color: var(--white);
  font-size: clamp(26px, 5vw, 48px);
  line-height: 1.1;
  margin-bottom: 16px;
}
.contactHeroContent p {
  color: rgba(255,255,255,.9);
  font-size: 16px;
  font-family: var(--body-font);
  margin: 0 auto;
  line-height: 1.6;
}
@media (max-width: 1199px) {
  .contactHeroSection { height: 380px; }
  .contactHeroContent p { font-size: 14px; padding: 0 20px; }
}
@media (max-width: 768px) {
  .contactHeroSection { height: 320px; }
}

/* ---- Contact Form Section ---- */
.contactFormSection {
  padding: 100px 0 120px;
  background: var(--white);
}
@media (max-width: 1199px) {
  .contactFormSection { padding: 50px 0 60px; }
}

.contactGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: start;
}
@media (max-width: 992px) {
  .contactGrid { grid-template-columns: 1fr; gap: 40px; }
}

/* Left column */
.contactInfo { max-width: 540px; }

.contactHeading {
  font-family: var(--body-font);
  font-size: clamp(26px, 3.4vw, 48px);
  font-weight:600;
  line-height: 1.15;
  color: var(--secondary-color);
  margin-bottom: 18px;
}
.contactIntro {
  font-family: var(--body-font);
  color: var(--text-muted);
  font-size: 20px;
  line-height: 1.6;
  margin-bottom: 36px;
}
.contactLogo {
  margin-bottom: 36px;
}
.contactLogo img {
  height: 90px;
  width: auto;
}
@media (max-width: 1199px) {
  .contactLogo img { height: 72px; }
}

.contactSubhead {
  font-family: var(--body-font);
  font-size: 23px;
  font-weight: 700;
  color: var(--secondary-color);
  margin-bottom: 14px;
}
.contactAddress {
  font-family: var(--body-font);
  font-size: 17px;
  color: var(--text-main);
  line-height: 1.8;
  margin-bottom: 28px;
  font-weight: 500;
}

.contactLinks {
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin: 0 0 36px;
  padding: 0;
  list-style: none;
}
.contactLinks li {
  display: flex;
  align-items: center;
  gap: 14px;
}
.contactIcon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #444;
  color: var(--white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  flex-shrink: 0;
}
.contactLinks a {
  font-family: var(--body-font);
  font-size: 15px;
  color: var(--text-main);
  font-weight: 500;
  transition: var(--transition);
}
.contactLinks a:hover { color: var(--primary-color); }

.contactFollow {
  font-family: var(--body-font);
  font-size: 20px;
  font-weight: 500;
  color: var(--secondary-color);
  margin-bottom: 14px;
}
.contactSocial {
  display: flex;
  gap: 12px;
}
.contactSocial a {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background:#444;
  color: var(--white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  transition: var(--transition);
}
.contactSocial a:hover {
  background: var(--primary-color);
}

/* Right column — form card */
.contactFormCard {
  background: #EFEFEF;
  border-radius: 18px;
  padding: 36px;
}
@media (max-width: 570px) {
  .contactFormCard { padding: 24px; }
}

.contactForm .formGroup {
  margin-bottom: 18px;
}
.contactForm label {
  display: block;
  font-family: var(--body-font);
  font-size: 14px;
  font-weight: 500;
  color: var(--secondary-color);
  margin-bottom: 8px;
}
.contactForm label span {
  color: #E53935;
  margin-left: 2px;
}
.contactForm input,
.contactForm select,
.contactForm textarea {
  width: 100%;
  background: var(--white);
  border: 1px solid transparent;
  border-radius: 10px;
  padding: 14px 16px;
  font-family: var(--body-font);
  font-size: 15px;
  color: var(--text-main);
  outline: none;
  transition: var(--transition);
}
.contactForm input::placeholder,
.contactForm textarea::placeholder {
  color: #B8B5B0;
}
.contactForm input:focus,
.contactForm select:focus,
.contactForm textarea:focus {
  border-color: var(--primary-color);
  box-shadow: 0 0 0 3px rgba(201,132,0,.12);
}
.contactForm select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'><path d='M1 1L6 6L11 1' stroke='%23888' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 12px 8px;
  padding-right: 40px;
  color: #B8B5B0;
}
.contactForm select:valid { color: var(--text-main); }
.contactForm textarea {
  resize: vertical;
  min-height: 110px;
}

.submitEnquiryBtn {
  width: 100%;
  margin-top: 8px;
  background: var(--secondary-color);
  color: var(--white);
  border: none;
  border-radius: 12px;
  padding: 18px 24px;
  font-family: var(--body-font);
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  transition: var(--transition);
}
.submitEnquiryBtn i { font-size: 13px; transition: var(--transition); }
.submitEnquiryBtn:hover {
  background: var(--primary-color);
}
.submitEnquiryBtn:hover i { transform: translateX(4px); }

/* ============================================================
   ABOUT PAGE
   ============================================================ */
.aboutPage #mainHeader {
  background: rgba(12, 26, 51, .55);
}

/* Hero tweaks */
.aboutHeroSection {
  height: 560px;
}
.aboutHeroSection .contactHeroImg img {
  filter: brightness(.6);
}
@media (max-width: 1199px) {
  .aboutHeroSection { height: 380px; }
}
@media (max-width: 768px) {
  .aboutHeroSection { height: 320px; }
}

/* ---- Intro (Redefining Luxury) ---- */
.aboutIntroSection {
  padding: 110px 0;
  background: var(--white);
}
@media (max-width: 1199px) {
  .aboutIntroSection { padding: 50px 0; }
}

.aboutIntroGrid {
  display: grid;
grid-template-columns: 2.05fr 2fr;
  gap: 20px;
  align-items: center;
}
@media (max-width: 992px) {
  .aboutIntroGrid { grid-template-columns: 1fr; gap: 40px; }
}

.aboutIntroText h2 {
  font-family: var(--body-font);
  font-size: clamp(26px, 3.2vw, 42px);
  font-weight: 700;
  line-height: 1.15;
  color: var(--secondary-color);
  margin-bottom: 30px;
}
.aboutIntroText p {
  font-family: var(--body-font);
  font-size: 18px;
  line-height: 1.75;
  color: var(--text-muted);
  margin-bottom: 0px;

  font-weight: 500;
}
.aboutIntroImage {
  display: flex;
  justify-content: center;
  align-items: center;
  img{
    width: 100%;

  }
}
.aboutIllustration {
  width: 100%;
  max-width: 520px;
  height: auto;
}

/* ---- Our Story ---- */
.ourStorySection {
  position: relative;
  padding: 80px 0;
  overflow: hidden;
  isolation: isolate;
  color: var(--white);
}
@media (max-width: 1199px) {
  .ourStorySection { padding: 50px 0; }
}
.ourStoryBg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image: url(../images/about-add-bg.jpg);
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  filter: saturate(.85);
}
.ourStoryOverlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(12,10,8,.75) 0%, rgba(12,10,8,.82) 100%);
}
.ourStorySection .mainContainer {
  position: relative;
  z-index: 2;
}
.ourStoryHeader {
  text-align: center;
  max-width: 1040px;
  margin: 0 auto 56px;
}
.ourStoryLabel {
  display: inline-block;
  font-family: var(--body-font);
  font-size: 17px;
  font-weight: 500;
  letter-spacing: 6px;
  text-transform: uppercase;
  color: rgba(255,255,255,.85);
  margin-bottom: 15px;
}
.ourStoryHeader h2 {
  font-family: var(--body-font);
  font-size: clamp(26px, 3.2vw, 40px);
  font-weight: 600;
  line-height: 1.2;
  color: var(--white);
  margin-bottom: 24px;
}
.ourStoryHeader p {
  font-family: var(--body-font);
  font-size: 18px;
  line-height: 1.8;
  color: rgba(255,255,255,.85);
  margin: 0 auto;
  max-width: 960px;
}
@media (max-width: 1199px) {
  .ourStoryHeader { margin-bottom: 32px; }
  .ourStoryHeader p { font-size: 14px; }
}

.visionMissionGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  max-width: 1100px;
  margin: 0 auto;
}
@media (max-width: 768px) {
  .visionMissionGrid { grid-template-columns: 1fr; gap: 16px; }
}

.vmCard {
  position: relative;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 18px;
  padding: 40px 36px;
  text-align: center;

  transition: var(--transition);
}
.vmCard:hover {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.4);
}
.vmCard h3 {
  font-family: var(--body-font);
  font-size: 32px;
  font-weight: 600;
  color: var(--white);
padding-bottom: 10px;
  position: relative;

}

.vmCard p {
  font-family: var(--body-font);
  font-size: 18px;
  line-height: 1.7;
  color: rgba(255,255,255,.9);
  margin: 0;
  font-weight: 400;
}
@media (max-width: 570px) {
  .vmCard { padding: 28px 22px; }
  .vmCard h3 { font-size: 26px; }
}

/* ============================================================
   BLOG PAGE
   ============================================================ */
.blogPage #mainHeader {
  background: rgba(12, 26, 51, .55);
}

.blogHeroSection { height: 520px; }
.blogHeroSection .contactHeroImg img { filter: brightness(.6); }
@media (max-width: 1199px) {
  .blogHeroSection { height: 380px; }
}
@media (max-width: 768px) {
  .blogHeroSection { height: 320px; }
}

.blogSection {
  padding: 100px 0 0px;
  background: var(--white);
}
@media (max-width: 1199px) {
  .blogSection { padding: 50px 0 30px; }
}

.blogHeading {
  font-family: var(--body-font);
  font-size: clamp(26px, 3.4vw, 40px);
  font-weight: 700;
  line-height: 1.15;
  color: var(--secondary-color);
  margin-bottom: 56px;
}
@media (max-width: 1199px) {
  .blogHeading { margin-bottom: 28px; }
}

.blogGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px 16px;
}
@media (max-width: 992px) {
  .blogGrid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .blogGrid { grid-template-columns: 1fr; }
}

.blogCard {
background: #F7F7F7;
  border-radius: 20px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: var(--transition);
}
.blogCard:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}

.blogCardImage {
  position: relative;
  padding: 16px 16px 0;
}
.blogCardImage img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: 12px;
  display: block;
}
@media (max-width: 1199px) {
  .blogCardImage img { height: 190px; }
}

.blogTag {
  position: absolute;
  top: 26px;
  right: 26px;
  background: var(--white);
  color: #003265;
  font-family: var(--body-font);
  font-size: 14px;
  font-weight: 600;
  padding: 7px 14px;
  border-radius: 8px;
  letter-spacing: .2px;
  box-shadow: 0 2px 6px rgba(0,0,0,.12);
}

.blogCardBody {
  padding: 16px;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.blogCardBody h3 {
  font-family: var(--body-font);
  font-size: 22px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--secondary-color);
  margin-bottom: 12px;
}
.blogCardBody p {
  font-family: var(--body-font);
  font-size: 16px;
  line-height: 1.6;
  color: var(--text-muted);
  margin: 0 0 10px;
  flex: 1;
}

.blogCardMeta {
  display: flex;
  align-items: center;
  justify-content: space-between;


}
.blogDate {
  font-family: var(--body-font);
  font-size: 13px;
  color: #686868;
}
.blogReadMore {
font-family: var(--body-font);
  font-size: 13px;
  font-weight: 500;
  color: #686868;
  text-decoration: none;
  display: inline-flex;
  align-items: center;

  transition: var(--transition);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.blogReadMore i {
  font-size: 11px;
  text-decoration: none;
  transition: var(--transition);
  padding-left: 6px;
}
.blogReadMore:hover {
  color: var(--primary-color);
}
.blogReadMore:hover i {
  transform: translateX(4px);
}

/* ============================================================
   EXPERIENCES PAGE
   ============================================================ */
.experiencesPage #mainHeader {
  background: rgba(12, 26, 51, .55);
}

/* Hero */
.experiencesHeroSection { height: 520px; }
.experiencesHeroSection .contactHeroImg img { filter: brightness(.65); }
@media (max-width: 1199px) {
  .experiencesHeroSection { height: 380px; }
}
@media (max-width: 768px) {
  .experiencesHeroSection { height: 320px; }
}

/* Welcome to Kochi */
.welcomeKochiSection {
  padding: 90px 0 60px;
  background: var(--white);
}
@media (max-width: 1199px) {
  .welcomeKochiSection { padding: 50px 0 30px; }
}
.welcomeKochiGrid {
display: grid;
  grid-template-columns: 2.1fr 2fr;
  gap: 80px;
  align-items: center;
}
@media (max-width: 992px) {
  .welcomeKochiGrid { grid-template-columns: 1fr; gap: 30px; }
}
.welcomeLabel {
  display: inline-block;
  font-family: var(--body-font);
  font-size: clamp(26px, 3vw, 30px);
  font-weight: 700;
  color:#4D897C;
  letter-spacing: .5px;
margin-bottom: 0px;
}
.welcomeKochiText h2 {
  font-family: var(--body-font);
  font-size: clamp(26px, 3vw, 30px);
  font-weight: 700;

  color: #9A866A;
  margin-bottom: 22px;
}
.welcomeKochiText p {
  font-family: var(--body-font);
  font-size: 18px;
  line-height: 1.75;
  color: var(--text-muted);
font-weight: 500;
  margin: 0;
}
.welcomeKochiImage {
  display: flex;
  justify-content: center;
}
.welcomeKochiImage img {

  height: auto;
}

/* Shared: sub-section title with side-lines */
.expSection {
  padding: 60px 0 0px;
  background: var(--white);
}
@media (max-width: 1199px) {
  .expSection { padding: 30px 0; }
}
.expSectionTitle {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  margin-bottom: 40px;
}
.expSectionTitle::before,
.expSectionTitle::after {
  content: '';
  flex: 1;
  height: 1px;
background: #5A5959AB;
}
.expSectionTitle span {
  font-family: var(--primary-font);
  font-size: clamp(22px, 2.4vw, 37px);
  font-weight: 400;
  color: var(--secondary-color);
  white-space: nowrap;
}
@media (max-width: 768px) {
  .expSectionTitle { gap: 16px; margin-bottom: 24px; }
}

/* Culture & Heritage */
.cultureGrid {
display: grid;
  grid-template-columns: 2.1fr 1fr;
  gap: 80px;
  align-items: center;
}
@media (max-width: 992px) {
  .cultureGrid { grid-template-columns: 1fr; gap: 32px; }
}
.cultureThumbs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.cultureThumb {
  margin: 0;
  text-align: center;
}
.cultureThumb img {
  width: 100%;

  object-fit: cover;
  border-radius: 12px;
}
.cultureThumb figcaption {
  margin-top: 10px;
  font-family: var(--body-font);
  font-size: 18px;
  font-weight: 500;
color: #000000E5;
}
.cultureInfo h3 {
   font-family: var(--body-font);
  font-size: clamp(24px, 2.4vw, 32px);
  font-weight: 500;
  line-height: 1.2;
  color: var(--secondary-color);
  margin-bottom: 18px;
}
.cultureInfo p {
  font-family: var(--body-font);
  font-size: 18px;
  line-height: 1.7;
  color: var(--text-muted);
  margin-bottom: 22px;
  font-weight: 400;
  max-width: 384px;
}
.cultureList {
  list-style: none;
  margin: 0;
  padding: 0;
}
.cultureList li {
  position: relative;
  padding-left: 22px;
  font-family: var(--body-font);
  font-size: 15px;
  color: #9A866A;
  font-weight: 500;
  margin-bottom: 10px;
}
.cultureList li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 9px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #9A866A;
}

/* Fort Kochi Heritage Walk */
.expSubSection {
  padding: 40px 0 60px;
  background: var(--white);
}
@media (max-width: 1199px) {
  .expSubSection { padding: 20px 0 30px; }
}
.expSubHeader {
  margin-bottom: 26px;
}
.expSubHeader h3 {
  font-family: var(--body-font);
  font-size: clamp(22px, 2.2vw, 30px);
  font-weight: 500;
  color: var(--secondary-color);
  margin-bottom: 12px;
}
.expSubHeader p {
  font-family: var(--body-font);
  font-size: 18px;
  color: var(--text-muted);
  font-weight: 400;
  line-height: 1.7;
  margin: 0;
  max-width: 761px;
}

.heritageGallery {
display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: 260px 260px;
  gap: 16px;
}
.heritageTile {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  display: block;
}
.heritageTile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s ease;
}
.heritageTile:hover img { transform: scale(1.05); }
.heritageCap {
  position: absolute;
  left: 14px;
  bottom: 14px;
  color: var(--white);
  font-family: var(--body-font);
  font-size: 14px;
  font-weight: 500;
  text-shadow: 0 1px 4px rgba(0,0,0,.6);
  z-index: 2;
}
.heritageTile::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.55) 100%);
  z-index: 1;
  pointer-events: none;
}
.heritageGallery .tileA { grid-column: 1 / 2; grid-row: 1 / 2; }
.heritageGallery .tileB { grid-column: 2 / 3; grid-row: 1 / 2; }
.heritageGallery .tileC { grid-column: 3 / 4; grid-row: 1 / 3; }
.heritageGallery .tileD { grid-column: 1 / 2; grid-row: 2 / 3; }
.heritageGallery .tileE { grid-column: 2 / 3; grid-row: 2 / 3; }
@media (max-width: 768px) {
  .heritageGallery {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    grid-auto-rows: 160px;
  }
  .heritageGallery .tileA,
  .heritageGallery .tileB,
  .heritageGallery .tileC,
  .heritageGallery .tileD,
  .heritageGallery .tileE {
    grid-column: auto;
    grid-row: auto;
  }
}

/* Tuk-Tuk */
.tuktukSection {
  padding: 70px 0;
  background: var(--white);
}
@media (max-width: 1199px) {
  .tuktukSection { padding: 30px 0; }
}
.tuktukGrid {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap:20px;
  align-items: center;
}
@media (max-width: 992px) {
  .tuktukGrid { grid-template-columns: 1fr; gap: 24px; }
}
.tuktukText h3 {
  font-family: var(--body-font);
  font-size: clamp(24px, 2.4vw, 32px);
  font-weight: 500;
  color: var(--secondary-color);
  margin-bottom: 16px;
}
.tuktukText p {
  font-family: var(--body-font);
  font-size: 18px;
  line-height: 1.7;
  color: var(--text-muted);

  font-weight: 400;
  margin: 0;
}
.tuktukImage {
  display: flex;
  justify-content: center;
}
.tuktukImage img {
  max-width: 420px;
  width: 100%;
  height: auto;
}

/* Backwaters */
.backwatersGallery {
display: grid;
  grid-template-columns: 0fr 1fr 1fr;
  grid-template-rows: 413px 278px;
  gap: 16px;
  margin-bottom: 40px;
}
.bwTile {
  border-radius: 12px;
  overflow: hidden;
}
.bwTile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.bwTileWide { grid-column: 1 / 4; grid-row: 1 / 2; }
.bwTileSmall:nth-of-type(2) { grid-column: 1 / 3; grid-row: 2 / 3; }
.bwTileSmall:nth-of-type(3) { grid-column: 3 / 4; grid-row: 2 / 3; }
@media (max-width: 768px) {
  .backwatersGallery {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    grid-auto-rows: 200px;
  }
  .bwTileWide,
  .bwTileSmall:nth-of-type(2),
  .bwTileSmall:nth-of-type(3) {
    grid-column: auto;
    grid-row: auto;
  }
}

.backwatersItems {
  display: flex;
  flex-direction: column;
  gap: 22px;
}
.bwItem h4 {
  font-family: var(--body-font);
  font-size: 20px;
  font-weight: 600;
  color: var(--secondary-color);
  margin-bottom: 8px;
}
.bwItem p {
  font-family: var(--body-font);
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-muted);
  margin: 0;
}

/* Relaxation & Scenic Escapes */
.scenicGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
@media (max-width: 992px) {
  .scenicGrid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .scenicGrid { grid-template-columns: 1fr; }
}
.scenicCard {
  display: flex;
  flex-direction: column;
}
.scenicCardImg {
  border-radius: 30px;
  overflow: hidden;
  margin-bottom: 16px;
}
.scenicCardImg img {
  width: 100%;

  object-fit: cover;
  transition: transform .6s ease;
}
.scenicCard:hover .scenicCardImg img { transform: scale(1.04); }
.scenicCard h4 {
  font-family: var(--body-font);
  font-size: 25px;
  font-weight: 500;
  color: var(--secondary-color);
  margin-bottom: 8px;
}
.scenicCard p {
  font-family: var(--body-font);
  font-size: 18px;
  line-height: 1.7;
  color: var(--text-muted);
  margin: 0;
  font-weight: 400;
}

/* Brochure CTA */

.brochureTag {
  display: inline-block;
  background: rgba(255,255,255,.15);
  backdrop-filter: blur(6px);
  border: 1px solid rgba(255,255,255,.25);
  color: var(--white);
  padding: 6px 14px;
  border-radius: 8px;
  font-family: var(--body-font);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .4px;
  margin-bottom: 16px;
}
.brochureBtn {
  padding: 12px 26px;
  font-size: 14px;
  text-transform: none;
  letter-spacing: .2px;
  font-weight: 600;
  @media (max-width: 767px) {
width: 100%!important;
display: block!important;
  }
}
.brochureBtn i {
  font-size: 12px;
  margin-left: 2px;
  transition: var(--transition);
}
.brochureBtn:hover i {
  transform: translateY(2px);
}

/* ============================================================
   GROUP AIRPORT TRANSFER (content-page)
   ============================================================ */
.airportTransferSection {
  position: relative;
  padding: 100px 0 100px;
  overflow: hidden;
  isolation: isolate;
}
.airportTransferBg {
  position: absolute;
  inset: 0;
  background-image:
    url('../images/sub-page-banner-2.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -2;
}
.airportTransferOverlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
              rgba(255,255,255,.78) 0%,
              rgba(235,242,250,.82) 50%,
              rgba(255,255,255,.78) 100%);
  z-index: -1;
}

.airportTransferIntro {
  margin-bottom: 48px;
}
.airportTransferIntro h2 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: var(--text-main);
  font-size: clamp(32px, 4.2vw, 56px);
  letter-spacing: .5px;
  line-height: 1.1;
  margin-bottom: 22px;
}
.airportTransferIntro p {
  font-family: var(--body-font);
  font-size: 17px;
  line-height: 1.7;
  color: var(--text-main);

  margin: 0;
}
.airportFeatureGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 60px;
  row-gap: 30px;
}
.airportFeature h4 {
  font-family: var(--body-font);
  font-size: 19px;
  font-weight: 600;
  color: var(--text-main);
  margin-bottom: 8px;
  line-height: 1.3;
}
.airportFeature p {
  font-family: var(--body-font);
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--text-main);
  margin: 0;
}
.airportFeatureSpacer { display: block; }

@media (max-width: 1199px) {
  .airportTransferSection { padding: 80px 0 90px; }
  .airportFeatureGrid { column-gap: 40px; row-gap: 24px; }
}
@media (max-width: 768px) {
  .airportTransferSection { padding: 60px 0 70px; }
  .airportTransferIntro { margin-bottom: 32px; }
  .airportFeatureGrid {
    grid-template-columns: 1fr;
    row-gap: 22px;
  }
  .airportFeatureSpacer { display: none; }
}

/* ============================================================
   AIRPORT HOSPITALITY DESK (content-page)
   ============================================================ */
.airportHospitalitySection {
  position: relative;
  padding: 100px 0 100px;
  overflow: hidden;
  isolation: isolate;
}
.airportHospitalityBg {
  position: absolute;
  inset: 0;
  background-image: url('../images/sub-page-banner-3.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -2;
}
.airportHospitalityOverlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
              rgba(255,255,255,.82) 0%,
              rgba(235,242,250,.88) 50%,
              rgba(255,255,255,.82) 100%);
  z-index: -1;
}



.airportHospitalityIntro {
  margin-bottom: 40px;
}
.airportHospitalityIntro h2 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: var(--text-main);
  font-size: clamp(32px, 4.2vw, 56px);
  letter-spacing: .5px;
  line-height: 1.1;
  margin-bottom: 22px;
  text-transform: uppercase;
}
.airportHospitalityIntro p {
  font-family: var(--body-font);
  font-size: 17px;
  line-height: 1.7;
  color: var(--text-main);
  margin: 0;

}

.airportHospitalityBlock h4 {
  font-family: var(--body-font);
  font-size: 22px;
  font-weight: 600;
  color: var(--text-main);
  margin-bottom: 8px;
  line-height: 1.3;
}
.airportHospitalityBlock p {
  font-family: var(--body-font);
  font-size: 16px;
  line-height: 1.7;
  color: var(--text-main);
  margin: 0;

}

@media (max-width: 1199px) {
  .airportHospitalitySection { padding: 80px 0 90px; }
  .airportHospitalityIntro { margin-bottom: 30px; }
  .airportHospitalityIntro p,
  .airportHospitalityBlock p { font-size: 15px; }
  .airportHospitalityBlock h4 { font-size: 19px; }
}
@media (max-width: 768px) {
  .airportHospitalitySection { padding: 60px 0 70px; }
  .airportHospitalityIntro { margin-bottom: 24px; }
}

/* ============================================================
   ARRIVAL CULTURAL EXPERIENCES (content-page)
   ============================================================ */
.arrivalCulturalSection {
  position: relative;
  padding: 100px 0 100px;
  background: #0a0a0a;
  color: #fff;
  overflow: hidden;
  isolation: isolate;
}

.arrivalCulturalSparkles {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(255, 90, 40, .55) 0, rgba(255, 90, 40, 0) 2px),
    radial-gradient(circle at 22% 72%, rgba(255, 60, 30, .45) 0, rgba(255, 60, 30, 0) 2px),
    radial-gradient(circle at 34% 30%, rgba(255, 120, 60, .35) 0, rgba(255, 120, 60, 0) 1.5px),
    radial-gradient(circle at 46% 88%, rgba(255, 80, 40, .55) 0, rgba(255, 80, 40, 0) 2.5px),
    radial-gradient(circle at 58% 12%, rgba(255, 100, 50, .4) 0, rgba(255, 100, 50, 0) 2px),
    radial-gradient(circle at 68% 55%, rgba(255, 70, 30, .5) 0, rgba(255, 70, 30, 0) 2px),
    radial-gradient(circle at 78% 80%, rgba(255, 110, 60, .35) 0, rgba(255, 110, 60, 0) 1.5px),
    radial-gradient(circle at 88% 22%, rgba(255, 90, 40, .5) 0, rgba(255, 90, 40, 0) 2px),
    radial-gradient(circle at 6% 50%, rgba(255, 130, 70, .3) 0, rgba(255, 130, 70, 0) 1.5px),
    radial-gradient(circle at 92% 65%, rgba(255, 80, 35, .45) 0, rgba(255, 80, 35, 0) 2px),
    radial-gradient(circle at 40% 50%, rgba(255, 100, 50, .35) 0, rgba(255, 100, 50, 0) 1.5px),
    radial-gradient(circle at 16% 42%, rgba(255, 120, 70, .35) 0, rgba(255, 120, 70, 0) 1.5px),
    radial-gradient(circle at 72% 32%, rgba(255, 90, 45, .4) 0, rgba(255, 90, 45, 0) 1.5px),
    radial-gradient(circle at 28% 92%, rgba(255, 110, 55, .35) 0, rgba(255, 110, 55, 0) 1.5px),
    radial-gradient(circle at 82% 95%, rgba(255, 95, 45, .4) 0, rgba(255, 95, 45, 0) 1.5px),
    radial-gradient(ellipse at 30% 60%, rgba(140, 30, 10, .25) 0, rgba(140, 30, 10, 0) 35%),
    radial-gradient(ellipse at 75% 35%, rgba(160, 40, 15, .22) 0, rgba(160, 40, 15, 0) 40%);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.arrivalCulturalSection .mainContainer {
  position: relative;
  z-index: 1;
}


.arrivalCulturalTitle {
  font-family: var(--primary-font);
  font-weight: 400;
  color: #fff;
  font-size: clamp(34px, 4.4vw, 60px);
  line-height: 1.1;
  letter-spacing: .5px;
  margin-bottom: 64px;
}

.arrivalCulturalGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 80px;
  row-gap: 44px;
}

.arrivalCulturalItem h4 {
  font-family: var(--body-font);
  font-size: 22px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 6px;
  line-height: 1.3;
}

.arrivalCulturalItem p {
  font-family: var(--body-font);
  font-size: 16px;
  line-height: 1.65;
  color: rgba(255, 255, 255, .82);
  margin: 0;
}

.arrivalCulturalItem .arrivalCulturalTagline {
  color: #fff;
  margin-bottom: 8px;
}

@media (max-width: 1199px) {
  .arrivalCulturalSection { padding: 80px 0 90px; }
  .arrivalCulturalTitle { margin-bottom: 44px; }
  .arrivalCulturalGrid { column-gap: 50px; row-gap: 32px; }
  .arrivalCulturalItem h4 { font-size: 19px; }
  .arrivalCulturalItem p { font-size: 14.5px; }
}

@media (max-width: 768px) {
  .arrivalCulturalSection { padding: 60px 0 70px; }
  .arrivalCulturalTitle { margin-bottom: 32px; }
  .arrivalCulturalGrid {
    grid-template-columns: 1fr;
    row-gap: 26px;
  }
}

/* ============================================================
   SNAKE BOAT RACE (content-page)
   ============================================================ */
.snakeBoatRaceSection {
  position: relative;
  padding: 100px 0 100px;
  overflow: hidden;
  isolation: isolate;
}
.snakeBoatRaceBg {
  position: absolute;
  inset: 0;
  background-image: url('../images/sub-page-banner-1.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -2;
}
.snakeBoatRaceOverlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
              rgba(255,255,255,.82) 0%,
              rgba(235,242,250,.88) 50%,
              rgba(255,255,255,.82) 100%);
  z-index: -1;
}



.snakeBoatRaceIntro {
  margin-bottom: 40px;
}
.snakeBoatRaceIntro h2 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: var(--text-main);
  font-size: clamp(32px, 4.2vw, 56px);
  letter-spacing: .5px;
  line-height: 1.1;
  margin-bottom: 22px;
  text-transform: uppercase;
}
.snakeBoatRaceIntro p,
.snakeBoatRaceBlock p {
  font-family: var(--body-font);
  font-size: 17px;
  line-height: 1.7;
  color: var(--text-main);
  margin: 0;


}

.snakeBoatRaceBlock {
  margin-bottom: 40px;
}
.snakeBoatRaceBlock h4,
.snakeBoatRaceInclusions h4 {
  font-family: var(--body-font);
  font-size: 22px;
  font-weight: 600;
  color: var(--text-main);
  margin-bottom: 10px;
  line-height: 1.3;
}

.snakeBoatRaceList {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 60px;
  row-gap: 10px;
  max-width: 880px;
}
.snakeBoatRaceList li {
  font-family: var(--body-font);
  font-size: 16px;
  color: var(--text-main);
  display: flex;
  gap: 6px;
}
.snakeBoatRaceList li .snakeBoatRaceCount {
  color: var(--text-main);
}

@media (max-width: 1199px) {
  .snakeBoatRaceSection { padding: 80px 0 90px; }
  .snakeBoatRaceIntro { margin-bottom: 30px; }
  .snakeBoatRaceBlock { margin-bottom: 30px; }
  .snakeBoatRaceIntro p,
  .snakeBoatRaceBlock p { font-size: 15px; }
  .snakeBoatRaceBlock h4,
  .snakeBoatRaceInclusions h4 { font-size: 19px; }
  .snakeBoatRaceList { column-gap: 40px; font-size: 14.5px; }
  .snakeBoatRaceList li { font-size: 14.5px; }
}
@media (max-width: 768px) {
  .snakeBoatRaceSection { padding: 60px 0 70px; }
  .snakeBoatRaceIntro p,
  .snakeBoatRaceBlock p { text-align: left; }
  .snakeBoatRaceList { grid-template-columns: 1fr; row-gap: 8px; }
}

/* ============================================================
   DISCOVER COCHIN (content-page)
   ============================================================ */
.discoverCochinSection {
  position: relative;
  padding: 100px 0 100px;
  overflow: hidden;
  isolation: isolate;
  color: #fff;
  background: #FAF8F4;
}
.discoverCochinBg {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg,
      rgba(0,0,0,.35) 0%,
      rgba(0,0,0,0) 35%,
      rgba(0,0,0,0) 65%,
      rgba(0,0,0,.35) 100%),
    linear-gradient(180deg,
      #2b1538 0%,
      #6a1f2d 18%,
      #c14224 45%,
      #e25b27 65%,
      #8a2820 88%,
      #2a0d12 100%);
  z-index: -1;
}



.discoverCochinIntro {
  margin-bottom: 48px;
}
.discoverCochinIntro h2 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: #fff;
  font-size: clamp(34px, 4.4vw, 60px);
  letter-spacing: .5px;
  line-height: 1.1;
  margin-bottom: 22px;
  text-transform: uppercase;
}
.discoverCochinIntro p {
  font-family: var(--body-font);
  font-size: 17px;
  line-height: 1.65;
  color: #fff;
  margin: 0;

}

.discoverCochinGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 70px;
  row-gap: 32px;
}

.discoverCochinItem h4 {
  font-family: var(--body-font);
  font-size: 21px;
  font-weight: 600;
  color: #fff;
  margin-bottom: 4px;
  line-height: 1.3;
}
.discoverCochinItem p {
  font-family: var(--body-font);
  font-size: 16px;
  line-height: 1.65;
  color: rgba(255,255,255,.92);
  margin: 0;
}
.discoverCochinItem .discoverCochinTagline {
  color: #fff;
  margin-bottom: 4px;
}

.discoverCochinTourDetails h3 {
  font-family: var(--primary-font);
  font-weight: 400;
  font-size: 26px;
  color: #fff;
  margin-bottom: 4px;
  line-height: 1.2;
}

@media (max-width: 1199px) {
  .discoverCochinSection { padding: 80px 0 90px; }
  .discoverCochinIntro { margin-bottom: 32px; }
  .discoverCochinIntro p { font-size: 15px; }
  .discoverCochinGrid { column-gap: 40px; row-gap: 24px; }
  .discoverCochinItem h4 { font-size: 18px; }
  .discoverCochinItem p { font-size: 14.5px; }
  .discoverCochinTourDetails h3 { font-size: 22px; }
}
@media (max-width: 768px) {
  .discoverCochinSection { padding: 60px 0 70px; }
  .discoverCochinGrid { grid-template-columns: 1fr; row-gap: 22px; }
}

/* ============================================================
   EXCLUSIVE KOCHI WATER METRO (content-page)
   ============================================================ */
.kochiWaterMetroSection {
  position: relative;
  padding: 100px 0 100px;
  overflow: hidden;
  isolation: isolate;
  background: #F6E2B8;
}
.kochiWaterMetroBg {
  position: absolute;
  inset: 0;
  background-image: url('../images/sub-page-banner-2.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -2;
}
.kochiWaterMetroOverlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
              rgba(255,255,255,.82) 0%,
              rgba(235,242,250,.88) 50%,
              rgba(255,255,255,.82) 100%);
  z-index: -1;
}


.kochiWaterMetroIntro {
  margin-bottom: 44px;
}
.kochiWaterMetroIntro h2 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: var(--text-main);
  font-size: clamp(32px, 4.2vw, 56px);
  letter-spacing: .5px;
  line-height: 1.1;
  margin-bottom: 22px;
  text-transform: uppercase;
}
.kochiWaterMetroIntro p {
  font-family: var(--body-font);
  font-size: 17px;
  line-height: 1.7;
  color: var(--text-main);
  margin: 0;

}

.kochiWaterMetroHighlights h3 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: var(--text-main);
  font-size: 28px;
  margin-bottom: 18px;
  line-height: 1.2;
}

.kochiWaterMetroList {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  row-gap: 10px;
}
.kochiWaterMetroList li {
  font-family: var(--body-font);
  font-size: 16.5px;
  color: var(--text-main);
  line-height: 1.6;
}
.kochiWaterMetroList .kwmLabel {
  font-weight: 600;
  margin-right: 6px;
}

@media (max-width: 1199px) {
  .kochiWaterMetroSection { padding: 80px 0 90px; }
  .kochiWaterMetroIntro { margin-bottom: 30px; }
  .kochiWaterMetroIntro p { font-size: 15px; }
  .kochiWaterMetroHighlights h3 { font-size: 22px; margin-bottom: 14px; }
  .kochiWaterMetroList li { font-size: 14.5px; }
}
@media (max-width: 768px) {
  .kochiWaterMetroSection { padding: 60px 0 70px; }
}

/* ============================================================
   KADAMAKKUDY ISLANDS (content-page)
   ============================================================ */
.kadamakkudySection {
  position: relative;
  padding: 100px 0 100px;
  overflow: hidden;
  isolation: isolate;
}
.kadamakkudyBg {
  position: absolute;
  inset: 0;
  background-image: url('../images/sub-page-banner-3.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -2;
}
.kadamakkudyOverlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
              rgba(255,255,255,.82) 0%,
              rgba(235,242,250,.88) 50%,
              rgba(255,255,255,.82) 100%);
  z-index: -1;
}



.kadamakkudyIntro {
  margin-bottom: 48px;
}
.kadamakkudyIntro h2 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: var(--text-main);
  font-size: clamp(32px, 4.2vw, 56px);
  letter-spacing: .5px;
  line-height: 1.1;
  margin-bottom: 22px;
  text-transform: uppercase;
}
.kadamakkudyIntro p {
  font-family: var(--body-font);
  font-size: 17px;
  line-height: 1.7;
  color: var(--text-main);
  margin: 0 0 14px;
  text-align: justify;
}
.kadamakkudyIntro p:last-child { margin-bottom: 0; }

.kadamakkudyGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 70px;
  row-gap: 30px;
}

.kadamakkudyBlock h3 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: var(--text-main);
  font-size: 28px;
  margin-bottom: 16px;
  line-height: 1.2;
}

.kadamakkudyList,
.kadamakkudyDetails {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  row-gap: 8px;
}
.kadamakkudyList li {
  font-family: var(--body-font);
  font-size: 16px;
  color: var(--text-main);
  line-height: 1.6;
  padding-left: 18px;
  position: relative;
}
.kadamakkudyList li::before {
  content: "-";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--text-main);
}
.kadamakkudyDetails li {
  font-family: var(--body-font);
  font-size: 16px;
  color: var(--text-main);
  line-height: 1.6;
}
.kadamakkudyDetails .kadamakkudyLabel {
  font-weight: 600;
  margin-right: 4px;
}

@media (max-width: 1199px) {
  .kadamakkudySection { padding: 80px 0 90px; }
  .kadamakkudyIntro { margin-bottom: 32px; }
  .kadamakkudyIntro p { font-size: 15px; }
  .kadamakkudyGrid { column-gap: 40px; row-gap: 24px; }
  .kadamakkudyBlock h3 { font-size: 22px; margin-bottom: 12px; }
  .kadamakkudyList li,
  .kadamakkudyDetails li { font-size: 14.5px; }
}
@media (max-width: 768px) {
  .kadamakkudySection { padding: 60px 0 70px; }
  .kadamakkudyIntro p { text-align: left; }
  .kadamakkudyGrid { grid-template-columns: 1fr; row-gap: 22px; }
}

/* ============================================================
   ALAPPUZHA DAY CRUISE (content-page)
   ============================================================ */
.alappuzhaCruiseSection {
  position: relative;
  padding: 100px 0 100px;
  overflow: hidden;
  isolation: isolate;
  color: #fff;
}
.alappuzhaCruiseBg {
  position: absolute;
  inset: 0;
  background-image: url('../images/sub-page-banner-4.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -2;
}
.alappuzhaCruiseOverlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
              rgba(10,10,10,.78) 0%,
              rgba(10,10,10,.7) 50%,
              rgba(10,10,10,.78) 100%);
  z-index: -1;
}



.alappuzhaCruiseTitle {
  font-family: var(--primary-font);
  font-weight: 400;
  color: #fff;
  font-size: clamp(32px, 4.2vw, 56px);
  letter-spacing: .5px;
  line-height: 1.1;
  margin-bottom: 36px;
  text-transform: uppercase;
}

.alappuzhaCruiseLead {
  margin-bottom: 28px;
}
.alappuzhaCruiseLead h3 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: #fff;
  font-size: 26px;
  line-height: 1.3;
  margin-bottom: 4px;
}
.alappuzhaCruiseTiming {
  font-family: var(--primary-font);
  font-weight: 400;
  color: #fff;
  font-size: 22px;
  margin: 0;
}

.alappuzhaCruiseDesc {
  font-family: var(--body-font);
  font-size: 17px;
  line-height: 1.7;
  color: #fff;
  margin: 0 0 36px;
  text-align: justify;
}

.alappuzhaCruiseHighlights h3 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: #fff;
  font-size: 28px;
  margin-bottom: 18px;
  line-height: 1.2;
}

.alappuzhaCruiseList {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  row-gap: 14px;
}
.alappuzhaCruiseList li {
  font-family: var(--body-font);
  font-size: 16.5px;
  color: #fff;
  line-height: 1.55;
  padding-left: 18px;
  position: relative;
}
.alappuzhaCruiseList li::before {
  content: "-";
  position: absolute;
  left: 0;
  top: 0;
  color: #fff;
}

@media (max-width: 1199px) {
  .alappuzhaCruiseSection { padding: 80px 0 90px; }
  .alappuzhaCruiseTitle { margin-bottom: 24px; }
  .alappuzhaCruiseLead { margin-bottom: 20px; }
  .alappuzhaCruiseLead h3 { font-size: 22px; }
  .alappuzhaCruiseTiming { font-size: 18px; }
  .alappuzhaCruiseDesc { font-size: 15px; margin-bottom: 26px; }
  .alappuzhaCruiseHighlights h3 { font-size: 22px; margin-bottom: 14px; }
  .alappuzhaCruiseList { row-gap: 10px; }
  .alappuzhaCruiseList li { font-size: 14.5px; }
}
@media (max-width: 768px) {
  .alappuzhaCruiseSection { padding: 60px 0 70px; }
  .alappuzhaCruiseDesc { text-align: left; }
}

/* ============================================================
   KERALA TRADITIONAL TEAM-BUILDING (content-page)
   ============================================================ */
.teamBuildingSection {
  position: relative;
  padding: 100px 0 100px;
  overflow: hidden;
  isolation: isolate;
  color: var(--text-main);
}
.teamBuildingBg {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
              #f5a16a 0%,
              #f7b285 25%,
              #fac9a3 55%,
              #fbd9bd 80%,
              #fce6cf 100%);
  z-index: -1;
}


.teamBuildingIntro {
  margin-bottom: 44px;
}
.teamBuildingIntro h2 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: var(--text-main);
  font-size: clamp(32px, 4.2vw, 56px);
  letter-spacing: .5px;
  line-height: 1.1;
  margin-bottom: 22px;
  text-transform: uppercase;
}
.teamBuildingIntro p {
  font-family: var(--body-font);
  font-size: 17px;
  line-height: 1.65;
  color: var(--text-main);
  margin: 0;

}

.teamBuildingGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 70px;
  row-gap: 32px;
}

.teamBuildingItem h4 {
  font-family: var(--body-font);
  font-size: 21px;
  font-weight: 600;
  color: var(--text-main);
  margin-bottom: 6px;
  line-height: 1.25;
}
.teamBuildingItem p {
  font-family: var(--body-font);
  font-size: 16px;
  line-height: 1.65;
  color: var(--text-main);
  margin: 0;
}

@media (max-width: 1199px) {
  .teamBuildingSection { padding: 80px 0 90px; }
  .teamBuildingIntro { margin-bottom: 32px; }
  .teamBuildingIntro p { font-size: 15px; }
  .teamBuildingGrid { column-gap: 40px; row-gap: 24px; }
  .teamBuildingItem h4 { font-size: 18px; }
  .teamBuildingItem p { font-size: 14.5px; }
}
@media (max-width: 768px) {
  .teamBuildingSection { padding: 60px 0 70px; }
  .teamBuildingGrid { grid-template-columns: 1fr; row-gap: 22px; }
  .teamBuildingItem h4 br { display: none; }
}

/* ============================================================
   GO-KART RACING (content-page)
   ============================================================ */
.goKartSection {
  position: relative;
  padding: 100px 0 100px;
  overflow: hidden;
  isolation: isolate;
  color: var(--text-main);
}
.goKartBg {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
              #f7c024 0%,
              #fcd233 30%,
              #ffd941 55%,
              #ffd84a 78%,
              #f6c024 100%);
  z-index: -1;
}
.goKartBg::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(ellipse at 25% 30%, rgba(255,255,255,.35) 0, rgba(255,255,255,0) 35%),
    radial-gradient(ellipse at 75% 70%, rgba(255,255,255,.28) 0, rgba(255,255,255,0) 40%),
    radial-gradient(ellipse at 50% 50%, rgba(255,255,255,.18) 0, rgba(255,255,255,0) 55%);
  pointer-events: none;
}


.goKartIntro {
  margin-bottom: 56px;
}
.goKartIntro h2 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: var(--text-main);
  font-size: clamp(32px, 4.2vw, 56px);
  letter-spacing: .5px;
  line-height: 1.1;
  margin-bottom: 22px;
  text-transform: uppercase;
}
.goKartIntro p {
  font-family: var(--body-font);
  font-size: 17px;
  line-height: 1.7;
  color: var(--text-main);
  margin: 0;

}

.goKartDetails h3 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: var(--text-main);
  font-size: 30px;
  margin-bottom: 22px;
  line-height: 1.2;
}

.goKartGrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 70px;
  row-gap: 22px;

}

.goKartItem h4 {
  font-family: var(--body-font);
  font-size: 18px;
  font-weight: 700;
  color: var(--text-main);
  margin-bottom: 4px;
  line-height: 1.3;
}
.goKartItem p {
  font-family: var(--body-font);
  font-size: 16px;
  line-height: 1.5;
  color: var(--text-main);
  margin: 0;
}

@media (max-width: 1199px) {
  .goKartSection { padding: 80px 0 90px; }
  .goKartIntro { margin-bottom: 38px; }
  .goKartIntro p { font-size: 15px; }
  .goKartDetails h3 { font-size: 24px; margin-bottom: 16px; }
  .goKartGrid { column-gap: 40px; row-gap: 18px; }
  .goKartItem h4 { font-size: 16px; }
  .goKartItem p { font-size: 14.5px; }
}
@media (max-width: 768px) {
  .goKartSection { padding: 60px 0 70px; }
  .goKartIntro p { text-align: left; }
  .goKartGrid { grid-template-columns: 1fr; row-gap: 16px; }
}

/* ============================================================
   LASER TAG (content-page)
   ============================================================ */
.laserTagSection {
  position: relative;
  padding: 100px 0 100px;
  overflow: hidden;
  isolation: isolate;
  color: #fff;
}
.laserTagBg {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 70% 60%,
              #1f4a8a 0%,
              #163765 25%,
              #0f244a 55%,
              #081534 85%,
              #050d24 100%);
  z-index: -2;
}
.laserTagSparkles {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    radial-gradient(circle at 12% 20%, rgba(120, 200, 255, .35) 0, rgba(120, 200, 255, 0) 2px),
    radial-gradient(circle at 24% 78%, rgba(90, 170, 255, .3) 0, rgba(90, 170, 255, 0) 1.8px),
    radial-gradient(circle at 36% 32%, rgba(140, 210, 255, .28) 0, rgba(140, 210, 255, 0) 1.5px),
    radial-gradient(circle at 48% 88%, rgba(100, 180, 255, .35) 0, rgba(100, 180, 255, 0) 2.2px),
    radial-gradient(circle at 60% 14%, rgba(130, 200, 255, .3) 0, rgba(130, 200, 255, 0) 2px),
    radial-gradient(circle at 70% 55%, rgba(160, 220, 255, .35) 0, rgba(160, 220, 255, 0) 2px),
    radial-gradient(circle at 80% 78%, rgba(110, 190, 255, .28) 0, rgba(110, 190, 255, 0) 1.6px),
    radial-gradient(circle at 90% 26%, rgba(140, 210, 255, .32) 0, rgba(140, 210, 255, 0) 2px),
    radial-gradient(circle at 6% 50%, rgba(120, 200, 255, .25) 0, rgba(120, 200, 255, 0) 1.6px),
    radial-gradient(circle at 94% 60%, rgba(150, 215, 255, .3) 0, rgba(150, 215, 255, 0) 2px),
    radial-gradient(circle at 40% 50%, rgba(130, 200, 255, .25) 0, rgba(130, 200, 255, 0) 1.5px),
    radial-gradient(circle at 18% 44%, rgba(120, 195, 255, .25) 0, rgba(120, 195, 255, 0) 1.5px),
    radial-gradient(circle at 76% 30%, rgba(130, 205, 255, .28) 0, rgba(130, 205, 255, 0) 1.6px),
    radial-gradient(circle at 28% 92%, rgba(110, 195, 255, .25) 0, rgba(110, 195, 255, 0) 1.5px),
    radial-gradient(circle at 84% 92%, rgba(125, 200, 255, .28) 0, rgba(125, 200, 255, 0) 1.6px),
    radial-gradient(ellipse at 70% 60%, rgba(60, 130, 220, .18) 0, rgba(60, 130, 220, 0) 40%),
    radial-gradient(ellipse at 20% 30%, rgba(40, 90, 180, .15) 0, rgba(40, 90, 180, 0) 45%);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}



.laserTagTitle {
  font-family: var(--primary-font);
  font-weight: 400;
  color: #fff;
  font-size: clamp(32px, 4.2vw, 56px);
  letter-spacing: .5px;
  line-height: 1.1;
  margin-bottom: 30px;
  text-transform: uppercase;
}

.laserTagCopy {
  margin-bottom: 44px;

}
.laserTagCopy p {
  font-family: var(--body-font);
  font-size: 17px;
  line-height: 1.7;
  color: #fff;
  margin: 0 0 18px;
  text-align: justify;
}
.laserTagCopy p:last-child { margin-bottom: 0; }

.laserTagDetails h3 {
  font-family: var(--primary-font);
  font-weight: 400;
  color: #fff;
  font-size: 28px;
  margin-bottom: 16px;
  line-height: 1.2;
}

.laserTagList {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  row-gap: 10px;
}
.laserTagList li {
  font-family: var(--body-font);
  font-size: 16.5px;
  color: #fff;
  line-height: 1.55;
}
.laserTagList .laserTagLabel {
  font-weight: 700;
  margin-right: 6px;
}
.laserTagList .laserTagValue {
  font-weight: 400;
}

@media (max-width: 1199px) {
  .laserTagSection { padding: 80px 0 90px; }
  .laserTagTitle { margin-bottom: 22px; }
  .laserTagCopy { margin-bottom: 30px; }
  .laserTagCopy p { font-size: 15px; margin-bottom: 14px; }
  .laserTagDetails h3 { font-size: 22px; margin-bottom: 12px; }
  .laserTagList li { font-size: 14.5px; }
}
@media (max-width: 768px) {
  .laserTagSection { padding: 60px 0 70px; }
  .laserTagCopy p { text-align: left; }
}

/* ============================================================
   TRADITIONAL ART FORMS (content-page)
   ============================================================ */
.artFormsSection {
  position: relative;
  padding: 100px 0 100px;
  background: #000;
  color: #fff;
  overflow: hidden;
}

.artFormsInner {
  max-width: 1100px;
}

.artFormsTitle {
  font-family: var(--primary-font);
  font-weight: 400;
  color: #fff;
  font-size: clamp(34px, 4.4vw, 60px);
  letter-spacing: .5px;
  line-height: 1.05;
  margin-bottom: 56px;
  text-transform: uppercase;
}

.artFormsGroups {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 50px;
  row-gap: 40px;
}

.artFormsGroupTitle {
  font-family: var(--primary-font);
  font-weight: 400;
  color: var(--text-main);
  font-size: 26px;
  line-height: 1.2;
  margin-bottom: 18px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(0, 0, 0, .12);
}

.artFormsList {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  row-gap: 14px;
}
.artFormsList li {
  font-family: var(--body-font);
  font-size: 22px;
  font-weight: 500;
  color: #fff;
  line-height: 1.4;
  letter-spacing: .5px;
  padding-left: 22px;
  position: relative;
}
.artFormsList li::before {
  content: "-";
  position: absolute;
  left: 0;
  top: 0;
  color: #fff;
}
.artFormsList .artFormsQty {
  font-size: 14px;
  font-weight: 400;
  color: rgba(255,255,255,.75);
  letter-spacing: .5px;
  margin-left: 4px;
}

@media (max-width: 1199px) {
  .artFormsSection { padding: 80px 0 90px; }
  .artFormsTitle { margin-bottom: 36px; }
  .artFormsGroups { column-gap: 30px; row-gap: 30px; }
  .artFormsGroupTitle { font-size: 21px; margin-bottom: 14px; padding-bottom: 8px; }
  .artFormsList { row-gap: 10px; }
  .artFormsList li { font-size: 17px; }
  .artFormsList .artFormsQty { font-size: 12px; }
}
@media (max-width: 900px) {
  .artFormsGroups { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  .artFormsSection { padding: 60px 0 70px; }
  .artFormsGroups { grid-template-columns: 1fr; row-gap: 24px; }
  .artFormsGroupTitle { font-size: 19px; }
  .artFormsList li { font-size: 15px; }
  .artFormsList .artFormsQty { font-size: 11.5px; }
}

/* ============================================================
   CONTENT-PAGE — LIGHT THEME OVERRIDES
   Replaces all background images, dark backgrounds, gradients
   and white text with clean alternating light backgrounds and
   dark text for a unified look.
   ============================================================ */

/* Hide all background-image / overlay / sparkle / gradient layers */
.airportTransferBg,
.airportTransferOverlay,
.airportHospitalityBg,
.airportHospitalityOverlay,
.arrivalCulturalSparkles,
.snakeBoatRaceBg,
.snakeBoatRaceOverlay,
.discoverCochinBg,
.kochiWaterMetroBg,
.kochiWaterMetroOverlay,
.kadamakkudyBg,
.kadamakkudyOverlay,
.alappuzhaCruiseBg,
.alappuzhaCruiseOverlay,
.teamBuildingBg,
.goKartBg,
.laserTagBg,
.laserTagSparkles {
  display: none;
}

/* Alternating light section backgrounds */
.airportTransferSection,
.arrivalCulturalSection,
.artFormsSection,
.alappuzhaCruiseSection,
.goKartSection {
  background: #FAF8F4;
  color: var(--text-main);
}
.airportHospitalitySection,
.snakeBoatRaceSection,
.kadamakkudySection,
.teamBuildingSection,
.laserTagSection {
  background: #FFFFFF;
  color: var(--text-main);
}

/* Force dark text in sections that previously used white */
.arrivalCulturalSection .arrivalCulturalTitle,
.arrivalCulturalSection .arrivalCulturalItem h4,
.arrivalCulturalSection .arrivalCulturalItem .arrivalCulturalTagline {
  color: var(--text-main);
}
.arrivalCulturalSection .arrivalCulturalItem p {
  color: var(--text-muted);
}

.discoverCochinSection .discoverCochinIntro h2,
.discoverCochinSection .discoverCochinIntro p,
.discoverCochinSection .discoverCochinItem h4,
.discoverCochinSection .discoverCochinItem .discoverCochinTagline,
.discoverCochinSection .discoverCochinTourDetails h3 {
  color: var(--text-main);
}
.discoverCochinSection .discoverCochinItem p {
  color: var(--text-muted);
}

.alappuzhaCruiseSection .alappuzhaCruiseTitle,
.alappuzhaCruiseSection .alappuzhaCruiseLead h3,
.alappuzhaCruiseSection .alappuzhaCruiseTiming,
.alappuzhaCruiseSection .alappuzhaCruiseDesc,
.alappuzhaCruiseSection .alappuzhaCruiseHighlights h3,
.alappuzhaCruiseSection .alappuzhaCruiseList li,
.alappuzhaCruiseSection .alappuzhaCruiseList li::before {
  color: var(--text-main);
}

.laserTagSection .laserTagTitle,
.laserTagSection .laserTagCopy p,
.laserTagSection .laserTagDetails h3,
.laserTagSection .laserTagList li,
.laserTagSection .laserTagList .laserTagLabel,
.laserTagSection .laserTagList .laserTagValue {
  color: var(--text-main);
}

.artFormsSection .artFormsTitle,
.artFormsSection .artFormsList li,
.artFormsSection .artFormsList li::before {
  color: var(--text-main);
}
.artFormsSection .artFormsList .artFormsQty {
  color: var(--text-muted);
}
