

/* === REBUILD OVERRIDE: HERO VIDEO PRICE BOX (NEW) === */
.hero-video{ position:relative; }
.hero-video .hero-pricebox-new{
  position:absolute !important;
  right:24px !important;
  bottom:16px !important;
  top:auto !important;
  left:auto !important;
  z-index:25 !important;
  width:min(360px, 46vw) !important;
  padding:18px 22px !important;
  border-radius:18px !important;
  border:1px solid rgba(130, 200, 255, .55) !important;
  background:rgba(18, 56, 78, .35) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  text-align:center !important;
  pointer-events:none !important;
}
.hero-video .hero-pricebox-new .hpbn-top{
  font-weight:600 !important;
  color:#ffffff !important;
  opacity:.95 !important;
  margin:0 0 8px 0 !important;
  line-height:1.2 !important;
}
.hero-video .hero-pricebox-new .hpbn-price{
  font-weight:800 !important;
  color:#20e38a !important;
  font-size:34px !important;
  line-height:1.1 !important;
  margin:0 0 10px 0 !important;
  white-space:nowrap !important;
}
.hero-video .hero-pricebox-new .hpbn-bottom{
  font-weight:600 !important;
  color:#ffffff !important;
  opacity:.95 !important;
  margin:0 !important;
  line-height:1.2 !important;
}

/* === REBUILD OVERRIDE: THEME PARKS CARDS (NEW) === */
#theme-parks .tp-grid.tp-grid-new{
  display:grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap:18px !important;
  align-items:stretch !important;
}
@media (max-width: 1200px){
  #theme-parks .tp-grid.tp-grid-new{ grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 680px){
  #theme-parks .tp-grid.tp-grid-new{ grid-template-columns: 1fr !important; }
}

#theme-parks .tp-card-new{
  border-radius:22px !important;
  overflow:hidden !important;
  background:rgba(15, 24, 44, .85) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,.35) !important;
  display:flex !important;
  flex-direction:column !important;
  min-height:520px !important;
}

#theme-parks .tp-cardnew-imgwrap{
  height:210px !important;
  background:#0b1326 !important;
}
#theme-parks .tp-cardnew-img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}

#theme-parks .tp-cardnew-body{
  padding:22px 22px 20px !important;
  display:flex !important;
  flex-direction:column !important;
  flex:1 1 auto !important;
}

#theme-parks .tp-cardnew-title{
  margin:0 0 10px 0 !important;
  font-size:24px !important;
  line-height:1.15 !important;
  color:#fff !important;
  font-weight:800 !important;
}
#theme-parks .tp-cardnew-desc{
  margin:0 !important;
  color:rgba(255,255,255,.78) !important;
  line-height:1.5 !important;
  min-height:96px !important;
}
#theme-parks .tp-cardnew-spacer{ flex:1 1 auto !important; }

#theme-parks .tp-cardnew-bestfor{
  margin:18px 0 12px 0 !important;
  color:rgba(255,255,255,.78) !important;
  font-size:13px !important;
}
#theme-parks .tp-cardnew-cta{
  display:block !important;
  text-align:center !important;
  padding:12px 14px !important;
  border-radius:999px !important;
  border:1px solid rgba(90, 170, 255, .45) !important;
  background:rgba(20, 45, 85, .65) !important;
  color:#eaf3ff !important;
  font-weight:700 !important;
  text-decoration:none !important;
  margin-top:auto !important;
}


/* ===== Index page fixes (v5 - FINAL lock) ===== */

