/* Native page transitions keep links, browser history and direct URLs intact. */
@view-transition{navigation:auto}
html{scrollbar-gutter:stable;scroll-padding-bottom:110px}
::view-transition-old(root){animation:page-out 150ms ease both}
::view-transition-new(root){animation:page-in 230ms ease both}
@keyframes page-out{to{opacity:0}}
@keyframes page-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.btn,.filter-pills button,.segmented button,.week button,.round-action,.gallery-controls button{transition:background-color .2s ease,color .2s ease,box-shadow .2s ease,transform .18s ease}
.btn:active,.round-action:active,.gallery-controls button:active{transform:scale(.97)}
.btn>span,.space-card .circle{transition:transform .22s ease}
@media(hover:hover){.btn:hover>span{transform:translate(2px,-2px)}.space-card:hover .circle{transform:rotate(8deg)}}
.menu-button span{transition:transform .22s ease}
.menu-button[aria-expanded="true"] span:first-child{transform:translateY(4px) rotate(45deg)}
.menu-button[aria-expanded="true"] span:last-child{transform:translateY(-4px) rotate(-45deg)}
dialog{opacity:0;transform:translateY(12px) scale(.98);transition:opacity .2s ease,transform .24s ease,display .24s allow-discrete,overlay .24s allow-discrete}
dialog[open]{opacity:1;transform:none}
dialog::backdrop{opacity:0;transition:opacity .24s ease,display .24s allow-discrete,overlay .24s allow-discrete}
dialog[open]::backdrop{opacity:1}
@starting-style{dialog[open]{opacity:0;transform:translateY(12px) scale(.98)}dialog[open]::backdrop{opacity:0}}
dialog{overscroll-behavior:contain}
.space-grid,.benefit-strip,.table-scroll{overscroll-behavior-x:contain;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#b9cba0 transparent}
#gallery-image{touch-action:pan-y}
.hero-image,.teaser-image,.visit-art,.contact-image,.gallery>div{background:#dce2d4}
.price strong{font-variant-numeric:tabular-nums}
@media(max-width:800px){
 html{scroll-padding-top:112px}
 .header{position:sticky;top:8px;box-shadow:0 4px 25px #1f2a1410}
 .header nav,.header nav.open{display:flex;flex-direction:column;align-items:stretch;gap:0}
 .header nav{visibility:hidden;opacity:0;transform:translateY(-8px);pointer-events:none;max-height:calc(100svh - 180px);overflow-y:auto;overscroll-behavior:contain;transition:opacity .2s ease,transform .22s ease,visibility .22s}
 .header nav.open{visibility:visible;opacity:1;transform:none;pointer-events:auto}
 .menu-button{min-width:44px;min-height:44px;align-items:center;justify-content:center;padding:8px;flex-shrink:0}
 .header-button{min-height:44px}
 .modal-close,.round-action,.gallery-controls button{min-width:44px;min-height:44px}
 .filter-pills button,.segmented button,.week button,.class-row .btn{min-height:44px}
 .training-detail{scroll-margin-top:112px}
 form input,form select,.goal-picker select,.schedule-top select{font-size:16px}
 .footer-top>div>a:not(.brand),.footer-top>div>button:not(.btn){min-height:44px;display:flex;align-items:center;margin:0}
}
@media(max-width:600px){
 .header{gap:8px;padding-left:18px;padding-right:10px}
 .header-button{font-size:9px;padding:11px 12px}
 .mobile-dock>a{min-height:44px;display:flex;align-items:center}
 .mobile-dock .btn{min-height:44px}
 .hero-actions .ghost{min-height:44px}
 .week{gap:4px}
 .class-row{grid-template-columns:42px minmax(0,1fr) auto}
 .class-row h3{overflow-wrap:anywhere}
 .table-scroll{scroll-padding:16px}
}
@media(max-width:360px){.header{padding-left:14px;gap:5px}.header-button{font-size:8px;padding:10px}.brand{font-size:25px}.class-row .btn{padding:10px 9px}}
@media(prefers-reduced-motion:reduce){
 @view-transition{navigation:none}
 html,.space-grid,.benefit-strip,.table-scroll{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important}
 ::view-transition-old(root),::view-transition-new(root){animation:none!important}
}