@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes scaleIn {
    from { opacity: 0; transform: scale(.94); }
    to   { opacity: 1; transform: scale(1); }
}

@keyframes slideInLeft {
    from { opacity: 0; transform: translateX(-28px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes jpPulse {
    0%   { transform: scale(1);    color: #fff; }
    50%  { transform: scale(1.14); color: #f4b911; }
    100% { transform: scale(1);    color: #fff; }
}

@keyframes shimmer {
    0%   { background-position: -400px 0; }
    100% { background-position: 400px 0; }
}

@keyframes glow {
    0%, 100% { box-shadow: 0 0 8px rgba(244,185,17,.3); }
    50%       { box-shadow: 0 0 22px rgba(244,185,17,.65); }
}

.hero-h1      { animation: fadeInUp .7s ease both; }
.hero-sub     { animation: fadeInUp .7s .12s ease both; }
.hero-badge   { animation: fadeIn   .5s ease both; }
.hero-stats-row { animation: fadeInUp .7s .22s ease both; }
.hero-cta-row   { animation: fadeInUp .7s .32s ease both; }

.info-tile        { animation: scaleIn .45s ease both; }
.adv-tile         { animation: fadeInUp .5s ease both; }
.bonus-card       { animation: scaleIn .5s ease both; }
.strategy-card    { animation: fadeInUp .5s ease both; }
.toc-box          { animation: fadeIn  .4s ease both; }

.btn-main--play,
.btn-hdr--play   { animation: glow 2.5s ease-in-out infinite; }

.jp-pulse { animation: jpPulse .4s ease; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

@keyframes bonusWidgetSlide {
    from { transform: translateY(100%); }
    to   { transform: translateY(0); }
}

.ftr-bonus-widget {
    animation: bonusWidgetSlide .5s .8s cubic-bezier(.22,1,.36,1) both;
}

.site-header {
    transition: box-shadow .25s ease;
}

.hdr-mobile-menu {
    animation: fadeIn .22s ease both;
}

.faq-item.is-open .faq-question h3 {
    color: #66cc39;
}

.section-title {
    position: relative;
    display: inline-block;
}

@keyframes underlineGrow {
    from { width: 0; }
    to   { width: 100%; }
}

.section-title::after {
    content: '';
    display: block;
    height: 3px;
    background: linear-gradient(90deg, #f4b911, #66cc39);
    border-radius: 2px;
    margin-top: 4px;
    width: 60px;
    margin-left: auto;
    margin-right: auto;
}

.strategy-card__img-wrap::after {
    content: '';
    display: block;
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 55%, rgba(64,13,0,.3) 100%);
    pointer-events: none;
}
.strategy-card__img-wrap { position: relative; }

.btn-sec {
    position: relative;
    overflow: hidden;
}
.btn-sec::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.18) 50%, transparent 100%);
    background-size: 200% 100%;
    transform: translateX(-100%);
    transition: transform .4s ease;
}
.btn-sec:hover::after {
    transform: translateX(100%);
}

.bonus-card__amount {
    position: relative;
}

@keyframes countUp {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}
.bonus-card__amount { animation: countUp .6s ease both; }
