/* =====================================================================
   Spa page decoration (inserted by _build/decor/spa.py)
   Everything is aria-hidden, pointer-events:none and sits behind content.
   ===================================================================== */
.dz-spa-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

/* hosts: content above the decoration layer */
.dz-spa-host > .container,
.dz-spa-host > .page-intro__card { position: relative; z-index: 1; }

.dz-spa-layer { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
:where(.dz-spa-layer, .dz-spa-pr) svg { position: absolute; display: block; pointer-events: none; overflow: visible; }
.dz-spa-stars, .dz-spa-mist, .dz-spa-land, .dz-spa-lland { overflow: hidden; }

/* ---------- page intro (paper) : margins only ---------- */
.dz-spa-intro { color: var(--gold); }
.dz-spa-i-con1 { width: 360px; left: max(-80px, calc(50% - 760px)); top: -40px; color: var(--sand); opacity: .9; }
.dz-spa-i-con2 { width: 260px; right: max(-90px, calc(50% - 740px)); bottom: calc(var(--ridge) + 4px); color: var(--sand); opacity: .8; }
.dz-spa-i-steamL { height: 260px; left: max(2%, calc(50% - 600px)); top: 12%; opacity: .42; }
.dz-spa-i-steamL2 { height: 170px; left: max(7%, calc(50% - 530px)); top: 34%; opacity: .26; }
.dz-spa-i-sprigL { width: 210px; left: max(-30px, calc(50% - 690px)); bottom: calc(var(--ridge) + 24px); color: var(--moss); opacity: .2; transform: rotate(-8deg); }
.dz-spa-i-fernR { height: 250px; right: max(3%, calc(50% - 640px)); top: 6%; color: var(--moss); opacity: .2; transform: rotate(12deg); }
.dz-spa-i-steamR { height: 220px; right: max(10%, calc(50% - 540px)); top: 24%; opacity: .34; }
.dz-spa-i-sprigR { width: 180px; right: max(-30px, calc(50% - 700px)); bottom: calc(var(--ridge) + 40px); color: var(--wood); opacity: .16; transform: scaleX(-1) rotate(-14deg); }
@media (max-width: 1099px) {
  .dz-spa-i-steamL2, .dz-spa-i-fernR, .dz-spa-i-sprigL, .dz-spa-i-sprigR { display: none; }
  .dz-spa-i-steamL { height: 120px; left: 4px; top: 8px; opacity: .3; }
  .dz-spa-i-steamR { height: 100px; right: 4px; top: 22px; opacity: .26; }
  .dz-spa-i-con1 { width: 220px; left: -110px; top: -60px; }
  .dz-spa-i-con2 { display: none; }
}

/* ---------- dark spa band: night forest ---------- */
.dz-spa-band { color: var(--gold-2); }
.dz-spa-stars { inset: 0; width: 100%; height: 100%; }
.dz-spa-b-stars { -webkit-mask-image: linear-gradient(180deg, #000 0, #000 30%, rgba(0,0,0,.35) 70%, transparent 92%); mask-image: linear-gradient(180deg, #000 0, #000 30%, rgba(0,0,0,.35) 70%, transparent 92%); opacity: .55; }
.dz-spa-b-moon { width: clamp(90px, 11vw, 170px); right: max(4%, calc(50% - 600px)); top: calc(var(--ridge) + 18px); }
.dz-spa-b-steam1 { height: clamp(150px, 20vw, 290px); right: max(14%, calc(50% - 440px)); top: calc(var(--ridge) + clamp(90px, 10vw, 150px)); opacity: .2; }
.dz-spa-b-steam2 { height: clamp(110px, 14vw, 210px); right: max(22%, calc(50% - 330px)); top: calc(var(--ridge) + clamp(150px, 15vw, 240px)); opacity: .13; }
/* margins beside the cards (only where there is room) */
.dz-spa-b-sideL, .dz-spa-b-sideR, .dz-spa-b-sprigL, .dz-spa-b-fernR { display: none; }
@media (min-width: 1380px) {
  .dz-spa-b-sideL, .dz-spa-b-sideR, .dz-spa-b-sprigL, .dz-spa-b-fernR { display: block; }
  .dz-spa-b-sideL { height: 240px; left: calc(50% - 720px + 4px); top: 38%; opacity: .16; }
  .dz-spa-b-sideR { height: 200px; right: calc(50% - 720px + 2px); top: 60%; opacity: .14; }
  .dz-spa-b-sprigL { width: 150px; left: calc(50% - 720px - 70px); top: 58%; color: var(--moss); opacity: .7; transform: rotate(72deg); }
  .dz-spa-b-fernR { height: 220px; right: calc(50% - 720px + 4px); top: 30%; color: var(--moss); opacity: .65; transform: rotate(-10deg); }
}
.dz-spa-mist { left: 0; width: 200%; height: clamp(60px, 9vw, 130px); }
.dz-spa-b-mist1 { top: 44%; }
.dz-spa-land { left: 0; bottom: 0; width: 100%; height: clamp(150px, 17vw, 260px); }
.dz-spa-b-mist2 { bottom: clamp(10px, 2vw, 40px); }
@media (max-width: 899px) {
  .dz-spa-b-steam1 { right: 6%; top: calc(var(--ridge) + 4px); height: 120px; opacity: .14; }
  .dz-spa-b-steam2 { display: none; }
  .dz-spa-b-moon { width: 70px; right: 22%; top: calc(var(--ridge) + 10px); }
}

/* ripple rings below the price box */
.dz-spa-price { position: relative; isolation: isolate; }
.dz-spa-pr { position: absolute; top: calc(100% + 6px); right: clamp(0px, 6%, 120px); width: min(400px, 100%); aspect-ratio: 400 / 120; z-index: -1; pointer-events: none; }
.dz-spa-pr svg { inset: 0; width: 100%; height: 100%; }
.dz-spa-ring { opacity: .3; }
.dz-spa-ring:nth-child(2) { opacity: .24; }
.dz-spa-ring:nth-child(3) { opacity: .18; }
.dz-spa-ring:nth-child(4) { opacity: .12; }
.dz-spa-ring:nth-child(5) { opacity: .07; }
@media (max-width: 699px) { .dz-spa-pr { right: auto; left: 50%; transform: translateX(-50%); } }

/* ---------- light gallery ---------- */
.dz-spa-m-con { width: 380px; right: max(-120px, calc(50% - 800px)); top: -30px; color: var(--sand); opacity: .9; }
.dz-spa-m-fern { height: 230px; right: max(5%, calc(50% - 520px)); top: calc(var(--sec) - 30px); color: var(--moss); opacity: .17; transform: rotate(16deg); }
.dz-spa-m-sprig { width: 230px; right: max(-20px, calc(50% - 690px)); top: calc(var(--sec) + 120px); color: var(--wood); opacity: .15; transform: rotate(-18deg); }
.dz-spa-m-steam { height: 200px; right: max(16%, calc(50% - 380px)); top: calc(var(--sec) - 40px); color: var(--gold); opacity: .3; }
.dz-spa-lland { left: 0; bottom: 0; width: 100%; height: clamp(110px, 12vw, 170px); }
@media (max-width: 899px) {
  .dz-spa-m-fern, .dz-spa-m-sprig { display: none; }
  .dz-spa-m-steam { height: 110px; right: 4%; top: 16px; opacity: .25; }
  .dz-spa-m-con { width: 240px; right: -120px; top: -60px; }
}

/* ---------- CTA band (dark) ---------- */
.dz-spa-cta { color: var(--gold-2); }
.dz-spa-c-stars { opacity: .5; -webkit-mask-image: linear-gradient(180deg, #000 30%, transparent 95%); mask-image: linear-gradient(180deg, #000 30%, transparent 95%); }
.dz-spa-c-moon { width: clamp(70px, 8vw, 130px); left: max(5%, calc(50% - 560px)); top: calc(var(--ridge) + 10px); }
.dz-spa-c-steamL { height: clamp(140px, 16vw, 230px); left: max(12%, calc(50% - 420px)); bottom: 18%; opacity: .2; }
.dz-spa-c-steamR { height: clamp(160px, 18vw, 260px); right: max(12%, calc(50% - 430px)); bottom: 16%; opacity: .2; }
.dz-spa-c-sprigL { width: 190px; left: max(-40px, calc(50% - 700px)); bottom: 22%; color: var(--moss); opacity: .8; transform: rotate(-6deg); }
.dz-spa-c-sprigR { width: 190px; right: max(-40px, calc(50% - 700px)); bottom: 30%; color: var(--moss); opacity: .8; transform: scaleX(-1) rotate(-10deg); }
.dz-spa-c-mist { bottom: 0; }
@media (max-width: 899px) {
  .dz-spa-c-steamL, .dz-spa-c-steamR, .dz-spa-c-sprigL, .dz-spa-c-sprigR { display: none; }
  .dz-spa-c-moon { width: 56px; left: 6%; top: calc(var(--ridge) - 10px); }
}

/* ---------- gentle motion ---------- */
@media (prefers-reduced-motion: no-preference) {
  .dz-spa-rise use { animation: dz-spa-rise 9s ease-in-out infinite; transform-box: fill-box; transform-origin: 50% 100%; }
  .dz-spa-d2 use { animation-delay: -3s; animation-duration: 11s; }
  .dz-spa-d3 use { animation-delay: -6s; animation-duration: 10s; }
  .dz-spa-st-b { animation: dz-spa-twinkle 5s ease-in-out infinite alternate; }
  .dz-spa-st-a { animation: dz-spa-twinkle 7s ease-in-out -3s infinite alternate; }
  .dz-spa-drift { animation: dz-spa-drift 90s linear infinite; }
  .dz-spa-rev { animation-duration: 130s; animation-direction: reverse; }
  .dz-spa-ring { animation: dz-spa-ring 6s ease-in-out infinite; animation-delay: calc(var(--i) * -.6s); transform-box: fill-box; transform-origin: center; }
  .dz-spa-drop { animation: dz-spa-drop 6s ease-in-out infinite; }
}
@keyframes dz-spa-rise {
  0% { transform: translateY(6%) scaleY(.96); opacity: .55; }
  50% { transform: translateY(-4%) scaleY(1.03); opacity: 1; }
  100% { transform: translateY(6%) scaleY(.96); opacity: .55; }
}
@keyframes dz-spa-twinkle { from { opacity: 1; } to { opacity: .35; } }
@keyframes dz-spa-drift { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@keyframes dz-spa-ring { 0%, 100% { transform: scale(.94); } 50% { transform: scale(1.05); } }
@keyframes dz-spa-drop { 0%, 60%, 100% { transform: translateY(0); opacity: .55; } 75% { transform: translateY(26px); opacity: 0; } 76% { transform: translateY(0); opacity: 0; } }
