/* =============================================================================
   HARSHYA.IN — COMPONENT DESIGN SYSTEM v2.0
   Covers every UI component on the homepage with consistent visual design.
   Load order: layout-system.css → jk-navbar.css → components.css
   ============================================================================= */

/* ===========================================================================
   COMPONENT 1: SECTION DIVIDER
   =========================================================================== */
.bp-section-divider-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  max-width: var(--content-max, 1200px) !important;
  margin: 40px auto 28px !important;
  padding: 0 var(--content-padding, 28px) !important;
}
.bp-divider-line {
  flex: 1 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent 0%, var(--brand-red, #9E483F) 100%) !important;
  opacity: 0.25 !important;
}
.bp-divider-line.right {
  background: linear-gradient(90deg, var(--brand-red, #9E483F) 0%, transparent 100%) !important;
}
.bp-divider-title {
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.24em !important;
  color: var(--brand-red, #9E483F) !important;
  background: var(--surface-canvas, #FAF0E1) !important;
  border: 1px solid var(--border-soft, #E5C8A2) !important;
  padding: 5px 18px !important;
  border-radius: 999px !important;
  text-transform: uppercase !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  white-space: nowrap !important;
  box-shadow: 0 2px 8px rgba(158, 72, 63, 0.08) !important;
}
.bp-divider-gem {
  font-size: 8px !important;
  opacity: 0.7 !important;
}

/* ===========================================================================
   COMPONENT 2: EXPERIENCE HUB (Tab Switcher)
   =========================================================================== */
.bp-experience-hub {
  max-width: var(--content-max, 1200px) !important;
  margin: 0 auto 48px !important;
  padding: 0 var(--content-padding, 28px) !important;
}
.bp-exp-header {
  text-align: center !important;
  margin-bottom: 28px !important;
}
.bp-exp-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: var(--brand-red, #9E483F) !important;
  background: rgba(158, 72, 63, 0.08) !important;
  border: 1px solid rgba(158, 72, 63, 0.2) !important;
  padding: 4px 14px !important;
  border-radius: 999px !important;
  margin-bottom: 12px !important;
}
.bp-exp-heading {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: clamp(1.5rem, 3vw, 2rem) !important;
  font-weight: 800 !important;
  color: #18181B !important;
  margin-bottom: 8px !important;
  line-height: 1.2 !important;
}
.bp-exp-subtitle {
  font-size: 14px !important;
  color: var(--text-muted, #6E524B) !important;
  max-width: 580px !important;
  margin: 0 auto !important;
  line-height: 1.6 !important;
}

/* Tab Row */
.bp-exp-tabs-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  margin-bottom: 24px !important;
}
.bp-exp-tab {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 9px 20px !important;
  border-radius: 999px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: var(--text-secondary, #4A322D) !important;
  background: var(--surface-card, #FFFDF9) !important;
  border: 1.5px solid var(--border-soft, #E5C8A2) !important;
  cursor: pointer !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  white-space: nowrap !important;
  font-family: var(--font-sans) !important;
}
.bp-exp-tab:hover {
  border-color: var(--brand-red, #9E483F) !important;
  color: var(--brand-red, #9E483F) !important;
  background: rgba(158, 72, 63, 0.06) !important;
}
.bp-exp-tab.active {
  background: var(--brand-red, #9E483F) !important;
  border-color: var(--brand-red, #9E483F) !important;
  color: var(--surface-soft, #F5E1C5) !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 14px rgba(158, 72, 63, 0.3) !important;
}
.tab-icon {
  font-size: 15px !important;
  line-height: 1 !important;
}

/* Experience Card (Two-Column: Media + Content) */
.bp-exp-card {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 0 !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  border: 1px solid var(--border-soft, #E5C8A2) !important;
  box-shadow: 0 8px 32px rgba(42, 24, 21, 0.10) !important;
  background: var(--surface-card, #FFFDF9) !important;
  min-height: 320px !important;
}
.bp-exp-card-media {
  position: relative !important;
  overflow: hidden !important;
}
.bp-exp-card-media img,
#expMediaImg {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.6s ease !important;
  min-height: 280px !important;
}
.bp-exp-card:hover .bp-exp-card-media img {
  transform: scale(1.04) !important;
}
.bp-exp-media-overlay {
  position: absolute !important;
  bottom: 16px !important;
  left: 16px !important;
}
.bp-exp-media-pill {
  display: inline-block !important;
  font-size: 9.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #FFFDF9 !important;
  background: rgba(42, 24, 21, 0.72) !important;
  backdrop-filter: blur(8px) !important;
  padding: 4px 12px !important;
  border-radius: 6px !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
}

/* Content side */
.bp-exp-card-content {
  padding: 32px 32px 28px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}
.bp-exp-kicker {
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 0.2em !important;
  text-transform: uppercase !important;
  color: var(--brand-red, #9E483F) !important;
  margin-bottom: 10px !important;
}
.bp-exp-title {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: clamp(1.25rem, 2.5vw, 1.6rem) !important;
  font-weight: 800 !important;
  color: #18181B !important;
  line-height: 1.25 !important;
  margin-bottom: 12px !important;
}
.bp-exp-desc {
  font-size: 13.5px !important;
  color: var(--text-secondary, #4A322D) !important;
  line-height: 1.7 !important;
  margin-bottom: 20px !important;
}
.bp-exp-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-bottom: 24px !important;
}
.exp-tag {
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: var(--text-secondary, #4A322D) !important;
  background: var(--surface-canvas, #FAF0E1) !important;
  border: 1px solid var(--border-soft, #E5C8A2) !important;
  padding: 4px 12px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}
.bp-exp-actions {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}
.bp-exp-cta-primary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: var(--brand-red, #9E483F) !important;
  color: var(--surface-soft, #F5E1C5) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 10px 22px !important;
  border-radius: 999px !important;
  text-decoration: none !important;
  box-shadow: 0 4px 14px rgba(158, 72, 63, 0.3) !important;
  transition: all 0.2s ease !important;
}
.bp-exp-cta-primary:hover {
  background: var(--brand-red-dark, #82362E) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 18px rgba(158, 72, 63, 0.4) !important;
}
.bp-exp-cta-secondary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--brand-red, #9E483F) !important;
  text-decoration: none !important;
  border: 1.5px solid rgba(158, 72, 63, 0.3) !important;
  padding: 9px 18px !important;
  border-radius: 999px !important;
  background: transparent !important;
  transition: all 0.2s ease !important;
}
.bp-exp-cta-secondary:hover {
  background: rgba(158, 72, 63, 0.07) !important;
  border-color: var(--brand-red, #9E483F) !important;
}

/* ===========================================================================
   COMPONENT 3: FIVE PILLARS GRID + PANORAMIC DISCOVERY TOUR
   =========================================================================== */
.bp-pillars-header-block {
  text-align: center !important;
  max-width: 820px !important;
  margin: 0 auto 30px !important;
  padding: 0 20px !important;
}
.bp-pillars-kicker {
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: #9E483F !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: rgba(158, 72, 63, 0.08) !important;
  padding: 5px 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(158, 72, 63, 0.18) !important;
  margin-bottom: 10px !important;
}
.bp-pillars-kicker-dot {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #9E483F !important;
  display: inline-block !important;
}
.bp-pillars-main-title {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: clamp(1.6rem, 2.8vw, 2.2rem) !important;
  font-weight: 800 !important;
  color: #2A1815 !important;
  line-height: 1.2 !important;
  margin: 0 0 10px !important;
}
.bp-pillars-subtitle {
  font-size: 14px !important;
  color: #6E524B !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

.bp-pillars-grid {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 16px !important;
  max-width: 1400px !important;
  margin: 0 auto 28px !important;
  padding: 0 var(--content-padding, 28px) !important;
  align-items: stretch !important;
}

/* Pillar Card */
.bp-pillar-card {
  background: linear-gradient(180deg, #FFFDF9 0%, #FAF0E1 100%) !important;
  border: 1.5px solid rgba(158, 72, 63, 0.16) !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: 0 4px 16px rgba(158, 72, 63, 0.06) !important;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s ease, border-color 0.28s ease !important;
  position: relative !important;
}
.bp-pillar-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 20px 42px rgba(158, 72, 63, 0.16) !important;
  border-color: #9E483F !important;
}

.bp-pillar-accent-bar {
  height: 3.5px !important;
  width: 100% !important;
  display: block !important;
}
.bp-card-edu .bp-pillar-accent-bar { background: linear-gradient(90deg, #9E483F, #C17A3A) !important; }
.bp-card-quiz .bp-pillar-accent-bar { background: linear-gradient(90deg, #7A3060, #9E483F) !important; }
.bp-card-sports .bp-pillar-accent-bar { background: linear-gradient(90deg, #B85D3B, #D97706) !important; }
.bp-card-news .bp-pillar-accent-bar { background: linear-gradient(90deg, #82362E, #9E483F) !important; }
.bp-card-images .bp-pillar-accent-bar { background: linear-gradient(90deg, #5C2822, #7A3060) !important; }

/* Photo window */
.bp-pillar-art {
  height: 155px !important;
  width: 100% !important;
  overflow: hidden !important;
  position: relative !important;
  background: #2A1815 !important;
  display: block !important;
  text-decoration: none !important;
}
.bp-pillar-art img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.bp-pillar-card:hover .bp-pillar-art img {
  transform: scale(1.08) !important;
}
.bp-pillar-art-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg, rgba(0,0,0,0.12) 0%, rgba(42,24,21,0.55) 100%) !important;
  pointer-events: none !important;
}
.bp-pillar-art-badge {
  position: absolute !important;
  top: 10px !important;
  left: 10px !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  color: #FFFDF9 !important;
  background: rgba(42, 24, 21, 0.7) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  text-transform: uppercase !important;
  z-index: 2 !important;
}
.bp-pillar-art-stat {
  position: absolute !important;
  bottom: 10px !important;
  right: 10px !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  color: #2A1815 !important;
  background: rgba(255, 253, 249, 0.94) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  padding: 3px 9px !important;
  border-radius: 999px !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.22) !important;
  z-index: 2 !important;
}

/* Body */
.bp-pillar-body {
  padding: 16px 18px 18px !important;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
}
.bp-pillar-meta-row {
  margin-bottom: 8px !important;
}
.bp-pillar-title {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: 1.25rem !important;
  font-weight: 800 !important;
  color: #2A1815 !important;
  line-height: 1.2 !important;
  margin: 0 0 3px !important;
  transition: color 0.18s ease !important;
}
.bp-pillar-title-link {
  text-decoration: none !important;
}
.bp-pillar-card:hover .bp-pillar-title {
  color: #9E483F !important;
}
.bp-pillar-subtitle {
  font-size: 10.5px !important;
  font-weight: 700 !important;
  color: #9E483F !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  display: block !important;
}
.bp-pillar-desc {
  font-size: 11.5px !important;
  color: #4A322D !important;
  line-height: 1.55 !important;
  margin: 0 0 14px !important;
  flex: 1 1 auto !important;
}

/* Sub links / Topic chips */
.bp-pillar-sublinks {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-bottom: 16px !important;
}
.bp-pillar-sublinks a {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #2A1815 !important;
  background: #FFFDF9 !important;
  border: 1px solid rgba(158, 72, 63, 0.18) !important;
  padding: 4px 9px !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  transition: all 0.18s ease !important;
}
.bp-pillar-sublinks a:hover {
  background: #9E483F !important;
  color: #FFFDF9 !important;
  border-color: #82362E !important;
  transform: translateY(-1px) !important;
}
.chip-icon {
  font-size: 11px !important;
}

/* CTA Button */
.bp-pillar-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  height: 38px !important;
  border-radius: 12px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 4px 12px rgba(158, 72, 63, 0.22) !important;
  border: none !important;
}
.btn-edu { background: linear-gradient(135deg, #9E483F, #82362E) !important; color: #FFFDF9 !important; }
.btn-quiz { background: linear-gradient(135deg, #7A3060, #5C2448) !important; color: #FFFDF9 !important; }
.btn-sports { background: linear-gradient(135deg, #B85D3B, #944527) !important; color: #FFFDF9 !important; }
.btn-news { background: linear-gradient(135deg, #82362E, #692821) !important; color: #FFFDF9 !important; }
.btn-images { background: linear-gradient(135deg, #5C2822, #441A16) !important; color: #FFFDF9 !important; }
.bp-pillar-btn:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(158, 72, 63, 0.35) !important;
  opacity: 0.95 !important;
}

/* Panoramic Cinematic Discovery Tour Showcase Banner */
.bp-discovery-cinematic-banner {
  max-width: 1400px !important;
  margin: 0 auto 44px !important;
  padding: 0 var(--content-padding, 28px) !important;
  box-sizing: border-box !important;
  display: block !important;
  cursor: pointer !important;
  text-decoration: none !important;
}
.bp-discovery-cinematic-banner > .bp-disc-content {
  background: linear-gradient(135deg, rgba(42, 24, 21, 0.92) 0%, rgba(158, 72, 63, 0.88) 100%),
              url('/assets/images/region_ladakh_landscape.jpg') center/cover no-repeat !important;
  border-radius: 20px !important;
  padding: 28px 34px !important;
  border: 1.5px solid rgba(245, 225, 197, 0.3) !important;
  box-shadow: 0 12px 36px rgba(42, 24, 21, 0.22) !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 28px !important;
  flex-wrap: wrap !important;
  position: relative !important;
  overflow: hidden !important;
}
.bp-discovery-cinematic-banner:hover > .bp-disc-content {
  transform: translateY(-3px) !important;
  box-shadow: 0 18px 48px rgba(158, 72, 63, 0.32) !important;
}
.bp-disc-left {
  flex: 1 1 540px !important;
}
.bp-disc-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: #F5E1C5 !important;
  background: rgba(255, 255, 255, 0.12) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  padding: 4px 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(245, 225, 197, 0.25) !important;
  margin-bottom: 12px !important;
}
.bp-disc-pulse {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #F5E1C5 !important;
  box-shadow: 0 0 10px #F5E1C5 !important;
  display: inline-block !important;
}
.bp-disc-title {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: clamp(1.4rem, 2.5vw, 1.85rem) !important;
  font-weight: 800 !important;
  color: #FFFDF9 !important;
  line-height: 1.25 !important;
  margin: 0 0 8px !important;
  text-shadow: 0 2px 10px rgba(0,0,0,0.3) !important;
}
.bp-disc-desc {
  font-size: 13.5px !important;
  color: #FAF0E1 !important;
  line-height: 1.6 !important;
  margin: 0 0 14px !important;
  opacity: 0.95 !important;
  max-width: 680px !important;
}
.bp-disc-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}
.bp-disc-tag {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: #F5E1C5 !important;
  background: rgba(0, 0, 0, 0.28) !important;
  padding: 5px 12px !important;
  border-radius: 6px !important;
  border: 1px solid rgba(245, 225, 197, 0.2) !important;
}
.bp-disc-right {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  flex-shrink: 0 !important;
}
.bp-disc-play-circle {
  width: 58px !important;
  height: 58px !important;
  border-radius: 50% !important;
  background: #9E483F !important;
  border: 3px solid #FAF0E1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 6px 20px rgba(0,0,0,0.35) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}
.bp-discovery-cinematic-banner:hover .bp-disc-play-circle {
  transform: scale(1.1) !important;
  box-shadow: 0 8px 26px rgba(158, 72, 63, 0.6) !important;
}
.bp-disc-play-icon {
  color: #FAF0E1 !important;
  font-size: 18px !important;
  margin-left: 3px !important;
}
.bp-disc-cta-label {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  color: #FFFDF9 !important;
}
.bp-disc-cta-label strong {
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 0.02em !important;
}
.bp-disc-cta-label small {
  font-size: 11px !important;
  color: #F5E1C5 !important;
  opacity: 0.85 !important;
}

/* ===========================================================================
   COMPONENT 4: WONDER + TONGUE SECTION (Two Cards Side by Side)
   =========================================================================== */
.bp-wonder-tongue-section {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  max-width: var(--content-max, 1200px) !important;
  margin: 0 auto 44px !important;
  padding: 0 var(--content-padding, 28px) !important;
}

/* Shared card shell */
.bp-wonder-card,
.bp-tongue-card {
  background: var(--surface-card, #FFFDF9) !important;
  border: 1.5px solid var(--border-soft, #E5C8A2) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 16px rgba(158, 72, 63, 0.06) !important;
  display: flex !important;
  flex-direction: column !important;
  transition: box-shadow 0.22s ease !important;
}
.bp-wonder-card:hover,
.bp-tongue-card:hover {
  box-shadow: 0 10px 32px rgba(158, 72, 63, 0.12) !important;
}

/* Card header bar */
.bp-wt-card-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 14px 20px !important;
  border-bottom: 1px solid var(--border-subtle, #EFE0C9) !important;
  background: rgba(245, 225, 197, 0.35) !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
.bp-wt-tag {
  font-size: 10px !important;
  font-weight: 800 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  color: var(--brand-red, #9E483F) !important;
}
.bp-wt-shuffle-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: var(--brand-red, #9E483F) !important;
  background: rgba(158, 72, 63, 0.08) !important;
  border: 1px solid rgba(158, 72, 63, 0.2) !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  font-family: var(--font-sans) !important;
}
.bp-wt-shuffle-btn:hover {
  background: var(--brand-red, #9E483F) !important;
  color: #FFFFFF !important;
  border-color: var(--brand-red, #9E483F) !important;
}

/* Wonder body */
.bp-wonder-body {
  padding: 20px 22px !important;
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
}
.bp-wonder-badge {
  display: inline-block !important;
  font-size: 9.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: var(--brand-gold, #C17A3A) !important;
  background: rgba(193, 122, 58, 0.1) !important;
  border: 1px solid rgba(193, 122, 58, 0.25) !important;
  padding: 3px 10px !important;
  border-radius: 6px !important;
  margin-bottom: 12px !important;
  width: fit-content !important;
}
.bp-wonder-title {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: 1.25rem !important;
  font-weight: 800 !important;
  color: #18181B !important;
  line-height: 1.3 !important;
  margin-bottom: 12px !important;
}
.bp-wonder-fact {
  font-size: 13px !important;
  color: var(--text-secondary, #4A322D) !important;
  line-height: 1.7 !important;
  flex: 1 !important;
  margin-bottom: 20px !important;
}
.bp-wonder-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-top: 14px !important;
  border-top: 1px solid var(--border-subtle, #EFE0C9) !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
.bp-wonder-counter {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--text-muted, #6E524B) !important;
}
.bp-wonder-explore {
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: var(--brand-red, #9E483F) !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  transition: gap 0.15s ease !important;
}
.bp-wonder-explore:hover { gap: 8px !important; }

/* Tongue (language) body */
.bp-tongue-body {
  padding: 20px 22px !important;
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
}
.bp-tongue-original {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: 1.6rem !important;
  font-weight: 700 !important;
  color: var(--brand-red, #9E483F) !important;
  line-height: 1.35 !important;
  margin-bottom: 6px !important;
  direction: auto !important;
}
.bp-tongue-roman {
  font-family: var(--font-script, 'Caveat', cursive) !important;
  font-size: 1.2rem !important;
  color: var(--brand-gold, #C17A3A) !important;
  margin-bottom: 14px !important;
}
.bp-tongue-meaning {
  font-size: 13px !important;
  color: var(--text-secondary, #4A322D) !important;
  line-height: 1.65 !important;
  margin-bottom: 12px !important;
  flex: 1 !important;
}
.bp-tongue-meaning strong {
  font-weight: 700 !important;
  color: #18181B !important;
}
.bp-tongue-context {
  font-size: 12px !important;
  color: var(--text-muted, #6E524B) !important;
  background: rgba(245, 225, 197, 0.5) !important;
  border-left: 3px solid var(--brand-red, #9E483F) !important;
  padding: 8px 12px !important;
  border-radius: 0 8px 8px 0 !important;
  margin-bottom: 16px !important;
  line-height: 1.55 !important;
}
.context-bullet { font-weight: 700 !important; color: var(--brand-red, #9E483F) !important; }

.bp-tongue-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-top: 14px !important;
  border-top: 1px solid var(--border-subtle, #EFE0C9) !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
.bp-pronounce-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: var(--brand-red, #9E483F) !important;
  background: rgba(158, 72, 63, 0.08) !important;
  border: 1px solid rgba(158, 72, 63, 0.22) !important;
  border-radius: 999px !important;
  padding: 6px 14px !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  font-family: var(--font-sans) !important;
}
.bp-pronounce-btn:hover {
  background: var(--brand-red, #9E483F) !important;
  color: #FFFFFF !important;
}

/* Language pill selector */
.bp-lang-pill-selector {
  display: flex !important;
  gap: 4px !important;
}
.bp-lang-btn {
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  border: 1px solid var(--border-soft, #E5C8A2) !important;
  background: transparent !important;
  color: var(--text-muted, #6E524B) !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  font-family: var(--font-sans) !important;
}
.bp-lang-btn:hover {
  border-color: var(--brand-red, #9E483F) !important;
  color: var(--brand-red, #9E483F) !important;
}
.bp-lang-btn.active {
  background: var(--brand-red, #9E483F) !important;
  border-color: var(--brand-red, #9E483F) !important;
  color: #FFFFFF !important;
}

/* ===========================================================================
   COMPONENT 5: ITINERARY TRIP PLANNER
   =========================================================================== */
.bp-itinerary-matcher-section {
  max-width: var(--content-max, 1200px) !important;
  margin: 0 auto 48px !important;
  padding: 0 var(--content-padding, 28px) !important;
}
.bp-itinerary-box {
  background: linear-gradient(145deg, #FFFDF9 0%, #FAF0E1 100%) !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  padding: 30px 32px !important;
  box-shadow: 0 8px 30px rgba(158, 72, 63, 0.08), 0 2px 8px rgba(0, 0, 0, 0.03) !important;
  border: 1.5px solid rgba(158, 72, 63, 0.22) !important;
}
.bp-itinerary-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  margin-bottom: 24px !important;
  padding-bottom: 20px !important;
  border-bottom: 1.5px solid rgba(158, 72, 63, 0.14) !important;
}
.bp-itin-kicker {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #9E483F !important;
  background: rgba(158, 72, 63, 0.09) !important;
  border: 1px solid rgba(158, 72, 63, 0.2) !important;
  padding: 4px 12px !important;
  border-radius: 999px !important;
  margin-bottom: 6px !important;
}
.bp-itin-heading {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: clamp(1.35rem, 2.5vw, 1.75rem) !important;
  font-weight: 800 !important;
  color: #2A1815 !important;
  line-height: 1.25 !important;
  margin: 0 !important;
}

/* Duration buttons */
.bp-days-btn-group {
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
.bp-day-btn {
  padding: 8px 18px !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  background: #FFFDF9 !important;
  border: 1.5px solid rgba(158, 72, 63, 0.22) !important;
  color: #4A322D !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif) !important;
  white-space: nowrap !important;
}
.bp-day-btn:hover {
  background: #F5E1C5 !important;
  border-color: #9E483F !important;
  color: #9E483F !important;
}
.bp-day-btn.active {
  background: linear-gradient(135deg, #9E483F 0%, #82362E 100%) !important;
  border-color: #82362E !important;
  color: #FFFDF9 !important;
  box-shadow: 0 4px 14px rgba(158, 72, 63, 0.32) !important;
}

/* Result grid */
.bp-itin-result-grid {
  display: grid !important;
  grid-template-columns: 1.35fr 1fr !important;
  gap: 24px !important;
  align-items: stretch !important;
  background: #FFFFFF !important;
  border-radius: 16px !important;
  padding: 24px 26px !important;
  border: 1.5px solid rgba(158, 72, 63, 0.16) !important;
  box-shadow: 0 4px 16px rgba(74, 55, 50, 0.04) !important;
}
.bp-itin-badge {
  display: inline-block !important;
  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif) !important;
  font-size: 10.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: #9E483F !important;
  background: rgba(158, 72, 63, 0.08) !important;
  border: 1px solid rgba(158, 72, 63, 0.2) !important;
  padding: 3px 10px !important;
  border-radius: 6px !important;
  margin-bottom: 10px !important;
}
.bp-itin-circuit {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: 1.4rem !important;
  font-weight: 800 !important;
  color: #2A1815 !important;
  line-height: 1.3 !important;
  margin-bottom: 10px !important;
}
.bp-itin-overview {
  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif) !important;
  font-size: 13.5px !important;
  color: #374151 !important;
  line-height: 1.65 !important;
  margin-bottom: 18px !important;
}
.bp-itin-stats-row {
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  background: #FAF0E1 !important;
  padding: 12px 16px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(158, 72, 63, 0.12) !important;
}
.bp-itin-stat {
  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif) !important;
  font-size: 12.5px !important;
  color: #4A322D !important;
}
.stat-label {
  font-weight: 600 !important;
  color: #6E524B !important;
  margin-right: 6px !important;
}
.bp-itin-stat strong {
  color: #9E483F !important;
  font-weight: 800 !important;
}

/* Highlights card */
.bp-itin-highlights-card {
  background: #FAF0E1 !important;
  border: 1.5px solid rgba(158, 72, 63, 0.16) !important;
  border-radius: 14px !important;
  padding: 20px 22px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  height: 100% !important;
  box-sizing: border-box !important;
}
.highlights-title {
  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif) !important;
  font-size: 11.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #82362E !important;
  margin-bottom: 12px !important;
}
.highlights-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 18px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}
.highlights-list li {
  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif) !important;
  font-size: 13px !important;
  color: #2A1815 !important;
  padding-left: 20px !important;
  position: relative !important;
  line-height: 1.5 !important;
}
.highlights-list li::before {
  content: '✓' !important;
  position: absolute !important;
  left: 0 !important;
  color: #9E483F !important;
  font-weight: 800 !important;
  font-size: 13px !important;
}
.bp-itin-action-btn {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  background: linear-gradient(135deg, #B2564C 0%, #9E483F 100%) !important;
  color: #FFFDF9 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 12px 18px !important;
  border-radius: 10px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 4px 14px rgba(158, 72, 63, 0.3) !important;
  box-sizing: border-box !important;
}
.bp-itin-action-btn:hover {
  background: #82362E !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 18px rgba(158, 72, 63, 0.4) !important;
}

/* ===========================================================================
   COMPONENT 6: BOTTOM DASHBOARD (4-Column Deck)
   =========================================================================== */
.bp-bottom-deck-section {
  max-width: var(--content-max, 1200px) !important;
  margin: 0 auto 52px !important;
  padding: 0 var(--content-padding, 28px) !important;
}
.bp-bottom-deck-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 22px !important;
  align-items: stretch !important;
}

/* Shared deck card shell */
.bp-deck-card {
  background: linear-gradient(180deg, #FFFDF9 0%, #FAF0E1 100%) !important;
  border: 1.5px solid rgba(158, 72, 63, 0.16) !important;
  border-radius: 18px !important;
  padding: 22px 22px 20px !important;
  box-shadow: 0 4px 16px rgba(158, 72, 63, 0.06) !important;
  display: flex !important;
  flex-direction: column !important;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.22s ease !important;
}
.bp-deck-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 28px rgba(158, 72, 63, 0.12) !important;
}
.bp-deck-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 14px !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(158, 72, 63, 0.14) !important;
  background: transparent !important;
}
.bp-deck-title-group {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}
.bp-deck-title {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: 1.25rem !important;
  font-weight: 800 !important;
  color: #2A1815 !important;
  line-height: 1.2 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
}
.bp-deck-kicker {
  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, sans-serif) !important;
  font-size: 9.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: #9E483F !important;
}
.bp-deck-link {
  font-family: var(--font-sans, -apple-system, BlinkMacSystemFont, sans-serif) !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
  color: #9E483F !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
  transition: all 0.18s ease !important;
  padding: 3px 8px !important;
  border-radius: 6px !important;
  background: rgba(158, 72, 63, 0.06) !important;
}
.bp-deck-link:hover {
  background: #9E483F !important;
  color: #FFFDF9 !important;
  transform: translateX(2px) !important;
}

/* ---- Region Mini Cards ---- */
.bp-region-cards-row {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  margin-top: 0 !important;
  flex: 1 1 auto !important;
}
.bp-mini-rcard {
  display: grid !important;
  grid-template-columns: 88px 1fr 22px !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 8px 10px !important;
  background: #FFFDF9 !important;
  border: 1px solid rgba(158, 72, 63, 0.16) !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  min-width: 0 !important;
}
.bp-mini-rcard:hover {
  transform: translateY(-2px) !important;
  border-color: #9E483F !important;
  box-shadow: 0 6px 18px rgba(158, 72, 63, 0.12) !important;
  background: #FAF0E1 !important;
}
.bp-rcard-img-wrap {
  width: 88px !important;
  height: 72px !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  position: relative !important;
  flex-shrink: 0 !important;
  background: #2A1815 !important;
}
.bp-rcard-img-wrap img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  transition: transform 0.3s ease !important;
}
.bp-mini-rcard:hover .bp-rcard-img-wrap img {
  transform: scale(1.08) !important;
}
.bp-rcard-badge {
  position: absolute !important;
  bottom: 4px !important;
  left: 4px !important;
  font-size: 8.5px !important;
  font-weight: 800 !important;
  color: #FFFDF9 !important;
  background: rgba(42, 24, 21, 0.8) !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  letter-spacing: 0.02em !important;
  backdrop-filter: blur(4px) !important;
}
.bp-mini-rcard-body {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
}
.bp-mini-rcard-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
.bp-mini-rcard-name {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: 14.5px !important;
  font-weight: 800 !important;
  color: #2A1815 !important;
  line-height: 1.2 !important;
}
.bp-mini-rcard-sub {
  font-size: 10px !important;
  font-weight: 700 !important;
  color: #9E483F !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  line-height: 1.2 !important;
}
.bp-mini-rcard-tags {
  font-size: 10.5px !important;
  color: #6E524B !important;
  line-height: 1.35 !important;
  white-space: normal !important;
  margin-top: 1px !important;
}
.bp-circle-arrow {
  width: 22px !important;
  height: 22px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  flex-shrink: 0 !important;
  transition: transform 0.18s ease !important;
}
.bp-mini-rcard:hover .bp-circle-arrow {
  transform: translateX(3px) !important;
}
.arrow-red { background: rgba(158, 72, 63, 0.14) !important; color: #9E483F !important; }
.arrow-teal { background: rgba(130, 54, 46, 0.14) !important; color: #82362E !important; }
.arrow-orange { background: rgba(184, 93, 59, 0.14) !important; color: #B85D3B !important; }

/* ---- Quick Access 8-Grid (2 Columns x 4 Rows) ---- */
.bp-quick-access-grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
  margin-top: 0 !important;
  flex: 1 1 auto !important;
}
.bp-qa-item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 14px !important;
  text-decoration: none !important;
  border-radius: 12px !important;
  background: #FFFDF9 !important;
  border: 1px solid rgba(158, 72, 63, 0.14) !important;
  transition: all 0.18s ease !important;
  min-height: 56px !important;
  box-sizing: border-box !important;
}
.bp-qa-item:hover {
  background: #9E483F !important;
  border-color: #82362E !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(158, 72, 63, 0.22) !important;
}
.bp-qa-icon {
  font-size: 22px !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
}
.bp-qa-meta {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  line-height: 1.25 !important;
}
.bp-qa-label {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #2A1815 !important;
  transition: color 0.18s ease !important;
}
.bp-qa-sub {
  font-size: 10.5px !important;
  color: #6E524B !important;
  transition: color 0.18s ease !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.bp-qa-item:hover .bp-qa-label,
.bp-qa-item:hover .bp-qa-sub {
  color: #FFFDF9 !important;
}

/* ---- News List ---- */
.bp-news-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-top: 0 !important;
  flex: 1 1 auto !important;
}
.bp-news-row {
  display: grid !important;
  grid-template-columns: 60px 1fr 20px !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 12px !important;
  text-decoration: none !important;
  border-radius: 12px !important;
  background: #FFFDF9 !important;
  border: 1px solid rgba(158, 72, 63, 0.14) !important;
  transition: all 0.18s ease !important;
}
.bp-news-row:hover {
  background: #FAF0E1 !important;
  border-color: #9E483F !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(158, 72, 63, 0.12) !important;
}
.bp-news-thumb {
  width: 60px !important;
  height: 52px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  display: block !important;
  flex-shrink: 0 !important;
}
.bp-news-info {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
  min-width: 0 !important;
}
.bp-news-meta-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
.bp-news-cat {
  font-size: 9.5px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #9E483F !important;
}
.bp-news-time {
  font-size: 9.5px !important;
  font-weight: 700 !important;
  color: #82362E !important;
  background: rgba(158, 72, 63, 0.08) !important;
  padding: 1px 6px !important;
  border-radius: 4px !important;
}
.bp-news-heading {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #2A1815 !important;
  line-height: 1.38 !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}
.bp-news-meta {
  font-size: 10.5px !important;
  color: #6E524B !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.bp-news-chevron {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #9E483F !important;
  flex-shrink: 0 !important;
  transition: transform 0.18s ease !important;
}
.bp-news-row:hover .bp-news-chevron {
  transform: translateX(3px) !important;
}
.bp-news-footer-ticker {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 2px 0 !important;
  border-top: 1px solid rgba(158, 72, 63, 0.12) !important;
  margin-top: 6px !important;
}
.bp-news-ticker-dot {
  width: 6px !important;
  height: 6px !important;
  border-radius: 50% !important;
  background: #E11D48 !important;
  display: inline-block !important;
  box-shadow: 0 0 6px #E11D48 !important;
  flex-shrink: 0 !important;
}
.bp-news-ticker-text {
  font-size: 10px !important;
  font-weight: 600 !important;
  color: #6E524B !important;
}

/* ---- Quick Facts List ---- */
.bp-facts-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-top: 0 !important;
  flex: 1 1 auto !important;
}
.bp-fact-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 10px 14px !important;
  border-radius: 12px !important;
  background: #FFFDF9 !important;
  border: 1px solid rgba(158, 72, 63, 0.14) !important;
  text-decoration: none !important;
  transition: all 0.18s ease !important;
}
.bp-fact-row:hover {
  background: #FAF0E1 !important;
  border-color: #9E483F !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px rgba(158, 72, 63, 0.12) !important;
}
.bp-fact-left {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}
.bp-fact-num {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: 1.65rem !important;
  font-weight: 800 !important;
  color: #9E483F !important;
  line-height: 1 !important;
  min-width: 42px !important;
  flex-shrink: 0 !important;
}
.bp-fact-meta {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  line-height: 1.25 !important;
}
.bp-fact-text {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #2A1815 !important;
}
.bp-fact-sub {
  font-size: 10.5px !important;
  color: #6E524B !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.bp-fact-arrow {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #9E483F !important;
  transition: transform 0.18s ease !important;
}
.bp-fact-row:hover .bp-fact-arrow {
  transform: translateX(3px) !important;
}
.bp-facts-seal {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 8px 4px 0 !important;
  border-top: 1px solid rgba(158, 72, 63, 0.14) !important;
  margin-top: 6px !important;
  text-align: center !important;
}
.bp-facts-seal-icon {
  font-size: 11px !important;
  color: #9E483F !important;
  margin-bottom: 1px !important;
}
.bp-facts-seal-title {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-style: italic !important;
  font-size: 12.5px !important;
  font-weight: 700 !important;
  color: #9E483F !important;
}
.bp-facts-seal-sub {
  font-size: 9.5px !important;
  font-weight: 600 !important;
  color: #6E524B !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
}

/* ===========================================================================
   COMPONENT 7: FOOTER (High-Contrast Light Editorial Theme)
   =========================================================================== */
.bp-footer {
  background: #F7EFE5 !important;
  border-top: 3px solid #9E483F !important;
  padding: 56px var(--content-padding, 28px) 32px !important;
  color: #374151 !important;
  font-size: 13.5px !important;
}
.bp-footer-inner {
  max-width: var(--content-max, 1200px) !important;
  margin: 0 auto !important;
}
.bp-footer-brand {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: 1.55rem !important;
  font-weight: 800 !important;
  color: #82362E !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 16px !important;
}
.bp-footer-logo-svg {
  width: 36px !important;
  height: auto !important;
}
.bp-footer-grid {
  display: grid !important;
  grid-template-columns: 2fr 1fr 1fr 1.2fr !important;
  gap: 40px !important;
  padding-bottom: 40px !important;
  border-bottom: 1px solid rgba(158, 72, 63, 0.16) !important;
  margin-bottom: 24px !important;
}
.bp-footer-about {
  font-size: 13px !important;
  line-height: 1.7 !important;
  color: #4B5563 !important;
  max-width: 340px !important;
  margin-bottom: 16px !important;
}
.bp-footer-col-head {
  font-family: var(--font-serif, 'Newsreader', Georgia, serif) !important;
  font-size: 14.5px !important;
  font-weight: 800 !important;
  color: #111827 !important;
  letter-spacing: -0.01em !important;
  margin-bottom: 14px !important;
}
.bp-footer-links {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
.bp-footer-links a {
  color: #374151 !important;
  text-decoration: none !important;
  font-size: 13px !important;
  transition: all 0.15s ease !important;
}
.bp-footer-links a:hover {
  color: #9E483F !important;
  font-weight: 600 !important;
  transform: translateX(2px) !important;
}
.bp-footer-bottom {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
  font-size: 12px !important;
  color: #374151 !important;
}

/* Sublinks nav in footer */
.bp-sublinks-nav {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}
.bp-sublinks-nav a {
  color: #374151 !important;
  font-size: 12px !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}
.bp-sublinks-nav a:hover {
  color: #9E483F !important;
}

/* ===========================================================================
   COMPONENT 8: PILLAR SUBLINKS RESPONSIVE FIXES
   =========================================================================== */
@media (max-width: 1380px) {
  .bp-bottom-deck-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 18px !important;
  }
}

@media (max-width: 1100px) {
  .bp-pillars-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 14px !important;
  }
  .bp-card-images {
    grid-column: span 2 !important;
  }
  .bp-bottom-deck-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 16px !important;
  }
  .bp-exp-card {
    grid-template-columns: 1fr !important;
  }
  .bp-exp-card-media img, #expMediaImg {
    min-height: 220px !important;
    max-height: 240px !important;
  }
}

@media (max-width: 900px) {
  .bp-pillars-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .bp-card-images {
    grid-column: 1 / -1 !important;
  }
  .bp-wonder-tongue-section {
    grid-template-columns: 1fr !important;
  }
  .bp-itin-result-grid {
    grid-template-columns: 1fr !important;
  }
  .bp-itinerary-box {
    padding: 24px 20px !important;
  }
  .bp-bottom-deck-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 12px !important;
  }
  .bp-footer-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 24px !important;
  }
  .bp-exp-tabs-wrap {
    justify-content: flex-start !important;
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    padding-bottom: 4px !important;
    scrollbar-width: none !important;
  }
  .bp-exp-tabs-wrap::-webkit-scrollbar { display: none !important; }
}

@media (max-width: 640px) {
  .bp-pillars-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    padding: 0 14px !important;
  }
  .bp-card-images {
    grid-column: auto !important;
  }
  .bp-bottom-deck-grid {
    grid-template-columns: 1fr !important;
  }
  .bp-experience-hub,
  .bp-wonder-tongue-section,
  .bp-itinerary-matcher-section,
  .bp-bottom-deck-section,
  .bp-section-divider-wrap {
    padding: 0 14px !important;
  }
  .bp-footer {
    padding: 36px 14px calc(72px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .bp-footer-grid {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  .bp-itinerary-box {
    padding: 20px 16px !important;
    border-radius: 16px !important;
  }
  .bp-exp-card { border-radius: 16px !important; min-height: auto !important; }
  .bp-exp-card-content { padding: 20px !important; }
}

@media (max-width: 480px) {
  .bp-pillars-grid {
    grid-template-columns: 1fr !important;
    padding: 0 12px !important;
  }
  .bp-quick-access-grid { grid-template-columns: repeat(4, 1fr) !important; gap: 4px !important; }
  .bp-qa-item { padding: 10px 4px !important; }
  .bp-qa-label { font-size: 9.5px !important; }
}