/* ==========================================================================
   9wickets — "শেষ কথা" FINAL CTA — premium animated redesign v2
   (loads absolute last, after seo-about-v2.css)
   --------------------------------------------------------------------------
   `.vk-cta--premium` / `.vk-cta__inner--split` (cta-premium.css) is a SHARED
   component reused on other pages (Agent List, FAQ, agent-tier, help-desk —
   e.g. the Agent List page's "সরাসরি নিজের টায়ারে যান" CTA uses the exact
   same markup/classes on a light cream background). Every rule in this file
   therefore carries the `body.vk-home` prefix so this pass can never bleed
   onto those pages — same convention already used for .vk-story and the
   home-relayout.css §11 CTA glass-panel pass.

   Design: matches the hero's dark aurora stage as the page's closing
   bookend. The two `.vk-orb--cta-a/b` blurred blobs already exist in this
   widget's markup and already animate (wickets-home.css, vk-float-a/b) —
   on the current light cream background their `mix-blend-mode: screen`
   barely reads; on a dark stage they become the section's primary ambient
   motion for free, so no new floating-orb markup/JS is needed.
   On top of that: a slow-rotating gold ring frames the portrait (same
   @property conic-gradient technique as hero-v5's photo ring, own custom
   property so it can't collide), the trust chip gets a gentle float, the
   primary button gets a shimmer sweep, and a few twinkling spark dots add
   a "royal" finishing touch around the heading.
   ========================================================================== */

body.vk-home .vk-cta--premium {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    background: linear-gradient(180deg, #0B0906 0%, #15110A 60%, #17150F 100%);
    border-top: 1px solid rgba(255, 199, 44, .16);
}
body.vk-home .vk-cta--premium .vk-cta__bg::before {
    background:
        radial-gradient(55% 60% at 50% 40%, rgba(255, 199, 44, .16) 0%, transparent 62%),
        radial-gradient(40% 50% at 15% 85%, rgba(200, 134, 11, .16) 0%, transparent 62%),
        radial-gradient(40% 50% at 85% 15%, rgba(230, 169, 30, .14) 0%, transparent 62%);
}
body.vk-home .vk-cta--premium .vk-orb { opacity: .5; }

/* ---------- recolor the frosted copy-card (home-relayout.css §11 painted
   it white/glass for the old light cream background — on this dark stage
   it read as a stray gray box) to a dark gold-tinted glass instead ---------- */
body.vk-home .vk-cta--premium .vk-cta__content::before {
    background: rgba(11, 9, 6, .34);
    border-color: rgba(255, 199, 44, .20);
    box-shadow: 0 24px 54px -30px rgba(0, 0, 0, .6);
}

/* ---------- text: light-on-dark ---------- */
body.vk-home .vk-cta--premium .vk-cta__content .vk-eyebrow {
    background: rgba(255, 199, 44, .10);
    border-color: rgba(255, 199, 44, .30);
    color: #FFC72C;
}
body.vk-home .vk-cta--premium .vk-cta__content .vk-h1 { color: #FBF6EC !important; }
body.vk-home .vk-cta--premium .vk-cta__content .vk-lead { color: #C9BFA6 !important; }

/* ---------- heading: twinkling spark dots ---------- */
body.vk-home .vk-cta--premium .vk-cta__content { position: relative; }
body.vk-home .vk-cta--premium .vk-cta__content .vk-h1 {
    position: relative;
}
body.vk-home .vk-cta--premium .vk-cta__content .vk-h1::before,
body.vk-home .vk-cta--premium .vk-cta__content .vk-h1::after {
    content: '';
    position: absolute;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #FFE066;
    box-shadow: 0 0 8px 2px rgba(255, 199, 44, .7);
    animation: vk-ctafin-twinkle 2.6s ease-in-out infinite;
}
body.vk-home .vk-cta--premium .vk-cta__content .vk-h1::before { top: -6px; left: -4px; animation-delay: 0s; }
body.vk-home .vk-cta--premium .vk-cta__content .vk-h1::after { top: 50%; right: -10px; animation-delay: 1.1s; }
@keyframes vk-ctafin-twinkle {
    0%, 100% { opacity: .25; transform: scale(.7); }
    50%      { opacity: 1; transform: scale(1.2); }
}

/* ---------- buttons: shimmer sweep on the primary CTA ---------- */
body.vk-home .vk-cta--premium .vk-cta__buttons .vk-btn--primary {
    position: relative;
    overflow: hidden;
}
body.vk-home .vk-cta--premium .vk-cta__buttons .vk-btn--primary::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(100deg, transparent 25%, rgba(255, 255, 255, .40) 50%, transparent 75%);
    background-size: 220% 100%;
    background-position: 220% 0;
    animation: vk-ctafin-shimmer 4.2s ease-in-out infinite;
    animation-delay: 1.4s;
}
@keyframes vk-ctafin-shimmer {
    0%, 45% { background-position: 220% 0; }
    65%     { background-position: -50% 0; }
    100%    { background-position: -50% 0; }
}

/* ---------- visual: rotating gold ring + floating chip ---------- */
body.vk-home .vk-cta--premium .vk-cta__frame {
    background: linear-gradient(160deg, rgba(255, 199, 44, .55) 0%, rgba(200, 134, 11, .30) 45%, rgba(255, 255, 255, .18) 100%);
    box-shadow: 0 30px 70px -20px rgba(0, 0, 0, .65), 0 0 0 1px rgba(200, 134, 11, .30);
}
@property --ctafin-ring-angle {
    syntax: '<angle>';
    inherits: false;
    initial-value: 0deg;
}
body.vk-home .vk-cta--premium .vk-cta__frame::before {
    inset: -14px;
    background: conic-gradient(from var(--ctafin-ring-angle), #FFC72C, #7A5200 26%, #7A5200 74%, #E8A200, #FFC72C);
    filter: blur(2px);
    opacity: .85;
    animation: vk-ctafin-ring-spin 9s linear infinite;
}
@keyframes vk-ctafin-ring-spin {
    to { --ctafin-ring-angle: 360deg; }
}
body.vk-home .vk-cta--premium .vk-cta__chip {
    animation: vk-ctafin-chip-float 3.4s ease-in-out infinite;
}
@keyframes vk-ctafin-chip-float {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-6px); }
}
@media (max-width: 860px) {
    body.vk-home .vk-cta--premium .vk-cta__chip { animation: vk-ctafin-chip-float-mobile 3.4s ease-in-out infinite; }
    @keyframes vk-ctafin-chip-float-mobile {
        0%, 100% { transform: translateX(-50%) translateY(0); }
        50%      { transform: translateX(-50%) translateY(-6px); }
    }
}

@media (prefers-reduced-motion: reduce) {
    body.vk-home .vk-cta--premium .vk-cta__content .vk-h1::before,
    body.vk-home .vk-cta--premium .vk-cta__content .vk-h1::after,
    body.vk-home .vk-cta--premium .vk-cta__buttons .vk-btn--primary::after,
    body.vk-home .vk-cta--premium .vk-cta__frame::before,
    body.vk-home .vk-cta--premium .vk-cta__chip { animation: none !important; }
}
