/* Each scene traces its own graphite sketch, then reveals its finished image. */
.hero-full .hero-stage::before{pointer-events:none;z-index:1}
.hero-full .hero-image.hero-animation{z-index:0;background:#f7f3ea;overflow:hidden;border-radius:0;isolation:isolate}
.hero-full .hero-stage .intro{position:relative;z-index:2;pointer-events:none}
.hero-full .hero-stage .intro a{pointer-events:auto}
.hero-full .hero-stage .hero-scroll{z-index:3}
.hero-animation .hero-scene{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .8s ease;background:#f7f3ea}
.hero-animation .hero-scene.is-current{opacity:1}
.hero-animation .hero-visual{position:absolute;inset:0;display:block;width:100%;height:100%}
.hero-full .hero-image .hero-visual img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center center}
.hero-animation .hero-drawing{visibility:hidden;pointer-events:none}
.hero-animation .hero-light-glow,.hero-animation .hero-sound-wave,.hero-animation .hero-animation-label,.hero-animation .hero-pencil-canvas{pointer-events:none}
.hero-animation .hero-pencil-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;opacity:0}
.hero-animation .hero-light-glow{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse 10% 25% at 45% 22%,rgba(247,186,57,.34),transparent 80%),radial-gradient(ellipse 10% 25% at 65% 22%,rgba(247,186,57,.31),transparent 80%),radial-gradient(ellipse 10% 25% at 88% 22%,rgba(247,186,57,.30),transparent 80%);mix-blend-mode:multiply}
.hero-scene-theater .hero-light-glow{background:radial-gradient(ellipse 37% 18% at 68% 26%,rgba(246,199,104,.31),transparent 80%),radial-gradient(ellipse 30% 28% at 77% 49%,rgba(255,229,167,.2),transparent 80%)}
.hero-scene-pavilion .hero-light-glow{background:radial-gradient(ellipse 22% 38% at 82% 55%,rgba(245,176,67,.24),transparent 80%),radial-gradient(ellipse 24% 30% at 45% 60%,rgba(245,176,67,.2),transparent 80%)}
.hero-scene-bar .hero-light-glow{background:radial-gradient(ellipse 45% 25% at 67% 34%,rgba(245,176,67,.18),transparent 80%),radial-gradient(ellipse 42% 20% at 70% 64%,rgba(245,176,67,.26),transparent 80%)}
.hero-animation .hero-sound-wave{position:absolute;top:15%;width:13%;aspect-ratio:1.7;border:1px solid rgba(168,115,21,.48);border-radius:50%;box-shadow:0 0 0 16px rgba(181,126,23,.07),0 0 0 36px rgba(181,126,23,.035);opacity:0;transform:translate(-50%,-50%) scale(.35)}
.hero-animation .hero-sound-wave-one{left:53%}.hero-animation .hero-sound-wave-two{left:81%}
.hero-animation .hero-animation-label{position:absolute;right:5%;bottom:83px;color:#58452a;font-size:11px;font-weight:700;letter-spacing:2px;text-align:right;text-shadow:0 1px 10px white}
.hero-animation .hero-animation-label span{display:block;opacity:0}
.hero-animation .hero-motion-control{position:absolute;right:5%;bottom:24px;z-index:5;display:flex;align-items:center;border:1px solid rgba(51,43,30,.3);background:rgba(255,255,255,.88);border-radius:40px;padding:9px 15px;font-family:inherit;font-weight:600;font-size:12px;line-height:1.2;color:#292923;cursor:pointer;box-shadow:0 4px 16px rgba(0,0,0,.08)}
.hero-animation .hero-motion-control[hidden]{display:none}
.hero-animation .hero-motion-control:hover{background:white}
.hero-animation .hero-motion-control:focus-visible{outline:3px solid #b37c09;outline-offset:3px}
.hero-animation.is-playing .hero-scene.is-current .hero-complete{animation:llg-finished-room 15s ease-in-out 1 both}
.hero-animation.is-playing .hero-scene.is-current .hero-pencil-canvas{animation:llg-graphite-layer 15s ease-in-out 1 both}
.hero-animation.is-playing .hero-scene.is-current .hero-light-glow{animation:llg-warmth 15s ease-in-out 1 both}
.hero-animation.is-playing .hero-scene.is-current .hero-sound-wave-one{animation:llg-sound 15s ease-in-out 1 both}
.hero-animation.is-playing .hero-scene.is-current .hero-sound-wave-two{animation:llg-sound 15s ease-in-out 1 both;animation-delay:.22s}
.hero-animation.is-playing .hero-scene.is-current .hero-label-sketch{animation:llg-sketch-caption 15s ease-in-out 1 both}
.hero-animation.is-playing .hero-scene.is-current .hero-label-detail{animation:llg-shade-caption 15s ease-in-out 1 both}
.hero-animation.is-playing .hero-scene.is-current .hero-label-finish{animation:llg-light-caption 15s ease-in-out 1 both}
.hero-animation.is-paused :is(.hero-complete,.hero-pencil-canvas,.hero-light-glow,.hero-sound-wave,.hero-animation-label span){animation-play-state:paused!important}
@keyframes llg-graphite-layer{0%,49%{opacity:1}68%,100%{opacity:0}}
@keyframes llg-finished-room{0%,48%{opacity:0}80%,100%{opacity:1}}
@keyframes llg-warmth{0%,68%{opacity:0}82%,100%{opacity:1}}
@keyframes llg-sound{0%,70%{opacity:0;transform:translate(-50%,-50%) scale(.35)}82%{opacity:.52}94%{opacity:.08;transform:translate(-50%,-50%) scale(1.75)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.75)}}
@keyframes llg-sketch-caption{0%,6%{opacity:0}14%,42%{opacity:1}52%,100%{opacity:0}}
@keyframes llg-shade-caption{0%,43%{opacity:0}52%,65%{opacity:1}73%,100%{opacity:0}}
@keyframes llg-light-caption{0%,68%{opacity:0}77%,89%{opacity:1}98%,100%{opacity:0}}
@media(max-width:700px){
 .hero-full .hero-image.hero-animation{position:relative;inset:auto;z-index:0;width:100%;height:auto;aspect-ratio:1672/941;min-height:0}
 .hero-full .hero-image .hero-visual img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center}
 .hero-animation .hero-light-glow{background:radial-gradient(ellipse 12% 26% at 25% 22%,rgba(247,186,57,.35),transparent 80%),radial-gradient(ellipse 12% 26% at 52% 22%,rgba(247,186,57,.3),transparent 80%),radial-gradient(ellipse 12% 26% at 80% 22%,rgba(247,186,57,.3),transparent 80%)}
 .hero-animation .hero-sound-wave-one{left:35%}.hero-animation .hero-sound-wave-two{left:73%}
 .hero-animation .hero-animation-label{right:5%;bottom:67px;font-size:10px;letter-spacing:1.4px}
 .hero-animation .hero-motion-control{right:5%;bottom:13px;padding:8px 12px}
}
@media(prefers-reduced-motion:reduce){.hero-animation .hero-scene{transition:none!important}.hero-animation .hero-drawing,.hero-animation .hero-light-glow,.hero-animation .hero-sound-wave,.hero-animation .hero-animation-label,.hero-animation .hero-pencil-canvas{display:none!important}.hero-animation .hero-complete{opacity:1!important;animation:none!important}}
