/* ══════════════════════════════════════════════
   ANIMATIONS — keyframes and motion only
══════════════════════════════════════════════ */
@property --angle { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
@keyframes spinBorder { to { --angle: 360deg; } }

/* intro */
#preloader { animation: preOut 0.55s ease 0.9s forwards; }
#preloader img { animation: prePulse 0.9s ease-in-out infinite alternate; }
.pre-ring { animation: spin 0.8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes prePulse { from { transform: scale(0.94); opacity: 0.75; } to { transform: scale(1.04); opacity: 1; } }
@keyframes preOut { to { opacity: 0; visibility: hidden; } }

.header { animation: headerIn 0.9s var(--ease) 0.9s both; }
@keyframes headerIn { from { transform: translateY(-120%); opacity: 0; } }

.hero-copy > * { animation: riseIn 1s var(--ease) both; }
.hero-copy > :nth-child(1) { animation-delay: 1.05s; }
.hero-copy > :nth-child(2) { animation-delay: 1.18s; }
.hero-copy > :nth-child(3) { animation-delay: 1.31s; }
.hero-copy > :nth-child(4) { animation-delay: 1.44s; }
@keyframes riseIn { from { opacity: 0; transform: translateY(36px); filter: blur(10px); } }

/* ticker */
.stream-track { animation: ticker 46s linear infinite; }
@keyframes ticker { to { transform: translateX(-50%); } }
.stream-indicator, .badge-pulse { animation: pulseDot 1.5s ease-in-out infinite; }
@keyframes pulseDot { 50% { opacity: 0.35; transform: scale(0.8); } }

/* hero details */
.hero h1 .gold-text { animation: shimmer 6s linear infinite; }
@keyframes shimmer { to { background-position: -220% 0; } }
.hero-badge i { animation: wiggle 3.2s ease-in-out infinite; }
@keyframes wiggle { 0%, 80%, 100% { transform: rotate(0); } 86% { transform: rotate(-14deg) scale(1.2); } 93% { transform: rotate(12deg) scale(1.2); } }
.hero-actions .btn-gold i { animation: lift 1.6s ease-in-out infinite; }
@keyframes lift { 50% { transform: translate(2px, -3px); } }
.hero-grid > :last-child .vip-hero-card { animation: float 7s ease-in-out infinite; }
@keyframes float { 50% { transform: translateY(-10px); } }

/* rotating light borders */
.vip-hero-card::before {
    background: conic-gradient(from var(--angle), var(--gold), transparent 22%, transparent 45%, var(--telegram) 55%, transparent 70%, var(--gold));
    animation: spinBorder 7s linear infinite;
}
.deal-box.featured::before {
    content: ''; position: absolute; inset: -1px; border-radius: inherit; padding: 1.5px; pointer-events: none;
    background: conic-gradient(from var(--angle), var(--gold-light), transparent 28%, transparent 50%, #fff 60%, transparent 75%, var(--gold-light));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor; mask-composite: exclude;
    animation: spinBorder 5s linear infinite;
}

/* cursor spotlight inside cards (position set by fx.js) */
.stat-card::after, .deal-box::after, .feature-card::after, .partner-card::after {
    content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
    background: radial-gradient(300px circle at var(--mx, 50%) var(--my, 50%), rgba(255, 212, 0, 0.13), transparent 65%);
    opacity: 0; transition: opacity 0.4s ease;
}
.stat-card:hover::after, .deal-box:hover::after, .feature-card:hover::after, .partner-card:hover::after { opacity: 1; }
.deal-box, .feature-card { transform-style: preserve-3d; will-change: transform; }

/* small living details */
.deal-ribbon { animation: ribbon 2.2s ease-in-out infinite; }
@keyframes ribbon { 50% { box-shadow: 0 6px 26px 0 rgba(255, 212, 0, 0.85); } }
.vip-features li i { animation: pop 3.4s ease-in-out infinite; }
.vip-features li:nth-child(2) i { animation-delay: 0.3s; }
.vip-features li:nth-child(3) i { animation-delay: 0.6s; }
.vip-features li:nth-child(4) i { animation-delay: 0.9s; }
@keyframes pop { 0%, 85%, 100% { transform: scale(1); } 92% { transform: scale(1.35); } }
.hex-icon { transition: transform 0.5s var(--ease); }
.feature-card:hover .hex-icon { transform: translateY(-4px) rotate(-6deg) scale(1.06); }
.calc-result-val.bump { animation: bump 0.35s ease; }
@keyframes bump { 40% { transform: scale(1.07); } }
.arrow-cta { animation: nudgeRtl 1.2s ease-in-out infinite; }
[dir="ltr"] .arrow-cta { animation-name: nudgeLtr; }
@keyframes nudgeRtl { 50% { transform: translateX(-5px); } }
@keyframes nudgeLtr { 50% { transform: translateX(5px); } }

.float-tg::before, .float-tg::after {
    content: ''; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--telegram);
    animation: radar 2.4s ease-out infinite; pointer-events: none;
}
.float-tg::after { animation-delay: 1.2s; }
@keyframes radar { from { transform: scale(1); opacity: 0.7; } to { transform: scale(1.9); opacity: 0; } }

@media (max-width: 1024px) {
    .hero-grid > :last-child .vip-hero-card { animation: none; }
}
@media (max-width: 768px) {
    .bottom-floating-dock { animation: dockIn 0.9s var(--ease) 1.6s both; }
    @keyframes dockIn { from { transform: translate(-50%, 160%); opacity: 0; } }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
    html { scroll-behavior: auto; }
    #preloader, .cursor-glow { display: none; }
}
