/* Solaria d'Oriente motion layer (tools/motion.mjs adds it to every page).
   Everything animates transform/opacity only, so it stays on the compositor while scrolling.
   Scroll-linked effects use native scroll-driven animations (animation-timeline); browsers without them
   get the JS fallback in dor-motion.js. prefers-reduced-motion turns all of it off. */
:root {
  --dor-ease-out: cubic-bezier(.22, 1, .36, 1);      /* expo-like settle */
  --dor-ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --dor-reveal-dur: .9s;
  --dor-header-h: 84px;
}

/* Smooth in-page jumps (room filters, "#location" links) that land below the fixed header. */
html { scroll-behavior: smooth; }
[id] { scroll-margin-top: var(--dor-header-h); }

/* Cross-page fade between pages of this site (View Transitions, Chrome/Edge/Safari 18.2+). */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: dor-vt-out .28s var(--dor-ease-in-out) both; }
::view-transition-new(root) { animation: dor-vt-in .42s var(--dor-ease-out) both; }
@keyframes dor-vt-out { to { opacity: 0; } }
@keyframes dor-vt-in { from { opacity: 0; transform: translateY(12px); } }

/* Brand loader: only on the first page of a visit; later pages skip it (class set in <head>). */
html.dor-seen #solaria-fill-loader { display: none !important; }
#solaria-fill-loader.loader-out { opacity: 0; transition: opacity .45s var(--dor-ease-out) !important; }

/* Reveal on scroll (replaces Elementor's slideInLeft/Right, which flew blocks in from off-screen). */
html.dor-js [data-reveal] {
  opacity: 0;
  translate: 0 28px;
  transition: opacity var(--dor-reveal-dur) var(--dor-ease-out), translate var(--dor-reveal-dur) var(--dor-ease-out);
  transition-delay: var(--dor-delay, 0s);
}
html.dor-js [data-reveal="left"] { translate: -36px 0; }
html.dor-js [data-reveal="right"] { translate: 36px 0; }
html.dor-js [data-reveal].is-in { opacity: 1; translate: 0 0; }

/* Room cards (rooms page loops, room sliders): calm hover lift + image settle. */
.e-loop-item, .solaria-room-card { transition: translate .6s var(--dor-ease-out), box-shadow .6s var(--dor-ease-out); }
.e-loop-item img, .solaria-room-card img { transition: scale 1.2s var(--dor-ease-out); }
@media (hover: hover) {
  .e-loop-item:hover img, .solaria-room-card:hover img { scale: 1.04; }
}
.e-loop-item .elementor-widget-theme-post-featured-image { overflow: hidden; }

/* Room page hero: the scroll zoom (2.3x to 1x over a 300vh pinned section) is gone by the owner's choice;
   the photo grid is a plain full-screen hero, shown at 1:1 so the photos stay sharp. */
html div.hero-zoom-outer.hero-zoom-outer { height: auto !important; }
html div.hero-zoom-sticky.hero-zoom-sticky { position: relative !important; height: 100vh !important; height: 100svh !important; min-height: 560px !important; }
.hero-grid-inner { transform: none !important; }

/* The Hotel: "Solaria story" grid parallax (was an endless requestAnimationFrame loop). */
@supports (animation-timeline: view()) {
  #sspScroller { view-timeline: --dor-ssp block; }
  #sspGrid { animation: dor-ssp linear both; animation-timeline: --dor-ssp; animation-range: contain 0% contain 100%; }
  @keyframes dor-ssp { from { transform: translateY(-20vh); } to { transform: translateY(20vh); } }
}

/* Home: stacked outlet cards are driven per frame by dor-motion.js; no CSS transition fighting it. */
.sd-outlet-card { will-change: transform; transition: none !important; }

/* Room gallery (detail pages): softer cross-fade. */
.solaria-gallery-main img, .solaria-gallery-small img { transition: opacity .45s var(--dor-ease-out), transform .7s var(--dor-ease-out) !important; }

/* Header hide/show on scroll: same motion language. */
.solaria-dynamic-header { transition-timing-function: var(--dor-ease-out) !important; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  @view-transition { navigation: none; }
  html.dor-js [data-reveal] { opacity: 1; translate: none; transition: none; }
  #sspGrid, .e-loop-item img, .solaria-room-card img { animation: none !important; transform: none !important; scale: none !important; }
  #solaria-fill-loader { display: none !important; }
}