/* ===== Formenzo motion system v1 — vanilla, transform/opacity only ===== */
@media (prefers-reduced-motion: no-preference){

/* A) Hero entrance choreography (page load — homepage + zone pages) */
@keyframes fzUp{from{opacity:0;transform:translateY(22px);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
.searchwrap__in>h1{animation:fzUp .8s cubic-bezier(.2,.7,.2,1) .05s both}
.searchwrap__in>p{animation:fzUp .8s cubic-bezier(.2,.7,.2,1) .18s both}
.searchwrap__in .search{animation:fzUp .85s cubic-bezier(.2,.7,.2,1) .32s both}
.searchwrap__in .search~*{animation:fzUp .8s cubic-bezier(.2,.7,.2,1) .48s both}
.hero .tag{animation:fzUp .7s cubic-bezier(.2,.7,.2,1) .05s both}
.hero h1{animation:fzUp .8s cubic-bezier(.2,.7,.2,1) .16s both}
.hero h1~p{animation:fzUp .8s cubic-bezier(.2,.7,.2,1) .3s both}

/* B) Metallic shimmer on the hero gold words */
@keyframes fzShimmer{to{background-position:200% center}}
.searchwrap__in>h1 em,.hero h1 em{background:linear-gradient(100deg,#E8C56B 20%,#C9A24A 38%,#F6E3A8 50%,#C9A24A 62%,#E8C56B 80%);background-size:200% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:fzShimmer 7s linear infinite;font-style:normal}

/* C) Gold sheen sweep on primary CTAs */
.btn--gold,.btn--navy,.btn--green,a.cta{position:relative;overflow:hidden}
.btn--gold::after,.btn--navy::after,.btn--green::after,a.cta::after{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.38),transparent);transform:skewX(-20deg);transition:left .05s;pointer-events:none}
.btn--gold:hover::after,.btn--navy:hover::after,.btn--green:hover::after,a.cta:hover::after{left:140%;transition:left .65s cubic-bezier(.2,.7,.2,1)}

/* D) Section heading gold rule draws in on reveal */
.sec-h h2::after{content:"";display:block;width:54px;height:3px;margin-top:10px;border-radius:2px;background:linear-gradient(90deg,#C9A24A,#8A6D1E);transform:scaleX(0);transform-origin:left;transition:transform .7s cubic-bezier(.2,.7,.2,1) .15s}
.sec-h.in h2::after,.in .sec-h h2::after,.reveal.in h2::after{transform:scaleX(1)}

/* E) Staggered grid reveals (JS adds .fzm-st to known containers, .in on intersect) */
.fzm-st>*{opacity:0;transform:translateY(16px);transition:opacity .55s cubic-bezier(.2,.7,.3,1),transform .55s cubic-bezier(.2,.7,.3,1)}
.fzm-st.in>*{opacity:1;transform:none}
.fzm-st.in>*:nth-child(1){transition-delay:.02s}.fzm-st.in>*:nth-child(2){transition-delay:.08s}
.fzm-st.in>*:nth-child(3){transition-delay:.14s}.fzm-st.in>*:nth-child(4){transition-delay:.2s}
.fzm-st.in>*:nth-child(5){transition-delay:.26s}.fzm-st.in>*:nth-child(6){transition-delay:.32s}
.fzm-st.in>*:nth-child(7){transition-delay:.38s}.fzm-st.in>*:nth-child(8){transition-delay:.44s}
.fzm-st.in>*:nth-child(n+9){transition-delay:.5s}

/* F) Single-block reveal for sections the old system missed */
.fzm{opacity:0;transform:translateY(18px);transition:opacity .6s cubic-bezier(.2,.7,.3,1),transform .6s cubic-bezier(.2,.7,.3,1)}
.fzm.in{opacity:1;transform:none}

/* G) Type confidence: tighter display tracking, stronger eyebrows */
.searchwrap__in>h1{letter-spacing:-.032em}
.sec-h h2{letter-spacing:-.028em}
.lbl{letter-spacing:.11em}


/* H) Ken Burns drift on hero photos */
@keyframes fzKB{from{transform:scale(1) translate(0,0)}to{transform:scale(1.08) translate(-1.2%,1%)}}
.searchwrap__bg{animation:fzKB 30s ease-in-out infinite alternate;will-change:transform}
.hero__bg{animation:fzKB 34s ease-in-out infinite alternate}

/* I) skeleton loaders (server-rendered; wiped by JS innerHTML render) */
.fz-skel{border-radius:16px;background:#fff;border:1px solid #ECEEF2;overflow:hidden;min-height:380px;flex:0 0 31%;min-width:280px}
.fz-skel>div{background:linear-gradient(100deg,#EEF0F4 40%,#F7F8FA 50%,#EEF0F4 60%);background-size:200% 100%;animation:fzShimmerBg 1.4s linear infinite}
.fz-skel .sk-ph{height:172px}
.fz-skel .sk-l1{height:18px;margin:16px 16px 0;border-radius:6px;width:55%}
.fz-skel .sk-l2{height:12px;margin:12px 16px 0;border-radius:6px;width:80%}
.fz-skel .sk-l3{height:64px;margin:14px 16px 0;border-radius:10px}
.fz-skel .sk-l4{height:40px;margin:14px 16px 16px;border-radius:10px;width:88%}
@keyframes fzShimmerBg{to{background-position:-200% 0}}
/* J) press feedback on tappable cards (mobile-first) */
.card:active,.pkgcard:active,.guide:active,.emi:active,.bud:active{transform:translateY(-1px) scale(.988);transition-duration:.09s}
/* K) toast */
#fzToast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,16px);opacity:0;background:#16213A;color:#fff;font:600 13.5px 'Plus Jakarta Sans',system-ui,sans-serif;padding:11px 18px;border-radius:12px;border:1px solid rgba(201,162,74,.45);box-shadow:0 12px 32px -8px rgba(12,23,48,.4);z-index:99999;pointer-events:none;transition:transform .25s cubic-bezier(.2,.7,.2,1),opacity .25s;max-width:86vw;text-align:center}
#fzToast.show{transform:translate(-50%,0);opacity:1}
#fzToast b{color:#E8C56B}
}

/* fzToastBase: toast+skeleton base visible regardless of motion pref */
@media (prefers-reduced-motion: reduce){#fzToast{transition:none}#fzToast.show{transform:translate(-50%,0);opacity:1}.fz-skel>div{animation:none;background:#EEF0F4}}