/* ============================================================
   ApnaBiodata — css/animations.css
   Motion only: every @keyframes (float, marquee, riseIn,
   aurora, sway, chipOrbit...), the .float-text / .marquee
   animation bindings, and the scroll-reveal (.reveal) rules
   incl. the futuristic 3D rotateX reveal.
   ============================================================ */
@keyframes dust{from{background-position:0 0}to{background-position:40px 120px}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}
@keyframes floatText{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.float-text{animation:floatText 6s ease-in-out infinite;display:inline-block}
@keyframes riseIn{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes fanFloat{0%,100%{margin-top:0}50%{margin-top:-10px}}
.marquee{display:inline-flex;gap:36px;animation:marquee 26s linear infinite;font-weight:700;font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;font-family:"Fraunces",serif}
.reveal{opacity:1;transform:none}
@media (prefers-reduced-motion: no-preference){.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s cubic-bezier(.2,.8,.2,1),transform .7s cubic-bezier(.2,.8,.2,1)}
.reveal.visible{opacity:1;transform:none}}
@keyframes viewIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes auroraShift{from{transform:translate3d(-1.5%,-1%,0) scale(1)}to{transform:translate3d(1.5%,1.5%,0) scale(1.06)}}
@keyframes auroraHero{from{background-position:0% 0%}to{background-position:100% 90%}}
@keyframes orbFloat{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(14px,-22px,0) scale(1.07)}}
@keyframes chipOrbit{0%,100%{transform:translate3d(0,0,0) rotate(8deg)}50%{transform:translate3d(-8px,-16px,30px) rotate(-6deg)}}
@keyframes sway1{0%,100%{transform:rotate(-7deg) rotateY(20deg) rotateX(4deg) translateZ(-30px) translateY(18px)}50%{transform:rotate(-6deg) rotateY(15deg) rotateX(2deg) translateZ(-18px) translateY(6px)}}
@keyframes sway2{0%,100%{transform:rotateY(0deg) rotateX(3deg) translateZ(46px) translateY(-8px) scale(1.05)}50%{transform:rotateY(-4deg) rotateX(1deg) translateZ(58px) translateY(-20px) scale(1.06)}}
@keyframes sway3{0%,100%{transform:rotate(7deg) rotateY(-20deg) rotateX(4deg) translateZ(-30px) translateY(18px)}50%{transform:rotate(6deg) rotateY(-15deg) rotateX(2deg) translateZ(-18px) translateY(6px)}}
@keyframes marqueeShift{from{background-position:0 0}to{background-position:220% 0}}
.marquee{font-family:"Fraunces",serif;color:#fff}
@media (prefers-reduced-motion: no-preference){.reveal{transform:perspective(900px) rotateX(13deg) translateY(26px);transition:opacity .75s cubic-bezier(.2,.8,.2,1),transform .75s cubic-bezier(.2,.8,.2,1)}
.reveal.visible{transform:perspective(900px) rotateX(0) translateY(0)}
@keyframes cardFlipIn{from{opacity:0;transform:perspective(850px) rotateX(17deg) translateY(26px)}to{opacity:1;transform:perspective(850px) rotateX(0) translateY(0)}}
@keyframes viewIn3d{from{opacity:0;transform:perspective(1100px) rotateX(3deg) translateY(16px)}to{opacity:1;transform:none}}}