/* AMARABALI: retain the original design, amplify its motion. */
:root{--motion-ease:cubic-bezier(.16,1,.3,1)}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{overflow-x:clip}
.reveal{opacity:0;transform:translate3d(var(--reveal-x,0px),110px,0) scale(.94);transition:opacity 1.1s ease,transform 1.45s var(--motion-ease);transition-delay:var(--reveal-delay,0ms)}
.reveal.is-visible{opacity:1;transform:translate3d(0,0,0) scale(1)}
section{overflow-x:clip}
#top>div:first-child{inset:-8%;transform-origin:center;animation:amara-landscape 20s ease-in-out infinite alternate;will-change:transform}
#top>.container{padding-top:120px;padding-bottom:110px}
#top .reveal:first-child{animation:amara-copy 1.55s var(--motion-ease) both}
#top .container>.reveal{animation:amara-photo 1.8s var(--motion-ease) both;animation-delay:.12s}
#top figure{animation:amara-float 7s ease-in-out 1.8s infinite;will-change:transform}
#top figure img{box-shadow:0 28px 70px #051a0d66}
#about figure,#reasons figure{overflow:hidden}
#about figure img,#reasons figure img{transition:transform 1.7s var(--motion-ease)}
#about .reveal:not(.is-visible) img,#reasons .reveal:not(.is-visible) img{transform:scale(1.18)}
.motion-photo{overflow:hidden}
.motion-photo img{transition:transform .9s var(--motion-ease)}
@media(hover:hover){.motion-photo:hover img{transform:scale(1.08)}a[href^="https://lin.ee/"],a[href^="tel:"]{transition:transform .35s var(--motion-ease),box-shadow .35s ease}a[href^="https://lin.ee/"]:hover,a[href^="tel:"]:hover{transform:translateY(-5px);box-shadow:0 12px 30px #0003}}
[role="tabpanel"][data-state="active"]{animation:amara-panel .7s var(--motion-ease) both}
[role="dialog"][data-state="open"]{animation:amara-dialog .5s var(--motion-ease) both}
a:focus-visible,button:focus-visible{outline:3px solid #d5ae53;outline-offset:5px}
.motion-control{position:fixed;z-index:45;right:16px;bottom:86px;display:flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:9px 13px;border:1px solid #d8c48c80;border-radius:30px;background:#173d25ee;color:#fff;font:500 12px/1.4 sans-serif;box-shadow:0 4px 16px #0002;cursor:pointer;backdrop-filter:blur(10px)}
.motion-control svg{width:16px;height:16px;flex-shrink:0}
@keyframes amara-copy{from{opacity:0;transform:translate3d(-85px,65px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes amara-photo{from{opacity:0;transform:translate3d(150px,70px,0) scale(.72) rotate(6deg)}to{opacity:1;transform:translate3d(0,0,0) scale(1) rotate(0)}}
@keyframes amara-landscape{from{transform:translate3d(0,var(--hero-shift,0px),0) scale(1.15)}to{transform:translate3d(-2%,var(--hero-shift,0px),0) scale(1.01)}}
@keyframes amara-float{0%,100%{transform:translateY(0) rotate(-.6deg)}50%{transform:translateY(-22px) rotate(.6deg)}}
@keyframes amara-panel{from{opacity:0;transform:translateY(55px)}to{opacity:1;transform:translateY(0)}}
@keyframes amara-dialog{from{opacity:0;scale:.88}to{opacity:1;scale:1}}
@media(min-width:1024px){#top h1{font-size:clamp(3.75rem,5vw,5rem)}#top .container>.reveal{flex-shrink:0}#top figure img{width:clamp(24rem,34vw,30rem)}}
@media(max-width:1023px){#top>.container{padding-top:95px;padding-bottom:55px;gap:36px}#top figure img{width:min(70vw,340px);max-height:48svh;object-fit:cover}#top h1{font-size:clamp(2rem,6.4vw,3rem)}.reveal{transform:translate3d(0,75px,0) scale(.95)}#top .container>.reveal{animation-name:amara-panel}.motion-control{right:10px;bottom:78px}#top .container>.order-2{width:100%;min-width:0}}
@media(max-width:390px){#top .container>.order-2 .gap-6{gap:16px}#top .container>.order-2 p{line-height:1.75}header .container{gap:8px}}
.motion-paused *, .motion-paused *::before,.motion-paused *::after{animation-play-state:paused!important}
.motion-paused .reveal{opacity:1!important;transform:none!important;transition:none!important}
.motion-paused #top .reveal,.motion-paused [role="tabpanel"],.motion-paused [role="dialog"]{animation:none!important;opacity:1!important;transform:none!important}
.motion-paused #top>div:first-child{animation:none!important;transform:scale(1.05)!important}
.motion-paused #top figure{animation:none!important;transform:none!important}
html.motion-paused{scroll-behavior:auto}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.reveal{opacity:1!important;transform:none!important}#top>div:first-child{transform:none!important}#top figure{transform:none!important}}