.brand-han,.about-signature{font-family:JiangCalligraphy,'STKaiti','KaiTi',serif;font-weight:400}
.brand-han{font-size:49px;line-height:1;transform:translateY(2px)}
.about-signature{font-size:160px;color:var(--accent)}
.leaf-field{position:absolute;right:0;top:75px;width:235px;height:225px;pointer-events:none;z-index:-1;opacity:0}
.falling-leaf{position:absolute;width:45px;height:auto;opacity:0;will-change:transform,opacity;animation:leaf-fall 12s linear infinite;animation-play-state:paused;transform-origin:55% 45%}
.falling-leaf:not([src]){visibility:hidden}
.leaf-one{left:24%;top:4%;--drift:-38px;--turn:130deg;--tilt:25deg;animation-delay:-1.8s}
.leaf-two{left:62%;top:0;--drift:-60px;--turn:-105deg;--tilt:-30deg;animation-duration:14.8s;animation-delay:-8.4s;width:37px}
.leaf-three{left:82%;top:7%;--drift:-23px;--turn:185deg;--tilt:65deg;animation-duration:16.4s;animation-delay:-12s;width:40px}
@keyframes leaf-fall{
  0%{transform:translate3d(0,0,0) rotate(var(--tilt)) scaleX(.88);opacity:0}
  7%{opacity:.72}
  28%{transform:translate3d(12px,50px,0) rotate(68deg) scaleX(.48);opacity:.68}
  52%{transform:translate3d(-21px,108px,0) rotate(-12deg) scaleX(.92);opacity:.56}
  76%{transform:translate3d(4px,162px,0) rotate(var(--turn)) scaleX(.5);opacity:.32}
  93%,100%{transform:translate3d(var(--drift),207px,0) rotate(var(--turn)) scaleX(.8);opacity:0}
}
html[data-motion=on][data-page-visible=true][data-hero-visible=true] .leaf-field{opacity:1}
html[data-motion=on][data-page-visible=true][data-hero-visible=true] .falling-leaf{animation-play-state:running}
html[data-hero-visible=false] .branch-art,html[data-page-visible=false] .branch-art{animation-play-state:paused}
html[data-motion=off] .leaf-field{display:none}
@media(max-width:850px){.about-signature{font-size:115px}.leaf-field{right:0;top:102px;width:175px}.falling-leaf{width:38px}}
@media(max-width:540px){.brand-han{font-size:41px}.about-signature{font-size:90px}.leaf-field{right:0;top:30px;width:92px;height:170px}.falling-leaf{width:28px}.leaf-two{width:25px}.leaf-three{display:none}.leaf-one{left:18%;--drift:4px}.leaf-two{left:64%;--drift:-12px}.leaf-field{transform:scale(.78);transform-origin:top right}}
@media(max-width:360px){.leaf-field{width:50px;right:-5px}.leaf-one{left:30%}}
@media(prefers-reduced-motion:reduce){html:not([data-motion=on]) .leaf-field{display:none}}