/* ＆hana motion layer. Existing layout and copy remain the source of truth.
   Native CSS, no dependencies. All content works without this layer. */
:root{--hana-ease:cubic-bezier(.22,1,.36,1)}
/* Shared mobile footer: balance the logo and contact details within the page. */
@media(max-width:760px){
  .footer{position:relative;isolation:isolate;text-align:center;row-gap:25px}
  .footer>img{justify-self:center;margin-top:7px;width:160px}
  .footer>div{position:relative;z-index:1}
  .footer .home-footer-nav{text-align:left}
  .footer:after{content:"";position:absolute;z-index:-1;right:20px;bottom:125px;width:140px;height:220px;background:url('botanical-sprig.png') center/contain no-repeat;opacity:.28;pointer-events:none;rotate:12deg}
}
@media(prefers-reduced-motion:no-preference){
  .button{transition:background .35s ease,color .35s ease,translate .45s var(--hana-ease)}
  .button span[aria-hidden],.news-arrow{display:inline-block;transition:translate .45s var(--hana-ease)}
  .button:active{translate:0 1px}
  .arrow-link .long-arrow{transform-origin:right;transition:transform .5s var(--hana-ease)}
  .service-image img,.instagram-posts img{transition:scale .85s var(--hana-ease),transform .85s var(--hana-ease)}
  .header nav a{position:relative}
  .header nav a:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:1px;background:var(--green);scale:0 1;transform-origin:right;transition:scale .4s var(--hana-ease)}
  .header nav a:focus-visible:after{scale:1 1;transform-origin:left}
  .button:focus-visible span[aria-hidden]{translate:4px -3px}
  .arrow-link:focus-visible .long-arrow{transform:translateX(5px)}
  @media(hover:hover) and (pointer:fine){
    .button:hover{translate:0 -2px}
    .button:hover span[aria-hidden]{translate:4px -3px}
    .header nav a:hover:after{scale:1 1;transform-origin:left}
    .instagram-posts a:hover img{scale:1.045}
    .home-news-list a:hover .news-arrow{translate:4px -4px}
  }
  .hana-reveal{transition:opacity .85s var(--hana-ease),translate .85s var(--hana-ease);transition-delay:var(--reveal-delay,0ms)}
  .hana-reveal:not(.is-visible){opacity:0;translate:0 24px}
  .hana-reveal.is-visible,.hana-reveal:focus-within{opacity:1;translate:0 0}
  .hana-entry .home-hero-copy>*,.hana-entry .hero-copy>*,.hana-entry .page-hero-copy>*,.hana-entry .article-heading>*,.hana-entry .home-room-inset{
    animation:hana-enter 1s var(--hana-ease) both;animation-delay:calc(var(--entry-delay,0ms) + var(--intro-delay,0ms))
  }
  .hana-entry .home-hero-copy h1,.hana-entry .hero-copy h1{--entry-delay:90ms}
  .hana-entry .home-hero-intro,.hana-entry .hero-intro{--entry-delay:180ms}
  .hana-entry .home-hero-copy>.button,.hana-entry .hero-link{--entry-delay:270ms}
  .hana-entry .home-room-inset{--entry-delay:360ms}
  @keyframes hana-enter{from{opacity:0;translate:0 20px}to{opacity:1;translate:0 0}}
  /* One 2.5-second sequence: logo → curtain → photo → copy → finishing details. */
  .hana-opening{position:fixed;inset:0;z-index:30;display:grid;place-items:center;background:#fff;pointer-events:none;animation:hana-curtain .65s var(--hana-ease) .55s both}
  .hana-opening-brand{display:grid;justify-items:center;gap:22px;animation:hana-brand-away .45s ease .6s both}
  .hana-opening img{width:170px;animation:hana-logo .55s var(--hana-ease) both}
  .hana-opening-line{width:64px;height:1px;background:var(--green);transform-origin:left;animation:hana-line .6s var(--hana-ease) both}
  @keyframes hana-logo{from{opacity:0;translate:0 10px}to{opacity:1;translate:0 0}}
  @keyframes hana-line{from{scale:0 1;opacity:0}to{scale:1 1;opacity:1}}
  @keyframes hana-brand-away{from{opacity:1;translate:0 0}to{opacity:0;translate:0 -16px}}
  @keyframes hana-curtain{from{clip-path:inset(0)}to{clip-path:inset(0 0 100% 0)}}
  .hana-journey .header{animation:hana-soft-show .7s var(--hana-ease) .7s both}
  .hana-journey .home-hero-photo{animation:hana-photo-open 1.1s var(--hana-ease) .55s both}
  .hana-journey .home-hero-label{animation:hana-enter .75s var(--hana-ease) .9s both}
  .hana-journey .home-hero h1{animation:hana-enter .9s var(--hana-ease) 1.05s both}
  .hana-journey .home-hero-intro{animation:hana-enter .8s var(--hana-ease) 1.25s both}
  .hana-journey .home-hero-copy>.button{animation:hana-enter .8s var(--hana-ease) 1.45s both}
  .hana-journey .home-room-inset{animation:hana-enter .9s var(--hana-ease) 1.6s both}
  .hana-journey .home-flower-left,.hana-journey .home-flower-right{animation:hana-soft-show .9s var(--hana-ease) 1.45s both}
  .hana-preparing :is(.hana-opening,.hana-opening-brand,.header,.home-hero-photo,.home-hero-label,.home-hero h1,.home-hero-intro,.home-hero-copy>.button,.home-room-inset,.home-flower-left,.home-flower-right){animation-play-state:paused}
  @keyframes hana-photo-open{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
  .hana-journey .home-flower-right{--entry-opacity:.65}
  @keyframes hana-soft-show{from{opacity:0}to{opacity:var(--entry-opacity,1)}}
  /* Scroll-driven parallax. Unsupported browsers retain the approved static image. */
  @supports(animation-timeline:view()){
    .home-hero{view-timeline-name:--hero;view-timeline-axis:block}
    .home-hero-photo>img{scale:1.08;animation:hana-hero-depth linear both;animation-timeline:--hero;animation-range:exit 0% exit 100%}
    @keyframes hana-hero-depth{from{translate:0 -1%}to{translate:0 3%}}
    .home-page .menu-flower,.home-page .home-about-flower,.home-page .instagram-flower-right,.home-page .faq-sprig{animation:hana-plant-depth linear both;animation-timeline:view();animation-range:entry 0% exit 100%}
    @keyframes hana-plant-depth{from{translate:0 24px}to{translate:0 -24px}}
    @media(max-width:760px){
      .home-hero-photo>img{scale:1.06}
      @keyframes hana-plant-depth{from{translate:0 12px}to{translate:0 -12px}}
    }
  }
}
@media(prefers-reduced-motion:reduce){
  .hana-opening{display:none!important}
  .hana-reveal{opacity:1!important;translate:none!important}
  .home-hero-photo>img{scale:none!important;translate:none!important}
}
@media print{.hana-opening{display:none}.hana-reveal{opacity:1!important;translate:none!important}}