/* (2) Pencil/kicker headings: force Contact/global kicker style */
.section-kicker,
.tp-kicker,
.wbj-kicker,
.why-yas-kicker {
  display: inline-block !important;
  font-size: 13px !important;
  font-weight: 400 !important; /* matches ../assets/global/css/typography.css */
  letter-spacing: .45em !important;
  text-transform: uppercase !important;
  color: var(--yas-cyan, #55c7ff) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* If any section CSS wraps kickers in pills/boxes, kill it */
.section-kicker::before,
.section-kicker::after,
.tp-kicker::before,
.tp-kicker::after,
.wbj-kicker::before,
.wbj-kicker::after {
  content: none !important;
}

/* (5) Center the subsection heading blocks + their subtitles */
#theme-parks .tp-header { 
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
#theme-parks .tp-header .tp-title,
#theme-parks .tp-header .tp-subtitle {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.wbj-block {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.wbj-block h2,
.wbj-block p {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Safety: any accidental left alignment on these blocks */
#theme-parks .tp-header * ,
.wbj-block * {
  text-align: inherit !important;
}

/* (3) Theme parks: ensure CTA spacing stays (keep from earlier if needed) */
#theme-parks .tp-grid { margin-bottom: 40px !important; }
#theme-parks .tp-cta-row { margin-top: 28px !important; }


/* ===== INDEX A2 STABLE FIXES (do not edit other rules above) ===== */

/* 1) Header -> page spacing (hero only) */
section.hero{
  padding-top: 12px !important;
  margin-top: 0 !important;
}

/* 2) Capsule border for the HOLIDAY PACKAGES line (hero-kicker) */
.hero-kicker{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(85, 199, 255, 0.45) !important;
  border-radius: 999px !important;
  padding: 12px 18px !important;
  background: transparent !important;
}

/* 3) Pencil heading (WHY YAS ISLAND) match Contact exactly */
.why-yas-kicker{
  font-size: 13px !important;
  font-weight: 400 !important;
  letter-spacing: .45em !important;
  text-transform: uppercase !important;
  color: var(--yas-cyan, #55c7ff) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
.why-yas-kicker *{ color: inherit !important; }

/* 4) Packages cards image-top pencil text -> WHITE */
.yip-card-content .yip-top-kicker,
.yip-card-content .yip-top-kicker *{
  color: #ffffff !important;
  opacity: 1 !important;
}


/* =====================================================
   INDEX (Home) – Requested refinements (LOCKED)
   1) Reduce hero-kicker capsule right padding to visually align with hero heading
   2) Make section pencil headings consistent (WHY / PACKAGES / THEME PARKS)
   ===================================================== */

/* 1) Hero capsule width/padding refinement */
.hero-kicker{
  padding: 10px 14px !important; /* reduced from 12x18 */
}

/* 2) Pencil headings consistency */
.why-yas .section-kicker,
.yip-kicker,
.tp-kicker{
  display: inline-block !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  letter-spacing: .45em !important;
  text-transform: uppercase !important;
  color: #31c7ff !important; /* matches Theme Parks pencil */
}


/* ===== END INDEX A2 STABLE FIXES ===== */


/* =====================================================
   LOCKED PATCH – INDEX POINT 3 & 4 (do not edit)
   - Point 3: make package card image pencil headings white
   - Point 4: force all gradient capsule CTAs to match header Contact pill
   ===================================================== */

/* Point 3 – package image pencil headings (WEEKEND ESCAPE / MOST POPULAR / ULTIMATE ADVENTURE) */
#yas-island-packages .yip-top-kicker,
#yas-island-packages .yip-card-top .yip-top-kicker,
#yas-island-packages .yip-card-top [class*="kicker"]{
  color: #ffffff !important;
  opacity: 1 !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.55);
}

/* Point 4 – capsule gradient CTAs: match header .contact-pill */
:root{
  --index-pill-grad: linear-gradient(90deg, #31c7ff 0%, #6f63ff 45%, #ff4cc4 100%);
  --index-pill-text: #111111;
}

/* Apply to ONLY the capsule CTAs on homepage */
.tp-explore-btn,
.thingsdo-locked .thingsdo-btn,
.readyplan-locked .readyplan-btn,
.yip-viewall .yip-btn-gradient{
  background: var(--index-pill-grad) !important;
  color: var(--index-pill-text) !important;
  border: 0 !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Prevent any hover rules from removing the gradient */
.tp-explore-btn:hover,
.thingsdo-locked .thingsdo-btn:hover,
.readyplan-locked .readyplan-btn:hover,
.yip-viewall .yip-btn-gradient:hover{
  background: var(--index-pill-grad) !important;
  color: var(--index-pill-text) !important;
  filter: brightness(1.02) !important;
}

/* In case buttons use pseudo elements/overlays */
.tp-explore-btn::before, .tp-explore-btn::after,
.thingsdo-locked .thingsdo-btn::before, .thingsdo-locked .thingsdo-btn::after,
.readyplan-locked .readyplan-btn::before, .readyplan-locked .readyplan-btn::after,
.yip-viewall .yip-btn-gradient::before, .yip-viewall .yip-btn-gradient::after{
  background: transparent !important;
}


/* =========================
   HOME PAGE FINAL FIXES (07 Jan 2026)
   - Header spacing + stability
   - WhatsApp/topbar consistency
   - Hero video brightness (remove overlay)
   ========================= */

/* Solid white header on home (avoid backdrop-filter glitch on some mobiles) */
.homepage-locked .site-header{
  background:#fff !important;
  border-bottom:1px solid rgba(15,23,42,.12) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* Reduce nav gaps so tabs don't collide with logos / contact */
@media (min-width: 601px){
  .homepage-locked .site-header .container.nav{gap:10px !important;}
  .homepage-locked .site-header .nav-links{gap:16px !important;}
  .homepage-locked .site-header .nav-links a{font-size:15px !important;}
  .homepage-locked .site-header .nav-right{min-width:260px !important; gap:14px !important;}
  .homepage-locked .site-header .nav-contact{font-size:13px !important;}
  .homepage-locked .site-header .lang-switch{margin-inline-start:10px !important;}
}

/* Ensure header stays fully visible while scrolling on mobile */
@media (max-width: 900px){
  .homepage-locked .site-header{position:sticky; top:0;}
}

/* Hero video: remove dark overlay (video looked dull) */
.homepage-locked .hero-video .overlay{
  background: transparent !important;
  opacity: 0 !important;
}

/* =========================
   HOME PAGE FIXES (Jan 2026 Update 5)
   - Header spacing + wording
   - WhatsApp CTA already updated in HTML
   - Hero video brightness (remove overlay)
   ========================= */

/* Solid white sticky header (avoid backdrop-filter rendering glitches) */
.homepage-locked .site-header{
  background: #fff !important;
  border-bottom: 1px solid rgba(15,23,42,0.12) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Desktop/tablet: reduce nav gaps to prevent overlap with logos/contact */
@media (min-width: 601px){
  .homepage-locked .site-header .nav{
    gap: 10px !important;
  }
  .homepage-locked .site-header .nav-links{
    gap: 16px !important;
  }
  .homepage-locked .site-header .nav-links a{
    font-size: 15px !important;
  }
  .homepage-locked .site-header .nav-right{
    min-width: 260px !important;
    gap: 12px !important;
  }
  .homepage-locked .site-header .lang-switch{
    margin-inline-start: 10px !important;
  }
}

/* Hero video: remove dark overlay so it matches original brightness */
.homepage-locked .hero-video .overlay{
  background: none !important;
  opacity: 0 !important;
}
