/* O3 landing hero route-card contrast isolation: dark glass shell, high-contrast route parameters, luxury gold CTA. */
html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card.ol-o3-route-card-contrast,
html body[data-oloropa-page="index.php"] .ol-o5-award-hero .ol-o5-booking-card.ol-o3-route-card-contrast,
html body[data-oloropa-page="index.php"][data-oloropa-luxury-safari] #home-hero .ol-o5-booking-card.ol-o3-route-card-contrast {
  --o3-card-charcoal: #2D1F18;
  --o3-card-espresso: #1E1510;
  --o3-card-bark: #4A3B32;
  --o3-card-gold: #D4A373;
  --o3-card-ivory: #FDFBF7;
  --o3-card-cream: #FAF8F5;
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  display: grid !important;
  gap: clamp(.8rem, 1.4vw, 1.08rem) !important;
  align-content: start !important;
  padding: clamp(1.05rem, 1.9vw, 1.52rem) !important;
  border: 1px solid rgba(212, 163, 115, .28) !important;
  border-radius: clamp(1.35rem, 2vw, 1.75rem) !important;
  color: var(--o3-card-ivory) !important;
  background:
    radial-gradient(circle at 15% 5%, rgba(253, 251, 247, .18), transparent 14rem),
    radial-gradient(circle at 82% 100%, rgba(212, 163, 115, .16), transparent 12rem),
    linear-gradient(145deg, rgba(45, 31, 24, .82), rgba(30, 21, 16, .70) 48%, rgba(74, 59, 50, .58)) !important;
  background-color: rgba(45, 31, 24, .72) !important;
  -webkit-backdrop-filter: blur(12px) saturate(120%) !important;
  backdrop-filter: blur(12px) saturate(120%) !important;
  box-shadow:
    0 34px 86px rgba(16, 10, 7, .44),
    inset 0 1px 0 rgba(253, 251, 247, .24),
    inset 0 0 0 1px rgba(45, 31, 24, .36) !important;
}

html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card.ol-o3-route-card-contrast::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  background:
    linear-gradient(135deg, rgba(253, 251, 247, .18), transparent 26%, transparent 68%, rgba(212, 163, 115, .12)),
    repeating-linear-gradient(90deg, rgba(253, 251, 247, .045) 0 1px, transparent 1px 48px) !important;
  opacity: .62 !important;
}

html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card.ol-o3-route-card-contrast::after {
  content: "" !important;
  position: absolute !important;
  inset: auto 0 0 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  height: 44% !important;
  max-height: none !important;
  opacity: 1 !important;
  background:
    radial-gradient(circle at 18% 100%, rgba(212, 163, 115, .18), transparent 14rem),
    linear-gradient(180deg, rgba(45, 31, 24, 0), rgba(45, 31, 24, .32)) !important;
  animation: none !important;
}

html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card.ol-o3-route-card-contrast > * {
  position: relative !important;
  z-index: 2 !important;
}

html body[data-oloropa-page="index.php"] #home-hero .ol-o3-route-card-eyebrow,
html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card.ol-o3-route-card-contrast > p:first-child {
  margin: 0 !important;
  color: rgba(212, 163, 115, .94) !important;
  font-size: clamp(.62rem, .7vw, .72rem) !important;
  line-height: 1.15 !important;
  font-weight: 900 !important;
  letter-spacing: .22em !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 14px rgba(0, 0, 0, .38) !important;
}

html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-mood.ol-o3-route-card-mood {
  display: grid !important;
  gap: .44rem !important;
  min-height: clamp(5rem, 9.4vw, 6.6rem) !important;
  padding: clamp(.9rem, 1.6vw, 1.16rem) !important;
  border: 1px solid rgba(253, 251, 247, .15) !important;
  border-radius: clamp(1rem, 1.5vw, 1.3rem) !important;
  background:
    radial-gradient(circle at 78% 10%, rgba(253, 251, 247, .16), transparent 9rem),
    linear-gradient(135deg, rgba(30, 21, 16, .92), rgba(74, 59, 50, .78)) !important;
  color: var(--o3-card-ivory) !important;
  box-shadow:
    inset 0 1px 0 rgba(253, 251, 247, .18),
    0 18px 42px rgba(16, 10, 7, .32) !important;
}

html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-mood.ol-o3-route-card-mood span {
  display: block !important;
  color: rgba(212, 163, 115, .92) !important;
  font-family: var(--ol-font-ui, "Plus Jakarta Sans", system-ui, sans-serif) !important;
  font-size: .68rem !important;
  line-height: 1.18 !important;
  font-weight: 900 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}

html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-mood.ol-o3-route-card-mood strong {
  display: block !important;
  max-width: 14ch !important;
  color: var(--o3-card-ivory) !important;
  font-family: var(--ol-font-display, Georgia, serif) !important;
  font-size: clamp(1.32rem, 2.2vw, 1.9rem) !important;
  font-weight: 600 !important;
  letter-spacing: -.035em !important;
  line-height: .98 !important;
  text-wrap: balance !important;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .42) !important;
}

