/* V59 — unified, collision-free copy layout for the 3D offers and destinations cards.
   Card geometry, placement, controls and language-specific arrow direction stay unchanged. */
:is(#featuredOffers #featuredOffersRail, #destinationsTrack) .image-card .image-overlay {
  position: absolute !important;
  inset: auto 0 0 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 32px 22px 75px !important;
  overflow: visible !important;
  background: linear-gradient(to bottom, transparent 0%,rgba(2,19,32,.46) 18%,rgba(2,17,29,.91) 70%,rgba(2,17,29,.97) 100%) !important;
  text-align: start !important;
  pointer-events: none !important;
}
:is(#featuredOffers #featuredOffersRail, #destinationsTrack) .image-card .image-overlay .eyebrow {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  line-clamp: 2 !important;
  overflow: hidden !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  font-family: var(--sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: rgba(245,251,254,.92) !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.2);
}
html[lang="en"] :is(#featuredOffers #featuredOffersRail, #destinationsTrack) .image-card .image-overlay .eyebrow {
  font-family: var(--latin) !important;
}
:is(#featuredOffers #featuredOffersRail, #destinationsTrack) .image-card .image-overlay strong {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  font-family: var(--sans) !important;
  font-weight: 800 !important;
  font-size: clamp(21px, 1.9vw, 27px) !important;
  line-height: 1.37 !important;
  letter-spacing: 0 !important;
  overflow-wrap: break-word !important;
  word-break: normal !important;
  text-wrap: pretty;
  text-shadow: 0 2px 8px rgba(0,0,0,.32);
}
html[lang="en"] :is(#featuredOffers #featuredOffersRail, #destinationsTrack) .image-card .image-overlay strong {
  font-family: var(--latin) !important;
  font-size: clamp(20px, 1.85vw, 26px) !important;
  line-height: 1.23 !important;
}
/* Long package titles get a slightly quieter scale, without truncating their names. */
#featuredOffers #featuredOffersRail .image-card .image-overlay strong {font-size: clamp(20px, 1.75vw, 25px) !important;}
html[lang="en"] #featuredOffers #featuredOffersRail .image-card .image-overlay strong {font-size: clamp(19px, 1.68vw, 24px) !important;}
/* Full row is reserved for the card link arrow; it can never overlay the title. */
:is(#featuredOffers #featuredOffersRail, #destinationsTrack) .image-card .image-overlay i {
  position: absolute !important;
  inset: auto auto 22px auto !important;
  inset-inline-end: 22px !important;
  bottom: 22px !important;
  flex: 0 0 auto !important;
  width: 36px !important;
  height: 36px !important;
  padding: 0 !important;
  transform: none !important;
  opacity: 1 !important;
}
/* Keep the badge isolated from content when a package has a long Arabic title. */
#featuredOffers #featuredOffersRail .sf-discount-badge{max-width:calc(100% - 32px);line-height:1.45!important;}
@media(max-width:780px), (hover:none) and (pointer:coarse) {
  :is(#featuredOffers #featuredOffersRail, #destinationsTrack) .image-card .image-overlay {
    gap: 5px !important;
    padding: 24px 15px 58px !important;
  }
  :is(#featuredOffers #featuredOffersRail, #destinationsTrack) .image-card .image-overlay .eyebrow {
    font-size: 10.5px !important;
    line-height: 1.45 !important;
  }
  :is(#featuredOffers #featuredOffersRail, #destinationsTrack) .image-card .image-overlay strong {
    font-size: clamp(18px, 4.9vw, 22px) !important;
    line-height: 1.34 !important;
  }
  html[lang="en"] :is(#featuredOffers #featuredOffersRail, #destinationsTrack) .image-card .image-overlay strong {
    font-size: clamp(17px, 4.65vw, 21px) !important;
    line-height: 1.23 !important;
  }
  #featuredOffers #featuredOffersRail .image-card .image-overlay strong {
    font-size: clamp(17px, 4.55vw, 20px) !important;
    line-height: 1.31 !important;
  }
  html[lang="en"] #featuredOffers #featuredOffersRail .image-card .image-overlay strong {
    font-size: clamp(16px, 4.35vw, 19px) !important;
    line-height: 1.22 !important;
  }
  :is(#featuredOffers #featuredOffersRail, #destinationsTrack) .image-card .image-overlay i {
    inset-inline-end: 15px !important;
    bottom: 16px !important;
    width: 33px !important;
    height: 33px !important;
  }
}
@media(max-width:359px){
  :is(#featuredOffers #featuredOffersRail, #destinationsTrack) .image-card .image-overlay {padding: 18px 13px 55px !important;}
  #featuredOffers #featuredOffersRail .image-card .image-overlay strong{font-size:16px!important;line-height:1.3!important;}
  html[lang="en"] #featuredOffers #featuredOffersRail .image-card .image-overlay strong{font-size:15.5px!important;line-height:1.2!important;}
  :is(#featuredOffers #featuredOffersRail, #destinationsTrack) .image-card .image-overlay i{inset-inline-end:13px!important;bottom:13px!important;}
}