/* All rules require a class added by the optional motion layer. */
.motion-ready .motion-pause,.motion-ready .motion-preview-nav{display:grid;place-items:center;flex:none;width:38px;height:38px;padding:0;border:1px solid currentColor;border-radius:50%;background:#fffdf5de;color:inherit;cursor:pointer;line-height:1}
.motion-ready .motion-pause svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.motion-ready .motion-pause:disabled{opacity:.45;cursor:default}
.motion-ready .motion-pause:focus-visible,.motion-ready .motion-preview-nav:focus-visible{outline:2px solid currentColor;outline-offset:4px}
.motion-ready .motion-shadow,.motion-ready .motion-daylight,.motion-ready .motion-steam{position:absolute;display:block;pointer-events:none;user-select:none;overflow:hidden}
.motion-ready .motion-shadow{background:url('/assets/motion-branch-shadow.svg') center/contain no-repeat;transform-origin:80% 80%;animation:motion-branch-sway 17s ease-in-out infinite alternate}
.motion-ready .motion-daylight{background:radial-gradient(ellipse at 28% 55%,#fff5d733,transparent 65%);animation:motion-sunlight 13s ease-in-out infinite alternate}
.motion-ready:not(.motion-visible) .motion-shadow,.motion-ready:not(.motion-visible) .motion-daylight,.motion-ready:not(.motion-visible) .motion-wisp,.motion-ready:not(.motion-visible) .motion-preview img,.motion-ready:not(.motion-visible) .motion-preview-progress,.motion-ready.motion-paused .motion-shadow,.motion-ready.motion-paused .motion-daylight,.motion-ready.motion-paused .motion-wisp,.motion-ready.motion-paused .motion-preview img,.motion-ready.motion-paused .motion-preview-progress{animation-play-state:paused!important}
@keyframes motion-branch-sway{from{transform:translate3d(-1%,0,0) rotate(-2deg);opacity:.09}to{transform:translate3d(2%,2%,0) rotate(2deg);opacity:.17}}
@keyframes motion-sunlight{from{opacity:.25;transform:translate3d(0,0,0)}to{opacity:.8;transform:translate3d(2%,1%,0)}}

/* Doma chisto: the two original image layers remain untouched for slider mode. */
.motion-ready .motion-comparison-tools{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.motion-ready .motion-modes{display:flex;gap:3px;padding:4px;border:1px solid var(--line);border-radius:14px;margin-top:18px;background:#fff}
.motion-ready .motion-modes button{min-height:38px;padding:8px 17px;border:0;border-radius:10px;background:none;color:var(--ink);font-family:inherit;font-size:14px;font-weight:700;line-height:1.3;cursor:pointer}
.motion-ready .motion-modes button[aria-pressed=true]{background:var(--blue)}
.motion-ready .motion-comparison-hint{margin-block:12px 0;font-size:13px;color:var(--muted);line-height:1.45}
.motion-ready .motion-clean-reveal,.motion-ready .motion-clean-marker{display:none;pointer-events:none}
.motion-ready .comparison[data-motion-mode=reveal]{cursor:crosshair;touch-action:pan-y}
.motion-ready .comparison[data-motion-mode=reveal] .before-image{clip-path:none}
.motion-ready .comparison[data-motion-mode=reveal] .after-image,.motion-ready .comparison[data-motion-mode=reveal] .compare-divider,.motion-ready .comparison[data-motion-mode=reveal] .after-label{visibility:hidden}
.motion-ready .comparison[data-motion-mode=reveal] .motion-clean-reveal{display:block;clip-path:circle(var(--reveal-radius,120px) at var(--reveal-x,55%) var(--reveal-y,48%))}
.motion-ready .comparison[data-motion-mode=reveal] .motion-clean-marker{display:block;position:absolute;left:var(--reveal-x);top:var(--reveal-y);width:calc(var(--reveal-radius)*2);height:calc(var(--reveal-radius)*2);transform:translate(-50%,-50%);border:1px solid #ffffff80;border-radius:50%;box-shadow:0 0 15px #ffffff0d}
.motion-ready .comparison[data-motion-mode=reveal]:focus-visible{outline:3px solid #169bdd;outline-offset:4px}

/* Climate: light overlays sit behind the original wash and text. */
.motion-climate .motion-shadow{inset:10% -4% 8% 55%;opacity:.13;mask-image:linear-gradient(90deg,transparent,#000 22%,#000 78%,transparent)}
.motion-climate .motion-daylight{inset:20% 0 0 48%}
.motion-climate>.motion-pause{position:absolute;right:24px;bottom:22px;z-index:2;color:#3c615e}

/* Blizhe: shadows at the margin, restrained steam in the existing photos. */
.motion-glamping{position:relative;isolation:isolate}
.motion-glamping>.section-heading,.motion-glamping>.experience-grid{position:relative;z-index:1}
.motion-glamping>.motion-shadow{right:0;top:0;width:38%;height:220px;z-index:0;mask-image:linear-gradient(180deg,#000,transparent)}
.motion-glamping>.motion-pause{position:absolute;right:18px;bottom:8px;z-index:3;width:32px;height:32px;color:#435746;background:#f8f7f0}
.motion-glamping .motion-steam{z-index:1;mix-blend-mode:screen}
.motion-steam svg{display:block;width:100%;height:100%;fill:none;stroke:none}
.motion-steam-bath{left:30%;top:39%;width:67%;height:24%}
.motion-steam-breakfast{left:43%;top:42%;width:15%;height:17%}
.motion-steam .motion-wisp{transform-origin:50% 100%;opacity:0;animation:motion-steam-rise 7s ease-in-out infinite}
.motion-steam .motion-wisp-delayed{animation-delay:-3.5s;animation-duration:8s}
@keyframes motion-steam-rise{0%{opacity:0;transform:translate3d(0,15%,0) scale(.85)}35%{opacity:.22}65%{opacity:.14}100%{opacity:0;transform:translate3d(7%,-15%,0) scale(1.08)}}

/* Atelie vkusa: animated photo previews, separate from event selection. */
.motion-catering .motion-preview-tools{display:flex;align-items:center;gap:9px;justify-content:flex-end;margin:-12px 0 12px;color:var(--wine,#532a35)}
.motion-catering .motion-preview-tools>span{font-size:12px;margin-right:8px}
.motion-catering .motion-preview-nav{font-size:25px;width:32px;height:32px}
.motion-catering .motion-preview-tools .motion-pause{width:32px;height:32px}
.motion-catering .format-card>.motion-preview{position:relative;display:block;margin:0;padding:0;border-radius:5px;overflow:hidden;line-height:0;isolation:isolate}
.motion-catering .motion-preview img{display:block;width:100%;margin:0;border-radius:0;transform-origin:50% 45%}
.motion-catering .motion-preview-active .motion-preview img{animation:motion-photo-drift 9s ease-in-out both}
.motion-catering .motion-preview-progress{display:none;position:absolute;bottom:0;left:0;right:0;height:3px;background:#ddbe73;transform:scaleX(0);transform-origin:0 50%;z-index:2}
.motion-catering .motion-preview-active .motion-preview-progress{display:block;animation:motion-photo-progress 9s linear both}
.motion-catering .motion-preview-state{position:absolute;right:9px;bottom:12px;width:24px;height:24px;display:grid;place-items:center;border:1px solid #fff9;border-radius:50%;background:#30211f55;backdrop-filter:blur(3px)}
.motion-catering .motion-preview-state:after{content:'';width:0;height:0;border-left:6px solid white;border-top:4px solid transparent;border-bottom:4px solid transparent;margin-left:2px}
.motion-catering .motion-preview-active .motion-preview-state:after{width:6px;height:8px;margin:0;border:0;border-inline:2px solid white}
.motion-catering.motion-paused .motion-preview-active .motion-preview-state:after{width:0;height:0;border:0;border-left:6px solid white;border-top:4px solid transparent;border-bottom:4px solid transparent;margin-left:2px}
@keyframes motion-photo-drift{from{transform:scale(1)}to{transform:scale(1.045)}}
@keyframes motion-photo-progress{to{transform:scaleX(1)}}

@media(max-width:1023px){.motion-climate .motion-shadow{inset:58% -2% 3% 35%}.motion-climate .motion-daylight{inset:55% 0 0 25%}.motion-climate>.motion-pause{right:18px;bottom:18px}.motion-glamping>.motion-shadow{width:64%;height:200px;opacity:.1}}
@media(max-width:768px){.motion-catering .motion-preview-tools{margin:0 0 12px}.motion-catering .format-card>.motion-preview{grid-row:1/3;width:90px;align-self:stretch}.motion-catering .motion-preview-state{width:19px;height:19px;right:5px;bottom:7px}}
@media(max-width:650px){.motion-ready .motion-comparison-tools{gap:0}.motion-ready .motion-comparison-tools>.comparison-tabs{flex:1 0 100%}.motion-ready .motion-modes{margin-top:10px}.motion-ready .motion-modes button{padding-inline:16px}.motion-ready .motion-comparison-hint{font-size:12px}.motion-glamping>.motion-pause{bottom:10px;right:18px}}
@media(max-width:360px){.motion-catering .format-card>.motion-preview{width:76px}}
@media(prefers-reduced-motion:reduce){.motion-ready .motion-shadow,.motion-ready .motion-daylight,.motion-ready .motion-wisp,.motion-ready .motion-preview img,.motion-ready .motion-preview-progress{animation:none!important;transform:none!important}.motion-ready .motion-steam,.motion-ready .motion-preview-progress,.motion-ready .motion-preview-state{display:none!important}.motion-ready .motion-shadow{opacity:.09}.motion-ready .motion-daylight{opacity:.3}}