/* Scroll-linked rotation uses stable stages so it tracks scrolling in both directions. */
.logo-window{display:block;position:relative;width:100%;aspect-ratio:3/1;overflow:hidden;background:#fff;border-radius:4px}
.logo-window img,.brand .logo-window img{position:absolute;max-width:none;width:122%;height:auto;left:-11%;top:50%;transform:translateY(-48%);object-fit:contain}
.brand{width:240px}.footer-name{display:block;width:min(310px,100%)}
@media(max-width:1100px){.brand{width:210px}nav{gap:12px}.nav-wrap{gap:14px}}
@media(max-width:600px){.brand{width:clamp(185px,57vw,230px)}.nav-wrap{gap:10px}.menu-toggle{padding:8px 12px}}
.section-stage{display:flow-root;perspective:1200px;perspective-origin:center center}
.section-stage>.section-motion{opacity:var(--section-opacity,1);transform:translateZ(var(--section-depth,0px)) rotateX(var(--section-turn,0deg));transform-origin:var(--section-origin,center top);transition:none;backface-visibility:hidden}
.section-stage>.section-motion:focus-within{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.section-stage>.section-motion{opacity:1!important;transform:none!important}}
.card-stage,.image-stage{perspective:1000px;min-width:0}
.card-stage:nth-child(even){margin-top:36px}
.card-stage .program-card{margin-top:0;transform:translateZ(var(--scroll-lift,0px)) rotateX(var(--scroll-turn,0deg)) rotateY(var(--scroll-side,0deg)) scale(var(--scroll-scale,1));transition:box-shadow .3s;transform-origin:center;box-shadow:0 14px 0 -7px #c8d5bf,0 30px 45px #142e2628}
.card-stage .program-card:hover{transform:translateZ(18px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .2s,box-shadow .3s}
.card-stage:focus-within .program-card{transform:none}
.image-stage img{transform:rotateX(var(--scroll-turn,0deg)) rotateY(var(--scroll-side,0deg)) scale(var(--scroll-scale,1));transform-origin:center;box-shadow:12px 18px 0 -5px #dcb76a,20px 35px 55px #142e2640;backface-visibility:hidden}
.hero-scenery{perspective:1100px}
.hero-scenery img{transform:translateY(var(--hero-y,0px)) rotateY(var(--hero-turn,0deg)) scale(1.16);transform-origin:right center}
.hope-seal{transform:perspective(700px) translateY(var(--seal-y,0px)) rotateY(var(--hero-turn,0deg)) rotate(10deg)}
.story-quote{z-index:2}
@media(max-width:1100px){.card-stage:nth-child(even){margin-top:0}}
@media(max-width:600px){.image-stage img{box-shadow:8px 12px 0 -4px #dcb76a,10px 20px 30px #142e2630}.hero-scenery img{transform:translateY(calc(var(--hero-y,0px)*.4)) rotateY(var(--hero-turn,0deg)) scale(1.12)}}
@media(prefers-reduced-motion:reduce){.card-stage .program-card,.card-stage .program-card:hover,.image-stage img,.hero-scenery img,.hope-seal{transform:none!important}}