/* ===================== reveal + keyframes ===================== */
.reveal{opacity:0;transition:opacity .85s ease,transform .85s cubic-bezier(.2,.75,.3,1)}
.reveal[data-anim="up"]{transform:translateY(28px)}
.reveal[data-anim="left"]{transform:translateX(-30px)}
.reveal[data-anim="right"]{transform:translateX(30px)}
.reveal[data-anim="scale"]{transform:scale(.955)}
.reveal.in{opacity:1;transform:none}
.rise{opacity:0;animation:riseIn .95s cubic-bezier(.2,.75,.3,1) forwards}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes float-soft{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
@keyframes shimmer{0%{background-position:170% 0}55%,100%{background-position:-70% 0}}
@keyframes spin-slow{to{transform:rotate(360deg)}}
@keyframes glow{0%,100%{opacity:.4;transform:scale(1)}50%{opacity:.75;transform:scale(1.09)}}
@keyframes breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.03)}}
@keyframes riseIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes scrollHint{0%{transform:translateY(-16px);opacity:0}35%{opacity:1}100%{transform:translateY(46px);opacity:0}}