/* ---- motion layer (v3) ---- */
@keyframes pageIn{from{opacity:0}to{opacity:1}}body{animation:pageIn .8s ease both}
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:60;background:linear-gradient(90deg,var(--sage),var(--gilt));transform-origin:0 50%;transform:scaleX(0);pointer-events:none}
/* nav underline */
.nav nav a:not(.pill){position:relative}.nav nav a:not(.pill)::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1.5px;background:var(--gilt);transform:scaleX(0);transform-origin:right;transition:transform .45s cubic-bezier(.6,0,.2,1)}
.nav nav a:not(.pill):hover::after,.nav nav a[aria-current]:not(.pill)::after{transform:scaleX(1);transform-origin:left}
/* buttons */
.gbtn,.tbtn,.pill{position:relative;overflow:hidden;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,background .35s,color .35s}
.gbtn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s}
.gbtn:hover::after{transform:translateX(120%)}.gbtn:hover,.tbtn:hover{transform:translateY(-3px)}.gbtn:active,.tbtn:active{transform:translateY(0) scale(.97)}
.tlink{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;border:0;transition:background-size .4s}.tlink:hover{background-size:100% 1px}
/* hero */
.hero{isolation:isolate}.petals{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}.hero-in{z-index:1}
.frame{will-change:transform}.frame::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,250,235,.55) 48%,rgba(201,164,92,.25) 52%,transparent 65%);background-size:250% 100%;background-position:150% 0;animation:sweep 7s ease-in-out 1.2s infinite;mix-blend-mode:soft-light}
@keyframes sweep{0%{background-position:150% 0}45%,100%{background-position:-60% 0}}
.js .hero h1 .w{display:inline-block;opacity:0;transform:translateY(.45em);filter:blur(4px);animation:wordIn .9s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(.25s + var(--i)*.14s)}
@keyframes wordIn{to{opacity:1;transform:none;filter:none}}
.js .hero .kick,.js .hero .lede,.js .hero-txt>a{opacity:0;animation:wordIn 1s ease forwards}.js .hero .kick{animation-delay:.1s}.js .hero .lede{animation-delay:1s}.js .hero-txt>a{animation-delay:1.25s}
/* lotus */
.memory{position:relative;overflow:hidden}.lotus{position:absolute;right:4%;top:50%;width:min(320px,40vw);transform:translateY(-50%);color:var(--sage);opacity:.55;pointer-events:none}
.js .lotus path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.6s cubic-bezier(.6,.1,.2,1)}.js .lotus path:nth-child(2),.js .lotus path:nth-child(3){transition-delay:.4s}.js .lotus path:nth-child(4),.js .lotus path:nth-child(5){transition-delay:.8s}.js .lotus path:nth-child(6){transition-delay:1.2s}
.js .memory.in .lotus path{stroke-dashoffset:0}
/* dividers: drawn line at top of each section */
main>section{position:relative}
.js main>section+section::before{content:"";position:absolute;top:0;left:50%;width:min(240px,50%);height:1px;margin-left:calc(min(240px,50%)/-2);background:linear-gradient(90deg,transparent,var(--gilt),transparent);transform:scaleX(0);transition:transform 1.4s cubic-bezier(.6,0,.2,1)}
.js main>section.lined::before{transform:scaleX(1)}
/* staggers */
.js .rv{transition-delay:calc(var(--d,0)*110ms)}
.js .gallery-sec .masonry li{opacity:0;transform:scale(.94);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--d,0)*45ms)}.js .gallery-sec .masonry li.in{opacity:1;transform:none}
.gi img{transition:transform 1.1s cubic-bezier(.2,.7,.2,1),filter .6s}.gi:hover img{transform:scale(1.08)}
/* steps connecting line */
.steps ol{position:relative}.steps ol::before{content:"";position:absolute;top:-1.4rem;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--sage),var(--gilt));transform-origin:0 50%;transform:scaleX(var(--p,1))}
.js .steps ol::before{transform:scaleX(var(--p,0))}
.steps li::before{content:"";position:absolute;top:calc(-1.4rem - 5px);left:-6px;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid var(--sage)}
/* faq */
.faq details p{animation:none}.faq details[open] p{animation:faqIn .5s ease}@keyframes faqIn{from{opacity:0;transform:translateY(-6px)}}
/* lightbox */
dialog#lb[open]{animation:lbIn .45s cubic-bezier(.2,.7,.2,1)}dialog#lb[open]::backdrop{animation:pageIn .45s ease}
dialog#lb.closing{animation:lbOut .3s ease forwards}dialog#lb.closing::backdrop{animation:pageIn .3s ease reverse forwards}
@keyframes lbIn{from{opacity:0;transform:scale(.94)}}@keyframes lbOut{to{opacity:0;transform:scale(.96)}}
#lb img{transition:opacity .3s}#lb img.swap{opacity:0}
/* diya ignite */
.lightbtn{position:relative}.lightbtn .diya.big{position:relative}
.lightbtn .bloom{position:absolute;left:50%;top:40%;width:220px;height:220px;margin:-110px 0 0 -110px;border-radius:50%;background:radial-gradient(circle,rgba(201,164,92,.55),rgba(201,164,92,0) 65%);opacity:0;transform:scale(.3);pointer-events:none}
.lightbtn.ignite .bloom{animation:bloom 1.6s ease-out forwards}@keyframes bloom{30%{opacity:1;transform:scale(1.1)}100%{opacity:.35;transform:scale(1)}}
.lightbtn.ignite .flame{animation:ignite .9s cubic-bezier(.2,.9,.3,1.4),flick 2.4s ease-in-out .9s infinite}@keyframes ignite{from{transform:scale(0);opacity:0}60%{transform:scale(1.3,1.15)}}
.spark{position:absolute;left:50%;top:38%;width:4px;height:4px;border-radius:50%;background:#e8b965;box-shadow:0 0 6px 2px rgba(201,164,92,.7);pointer-events:none;animation:spark 1.4s ease-out forwards}
@keyframes spark{from{opacity:1;transform:translate(0,0)}to{opacity:0;transform:translate(var(--x),-110px) scale(.4)}}
/* reduced motion: everything static & visible */
@media (prefers-reduced-motion:reduce){body{animation:none}.js .rv,.js .gallery-sec .masonry li,.js .hero h1 .w,.js .hero .kick,.js .hero .lede,.js .hero-txt>a{opacity:1!important;transform:none!important;filter:none!important;animation:none!important}
.js .lotus path{stroke-dashoffset:0}.js main>section+section::before{transform:scaleX(1)}.js .steps ol::before{transform:scaleX(1)}.petals,.progress,.spark,.frame::after{display:none}.frame{transform:rotate(1.5deg)!important}}
@media (max-width:960px) and (prefers-reduced-motion:reduce){.frame{transform:none!important}}
