/* A living scene: independent camera, water, atmosphere and foreground planes. */
.hero{--look-x:0px;--look-y:0px;--near-x:0px;--near-y:0px;--scroll-lift:0px;--scene-zoom:1.035;perspective:1400px}
.scene-camera{position:absolute;inset:-2%;z-index:-3;pointer-events:none;isolation:isolate}
.scene-world{position:absolute;inset:0;transform:translate3d(var(--look-x),calc(var(--look-y) + var(--scroll-lift)),0) scale(var(--scene-zoom));will-change:transform}
.scene-world .garden{z-index:0;animation:none!important;will-change:auto}
.scene-surface{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .65s;pointer-events:none}
.scene-surface.ready{opacity:1}
.scene-atmosphere{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none}
.scene-mist{position:absolute;width:105%;height:30%;bottom:2%;left:-30%;background:radial-gradient(ellipse,#d7e7de38,transparent 67%);filter:blur(16px);transform-origin:center;animation:mist-crossing 17s ease-in-out infinite alternate}
.scene-mist:nth-child(2){left:26%;bottom:23%;width:80%;height:24%;opacity:.65;animation-duration:23s;animation-delay:-8s}
.scene-mist:nth-child(3){left:-10%;bottom:7%;width:110%;height:15%;opacity:.5;animation-duration:12s;animation-delay:-4s}
.scene-front-parallax{position:absolute;inset:-2%;z-index:-1;pointer-events:none;transform:translate3d(var(--near-x),var(--near-y),0);will-change:transform}
.scene-foreground{position:absolute;right:-7%;top:-11%;width:min(53vw,850px);pointer-events:none;transform-origin:100% 0}
.scene-branch{display:block;width:100%;height:auto;transform-origin:93% 5%;animation:branch-wind 6.6s ease-in-out infinite alternate;filter:drop-shadow(0 12px 15px #09281f20)}
.bamboo .scene-foreground{right:auto;left:-11%;top:-19%;width:min(58vw,960px);transform-origin:0 0}
.bamboo .scene-branch{transform-origin:8% 0;animation-duration:7.4s;filter:drop-shadow(0 10px 13px #0005)}
.winter .scene-foreground{right:-8%;top:-15%;width:min(57vw,900px)}
.winter .scene-branch{animation-duration:9.2s;filter:drop-shadow(0 8px 8px #312b1915)}
.scene-light{position:absolute;inset:-20%;z-index:1;pointer-events:none;mix-blend-mode:screen;opacity:.2;background:conic-gradient(from 156deg at 78% 0%,transparent 0deg,#f4f3cf70 7deg,transparent 12deg,#f4f3cf35 17deg,transparent 25deg);filter:blur(9px);animation:light-through-leaves 14s ease-in-out infinite alternate}
.bamboo .scene-light{opacity:.32;background:conic-gradient(from 150deg at 78% -4%,transparent 0deg,#b6ddec7a 7deg,transparent 12deg,#c4dfed45 19deg,transparent 29deg);filter:blur(12px)}
.winter .scene-light{opacity:.15;background:linear-gradient(115deg,transparent 32%,#fff5d4a6 46%,transparent 60%);animation-duration:18s}
.bamboo .scene-mist{background:radial-gradient(ellipse,#a4c5d15c,transparent 67%);filter:blur(22px);height:40%;bottom:-5%;animation-duration:14s}
.winter .scene-mist{background:radial-gradient(ellipse,#fff9e9a3,transparent 65%);height:25%;bottom:8%}
.hero-copy{z-index:3}.hero-bottom,.edition-bottom,.garden-seal,.vertical-poem{z-index:4}
.hero h1 .title-line{display:block;overflow:hidden;padding:.14em .06em;margin:-.14em -.06em;perspective:900px}
.hero h1 .title-word{display:inline-block;white-space:nowrap}
.hero h1 .glyph{display:inline-block;transform-origin:50% 100%;backface-visibility:hidden}
.hero h1 .title-space{white-space:pre}
.intro-enabled:not(.intro-skipped):not(.motion-paused) .hero h1.hero-enter{animation:none;opacity:1;transform:none;filter:none}
.intro-enabled:not(.intro-skipped):not(.motion-paused) .hero .glyph{animation:letter-unfold 1.35s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(.48s + var(--letter) * .035s)}
.intro-enabled:not(.intro-skipped):not(.motion-paused) .bamboo .hero .glyph{animation-delay:calc(.65s + var(--letter) * .04s)}
.intro-enabled:not(.intro-skipped):not(.motion-paused) .winter .hero .glyph{animation-delay:calc(.5s + var(--letter) * .035s)}
.intro-enabled:not(.intro-skipped):not(.motion-paused) .scene-camera{animation:arrive-in-garden 3.6s cubic-bezier(.16,.65,.2,1) both}
.intro-enabled:not(.intro-skipped):not(.motion-paused) .scene-foreground{animation:foreground-arrival 3.5s cubic-bezier(.15,.7,.2,1) both}
.intro-active .hero .scene-branch{animation-play-state:running}
.hero-actions .button{position:relative;overflow:hidden;transition:background .3s,color .3s,box-shadow .35s,transform .35s cubic-bezier(.2,.8,.2,1)}
.hero-actions .button:after{content:'';position:absolute;inset:-80% -45%;background:linear-gradient(110deg,transparent 40%,#fff7df5c 50%,transparent 60%);transform:translateX(-65%);transition:transform .8s;pointer-events:none}
.hero-actions .button:hover:after{transform:translateX(65%)}
.food-frame img{transition:transform 1.2s cubic-bezier(.16,1,.3,1);transform:scale(1.055) translateY(var(--food-shift,0px));will-change:transform}
.food-frame:hover img{transform:scale(1.09) translateY(var(--food-shift,0px))}
.cinema-section-title .reveal-word{display:inline-block;clip-path:inset(0 0 100% 0);transform:translateY(25px);transition:clip-path 1.1s cubic-bezier(.16,1,.3,1),transform 1.1s cubic-bezier(.16,1,.3,1);transition-delay:calc(var(--word) * .06s)}
.cinema-section-title.visible .reveal-word{clip-path:inset(-15% -8% -25% -8%);transform:none}
.scene-offscreen .scene-branch,.scene-offscreen .scene-mist,.scene-offscreen .scene-light{animation-play-state:paused}
.intro-skipped .scene-camera,.intro-skipped .scene-foreground,.intro-skipped .hero .glyph{animation:none}
.motion-paused .scene-world,.motion-paused .scene-front-parallax{transform:none}
.motion-paused .hero .glyph,.motion-paused .hero .title-word{animation:none;transform:none;filter:none;opacity:1}
.motion-paused .cinema-section-title .reveal-word{clip-path:none;transform:none}
@keyframes letter-unfold{from{transform:translate3d(0,125%,0) rotateX(-65deg) rotateZ(5deg);opacity:0}to{transform:none;opacity:1}}
@keyframes arrive-in-garden{from{transform:scale(1.17);filter:brightness(.78)}to{transform:scale(1);filter:brightness(1)}}
@keyframes foreground-arrival{from{transform:scale(1.42) rotate(-4deg);opacity:0}24%{opacity:1}to{transform:scale(1) rotate(0);opacity:1}}
@keyframes branch-wind{0%{transform:rotate(-1.7deg) translateY(-3px)}50%{transform:rotate(.6deg) translateX(4px)}100%{transform:rotate(2deg) translateY(7px)}}
@keyframes mist-crossing{from{transform:translate3d(-8%,4%,0) scale(.95);opacity:.35}50%{opacity:.8}to{transform:translate3d(24%,-9%,0) scale(1.15);opacity:.45}}
@keyframes light-through-leaves{from{transform:rotate(-6deg) translateX(-1%);opacity:.08}50%{opacity:.3}to{transform:rotate(4deg) translateX(3%);opacity:.17}}
@media(max-width:700px){
 .scene-camera{inset:-1%}.scene-mist{filter:blur(12px);height:28%;width:150%;bottom:5%}
 .scene-foreground{width:110%;right:-35%;top:-3%}.scene-branch{opacity:.86}
 .bamboo .scene-foreground{width:135%;left:-39%;top:-3%}.bamboo .scene-branch{opacity:.8}
 .winter .scene-foreground{width:110%;right:-34%;top:-5%}.winter .scene-branch{opacity:.85}
 .scene-light{opacity:.14}.bamboo .scene-light{opacity:.2}
 .intro-enabled:not(.intro-skipped):not(.motion-paused) .scene-camera{animation-duration:3.1s}
 .hero h1 .title-line{padding-top:.12em;padding-bottom:.15em}
 .food-frame img{will-change:auto}
}
@media(prefers-reduced-motion:reduce){
 .scene-world,.scene-front-parallax{transform:none!important}.scene-light,.scene-mist{display:none}.scene-branch{animation:none}
 .hero .glyph{opacity:1!important;transform:none!important;filter:none!important}.cinema-section-title .reveal-word{clip-path:none;transform:none}
 .food-frame img{transform:none;will-change:auto}
}