/* Universal breakpoints */
@keyframes from-right {
  0% {
    opacity: 0;
    transform: translateX(40rem); }
  100% {
    opacity: 1;
    transform: translateX(0); } }

.featured-offer-tiles {
  display: flex;
  gap: 20px;
  justify-content: space-between;
  width: 100%;
  overflow-x: auto;
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
  /* Scrollbar styles */ }
  .featured-offer-tiles::-webkit-scrollbar {
    width: 12px;
    height: 12px;
    cursor: pointer; }
  .featured-offer-tiles::-webkit-scrollbar-track {
    background: #e8e9ec;
    opacity: 0.7;
    border-radius: 12px; }
  .featured-offer-tiles::-webkit-scrollbar-thumb {
    border-radius: 12px;
    background: #62657b; }
  .featured-offer-tiles::-webkit-scrollbar-thumb:hover {
    background: #62657b; }
  @media (min-width: 1280px) {
    .featured-offer-tiles.larger-padding {
      padding-left: 40px;
      padding-right: 40px; } }

.px-40-20 {
  box-sizing: border-box;
  padding-left: 20px;
  padding-right: 20px; }
  @media (min-width: 1280px) {
    .px-40-20 {
      padding-left: 40px;
      padding-right: 40px; } }
  .px-40-20 .featured-offer-tiles {
    padding-left: 0;
    padding-right: 0; }

.featured-offer-tile-legacy {
  height: 510px;
  width: 320px;
  flex: 1 0 320px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 8px;
  transition: background-size 0.2s ease-in-out;
  cursor: pointer;
  background-size: auto 100%;
  display: flex;
  flex-direction: column;
  justify-content: end; }
  .featured-offer-tile-legacy:hover {
    background-size: auto 110%; }
  @media (max-width: 767px) {
    .featured-offer-tile-legacy {
      width: 264px;
      flex-basis: 264px;
      height: 392px; } }
  .featured-offer-tile-legacy .offer-content {
    position: relative;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    background: radial-gradient(92.92% 265.14% at 2.04% 32.27%, rgba(37, 37, 37, 0.65) 0%, rgba(43, 43, 43, 0.2015) 100%);
    backdrop-filter: blur(50px);
    color: white;
    padding: 24px;
    text-align: left; }
    .featured-offer-tile-legacy .offer-content .brand-logo {
      position: absolute;
      right: 20px;
      top: -45px; }
      @media (max-width: 767px) {
        .featured-offer-tile-legacy .offer-content .brand-logo {
          width: 64px;
          height: 64px;
          top: -32px; } }
    .featured-offer-tile-legacy .offer-content h4 {
      margin-top: 0;
      margin-bottom: 24px; }
    .featured-offer-tile-legacy .offer-content .offer-heading {
      margin-bottom: 8px; }
    .featured-offer-tile-legacy .offer-content .offer-description {
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis;
      font-weight: 700; }