@charset "UTF-8";

/* Slider transitions — single source for the public site and the admin live
   preview. Every effect is a two-phase choreography: the outgoing slide leaves
   with its own animation while the incoming one arrives, and the copy staggers
   in slightly behind the media for a layered, premium feel. */

/* Layering while both slides are on stage. */
.hero-slide.is-entering { z-index: 2; }
.hero-slide.is-leaving { z-index: 1; }
.slider-stage__slide.is-entering { z-index: 2; opacity: 1; }
.slider-stage__slide.is-leaving { z-index: 1; opacity: 1; pointer-events: none; }

@media (prefers-reduced-motion: no-preference) {
    .hero-slide.is-entering .hero-copy { animation: fx-copy-in .7s cubic-bezier(.22,1,.36,1) .18s both; }
    .hero-slide.is-leaving .hero-copy { animation: fx-copy-out .35s ease both; }
    [data-transition="crossfade"] .hero-slide.is-entering .hero-slide__media, [data-transition="crossfade"] .slider-stage__slide.is-entering { animation: fx-in-crossfade 1s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="crossfade"] .hero-slide.is-leaving .hero-slide__media, [data-transition="crossfade"] .slider-stage__slide.is-leaving { animation: fx-out-fade 1s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="slide"] .hero-slide.is-entering .hero-slide__media, [data-transition="slide"] .slider-stage__slide.is-entering { animation: fx-in-push .85s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="slide"] .hero-slide.is-leaving .hero-slide__media, [data-transition="slide"] .slider-stage__slide.is-leaving { animation: fx-out-push .85s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="soft-zoom"] .hero-slide.is-entering .hero-slide__media, [data-transition="soft-zoom"] .slider-stage__slide.is-entering { animation: fx-in-zoom 1.1s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="soft-zoom"] .hero-slide.is-leaving .hero-slide__media, [data-transition="soft-zoom"] .slider-stage__slide.is-leaving { animation: fx-out-zoom 1s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="curtain-open"] .hero-slide.is-entering .hero-slide__media, [data-transition="curtain-open"] .slider-stage__slide.is-entering { animation: fx-in-curtain .9s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="curtain-open"] .hero-slide.is-leaving .hero-slide__media, [data-transition="curtain-open"] .slider-stage__slide.is-leaving { animation: fx-out-settle .9s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="petal-wipe"] .hero-slide.is-entering .hero-slide__media, [data-transition="petal-wipe"] .slider-stage__slide.is-entering { animation: fx-in-petal 1s cubic-bezier(.33,1,.68,1) both; }
    [data-transition="petal-wipe"] .hero-slide.is-leaving .hero-slide__media, [data-transition="petal-wipe"] .slider-stage__slide.is-leaving { animation: fx-out-fade 1s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="wing-open"] .hero-slide.is-entering .hero-slide__media, [data-transition="wing-open"] .slider-stage__slide.is-entering { animation: fx-in-wing .95s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="wing-open"] .hero-slide.is-leaving .hero-slide__media, [data-transition="wing-open"] .slider-stage__slide.is-leaving { animation: fx-out-settle .9s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="egg-hatch"] .hero-slide.is-entering .hero-slide__media, [data-transition="egg-hatch"] .slider-stage__slide.is-entering { animation: fx-in-hatch .9s cubic-bezier(.33,1,.68,1) both; }
    [data-transition="egg-hatch"] .hero-slide.is-leaving .hero-slide__media, [data-transition="egg-hatch"] .slider-stage__slide.is-leaving { animation: fx-out-settle .9s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="gate-reveal"] .hero-slide.is-entering .hero-slide__media, [data-transition="gate-reveal"] .slider-stage__slide.is-entering { animation: fx-in-gate .9s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="gate-reveal"] .hero-slide.is-leaving .hero-slide__media, [data-transition="gate-reveal"] .slider-stage__slide.is-leaving { animation: fx-out-push .9s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="barn-open"] .hero-slide.is-entering .hero-slide__media, [data-transition="barn-open"] .slider-stage__slide.is-entering { animation: fx-in-barn 1s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="barn-open"] .hero-slide.is-leaving .hero-slide__media, [data-transition="barn-open"] .slider-stage__slide.is-leaving { animation: fx-out-zoom 1s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="orbit-sweep"] .hero-slide.is-entering .hero-slide__media, [data-transition="orbit-sweep"] .slider-stage__slide.is-entering { animation: fx-in-orbit 1s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="orbit-sweep"] .hero-slide.is-leaving .hero-slide__media, [data-transition="orbit-sweep"] .slider-stage__slide.is-leaving { animation: fx-out-orbit 1s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="breeze-slide"] .hero-slide.is-entering .hero-slide__media, [data-transition="breeze-slide"] .slider-stage__slide.is-entering { animation: fx-in-breeze 1.05s cubic-bezier(.33,1,.68,1) both; }
    [data-transition="breeze-slide"] .hero-slide.is-leaving .hero-slide__media, [data-transition="breeze-slide"] .slider-stage__slide.is-leaving { animation: fx-out-breeze 1s cubic-bezier(.33,1,.68,1) both; }
    [data-transition="spectrum-wipe"] .hero-slide.is-entering .hero-slide__media, [data-transition="spectrum-wipe"] .slider-stage__slide.is-entering { animation: fx-in-spectrum .95s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="spectrum-wipe"] .hero-slide.is-leaving .hero-slide__media, [data-transition="spectrum-wipe"] .slider-stage__slide.is-leaving { animation: fx-out-fade .95s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="carriage-slide"] .hero-slide.is-entering .hero-slide__media, [data-transition="carriage-slide"] .slider-stage__slide.is-entering { animation: fx-in-carriage 1.05s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="carriage-slide"] .hero-slide.is-leaving .hero-slide__media, [data-transition="carriage-slide"] .slider-stage__slide.is-leaving { animation: fx-out-push 1s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="wave-sail"] .hero-slide.is-entering .hero-slide__media, [data-transition="wave-sail"] .slider-stage__slide.is-entering { animation: fx-in-wave 1.15s cubic-bezier(.33,1,.68,1) both; }
    [data-transition="wave-sail"] .hero-slide.is-leaving .hero-slide__media, [data-transition="wave-sail"] .slider-stage__slide.is-leaving { animation: fx-out-wave 1.05s cubic-bezier(.33,1,.68,1) both; }
    [data-transition="wind-sweep"] .hero-slide.is-entering .hero-slide__media, [data-transition="wind-sweep"] .slider-stage__slide.is-entering { animation: fx-in-wind .6s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="wind-sweep"] .hero-slide.is-leaving .hero-slide__media, [data-transition="wind-sweep"] .slider-stage__slide.is-leaving { animation: fx-out-wind .55s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="candy-roll"] .hero-slide.is-entering .hero-slide__media, [data-transition="candy-roll"] .slider-stage__slide.is-entering { animation: fx-in-candy .95s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="candy-roll"] .hero-slide.is-leaving .hero-slide__media, [data-transition="candy-roll"] .slider-stage__slide.is-leaving { animation: fx-out-push .9s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="confetti-pop"] .hero-slide.is-entering .hero-slide__media, [data-transition="confetti-pop"] .slider-stage__slide.is-entering { animation: fx-in-pop .8s cubic-bezier(.22,1,.36,1) both; }
    [data-transition="confetti-pop"] .hero-slide.is-leaving .hero-slide__media, [data-transition="confetti-pop"] .slider-stage__slide.is-leaving { animation: fx-out-zoom .8s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="ball-bounce-cut"] .hero-slide.is-entering .hero-slide__media, [data-transition="ball-bounce-cut"] .slider-stage__slide.is-entering { animation: fx-in-bounce .95s cubic-bezier(.33,1,.68,1) both; }
    [data-transition="ball-bounce-cut"] .hero-slide.is-leaving .hero-slide__media, [data-transition="ball-bounce-cut"] .slider-stage__slide.is-leaving { animation: fx-out-fade .9s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="paw-step"] .hero-slide.is-entering .hero-slide__media, [data-transition="paw-step"] .slider-stage__slide.is-entering { animation: fx-in-paw .9s cubic-bezier(.33,1,.68,1) both; }
    [data-transition="paw-step"] .hero-slide.is-leaving .hero-slide__media, [data-transition="paw-step"] .slider-stage__slide.is-leaving { animation: fx-out-fade .9s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="mist-crossfade"] .hero-slide.is-entering .hero-slide__media, [data-transition="mist-crossfade"] .slider-stage__slide.is-entering { animation: fx-in-mist 1.15s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="mist-crossfade"] .hero-slide.is-leaving .hero-slide__media, [data-transition="mist-crossfade"] .slider-stage__slide.is-leaving { animation: fx-out-mist 1.1s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="glow-crossfade"] .hero-slide.is-entering .hero-slide__media, [data-transition="glow-crossfade"] .slider-stage__slide.is-entering { animation: fx-in-glow 1.05s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="glow-crossfade"] .hero-slide.is-leaving .hero-slide__media, [data-transition="glow-crossfade"] .slider-stage__slide.is-leaving { animation: fx-out-glow 1s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="starlight-fade"] .hero-slide.is-entering .hero-slide__media, [data-transition="starlight-fade"] .slider-stage__slide.is-entering { animation: fx-in-starlight 1.25s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="starlight-fade"] .hero-slide.is-leaving .hero-slide__media, [data-transition="starlight-fade"] .slider-stage__slide.is-leaving { animation: fx-out-fade 1.2s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="page-turn-soft"] .hero-slide.is-entering .hero-slide__media, [data-transition="page-turn-soft"] .slider-stage__slide.is-entering { animation: fx-in-page .95s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="page-turn-soft"] .hero-slide.is-leaving .hero-slide__media, [data-transition="page-turn-soft"] .slider-stage__slide.is-leaving { animation: fx-out-page .95s cubic-bezier(.65,0,.35,1) both; }
    [data-transition="brush-reveal"] .hero-slide.is-entering .hero-slide__media, [data-transition="brush-reveal"] .slider-stage__slide.is-entering { animation: fx-in-brush .95s cubic-bezier(.33,1,.68,1) both; }
    [data-transition="brush-reveal"] .hero-slide.is-leaving .hero-slide__media, [data-transition="brush-reveal"] .slider-stage__slide.is-leaving { animation: fx-out-fade .95s cubic-bezier(.65,0,.35,1) both; }
}

