/* Motion and composition finishing. All movement is user-pausable. */
.recovery-stage>.sai-motion{width:min(850px,100%);margin:auto;height:100%;aspect-ratio:auto}
.hero[data-motion=panorama] .hero-backdrop img{animation-name:panorama-drift;animation-duration:24s;transform-origin:70% 55%}
.hero[data-motion=drift] .hero-backdrop img{animation-name:vertical-drift;animation-duration:18s}
.hero[data-motion=curtain] .hero-backdrop{animation:curtain-enter 1.6s cubic-bezier(.22,.61,.36,1) both;animation-play-state:paused}
.hero[data-motion=curtain].is-active .hero-backdrop{animation-play-state:running}
.hero[data-motion=orbit] .hero-backdrop img{animation-name:orbit-light;animation-duration:22s}
.hero[data-motion=recovery] .hero-backdrop img{animation-name:workshop-focus;animation-duration:21s}
.hero[data-motion=sweep] .hero-backdrop:after{content:"";position:absolute;inset:0;background:linear-gradient(108deg,transparent 15%,#efd8a516 47%,transparent 72%);width:60%;transform:translateX(-150%);animation:light-sweep 14s ease-in-out infinite paused;pointer-events:none}
.hero[data-motion=sweep].is-active .hero-backdrop:after{animation-play-state:running}
.hero[data-motion=parallax] .hero-backdrop img{animation:none;transform:scale(1.13) translateY(var(--photo-offset,0px));transition:transform .16s linear}
.hero-copy{animation:copy-enter 1.1s cubic-bezier(.2,.7,.3,1) both}
.hero h1 span{text-wrap:balance}
@media(min-width:681px){.region-chuuouku .hero-rail{left:auto;bottom:auto;height:45px;padding-top:10px}.region-chuuouku .hero-counter{display:none}.region-nakagawa-cho .hero-rail,.region-Kasuya-gun .hero-rail{top:auto;bottom:28px;left:50px;right:50px;padding-top:15px}.region-nishiku .hero-rail{padding:12px 50px}}
.hero-art .hero-detail-photo{object-fit:cover}
.hero .hero-art:has(.hero-detail-photo) figcaption{top:auto;bottom:0;left:0;right:0;padding:7px 9px;background:#102e2ed9;color:#fff4dc;text-shadow:none;font-size:9px;text-align:center}
.hero-art .sai-motion{filter:drop-shadow(0 2px 8px #0004)}
.hero-eyebrow{white-space:normal}
.recovery-caption{gap:25px}
.recovery-caption a{white-space:nowrap}
.article-content section{margin-bottom:40px}
.article-content .card{border:1px solid #b4ac953f;padding:26px;margin-block:25px}
.article-content ul,.article-content ol{padding-left:1.4em}
.article-content .actions{display:flex;flex-wrap:wrap;gap:15px}
.article-content .grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}
.article-content figure{margin:28px 0}
.article-content figcaption{font-size:12px;color:#677167;margin-top:8px}
.motion-paused .hero-copy{opacity:1;transform:none}
@keyframes panorama-drift{from{transform:scale(1.04) translateX(0)}to{transform:scale(1.13) translateX(-2.5%)}}
@keyframes vertical-drift{from{transform:scale(1.08) translateY(1.6%)}to{transform:scale(1.13) translateY(-1.6%)}}
@keyframes curtain-enter{from{opacity:0;transform:translateY(45px)}to{opacity:1;transform:translateY(0)}}
@keyframes orbit-light{from{transform:scale(1.06) rotate(-.7deg)}to{transform:scale(1.13) rotate(.7deg)}}
@keyframes workshop-focus{from{transform:scale(1.045);filter:brightness(.88)}to{transform:scale(1.12);filter:brightness(1.06)}}
@keyframes light-sweep{0%,12%{transform:translateX(-170%)}65%,100%{transform:translateX(240%)}}
@keyframes copy-enter{from{opacity:1;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1000px){.hero-cta{gap:18px}.hero h1{overflow-wrap:normal}.recovery-stage>.sai-motion{width:800px;max-width:100%}}
@media(max-width:680px){.recovery-stage{height:220px;width:100%}.recovery-stage>.sai-motion{width:550px;max-width:none;left:50%;transform:translateX(-50%)}.recovery-caption{flex-direction:column;gap:12px;line-height:1.9}.article-content .grid{grid-template-columns:1fr}.hero-copy{animation-duration:.85s}.hero[data-motion=parallax] .hero-backdrop img{transform:scale(1.06)}}
/* iPhone-sized viewports keep image and copy on stable layers while the page scrolls. */
@media(max-width:680px){
  .motion-ready [data-reveal]{opacity:1!important;transform:none!important;transition:none!important}
  .hero-copy,.hero .hero-backdrop img{animation:none!important;transform:none!important;transition:none!important}
  .hero .hero-backdrop img{will-change:auto!important}
  .hero-particles{display:none}
  body[class*="region-"]:not(.region-nishiku):not(.region-minamiku):not(.region-Higashiku) .hero-inner{position:relative;z-index:4;background:var(--ink)}
  body[class*="region-"]:not(.region-nishiku):not(.region-minamiku):not(.region-Higashiku) .hero-backdrop{grid-row:2;top:auto;bottom:auto;height:100%;min-height:0}
  body[class*="region-"]:not(.region-nishiku):not(.region-minamiku):not(.region-Higashiku) .hero-art{top:auto;bottom:88px}
}
@media(max-width:359px){
  body[class*="region-"]:not(.region-nishiku):not(.region-minamiku):not(.region-Higashiku) .hero{min-height:calc(100svh - 68px)}
}
@media(prefers-reduced-motion:reduce){.hero-copy,.hero[data-motion] .hero-backdrop,.hero[data-motion] .hero-backdrop img,.hero[data-motion] .hero-backdrop:after{animation:none!important;transform:none!important;transition:none!important;opacity:1}}