:root{--motion-ease:cubic-bezier(.16,1,.3,1)}
.reading-progress{position:absolute;left:0;right:0;bottom:0;height:2px;pointer-events:none;background:var(--teal);transform:scaleX(0);transform-origin:left}
.motion-enabled .reading-progress{transform:scaleX(var(--read,0))}
.site-header{transition:box-shadow .5s,background .5s}
.page-scrolled .site-header{box-shadow:0 1px 0 #0000000b;background:#ffffffed}
.desktop-nav a{position:relative;transition:color .3s}
.desktop-nav a::after{content:"";height:1px;background:var(--teal);position:absolute;left:0;right:0;bottom:4px;transform:scaleX(0);transform-origin:left;transition:transform .45s var(--motion-ease)}
.desktop-nav a[aria-current],.desktop-nav a:hover{color:var(--teal)}
.desktop-nav a[aria-current]::after{transform:scaleX(1)}

/* One-time reveals use the independent translate property so pointer tilt
   and scroll transforms can coexist without overriding one another. */
.motion-enabled .motion-reveal{transition:opacity 1.1s var(--motion-ease),translate 1.25s var(--motion-ease),filter 1.1s var(--motion-ease);transition-delay:var(--reveal-delay,0ms)}
.motion-enabled .motion-reveal[data-motion-state=waiting]{opacity:0;translate:0 44px;filter:blur(5px)}
.motion-enabled .motion-reveal[data-motion-state=visible]{opacity:1;translate:0 0;filter:blur(0)}
.motion-enabled .hero-copy>.motion-reveal{transition-duration:1.25s,1.45s,1.15s}
.motion-enabled .hero-copy>h1[data-motion-state=waiting]{translate:0 65px;filter:blur(7px)}
.motion-line{display:block}
.motion-enabled .motion-line{overflow:clip;padding-bottom:.13em;margin-bottom:-.13em}
.motion-line-inner{display:block}
.motion-enabled .motion-heading{translate:none!important;filter:none!important;opacity:1!important}
.motion-enabled .motion-heading .motion-line-inner{transition:transform 1.2s var(--motion-ease),opacity .9s;transition-delay:calc(var(--line-index,0)*125ms + var(--reveal-delay,0ms))}
.motion-enabled .motion-heading[data-motion-state=waiting] .motion-line-inner{transform:translate3d(0,110%,0) rotate(2deg);opacity:0;transform-origin:left}
.motion-enabled .motion-heading[data-motion-state=visible] .motion-line-inner{transform:translate3d(0,0,0);opacity:1}
.motion-enabled .hero-portrait{transform:translate3d(0,var(--portrait-y,0px),0) scale(var(--portrait-scale,1.025));transform-origin:50% 36%;animation:portrait-enter 1.65s var(--motion-ease) both;will-change:transform}
.motion-enabled .hero-copy{transform:translate3d(0,var(--hero-y,0px),0)}
@keyframes portrait-enter{from{opacity:0;clip-path:inset(0 0 18% 0)}to{opacity:.97;clip-path:inset(0)}}
.motion-enabled .media-photo{transform:translate3d(0,var(--photo-y,0px),0) scale(var(--photo-scale,1.12));transition:scale .6s var(--motion-ease);will-change:transform}
.motion-enabled .image-button:hover .media-photo{scale:1.035}
.motion-enabled .blog-portrait{transform:translate3d(0,var(--blog-y,0px),0)}
.motion-enabled .entrance,.motion-enabled .tariff{transform:perspective(900px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transform-origin:center;transition:opacity 1.1s var(--motion-ease),translate 1.25s var(--motion-ease),filter 1.1s var(--motion-ease),transform .5s var(--motion-ease),box-shadow .5s,background .4s;transition-delay:var(--reveal-delay,0ms),var(--reveal-delay,0ms),var(--reveal-delay,0ms),0ms,0ms,0ms;position:relative}
.motion-enabled .entrance:hover,.motion-enabled .tariff:hover{transform:perspective(900px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translate3d(0,-7px,0);box-shadow:0 24px 60px #0000000a}
.motion-enabled .entrance::before,.motion-enabled .tariff::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(500px circle at var(--glow-x,50%) var(--glow-y,50%),#ffffff50,transparent 70%);opacity:0;pointer-events:none;transition:opacity .5s}
.motion-enabled .entrance-dark::before{background:radial-gradient(350px circle at var(--glow-x,50%) var(--glow-y,50%),#ffffff14,transparent 70%)}
.motion-enabled .entrance:hover::before,.motion-enabled .tariff:hover::before{opacity:1}
.card-arrow{transition:transform .55s var(--motion-ease)}
.entrance:hover .card-arrow{transform:translateX(8px)}
.button{transition:transform .5s var(--motion-ease),box-shadow .5s,background .3s}
.button:hover{box-shadow:0 10px 25px #00998b20;transform:translateY(-3px)}
.button:active{transform:scale(.97)}

.motion-enabled .menu-shell{transform:perspective(1200px) translate3d(0,var(--menu-y,0px),0) rotateX(var(--menu-rx,0deg)) rotateZ(var(--menu-rz,0deg)) scale(var(--menu-scale,1));transform-origin:center;will-change:transform;box-shadow:0 35px 100px #0008,0 0 0 1px #ffffff14}
.motion-menu-anchor{min-width:0;width:100%}
.footer-bottom>div{flex-wrap:wrap;gap:24px 32px}
.motion-control{white-space:nowrap}
.motion-control:disabled{opacity:.6;cursor:default}
.motion-disabled{scroll-behavior:auto!important}
.motion-disabled *,.motion-disabled *::before,.motion-disabled *::after{animation:none!important;transition:none!important}
.motion-enabled .meal-row{transform:translate3d(var(--meal-x,0px),0,0);opacity:var(--meal-opacity,1)}
.motion-enabled .plan-copy .motion-line:last-child .motion-line-inner{color:color-mix(in srgb,#fff calc((1 - var(--plan-light,0))*100%),#41c9b7)}
.motion-enabled .dashboard{transform:perspective(1200px) translate3d(0,var(--dash-y,0px),0) rotateX(var(--dash-rx,0deg)) rotateZ(var(--dash-rz,0deg)) scale(var(--dash-scale,1));will-change:transform}
.motion-enabled .dashboard-back{transform:translate3d(0,var(--back-y,0px),0) rotate(var(--back-rz,5deg))}
.save-button{transition:color .3s,transform .3s var(--motion-ease)}
.save-button:active{transform:scale(.83)}
.save-button[aria-pressed=true]{animation:bookmark-pop .45s var(--motion-ease)}
@keyframes bookmark-pop{0%{transform:scale(.78)}60%{transform:scale(1.15)}100%{transform:scale(1)}}
dialog[open]{animation:dialog-enter .45s var(--motion-ease)}
dialog[open]::backdrop{animation:backdrop-enter .35s ease-out}
@keyframes dialog-enter{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}
@keyframes backdrop-enter{from{opacity:0}to{opacity:1}}
.week-picker button,.segmented button,.checkin-actions button{transition:background .3s,color .3s,border-color .3s,transform .25s var(--motion-ease)}
.week-picker button:active,.segmented button:active,.checkin-actions button:active{transform:scale(.94)}
.faq-list details[open] p{animation:answer-enter .4s var(--motion-ease)}
@keyframes answer-enter{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* A brief pinned scene lets the menu settle as the visitor scrolls.
   Short laptop screens and touch layouts retain ordinary document flow. */
@media(min-width:981px) and (min-height:740px){
 .motion-enabled.motion-pin .plan-section{overflow:clip;min-height:185svh;padding-block:0}
 .motion-enabled.motion-pin .plan-layout{position:sticky;top:90px;min-height:calc(100svh - 90px);padding-block:48px}
}
@media(max-width:980px){.motion-menu-anchor{width:min(550px,100%);justify-self:center}}
@media(min-width:651px) and (max-width:980px){
 .plan-copy .motion-line:nth-child(2){display:inline-block}
 .plan-copy .motion-line:nth-child(3){display:inline-block;margin-left:.15em}
}
@media(max-width:650px){
 .motion-enabled .motion-reveal[data-motion-state=waiting]{translate:0 25px;filter:blur(2px)}
 .motion-enabled .motion-reveal{transition-duration:.85s,1s,.85s}
 .motion-enabled .hero-copy>h1[data-motion-state=waiting]{translate:0 35px;filter:blur(3px)}
 .motion-enabled .motion-heading .motion-line-inner{transition-duration:1s,.8s}
 .motion-enabled .entrance:hover,.motion-enabled .tariff:hover{transform:none;box-shadow:none}
 .motion-enabled .hero-portrait{animation-duration:1.2s}
 .reading-progress{height:1px}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto!important}
 *,*::before,*::after{animation:none!important;transition:none!important}
 .motion-reveal{opacity:1!important;translate:none!important;filter:none!important}
 .motion-line-inner{transform:none!important;opacity:1!important}
 .reading-progress{display:none}
}
