/* ============================================================================
   Aurelia Luxe — v3.36
   Loads last (after v335), so it wins over every earlier layer.

   BUG 1 (still open) — Mobile: can't scroll past the customer-reviews
   section.
     v335 only neutralised `[data-parallax="cta-banner"]` itself. That
     stopped the CTA banner's own layer from sticking, but every sibling
     between Testimonials and the Blog Preview (`.hl-offers`, the CTA
     banner shell, `.hl-blog-preview`) can still pick up a stray
     `will-change`/`contain`/transform from earlier layers and get
     promoted to its own compositor layer with nothing to paint. On iOS
     that is exactly what makes a scroll gesture crossing the boundary
     "catch" for a moment. Fix: strip every promotion hint and force
     `touch-action: pan-y` + `overflow: visible` on the *whole* band of
     sections on mobile, not just the CTA banner.

   BUG 2 (still open) — Blog page: pagination overlaps the card above it.
     The extra margin-top from v335 helps, but on a touch device the
     hover state on `.hl-blog-card` (translateY + box-shadow) can stay
     "stuck" after the tap that scrolled the page, visually growing the
     last card into the pagination row below it. Fix: disable the
     hover lift/shadow on coarse-pointer (touch) devices entirely, and
     add extra clearance + a positioning context to the pager so it can
     never sit under a card even if a hover state does stick.

   BUG 3 (partial) — Desktop: scroll-reveal animation still feels quick.
     v335 moved it to 1.1s. Push it further into "breezy" territory:
     longer duration, gentler easing curve, and a longer per-card
     stagger so grids cascade in rather than blinking in together.
============================================================================ */

/* ── BUG 1: mobile scroll stall between Testimonials and Blog Preview ───── */
@media (max-width: 900px) {
  .hl-testimonials,
  .hl-testimonials__slider,
  .hl-offers,
  .hl-cta-banner,
  .hl-cta-banner__bg,
  .hl-cta-banner__overlay,
  .hl-blog-preview {
    will-change: auto !important;
    contain: none !important;
    transform: none !important;
    touch-action: pan-y !important;
    overflow: visible !important;
  }

  [data-parallax="cta-banner"] {
    inset: 0 !important;
    position: absolute !important;
  }

  html, body {
    overscroll-behavior-y: auto !important;
  }
}

/* ── BUG 2: blog pagination overlapping the card grid ────────────────────── */
.hl-blog-archive .hl-pagination__wrap {
  margin-top: 4rem !important;
  position: relative !important;
  z-index: 2 !important;
  clear: both !important;
}
.hl-blog-archive-grid {
  margin-bottom: 1rem !important;
  overflow: visible !important;
}
@media (max-width: 640px) {
  .hl-blog-archive .hl-pagination__wrap {
    margin-top: 4.5rem !important;
  }
}

/* A hover-lift that survives a tap (no real "hover away" on touch) is what
   makes the last card visually creep into the pager below it. Touch/coarse
   pointers never get the lift or the enlarged shadow — tap feedback still
   comes from the normal :active state elsewhere in the theme. */
@media (hover: none), (pointer: coarse) {
  .hl-blog-card:hover,
  .hl-blog-card:hover .hl-blog-card__img,
  .hl-blog-card:hover .hl-blog-card__image-wrap img {
    transform: none !important;
    box-shadow: var(--hl-shadow) !important;
  }
}

/* ── BUG 3: breezier, more relaxed scroll-reveal on desktop ──────────────── */
@media (min-width: 901px) {
  .reveal-up,
  .reveal-left,
  .reveal-right,
  .hl-fade-in-up {
    transition-property: opacity, transform !important;
    transition-duration: 1.5s !important;
    transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1) !important;
  }
  .hl-fade-in-up {
    transition-delay: 90ms !important;
  }
  /* Give staggered grid children (rooms/experiences/offers/blog) more air
     between each card so the cascade reads as relaxed, not rushed. */
  .hl-rooms-grid > *,
  .hl-exp-grid > *,
  .hl-offer-grid > *,
  .hl-blog-grid > * {
    transition-duration: 1.3s !important;
    transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .reveal-up, .reveal-left, .reveal-right, .hl-fade-in-up {
    transition-duration: 0.01ms !important;
  }
}