@keyframes fx-in-crossfade { from { opacity: 0; } to { opacity: 1; } }
@keyframes fx-out-fade { from { opacity: 1; } to { opacity: 0; } }
@keyframes fx-in-push { from { opacity: .6; translate: 100% 0; } to { opacity: 1; translate: 0 0; } }
@keyframes fx-out-push { from { opacity: 1; translate: 0 0; } to { opacity: .25; translate: -28% 0; } }
@keyframes fx-in-zoom { from { opacity: 0; scale: 1.14; } to { opacity: 1; scale: 1; } }
@keyframes fx-out-zoom { from { opacity: 1; scale: 1; } to { opacity: 0; scale: 1.05; } }
@keyframes fx-out-settle { from { opacity: 1; scale: 1; } to { opacity: 0; scale: .97; } }
@keyframes fx-in-curtain { 0% { clip-path: inset(0 50% 0 50%); scale: 1.08; } 70% { clip-path: inset(0 0 0 0); } 100% { clip-path: inset(0 0 0 0); scale: 1; } }
@keyframes fx-in-petal { 0% { opacity: 0; clip-path: polygon(50% 42%, 54% 46%, 50% 50%, 46% 46%); rotate: -10deg; scale: 1.1; } 25% { opacity: 1; } 100% { opacity: 1; clip-path: polygon(50% -80%, 108% 8%, 128% 50%, 108% 92%, 50% 152%, -8% 92%, -28% 50%, -8% 8%); rotate: 0deg; scale: 1; } }
@keyframes fx-in-wing { 0% { opacity: 0; transform: scaleX(.08) skewY(2deg); } 55% { opacity: 1; transform: scaleX(1.04) skewY(-1deg); } 76% { transform: scaleX(.985) skewY(.4deg); } 100% { transform: none; } }
@keyframes fx-in-hatch { 0% { clip-path: polygon(0 100%, 16% 82%, 34% 97%, 52% 80%, 70% 96%, 86% 79%, 100% 95%, 100% 100%); rotate: 0deg; } 30% { clip-path: polygon(0 100%, 16% 58%, 34% 74%, 52% 55%, 70% 72%, 86% 54%, 100% 70%, 100% 100%); rotate: .4deg; } 60% { clip-path: polygon(0 100%, 16% 26%, 34% 42%, 52% 22%, 70% 40%, 86% 21%, 100% 38%, 100% 100%); rotate: -.4deg; } 100% { clip-path: polygon(0 100%, 16% -70%, 34% -70%, 52% -70%, 70% -70%, 86% -70%, 100% -70%, 100% 100%); rotate: 0deg; } }
@keyframes fx-in-gate { 0% { opacity: 0; transform: perspective(1400px) rotateY(-52deg); transform-origin: left center; } 100% { opacity: 1; transform: perspective(1400px) rotateY(0deg); transform-origin: left center; } }
@keyframes fx-in-barn { 0% { opacity: .7; clip-path: inset(0 50.5% 0 50.5%); scale: 1.12; } 65% { clip-path: inset(0 0 0 0); } 100% { opacity: 1; clip-path: inset(0 0 0 0); scale: 1; } }
@keyframes fx-in-orbit { 0% { opacity: 0; transform: translate(38%, -14%) rotate(7deg) scale(.88); } 62% { opacity: 1; transform: translate(-3%, 1.5%) rotate(-1.6deg) scale(1.01); } 100% { transform: none; } }
@keyframes fx-out-orbit { 0% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translate(-24%, 10%) rotate(-5deg) scale(.94); } }
@keyframes fx-in-breeze { 0% { opacity: 0; transform: translateX(-9%) rotate(-1deg); } 55% { opacity: 1; transform: translateX(1.4%) rotate(.5deg); } 80% { transform: translateX(-.5%) rotate(-.2deg); } 100% { transform: none; } }
@keyframes fx-out-breeze { 0% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateX(7%) rotate(.8deg); } }
@keyframes fx-in-spectrum { 0% { clip-path: inset(0 100% 0 0); filter: hue-rotate(80deg) saturate(1.8) brightness(1.15); } 55% { clip-path: inset(0 0 0 0); filter: hue-rotate(28deg) saturate(1.3) brightness(1.05); } 100% { clip-path: inset(0 0 0 0); filter: none; } }
@keyframes fx-in-carriage { 0% { translate: 112% 0; rotate: 1.4deg; } 58% { translate: -2.5% 0; rotate: -1deg; } 76% { translate: 1% 0; rotate: .5deg; } 100% { translate: 0 0; rotate: 0deg; } }
@keyframes fx-in-wave { 0% { opacity: 0; transform: translateY(9%) rotate(2.4deg); } 34% { opacity: 1; transform: translateY(-2.8%) rotate(-1.6deg); } 62% { transform: translateY(1.4%) rotate(.9deg); } 84% { transform: translateY(-.6%) rotate(-.4deg); } 100% { transform: none; } }
@keyframes fx-out-wave { 0% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateY(6%) rotate(-1.6deg); } }
@keyframes fx-in-wind { 0% { opacity: .35; transform: translateX(-115%) skewX(9deg); } 70% { opacity: 1; transform: translateX(2.2%) skewX(-1.6deg); } 100% { transform: none; } }
@keyframes fx-out-wind { 0% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateX(60%) skewX(-7deg); } }
@keyframes fx-in-candy { 0% { opacity: .8; transform: translateX(118%) rotate(13deg); } 55% { opacity: 1; transform: translateX(-2.4%) rotate(-3.6deg); } 74% { transform: translateX(1.2%) rotate(1.8deg); } 90% { transform: translateX(-.4%) rotate(-.7deg); } 100% { transform: none; } }
@keyframes fx-in-pop { 0% { opacity: 0; scale: .58; filter: brightness(1); } 55% { opacity: 1; scale: 1.055; filter: brightness(1.35) saturate(1.25); } 78% { scale: .985; filter: brightness(1.08); } 100% { scale: 1; filter: none; } }
@keyframes fx-in-bounce { 0% { opacity: 1; transform: translateY(-102%); } 42% { transform: translateY(0) scaleY(1); } 52% { transform: translateY(0) scaleY(.955); } 62% { transform: translateY(-9%) scaleY(1); } 76% { transform: translateY(0) scaleY(.985); } 86% { transform: translateY(-3%); } 94% { transform: translateY(0) scaleY(.995); } 100% { transform: none; } }
@keyframes fx-in-paw { 0% { opacity: 0; clip-path: inset(0 78% 0 0); translate: 0 1.2%; } 24% { opacity: 1; clip-path: inset(0 78% 0 0); translate: 0 0; } 25% { clip-path: inset(0 52% 0 0); translate: 0 1%; } 49% { clip-path: inset(0 52% 0 0); translate: 0 0; } 50% { clip-path: inset(0 26% 0 0); translate: 0 .8%; } 74% { clip-path: inset(0 26% 0 0); translate: 0 0; } 75% { clip-path: inset(0 0 0 0); translate: 0 .6%; } 100% { clip-path: inset(0 0 0 0); translate: 0 0; } }
@keyframes fx-in-mist { 0% { opacity: 0; filter: blur(22px) saturate(.7); scale: 1.06; } 100% { opacity: 1; filter: blur(0) saturate(1); scale: 1; } }
@keyframes fx-out-mist { 0% { opacity: 1; filter: blur(0); } 100% { opacity: 0; filter: blur(16px); } }
@keyframes fx-in-glow { 0% { opacity: 0; filter: brightness(2.4) saturate(.45); } 45% { opacity: 1; filter: brightness(1.35) saturate(.85); } 100% { filter: none; } }
@keyframes fx-out-glow { 0% { opacity: 1; filter: brightness(1); } 100% { opacity: 0; filter: brightness(2.1) saturate(.5); } }
@keyframes fx-in-starlight { 0% { opacity: 0; filter: brightness(.22) contrast(1.35) saturate(.7); scale: .985; } 55% { opacity: 1; filter: brightness(.72) contrast(1.12) saturate(.9); } 100% { filter: none; scale: 1; } }
@keyframes fx-in-page { 0% { opacity: .4; transform: perspective(1600px) rotateY(-38deg) translateX(8%); transform-origin: left center; } 100% { opacity: 1; transform: perspective(1600px) rotateY(0) translateX(0); transform-origin: left center; } }
@keyframes fx-out-page { 0% { opacity: 1; transform: perspective(1600px) rotateY(0); transform-origin: right center; } 100% { opacity: 0; transform: perspective(1600px) rotateY(26deg); transform-origin: right center; } }
@keyframes fx-in-brush { 0% { opacity: 1; clip-path: polygon(0 0, 0 0, -14% 34%, -22% 34%); } 34% { clip-path: polygon(120% 0, 0 0, -14% 34%, 108% 34%); } 35% { clip-path: polygon(120% 0, 0 0, 122% 34%, -14% 34%, -22% 68%, -30% 68%); } 67% { clip-path: polygon(120% 0, 0 0, 122% 34%, -14% 34%, 110% 68%, -30% 68%); } 68% { clip-path: polygon(120% 0, 0 0, 122% 34%, -14% 34%, 124% 68%, -30% 68%, -20% 102%, -28% 102%); } 100% { clip-path: polygon(120% 0, 0 0, 122% 34%, -14% 34%, 124% 68%, -30% 68%, 126% 102%, -28% 102%); } }
@keyframes fx-copy-in { 0% { opacity: 0; translate: 0 1.4rem; } 100% { opacity: 1; translate: 0 0; } }
@keyframes fx-copy-out { 0% { opacity: 1; } 100% { opacity: 0; translate: 0 -0.8rem; } }