html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-fields.ol-o3-route-data-box {
  display: grid !important;
  grid-template-columns: minmax(4.8rem, auto) minmax(0, 1fr) !important;
  align-items: baseline !important;
  gap: .56rem .82rem !important;
  margin: .12rem 0 0 !important;
  padding: clamp(.9rem, 1.45vw, 1.1rem) !important;
  border: 1px solid rgba(212, 163, 115, .26) !important;
  border-radius: clamp(.95rem, 1.4vw, 1.22rem) !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(212, 163, 115, .16), transparent 9rem),
    linear-gradient(135deg, rgba(45, 31, 24, .98), rgba(30, 21, 16, .96) 54%, rgba(74, 59, 50, .92)) !important;
  color: var(--o3-card-ivory) !important;
  box-shadow:
    inset 0 0 0 1px rgba(253, 251, 247, .055),
    inset 0 18px 36px rgba(0, 0, 0, .16),
    0 18px 44px rgba(16, 10, 7, .24) !important;
}

html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-fields.ol-o3-route-data-box span {
  min-width: 0 !important;
  color: rgba(212, 163, 115, .96) !important;
  font-family: var(--ol-font-ui, "Plus Jakarta Sans", system-ui, sans-serif) !important;
  font-size: clamp(.64rem, .72vw, .72rem) !important;
  line-height: 1.25 !important;
  font-weight: 900 !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
  text-shadow: 0 1px 14px rgba(0, 0, 0, .28) !important;
}

html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-fields.ol-o3-route-data-box b {
  min-width: 0 !important;
  color: #FDFBF7 !important;
  font-family: var(--ol-font-ui, "Plus Jakarta Sans", system-ui, sans-serif) !important;
  font-size: clamp(.76rem, .84vw, .88rem) !important;
  line-height: 1.32 !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
  overflow-wrap: anywhere !important;
  text-shadow: 0 1px 16px rgba(0, 0, 0, .42) !important;
}

html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card-cta.ol-o3-route-plan-cta,
html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card .ol-o5-booking-card-cta {
  width: 100% !important;
  min-height: clamp(2.95rem, 4.3vw, 3.35rem) !important;
  margin-top: .1rem !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 1px solid rgba(212, 163, 115, .86) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(135deg, rgba(212, 163, 115, .98), rgba(162, 90, 56, .96)) !important;
  color: #1E1510 !important;
  font-family: var(--ol-font-ui, "Plus Jakarta Sans", system-ui, sans-serif) !important;
  font-size: clamp(.82rem, .92vw, .94rem) !important;
  font-weight: 950 !important;
  letter-spacing: -.01em !important;
  text-decoration: none !important;
  text-shadow: 0 1px 0 rgba(253, 251, 247, .28) !important;
  box-shadow:
    0 16px 42px rgba(162, 90, 56, .42),
    inset 0 1px 0 rgba(253, 251, 247, .46),
    inset 0 -10px 24px rgba(30, 21, 16, .16) !important;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, filter .22s ease !important;
}

html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card-cta.ol-o3-route-plan-cta:hover,
html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card-cta.ol-o3-route-plan-cta:focus-visible,
html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card .ol-o5-booking-card-cta:hover,
html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card .ol-o5-booking-card-cta:focus-visible {
  transform: translateY(-1px) !important;
  filter: saturate(1.06) brightness(1.02) !important;
  border-color: rgba(253, 251, 247, .7) !important;
  box-shadow:
    0 20px 54px rgba(162, 90, 56, .52),
    0 0 0 4px rgba(212, 163, 115, .14),
    inset 0 1px 0 rgba(253, 251, 247, .54) !important;
}

html body[data-oloropa-page="index.php"] #home-hero .ol-o3-route-card-note,
html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card.ol-o3-route-card-contrast small {
  display: block !important;
  margin: .06rem 0 0 !important;
  color: rgba(253, 251, 247, .74) !important;
  font-family: var(--ol-font-ui, "Plus Jakarta Sans", system-ui, sans-serif) !important;
  font-size: clamp(.68rem, .78vw, .76rem) !important;
  line-height: 1.45 !important;
  letter-spacing: .01em !important;
  text-shadow: 0 1px 12px rgba(0, 0, 0, .32) !important;
}

@media (max-width: 900px) {
  html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card.ol-o3-route-card-contrast {
    width: min(100%, 25rem) !important;
    margin-inline: auto !important;
  }
}

@media (max-width: 520px) {
  html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-fields.ol-o3-route-data-box {
    grid-template-columns: 1fr !important;
    gap: .22rem !important;
  }

  html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-fields.ol-o3-route-data-box b {
    margin-bottom: .4rem !important;
  }

  html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-fields.ol-o3-route-data-box b:last-child {
    margin-bottom: 0 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card-cta.ol-o3-route-plan-cta,
  html body[data-oloropa-page="index.php"] #home-hero .ol-o5-booking-card .ol-o5-booking-card-cta {
    transition: none !important;
  }
}
