/* Poolside Cinema: native photographs preserve their full responsive resolution. */
.home .hero-photo{animation:none}
.motion-control{position:fixed;right:24px;bottom:max(16px,env(safe-area-inset-bottom));z-index:15;display:flex;align-items:center;gap:9px;min-height:44px;padding:10px 14px;border:1px solid #c5d9d580;background:var(--deep);color:var(--paper);font-size:12px}
.motion-control svg{width:12px;height:12px;fill:currentColor}
.motion-control:hover{background:var(--ink)}
.menu-open .motion-control,.viewer-open .motion-control{visibility:hidden}
.site-footer{padding-bottom:94px}
.cinema-frame,.photo-frame{overflow:hidden}
.viewer img{margin-inline:auto}
.photo-frame.wide-photo{height:clamp(320px,47vw,700px)}
.photo-frame.wide-photo img,.photo-frame.contact-visual img{width:100%;height:100%;object-fit:cover}
.photo-frame:not(.wide-photo):not(.contact-visual)>img{width:100%;height:auto}
.intro h2:has(.intro-rule){position:relative;border-bottom-color:transparent}
.intro-rule{position:absolute;inset:auto 0 -1px;height:1px;background:var(--line);transform-origin:left}
.motion-line{display:block}
.home .hero h1>span{transform-origin:left bottom}
.product-stage{overflow:hidden}
.product-stage>img.is-changing{animation:none}
.product-stage>.project-outgoing{z-index:-2;pointer-events:none}
.product-select button{position:relative;transition:color .2s ease}
.product-select button::after{content:'';position:absolute;inset:auto 0 -2px;height:2px;background:var(--paper);transform:scaleX(0);transform-origin:left;transition:transform .6s ease}
.product-select button[aria-pressed=true]{border-bottom-color:transparent}
.product-select button[aria-pressed=true]::after{transform:scaleX(1)}
.button .arrow,.text-link .arrow{transition:transform .35s ease}
.button:focus-visible .arrow,.text-link:focus-visible .arrow{transform:translateX(5px)}
.closing .button:active{transform:translateY(1px)}
@media(hover:hover){.button:hover .arrow,.text-link:hover .arrow{transform:translateX(5px)}}
.nav.is-open{animation:menu-arrival .4s ease}
@keyframes menu-arrival{from{clip-path:inset(0 0 100%);transform:translateY(-8px)}to{clip-path:inset(0);transform:none}}
html[data-motion=paused] .nav.is-open{animation:none}
html[data-motion=paused] .arrow,html[data-motion=paused] .product-select button::after{transition:none}
@media(max-width:600px){.motion-control{right:16px;padding-inline:10px;gap:7px}}
@media(prefers-reduced-motion:reduce){.motion-control{display:none}.cinema-frame img{transform:none!important}.nav.is-open{animation:none}.button:hover .arrow,.text-link:hover .arrow{transform:none}}