@layer reset, smolum-page, astryx-base, astryx-theme, smolum-layout;
@layer smolum-page {
/* Presentation-only motion. Individual transforms preserve the design's rotations. */
.motion-ready{--motion-ease:cubic-bezier(.22,1,.36,1);--motion-duration:580ms;--motion-micro:220ms}
.motion-ready .motion{opacity:1;translate:0 0;scale:1;rotate:0deg;transition:opacity var(--motion-duration) var(--motion-ease),translate var(--motion-duration) var(--motion-ease),scale var(--motion-duration) var(--motion-ease),rotate var(--motion-duration) var(--motion-ease);transition-delay:var(--motion-delay,0ms)}
.motion-ready .motion-pending{opacity:0;translate:var(--motion-x,0px) var(--motion-y,20px);scale:var(--motion-scale,1);rotate:var(--motion-rotate,0deg);transition:none!important}
/* Reserve the initial client-rendered page footprint; final layout is unchanged. */
body[data-page='detail'] #workshop-detail:empty{min-height:100svh}
.motion-left{--motion-x:-20px;--motion-y:0px}
.motion-right{--motion-x:24px;--motion-y:0px}
.motion-scale{--motion-y:14px;--motion-scale:.96}
.motion-collage{--motion-x:-8px;--motion-y:18px;--motion-scale:.96}
.motion-collage:nth-child(even){--motion-x:8px}
.motion-portrait{--motion-y:12px;--motion-scale:.96;--motion-rotate:1.5deg}
.motion-home-visual{--motion-x:22px;--motion-y:0px;--motion-scale:.97}
.motion-forest{--motion-x:24px;--motion-y:0px;--motion-scale:1.02}
.motion-quiet{--motion-y:12px}
.motion-ready .motion-instant{transition:none!important}
.motion-ready a,.motion-ready button{transition:color var(--motion-micro) var(--motion-ease),background-color var(--motion-micro) var(--motion-ease),border-color var(--motion-micro) var(--motion-ease)}
.motion-ready .button{transition:color var(--motion-micro) var(--motion-ease),background-color var(--motion-micro) var(--motion-ease),border-color var(--motion-micro) var(--motion-ease),scale var(--motion-micro) var(--motion-ease),opacity var(--motion-duration) var(--motion-ease),translate var(--motion-duration) var(--motion-ease)}
.motion-ready .button.motion-pending,.motion-ready .button.motion-entering{transition-delay:var(--motion-delay,0ms)}
.motion-ready .button:not(:disabled):active{transform:none;scale:.99}
.motion-arrow{display:inline-block;transition:translate var(--motion-micro) var(--motion-ease)}
.motion-ready .workshop-image img,.motion-ready .detail-work-list img{transition:scale var(--motion-micro) var(--motion-ease)}
.motion-ready .offer-object,.motion-ready .offer-plus{transition:translate var(--motion-micro) var(--motion-ease)}
.motion-ready .session,.motion-ready .detail-session{transition:background-color var(--motion-micro) var(--motion-ease),opacity var(--motion-duration) var(--motion-ease),translate var(--motion-duration) var(--motion-ease);transition-delay:0ms,var(--motion-delay,0ms),var(--motion-delay,0ms)}
@media(hover:hover) and (pointer:fine){
 .motion-ready .button:hover .motion-arrow{translate:3px 0}
 .motion-ready .workshop:hover .workshop-image img{scale:1.025}
 .motion-ready .detail-work-list li:hover img{scale:1.03}
 .motion-ready .offer-card:hover .offer-object,.motion-ready .offer-card:hover .offer-plus{translate:4px -2px}
 .motion-ready .session:hover,.motion-ready .detail-session:hover{background-color:var(--light)}
}
/* Only the functional FAQ animates height; JS measures the current content. */
.motion-ready .faq-list details.motion-faq summary:after{content:'+';transition:rotate var(--motion-micro) var(--motion-ease)}
.motion-ready .faq-list details.motion-faq[data-expanded='true'] summary:after{rotate:45deg}
.motion-faq-content{display:flow-root}
.motion-faq-animating{overflow:hidden}
/* A single quiet cue on an explicit schedule anchor visit. */
.motion-ready :is(#schedule,#dates){position:relative;isolation:isolate}
.motion-schedule-cue:before{content:'';position:absolute;inset:12px 0;border-radius:var(--radius);background:var(--lilac);pointer-events:none;z-index:-1;animation:motion-schedule-cue 1100ms var(--motion-ease) both}
@keyframes motion-schedule-cue{0%,100%{opacity:0}25%{opacity:.4}}
/* Narrow edge decoration keeps the centered invitation completely readable. */
.motion-ambient-host{position:relative;isolation:isolate;overflow:hidden}
.motion-ambient{position:absolute;inset:0;z-index:-1;pointer-events:none;color:var(--lilac);overflow:hidden}
.motion-ambient svg{position:absolute;right:0;top:0;width:16%;height:100%;opacity:.2}
.motion-ambient svg.motion-ambient-left{left:0;right:auto;top:-4%;width:15%;height:108%;transform:scale(-1,-1)}
.motion-ambient .motion-ambient-left path{animation:none;stroke-dashoffset:24}
.motion-ambient path{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-dasharray:180 36;animation:motion-resin-flow 12s linear infinite;animation-play-state:paused}
.motion-ambient path:nth-child(2){animation-duration:14s;animation-direction:reverse}
.motion-ambient path:nth-child(3){animation-duration:11s}
.motion-ambient.is-in-view path{animation-play-state:running}
.motion-ambient-host .detail-final-copy{position:relative;z-index:1}
@keyframes motion-resin-flow{to{stroke-dashoffset:-216}}
@media(max-width:700px){
 /* Image metadata comes from the workshop; reserve space before decoding. */
 .workshop-hero-visual{aspect-ratio:var(--hero-mobile-ratio,auto)}
 .motion-ready{--motion-duration:500ms}
 .motion-ready .motion,.motion-ready .button.motion-entering,.motion-ready .button.motion-pending{transition-delay:min(var(--motion-delay,0ms),120ms)}
 .motion-ready .hero .motion-entering,.motion-ready .workshop-hero .motion-entering{transition-delay:calc(var(--motion-delay,0ms) * .75)}
 .motion-ready .motion-pending{translate:0 14px;scale:1;rotate:0deg;transition-delay:min(var(--motion-delay,0ms),120ms)}
 .motion-ready .motion-quiet.motion-pending{translate:0 12px}
 .motion-ambient svg{width:10%;opacity:.15}
 .motion-ambient svg.motion-ambient-left{width:9%}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto!important}
 .motion-ready .motion,.motion-ready .motion-pending{opacity:1;translate:none;scale:none;rotate:none;transition:none!important}
 .motion-ready a,.motion-ready button,.motion-ready .motion-arrow,.motion-ready .workshop-image img,.motion-ready .detail-work-list img,.motion-ready .offer-object,.motion-ready .offer-plus,.motion-ready .faq-list summary:after{transition:none!important}
 .motion-ready .button:not(:disabled):active,.motion-ready .workshop:hover .workshop-image img,.motion-ready .detail-work-list li:hover img{scale:none}
 .motion-ready .button:hover .motion-arrow,.motion-ready .offer-card:hover .offer-object,.motion-ready .offer-card:hover .offer-plus{translate:none}
 .motion-ambient path{animation:none!important}
 .motion-schedule-cue:before{animation:none;opacity:0}
}

}
