/*!
 * Baji71 — Verde Luxe (Phase 9)
 * Professional green-dominant palette with red accent restraint.
 * Inspired by velkipro's section structure; rebuilt with refined
 * typography, calmer hierarchy, and sport-stadium-meets-luxury feel.
 *
 * Loaded after velki-home.css. Retones every token + adds new components.
 */

/* ============================================================
   1. TOKENS — green base, red accent (sparingly), ivory text
   ============================================================ */
body.vk {
    /* Surfaces — deep emerald, never pure black */
    --vk-bg:        #08160E;
    --vk-bg-1:      #0E2517;
    --vk-bg-2:      #143523;
    --vk-bg-card:   rgba(255, 255, 255, 0.035);
    --vk-bg-card-2: rgba(255, 255, 255, 0.06);
    --vk-bg-dark:   #050D08;
    --vk-bg-dark-2: #030806;

    /* Lines */
    --vk-line:      rgba(232, 216, 156, 0.12);
    --vk-line-2:    rgba(232, 216, 156, 0.32);
    --vk-line-cool: rgba(63, 179, 120, 0.32);

    /* Brand — green PRIMARY */
    --vk-green:        #2A8C5C;        /* emerald — main brand */
    --vk-green-2:      #3FB378;        /* mint highlight */
    --vk-green-3:      #1B6B47;        /* deep emerald — pressed */
    --vk-green-deep:   #0F4A2D;        /* darkest forest */
    --vk-green-glow:   rgba(63, 179, 120, 0.40);

    /* Brand — red ACCENT (sparingly) */
    --vk-red:          #C8102E;        /* cricket red — main accent */
    --vk-red-2:        #E63946;        /* hover */
    --vk-red-3:        #8B0F1F;        /* deep red — pressed */
    --vk-red-glow:     rgba(230, 57, 70, 0.40);

    /* Cream / gold (premium accent secondary) */
    --vk-cream:        #F2EBD3;
    --vk-cream-2:      #E8D89C;        /* warm gold-cream — supporting */
    --vk-cream-3:      #C7B468;        /* deep cream */
    --vk-gold:         #E8D89C;        /* ALIAS for compatibility */
    --vk-gold-2:       #F2EBD3;
    --vk-gold-3:       #C7B468;
    --vk-amber:        #B49147;
    --vk-violet:       #2A8C5C;        /* legacy alias remap */
    --vk-violet-2:     #1B6B47;
    --vk-magenta:      #C8102E;        /* legacy alias remap */
    --vk-cyan:         #3FB378;        /* legacy alias remap */
    --vk-emerald:      #3FB378;

    /* Premium gradients */
    --vk-grad-green:   linear-gradient(135deg, #3FB378 0%, #2A8C5C 60%, #0F4A2D 100%);
    --vk-grad-red:     linear-gradient(135deg, #E63946 0%, #C8102E 60%, #8B0F1F 100%);
    --vk-grad-gold:    linear-gradient(135deg, #F2EBD3 0%, #E8D89C 50%, #C7B468 100%);
    --vk-grad-gold-2:  linear-gradient(95deg, #FBF6E0 0%, #E8D89C 50%, #B49147 100%);
    --vk-grad-royal:   linear-gradient(135deg, #3FB378 0%, #2A8C5C 60%, #0F4A2D 100%);
    --vk-grad-aurora:  linear-gradient(135deg, #E8D89C 0%, #3FB378 50%, #1B6B47 100%);
    --vk-grad-cyan:    linear-gradient(135deg, #6EE7AE 0%, #3FB378 50%, #0F4A2D 100%);
    --vk-grad-magenta: linear-gradient(135deg, #E8D89C 0%, #C8102E 100%);
    --vk-grad-text:    linear-gradient(95deg, #FBF6E0 0%, #E8D89C 35%, #F2EBD3 65%, #C7B468 100%);
    --vk-grad-em:      linear-gradient(95deg, #E8D89C 0%, #3FB378 50%, #2A8C5C 100%);

    /* Text */
    --vk-text:       #F5F1E6;
    --vk-text-mid:   #C4D1C9;
    --vk-text-dim:   #7E897F;
    --vk-text-muted: #4A554C;

    /* Glow stack — calm, not casino */
    --vk-glow-gold:    0 0 0 1px rgba(232, 216, 156, 0.30) inset, 0 12px 40px rgba(232, 216, 156, 0.20);
    --vk-glow-gold-hi: 0 0 0 1px rgba(232, 216, 156, 0.50) inset, 0 18px 56px rgba(232, 216, 156, 0.32);
    --vk-glow-green:   0 0 0 1px rgba(63, 179, 120, 0.35) inset, 0 12px 40px rgba(63, 179, 120, 0.30);
    --vk-glow-red:     0 0 0 1px rgba(230, 57, 70, 0.40) inset, 0 12px 36px rgba(200, 16, 46, 0.40);
    --vk-glow-violet:  0 12px 40px rgba(63, 179, 120, 0.35);
    --vk-glow-cyan:    0 12px 40px rgba(63, 179, 120, 0.32);
    --vk-shadow-card:    0 12px 32px rgba(0, 12, 6, 0.55), 0 1px 0 rgba(255, 255, 255, 0.04) inset;
    --vk-shadow-card-hi: 0 24px 60px rgba(0, 12, 6, 0.75), 0 1px 0 rgba(255, 255, 255, 0.07) inset;

    /* Type stack */
    --vk-font-bn:         'Hind Siliguri', 'Noto Sans Bengali', system-ui, sans-serif;
    --vk-font-bn-display: 'Hind Siliguri', 'Noto Sans Bengali', system-ui, sans-serif;
    --vk-font-en:         'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --vk-font-en-display: 'Fraunces', 'Cormorant Garamond', Georgia, serif;
    --vk-font-serif:      'Fraunces', Georgia, serif;
    --vk-font-mono:       ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
}

/* Selection */
body.vk ::selection { background: var(--vk-green-2); color: #052013; }

/* ============================================================
   2. BACKDROPS — emerald night with subtle ambient
   ============================================================ */
body.vk-home {
    background-image:
        radial-gradient(60% 50% at 12% 0%, rgba(63, 179, 120, 0.18), transparent 60%),
        radial-gradient(45% 55% at 90% 25%, rgba(232, 216, 156, 0.06), transparent 65%),
        radial-gradient(55% 60% at 50% 110%, rgba(15, 74, 45, 0.32), transparent 65%),
        linear-gradient(180deg, #0E2517 0%, #08160E 60%, #050D08 100%);
    background-attachment: fixed;
    background-color: var(--vk-bg);
}
body.vk:not(.vk-home) {
    background-image:
        radial-gradient(50% 40% at 0% 0%, rgba(63, 179, 120, 0.16), transparent 65%),
        radial-gradient(40% 35% at 100% 0%, rgba(232, 216, 156, 0.06), transparent 70%),
        linear-gradient(180deg, #0E2517 0%, #08160E 100%);
    background-attachment: fixed;
    background-color: var(--vk-bg);
}

/* ============================================================
   3. HEADER — deep emerald glass, gold hairline, red support pill
   ============================================================ */
body.vk .vk-header {
    background: linear-gradient(180deg, rgba(8, 22, 14, 0.78) 0%, rgba(8, 22, 14, 0.55) 100%);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-bottom: 1px solid rgba(232, 216, 156, 0.16);
}
body.vk .vk-header.is-scrolled {
    background: linear-gradient(180deg, rgba(5, 13, 8, 0.95) 0%, rgba(5, 13, 8, 0.82) 100%);
    box-shadow: 0 12px 36px rgba(0, 8, 4, 0.55);
    border-bottom-color: rgba(232, 216, 156, 0.28);
}
body.vk .vk-header__bar {
    background: linear-gradient(90deg, transparent, var(--vk-green-2), var(--vk-cream-2), var(--vk-green-2), transparent) !important;
    height: 1px;
    opacity: .85;
}
body.vk .vk-brand__halo {
    background: radial-gradient(ellipse at center, rgba(63, 179, 120, 0.30) 0%, transparent 65%);
}
body.vk .vk-nav__list a { color: var(--vk-text); font-weight: 500; }
body.vk .vk-nav__list a:hover { color: var(--vk-cream-2); }

/* Header WhatsApp/support pill — red, matching every other CTA on the site */
body.vk .vk-cta-pulse {
    background: linear-gradient(135deg, var(--vk-red-2) 0%, var(--vk-red) 60%, var(--vk-red-3) 100%) !important;
    color: #fff !important;
    border: 1px solid rgba(230, 57, 70, 0.55) !important;
    box-shadow: 0 8px 24px rgba(200, 16, 46, 0.40) !important;
}

/* ============================================================
   4. HERO — emerald ambient
   ============================================================ */
body.vk .vk-hero {
    background:
        radial-gradient(40% 60% at 80% 30%, rgba(63, 179, 120, 0.22) 0%, transparent 65%),
        radial-gradient(50% 70% at 0% 90%, rgba(232, 216, 156, 0.08) 0%, transparent 65%);
}
body.vk .vk-hero__bg::before {
    background:
        radial-gradient(50% 60% at 18% 28%, rgba(232, 216, 156, 0.18) 0%, transparent 60%),
        radial-gradient(40% 55% at 82% 22%, rgba(63, 179, 120, 0.50) 0%, transparent 65%),
        radial-gradient(55% 65% at 70% 85%, rgba(63, 179, 120, 0.22) 0%, transparent 60%),
        radial-gradient(45% 55% at 12% 90%, rgba(110, 231, 174, 0.18) 0%, transparent 60%);
    filter: blur(20px) saturate(135%);
}
body.vk .vk-grid {
    background-image:
        linear-gradient(rgba(232, 216, 156, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(232, 216, 156, 0.04) 1px, transparent 1px);
}
body.vk .vk-orb { mix-blend-mode: screen; }
body.vk .vk-orb--a { background: radial-gradient(circle, var(--vk-green-2) 0%, transparent 65%); }
body.vk .vk-orb--b { background: radial-gradient(circle, var(--vk-green) 0%, transparent 65%); }
body.vk .vk-orb--c { background: radial-gradient(circle, var(--vk-cream-2) 0%, transparent 65%); }

/* ============================================================
   5. BUTTONS — green primary, red accent for emphasis
   ============================================================ */
body.vk .vk-btn {
    font-family: var(--vk-font-bn);
    font-weight: 700;
    letter-spacing: 0.005em;
    transition: transform .25s cubic-bezier(.2,.7,.15,1), box-shadow .3s ease, background .3s ease;
}

/* Primary = green (was gold before) */
body.vk .vk-btn--primary {
    background: linear-gradient(135deg, var(--vk-green-2) 0%, var(--vk-green) 60%, var(--vk-green-3) 100%);
    color: #fff;
    border: 1px solid rgba(63, 179, 120, 0.55);
    box-shadow:
        0 0 0 1px rgba(110, 231, 174, 0.22) inset,
        0 12px 32px rgba(63, 179, 120, 0.35),
        0 1px 0 rgba(255, 255, 255, 0.18) inset;
    text-shadow: 0 1px 0 rgba(0, 30, 15, 0.30);
}
body.vk .vk-btn--primary:hover {
    transform: translateY(-2px);
    box-shadow:
        0 0 0 1px rgba(110, 231, 174, 0.40) inset,
        0 18px 48px rgba(63, 179, 120, 0.55),
        0 1px 0 rgba(255, 255, 255, 0.22) inset;
}

/* Red — used for high-emphasis CTAs (sparingly) */
body.vk .vk-btn--red,
body.vk .vk-btn--accent {
    background: linear-gradient(135deg, var(--vk-red-2) 0%, var(--vk-red) 60%, var(--vk-red-3) 100%);
    color: #fff;
    border: 1px solid rgba(230, 57, 70, 0.55);
    box-shadow:
        0 0 0 1px rgba(230, 57, 70, 0.30) inset,
        0 12px 32px rgba(200, 16, 46, 0.40),
        0 1px 0 rgba(255, 255, 255, 0.20) inset;
}
body.vk .vk-btn--red:hover,
body.vk .vk-btn--accent:hover {
    transform: translateY(-2px);
    box-shadow:
        0 0 0 1px rgba(230, 57, 70, 0.55) inset,
        0 18px 48px rgba(200, 16, 46, 0.55),
        0 1px 0 rgba(255, 255, 255, 0.22) inset;
}

/* Gold pill — kept for legacy "vk-btn--gold" */
body.vk .vk-btn--gold {
    background: var(--vk-grad-gold);
    color: #08160E;
    border: 1px solid rgba(232, 216, 156, 0.55);
    box-shadow: 0 0 0 1px rgba(232, 216, 156, 0.45) inset, 0 12px 32px rgba(232, 216, 156, 0.30);
}
body.vk .vk-btn--gold:hover { transform: translateY(-2px); box-shadow: 0 0 0 1px rgba(232, 216, 156, 0.70) inset, 0 18px 48px rgba(232, 216, 156, 0.45); }

body.vk .vk-btn--whatsapp {
    background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
    color: #fff;
    border-color: rgba(37, 211, 102, 0.45);
    box-shadow: 0 12px 36px rgba(37, 211, 102, 0.40);
}

body.vk .vk-btn--ghost {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(232, 216, 156, 0.30);
    color: var(--vk-text);
    backdrop-filter: blur(8px);
}
body.vk .vk-btn--ghost:hover {
    background: rgba(232, 216, 156, 0.08);
    border-color: rgba(232, 216, 156, 0.55);
    color: var(--vk-cream-2);
    transform: translateY(-1px);
}

/* ============================================================
   6. EYEBROW — refined gold-cream
   ============================================================ */
body.vk .vk-eyebrow,
body.vk .v-eyebrow {
    display: inline-flex; align-items: center; gap: 10px;
    font-family: var(--vk-font-en);
    font-size: 11px; font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--vk-cream-2);
}
body.vk .vk-eyebrow::before,
body.vk .v-eyebrow::before {
    content: '';
    width: 24px; height: 1px;
    background: linear-gradient(90deg, var(--vk-red), var(--vk-cream-2));
    border-radius: 2px;
}
body.vk .vk-eyebrow:lang(bn),
body.vk .v-eyebrow:lang(bn) {
    text-transform: none;
    letter-spacing: 0.04em;
    font-family: var(--vk-font-bn);
}

/* ============================================================
   7. SECTION primitives
   ============================================================ */
body.vk .v-sec {
    max-width: var(--vk-max);
    margin: 0 auto;
    padding-block: clamp(64px, 8vw, 110px);
    padding-inline: var(--vk-pad);
    position: relative;
}
body.vk .v-sec__head {
    margin-bottom: 40px;
    text-align: center;
}
body.vk .v-sec__head--start { text-align: left; }
body.vk .v-sec__title {
    margin: 12px auto 14px;
    font-family: var(--vk-font-bn-display);
    font-weight: 700;
    font-size: clamp(28px, 4vw, 50px);
    line-height: 1.08;
    letter-spacing: -0.02em;
    color: var(--vk-text);
    max-width: 22ch;
}
body.vk .v-sec__head--start .v-sec__title { margin-left: 0; }
body.vk .v-sec__title em {
    font-style: normal;
    background: var(--vk-grad-text);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}
body.vk .v-sec__lead {
    margin: 0 auto;
    color: var(--vk-text-mid);
    font-size: 15px;
    line-height: 1.7;
    max-width: 56ch;
}
body.vk .v-sec__head--start .v-sec__lead { margin-left: 0; }

/* Subtle gold etch divider between sections */
body.vk .v-sec + .v-sec::before,
body.vk .vk-hero + .v-sec::before {
    content: ''; position: absolute;
    top: 0; left: 50%; transform: translateX(-50%);
    width: clamp(180px, 40vw, 480px);
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(232, 216, 156, 0.40), transparent);
    pointer-events: none;
    opacity: .55;
}

/* ============================================================
   8. HERO — refined centered display
   ============================================================ */
body.vk .v-hero {
    position: relative;
    padding: clamp(120px, 16vw, 200px) var(--vk-pad) clamp(80px, 10vw, 130px);
    text-align: center;
    z-index: 1;
}
body.vk .v-hero__inner {
    max-width: 980px; margin: 0 auto;
    display: flex; flex-direction: column; align-items: center;
    gap: 24px;
}
body.vk .v-hero__pill {
    display: inline-flex; align-items: center; gap: 10px;
    padding: 8px 16px;
    background: rgba(63, 179, 120, 0.10);
    border: 1px solid rgba(63, 179, 120, 0.32);
    border-radius: 999px;
    font-family: var(--vk-font-en);
    font-size: 11px; font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--vk-green-2);
}
body.vk .v-hero__pill:lang(bn) { text-transform: none; letter-spacing: 0.04em; font-family: var(--vk-font-bn); font-size: 13px; }
body.vk .v-hero__pill-dot {
    width: 6px; height: 6px;
    background: var(--vk-green-2);
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(63, 179, 120, 0.7);
    animation: v-pulse-green 1.6s ease-in-out infinite;
}
@keyframes v-pulse-green {
    0%,100% { box-shadow: 0 0 0 0 rgba(63, 179, 120, 0.7); }
    50% { box-shadow: 0 0 0 8px rgba(63, 179, 120, 0); }
}

body.vk .v-hero__title {
    margin: 0;
    font-family: var(--vk-font-bn-display);
    font-weight: 700;
    font-size: clamp(48px, 8vw, 108px);
    line-height: 0.96;
    letter-spacing: -0.03em;
    color: var(--vk-text);
}
body.vk .v-hero__title strong {
    background: var(--vk-grad-text);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    font-weight: 700;
}
body.vk .v-hero__title em {
    font-style: normal;
    color: var(--vk-green-2);
    font-weight: 700;
}
body.vk .v-hero__lead {
    margin: 0;
    font-size: clamp(15px, 1.2vw, 18px);
    line-height: 1.7;
    color: var(--vk-text-mid);
    max-width: 62ch;
}
body.vk .v-hero__lead strong { color: var(--vk-cream-2); font-weight: 700; }
body.vk .v-hero__cta { display: flex; gap: 14px; flex-wrap: wrap; justify-content: center; margin-top: 8px; }

body.vk .v-hero__stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin-top: 32px;
    width: 100%; max-width: 880px;
    border: 1px solid rgba(232, 216, 156, 0.20);
    border-radius: 18px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.025) 0%, rgba(255, 255, 255, 0.005) 100%),
        rgba(8, 22, 14, 0.70);
    overflow: hidden;
    box-shadow: 0 16px 48px rgba(0, 12, 6, 0.45);
}
body.vk .v-hero__stat {
    padding: 22px 18px;
    text-align: center;
    border-right: 1px solid rgba(232, 216, 156, 0.12);
}
body.vk .v-hero__stat:last-child { border-right: none; }
body.vk .v-hero__stat-num {
    display: block;
    font-family: var(--vk-font-en-display);
    font-weight: 700;
    font-size: clamp(28px, 3vw, 38px);
    line-height: 1;
    background: var(--vk-grad-text);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    letter-spacing: -0.025em;
}
body.vk .v-hero__stat-num small { font-size: 0.5em; opacity: .8; }
body.vk .v-hero__stat-lbl {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    color: var(--vk-text-dim);
    text-transform: uppercase;
    letter-spacing: 0.12em;
}
@media (max-width: 720px) {
    body.vk .v-hero__stats { grid-template-columns: repeat(2, 1fr); }
    body.vk .v-hero__stat:nth-child(2n) { border-right: none; }
    body.vk .v-hero__stat:nth-child(-n+2) { border-bottom: 1px solid rgba(232, 216, 156, 0.12); }
}

/* ============================================================
   9. AGENT CARDS — 4-card grid, refined
   ============================================================ */
body.vk .v-agents {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}
body.vk .v-agent {
    position: relative; overflow: hidden;
    padding: 32px 26px 28px;
    border-radius: 22px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.01) 100%),
        rgba(8, 22, 14, 0.72);
    border: 1px solid rgba(232, 216, 156, 0.14);
    color: inherit;
    transition: transform .35s cubic-bezier(.2,.7,.15,1), border-color .3s ease, box-shadow .3s ease;
    box-shadow: 0 12px 32px rgba(0, 12, 6, 0.40);
    display: flex; flex-direction: column;
    min-height: 320px;
}
body.vk .v-agent:hover {
    transform: translateY(-6px);
    border-color: rgba(63, 179, 120, 0.45);
    box-shadow: 0 28px 64px rgba(0, 12, 6, 0.65), 0 0 0 1px rgba(63, 179, 120, 0.20) inset;
}
body.vk .v-agent::before {
    content: ''; position: absolute; inset: 0;
    border-radius: inherit;
    background: var(--vk-grad-green);
    opacity: 0.06;
    transition: opacity .35s ease;
    pointer-events: none;
}
body.vk .v-agent:hover::before { opacity: 0.16; }
body.vk .v-agent--accent::before {
    background: var(--vk-grad-red);
    opacity: 0.08;
}
body.vk .v-agent--accent:hover::before { opacity: 0.20; }

body.vk .v-agent__badge {
    align-self: flex-start;
    font-family: var(--vk-font-en);
    font-size: 10px; font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    padding: 5px 12px;
    border-radius: 999px;
    background: rgba(63, 179, 120, 0.14);
    border: 1px solid rgba(63, 179, 120, 0.45);
    color: var(--vk-green-2);
    margin-bottom: 18px;
    position: relative; z-index: 1;
}
body.vk .v-agent--accent .v-agent__badge {
    background: rgba(230, 57, 70, 0.14);
    border-color: rgba(230, 57, 70, 0.45);
    color: var(--vk-red-2);
}
body.vk .v-agent__badge:lang(bn) { text-transform: none; letter-spacing: 0.04em; font-size: 11px; font-family: var(--vk-font-bn); }

body.vk .v-agent__title { margin: 0 0 4px; font-size: clamp(22px, 2.4vw, 28px); font-weight: 700; color: var(--vk-text); position: relative; z-index: 1; }
body.vk .v-agent__sub {
    margin: 0 0 14px;
    font-family: var(--vk-font-en);
    font-size: 12px; font-weight: 600;
    color: var(--vk-cream-2);
    text-transform: uppercase;
    letter-spacing: 0.10em;
    position: relative; z-index: 1;
}
body.vk .v-agent__desc { margin: 0 0 18px; color: var(--vk-text-mid); font-size: 14px; line-height: 1.65; position: relative; z-index: 1; flex: 1; }
body.vk .v-agent__foot {
    display: flex; justify-content: space-between; align-items: center;
    padding-top: 16px;
    border-top: 1px solid rgba(232, 216, 156, 0.16);
    position: relative; z-index: 1;
}
body.vk .v-agent__count {
    font-family: var(--vk-font-en-display);
    font-weight: 700; font-size: 22px;
    color: var(--vk-cream-2); letter-spacing: -0.02em;
}
body.vk .v-agent__count small { font-size: 0.55em; opacity: .8; font-weight: 600; }
body.vk .v-agent__cta {
    display: inline-flex; align-items: center; gap: 6px;
    font-weight: 700; font-size: 13px;
    color: var(--vk-green-2);
}
body.vk .v-agent--accent .v-agent__cta { color: var(--vk-red-2); }
body.vk .v-agent:hover .v-agent__cta { gap: 10px; }
@media (max-width: 980px) { body.vk .v-agents { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { body.vk .v-agents { grid-template-columns: 1fr; } }

/* ============================================================
   10. WHY-US — 6-card grid (3x2)
   ============================================================ */
body.vk .v-why {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}
body.vk .v-why__card {
    padding: 28px 26px;
    border-radius: 20px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.005) 100%),
        rgba(8, 22, 14, 0.62);
    border: 1px solid rgba(232, 216, 156, 0.12);
    transition: border-color .3s ease, transform .3s ease, box-shadow .3s ease;
    position: relative;
}
body.vk .v-why__card:hover {
    border-color: rgba(63, 179, 120, 0.40);
    transform: translateY(-4px);
    box-shadow: 0 20px 48px rgba(0, 12, 6, 0.55);
}
body.vk .v-why__icon {
    width: 48px; height: 48px;
    border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, rgba(63, 179, 120, 0.14), rgba(63, 179, 120, 0.04));
    border: 1px solid rgba(63, 179, 120, 0.32);
    color: var(--vk-green-2);
    margin-bottom: 18px;
}
body.vk .v-why__icon svg { width: 24px; height: 24px; }
body.vk .v-why__num {
    position: absolute; top: 22px; right: 24px;
    font-family: var(--vk-font-en-display);
    font-weight: 700; font-size: 36px;
    line-height: 1;
    color: rgba(232, 216, 156, 0.18);
    letter-spacing: -0.025em;
}
body.vk .v-why__title { margin: 0 0 8px; font-size: 18px; font-weight: 700; color: var(--vk-text); }
body.vk .v-why__desc { margin: 0; color: var(--vk-text-mid); font-size: 14px; line-height: 1.65; }
@media (max-width: 880px) { body.vk .v-why { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { body.vk .v-why { grid-template-columns: 1fr; } }

/* ============================================================
   11. HOW-IT-WORKS — 4 numbered steps with connecting line
   ============================================================ */
body.vk .v-steps {
    list-style: none; margin: 0; padding: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    position: relative;
    counter-reset: vstep;
}
body.vk .v-steps::before {
    content: ''; position: absolute;
    top: 32px; left: 12.5%; right: 12.5%;
    height: 1px;
    background: linear-gradient(90deg,
        rgba(63, 179, 120, 0.45) 0%,
        rgba(232, 216, 156, 0.45) 50%,
        rgba(200, 16, 46, 0.45) 100%);
    z-index: 0;
}
body.vk .v-step {
    position: relative; z-index: 1;
    text-align: center;
    padding: 0 8px;
}
body.vk .v-step__num {
    counter-increment: vstep;
    width: 64px; height: 64px;
    margin: 0 auto 18px;
    border-radius: 50%;
    background:
        radial-gradient(70% 70% at 50% 30%, rgba(63, 179, 120, 0.30) 0%, transparent 70%),
        var(--vk-bg-1);
    border: 2px solid rgba(63, 179, 120, 0.55);
    color: var(--vk-cream-2);
    font-family: var(--vk-font-en-display);
    font-weight: 700; font-size: 24px;
    display: flex; align-items: center; justify-content: center;
    letter-spacing: -0.02em;
    box-shadow: 0 8px 24px rgba(63, 179, 120, 0.30), 0 0 0 4px var(--vk-bg);
}
body.vk .v-step__title { margin: 0 0 6px; font-size: 17px; font-weight: 700; color: var(--vk-text); }
body.vk .v-step__desc { margin: 0; color: var(--vk-text-mid); font-size: 13px; line-height: 1.6; }
@media (max-width: 880px) {
    body.vk .v-steps { grid-template-columns: repeat(2, 1fr); }
    body.vk .v-steps::before { display: none; }
}
@media (max-width: 480px) { body.vk .v-steps { grid-template-columns: 1fr; } }

/* ============================================================
   12. TESTIMONIALS — 3 quote cards
   ============================================================ */
body.vk .v-quotes {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}
body.vk .v-quote {
    margin: 0;
    padding: 28px;
    border-radius: 18px;
    background: rgba(8, 22, 14, 0.68);
    border: 1px solid rgba(232, 216, 156, 0.14);
    position: relative;
    transition: border-color .3s ease, transform .3s ease;
}
body.vk .v-quote:hover { border-color: rgba(63, 179, 120, 0.40); transform: translateY(-3px); }
body.vk .v-quote__mark {
    position: absolute; top: -8px; left: 24px;
    font-family: var(--vk-font-en-display);
    font-size: 88px; line-height: 1;
    color: var(--vk-green);
    opacity: .35;
    pointer-events: none;
}
body.vk .v-quote__rating {
    display: flex; gap: 3px;
    margin-bottom: 14px;
    color: var(--vk-cream-2);
}
body.vk .v-quote__rating svg { width: 14px; height: 14px; }
body.vk .v-quote blockquote {
    margin: 0 0 22px;
    font-family: var(--vk-font-bn-display);
    font-size: 15px;
    line-height: 1.7;
    color: var(--vk-text);
    font-weight: 500;
}
body.vk .v-quote__who { display: flex; align-items: center; gap: 12px; padding-top: 16px; border-top: 1px solid rgba(232, 216, 156, 0.16); }
body.vk .v-quote__avatar {
    width: 40px; height: 40px;
    border-radius: 50%;
    background: var(--vk-grad-green);
    color: #fff;
    font-weight: 800; font-size: 12px;
    display: flex; align-items: center; justify-content: center;
}
body.vk .v-quote__name { display: flex; flex-direction: column; }
body.vk .v-quote__name strong { font-size: 14px; color: var(--vk-text); font-weight: 700; }
body.vk .v-quote__name em { font-style: normal; font-size: 12px; color: var(--vk-text-dim); }
@media (max-width: 880px) { body.vk .v-quotes { grid-template-columns: 1fr; } }

/* ============================================================
   13. LIVE FEED — 5 activity items
   ============================================================ */
body.vk .v-live {
    display: flex; flex-direction: column; gap: 10px;
    max-width: 880px; margin: 0 auto;
}
body.vk .v-live__item {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 16px;
    align-items: center;
    padding: 16px 22px;
    background: rgba(8, 22, 14, 0.60);
    border: 1px solid rgba(232, 216, 156, 0.10);
    border-radius: 14px;
    transition: border-color .3s ease, transform .3s ease;
}
body.vk .v-live__item:hover { border-color: rgba(63, 179, 120, 0.36); transform: translateX(3px); }
body.vk .v-live__avatar {
    width: 40px; height: 40px;
    border-radius: 50%;
    background: var(--vk-grad-green);
    color: #fff;
    font-weight: 800; font-size: 14px;
    display: flex; align-items: center; justify-content: center;
}
body.vk .v-live__item--cash .v-live__avatar { background: var(--vk-grad-gold); color: #08160E; }
body.vk .v-live__item--win  .v-live__avatar { background: linear-gradient(135deg, var(--vk-cream-2), var(--vk-cream-3)); color: #08160E; }
body.vk .v-live__item--bonus .v-live__avatar { background: var(--vk-grad-red); }
body.vk .v-live__body strong { display: block; font-size: 14px; color: var(--vk-text); font-weight: 700; }
body.vk .v-live__body em { font-style: normal; font-size: 12px; color: var(--vk-text-mid); }
body.vk .v-live__body em.where { color: var(--vk-text-dim); }
body.vk .v-live__what { margin: 2px 0 0; font-size: 13px; color: var(--vk-text-mid); }
body.vk .v-live__time {
    font-family: var(--vk-font-en);
    font-size: 11px; color: var(--vk-text-dim);
    letter-spacing: 0.06em;
    white-space: nowrap;
}

/* ============================================================
   14. COMMUNITY — 6 social cards
   ============================================================ */
body.vk .v-social {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}
body.vk .v-social__card {
    padding: 26px 24px 22px;
    border-radius: 18px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.005) 100%),
        rgba(8, 22, 14, 0.65);
    border: 1px solid rgba(232, 216, 156, 0.14);
    color: inherit;
    display: flex; flex-direction: column; gap: 6px;
    transition: border-color .3s ease, transform .3s ease, box-shadow .3s ease;
    position: relative;
}
body.vk .v-social__card:hover {
    transform: translateY(-4px);
    border-color: rgba(63, 179, 120, 0.40);
    box-shadow: 0 20px 48px rgba(0, 12, 6, 0.55);
}
body.vk .v-social__top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
body.vk .v-social__icon {
    width: 44px; height: 44px;
    border-radius: 12px;
    background: rgba(63, 179, 120, 0.10);
    border: 1px solid rgba(63, 179, 120, 0.32);
    color: var(--vk-green-2);
    display: flex; align-items: center; justify-content: center;
}
body.vk .v-social__icon svg { width: 22px; height: 22px; }
body.vk .v-social__count {
    text-align: right;
    font-family: var(--vk-font-en-display);
    font-weight: 700; font-size: 18px;
    color: var(--vk-cream-2);
    letter-spacing: -0.02em;
    line-height: 1;
}
body.vk .v-social__count em {
    display: block; font-style: normal;
    font-family: var(--vk-font-bn);
    font-size: 11px; font-weight: 500;
    color: var(--vk-text-dim);
    margin-top: 4px;
}
body.vk .v-social__name { margin: 0; font-size: 17px; font-weight: 700; color: var(--vk-text); }
body.vk .v-social__desc { margin: 0; color: var(--vk-text-mid); font-size: 13px; line-height: 1.6; }
body.vk .v-social__cta {
    margin-top: auto; padding-top: 14px;
    color: var(--vk-green-2);
    font-weight: 700; font-size: 13px;
    display: inline-flex; align-items: center; gap: 6px;
}
body.vk .v-social__card:hover .v-social__cta { gap: 10px; }
@media (max-width: 880px) { body.vk .v-social { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { body.vk .v-social { grid-template-columns: 1fr; } }

/* ============================================================
   15. BLOG — 3 post cards
   ============================================================ */
body.vk .v-blog {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}
body.vk .v-blog__card {
    background: rgba(8, 22, 14, 0.65);
    border: 1px solid rgba(232, 216, 156, 0.14);
    border-radius: 18px;
    overflow: hidden;
    transition: transform .3s ease, border-color .3s ease;
}
body.vk .v-blog__card:hover { transform: translateY(-4px); border-color: rgba(63, 179, 120, 0.40); }
body.vk .v-blog__link { display: flex; flex-direction: column; height: 100%; color: inherit; }
body.vk .v-blog__cover {
    aspect-ratio: 16/10;
    position: relative;
    background: linear-gradient(135deg, rgba(63, 179, 120, 0.18), rgba(232, 216, 156, 0.06));
    overflow: hidden;
}
body.vk .v-blog__cover img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
body.vk .v-blog__card:hover .v-blog__cover img { transform: scale(1.04); }
body.vk .v-blog__cat {
    position: absolute; top: 12px; left: 12px;
    padding: 4px 10px;
    background: rgba(8, 22, 14, 0.85);
    border: 1px solid rgba(232, 216, 156, 0.32);
    border-radius: 999px;
    font-family: var(--vk-font-en);
    font-size: 10px; font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--vk-cream-2);
}
body.vk .v-blog__body { padding: 22px 24px; flex: 1; display: flex; flex-direction: column; gap: 8px; }
body.vk .v-blog__meta {
    font-family: var(--vk-font-en);
    font-size: 11px;
    color: var(--vk-text-dim);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    display: flex; gap: 8px;
}
body.vk .v-blog__title { margin: 0; font-size: 17px; line-height: 1.3; color: var(--vk-text); font-weight: 700; }
body.vk .v-blog__excerpt { margin: 0; color: var(--vk-text-mid); font-size: 13px; line-height: 1.6; }
body.vk .v-blog__cta {
    margin-top: auto; padding-top: 12px;
    color: var(--vk-green-2);
    font-weight: 700; font-size: 13px;
    display: inline-flex; align-items: center; gap: 6px;
}
@media (max-width: 880px) { body.vk .v-blog { grid-template-columns: 1fr; } }

/* ============================================================
   16. PLATFORMS — verification panel + 2 link plates
   ============================================================ */
body.vk .v-plat {
    max-width: var(--vk-max); margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
    gap: clamp(28px, 4vw, 56px);
    align-items: center;
}
body.vk .v-plat__copy {}
body.vk .v-plat__assure { list-style: none; padding: 0; margin: 24px 0 0; display: flex; flex-wrap: wrap; gap: 10px; }
body.vk .v-plat__assure li {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 8px 14px;
    background: rgba(63, 179, 120, 0.08);
    border: 1px solid rgba(63, 179, 120, 0.32);
    border-radius: 999px;
    font-size: 12px;
    color: var(--vk-green-2);
}
body.vk .v-plat__links { display: flex; flex-direction: column; gap: 14px; }
body.vk .v-plink {
    display: grid;
    grid-template-columns: 56px 1fr auto;
    gap: 18px;
    align-items: center;
    padding: 22px 24px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.005) 100%),
        rgba(8, 22, 14, 0.78);
    border: 1px solid rgba(232, 216, 156, 0.20);
    border-radius: 18px;
    color: inherit;
    transition: transform .3s ease, border-color .3s ease;
}
body.vk .v-plink:hover { transform: translateY(-3px); border-color: rgba(232, 216, 156, 0.45); }
body.vk .v-plink__verify {
    width: 56px; height: 56px;
    border-radius: 50%;
    border: 2px dashed rgba(232, 216, 156, 0.45);
    background: rgba(232, 216, 156, 0.06);
    color: var(--vk-cream-2);
    display: flex; align-items: center; justify-content: center;
}
body.vk .v-plink__verify svg { width: 22px; height: 22px; }
body.vk .v-plink__name { font-size: 16px; font-weight: 700; color: var(--vk-text); margin: 0 0 4px; }
body.vk .v-plink__sub { font-size: 12px; color: var(--vk-text-mid); margin: 0 0 6px; }
body.vk .v-plink__pills { display: flex; gap: 6px; flex-wrap: wrap; }
body.vk .v-plink__pill {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 3px 8px;
    background: rgba(63, 179, 120, 0.10);
    border: 1px solid rgba(63, 179, 120, 0.30);
    border-radius: 999px;
    font-size: 10px;
    color: var(--vk-green-2);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
body.vk .v-plink__go {
    color: var(--vk-cream-2);
    font-weight: 700;
    font-size: 13px;
    white-space: nowrap;
    display: inline-flex; align-items: center; gap: 6px;
}
@media (max-width: 880px) { body.vk .v-plat { grid-template-columns: 1fr; } }

/* ============================================================
   17. SEO long-form
   ============================================================ */
body.vk .v-seo {
    max-width: var(--vk-max); margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
    gap: clamp(28px, 4vw, 48px);
}
body.vk .v-seo__col h3 { margin: 24px 0 8px; font-size: 18px; font-weight: 700; color: var(--vk-cream-2); }
body.vk .v-seo__col p { margin: 0; color: var(--vk-text-mid); font-size: 15px; line-height: 1.78; }
body.vk .v-seo__col strong { color: var(--vk-cream-2); }
body.vk .v-seo__lead { font-size: 16px !important; line-height: 1.78; }

body.vk .v-seo__panel {
    padding: 28px;
    border-radius: 20px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.005) 100%),
        rgba(8, 22, 14, 0.70);
    border: 1px solid rgba(232, 216, 156, 0.18);
}
body.vk .v-seo__panel h3 { margin: 0 0 8px; font-size: 18px; font-weight: 700; color: var(--vk-text); }
body.vk .v-seo__panel h3 em { font-style: normal; color: var(--vk-green-2); }
body.vk .v-seo__panel p { color: var(--vk-text-mid); font-size: 14px; line-height: 1.65; margin: 0 0 14px; }
body.vk .v-seo__cities { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 6px; }
body.vk .v-seo__cities li {
    padding: 5px 11px;
    background: rgba(232, 216, 156, 0.06);
    border: 1px solid rgba(232, 216, 156, 0.18);
    border-radius: 999px;
    font-size: 12px;
    color: var(--vk-text);
}
body.vk .v-seo__metrics {
    margin-top: 18px;
    display: grid; grid-template-columns: 1fr 1fr; gap: 0;
    border: 1px solid rgba(232, 216, 156, 0.18);
    border-radius: 14px;
    overflow: hidden;
    background: rgba(8, 22, 14, 0.40);
}
body.vk .v-seo__metric {
    padding: 18px 14px;
    text-align: center;
    border: 1px solid rgba(232, 216, 156, 0.12);
    border-top: none; border-left: none;
}
body.vk .v-seo__metric:nth-child(2n) { border-right: none; }
body.vk .v-seo__metric:nth-child(-n+2) { border-top: none; }
body.vk .v-seo__metric-num {
    display: block;
    font-family: var(--vk-font-en-display);
    font-weight: 700; font-size: 28px;
    background: var(--vk-grad-text);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    line-height: 1; letter-spacing: -0.025em;
}
body.vk .v-seo__metric-num small { font-size: 0.5em; opacity: .8; }
body.vk .v-seo__metric-lbl { display: block; margin-top: 6px; font-size: 11px; color: var(--vk-text-dim); text-transform: uppercase; letter-spacing: 0.10em; }
@media (max-width: 880px) { body.vk .v-seo { grid-template-columns: 1fr; } }

/* ============================================================
   18. CONTACT — 4 channel cards
   ============================================================ */
body.vk .v-contact {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}
body.vk .v-contact__card {
    padding: 24px;
    border-radius: 18px;
    background: rgba(8, 22, 14, 0.70);
    border: 1px solid rgba(232, 216, 156, 0.14);
    color: inherit;
    transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
    display: flex; flex-direction: column; gap: 6px;
    position: relative; overflow: hidden;
}
body.vk .v-contact__card:hover {
    transform: translateY(-4px);
    border-color: rgba(63, 179, 120, 0.45);
    box-shadow: 0 24px 56px rgba(0, 12, 6, 0.55);
}
body.vk .v-contact__card--whatsapp { border-color: rgba(37, 211, 102, 0.40); }
body.vk .v-contact__card--whatsapp::before {
    content: ''; position: absolute; inset: 0;
    background: radial-gradient(60% 80% at 0% 0%, rgba(37, 211, 102, 0.12) 0%, transparent 60%);
    pointer-events: none;
}
body.vk .v-contact__icon {
    width: 44px; height: 44px;
    border-radius: 12px;
    background: rgba(63, 179, 120, 0.12);
    border: 1px solid rgba(63, 179, 120, 0.32);
    color: var(--vk-green-2);
    display: flex; align-items: center; justify-content: center;
    margin-bottom: 8px;
}
body.vk .v-contact__card--whatsapp .v-contact__icon { background: rgba(37, 211, 102, 0.14); border-color: rgba(37, 211, 102, 0.40); color: #25D366; }
body.vk .v-contact__online {
    display: inline-flex; align-items: center; gap: 6px;
    align-self: flex-start;
    margin-bottom: 4px;
    font-family: var(--vk-font-en);
    font-size: 10px; font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--vk-green-2);
}
body.vk .v-contact__online i {
    width: 6px; height: 6px;
    background: #25D366;
    border-radius: 50%;
    animation: v-pulse-green 1.6s ease-in-out infinite;
}
body.vk .v-contact__online--off { color: var(--vk-text-dim); }
body.vk .v-contact__online--off i { background: var(--vk-text-dim); animation: none; }
body.vk .v-contact__name { margin: 0; font-size: 16px; font-weight: 700; color: var(--vk-text); }
body.vk .v-contact__detail { margin: 4px 0 4px; font-size: 13px; color: var(--vk-cream-2); font-weight: 600; }
body.vk .v-contact__sub { margin: 0; color: var(--vk-text-dim); font-size: 12px; line-height: 1.5; }
body.vk .v-contact__cta {
    margin-top: 12px;
    color: var(--vk-green-2);
    font-weight: 700; font-size: 12px;
    display: inline-flex; align-items: center; gap: 6px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}
body.vk .v-contact__card:hover .v-contact__cta { gap: 10px; }
@media (max-width: 880px) { body.vk .v-contact { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { body.vk .v-contact { grid-template-columns: 1fr; } }

/* ============================================================
   19. SUPPORT — 3 cards
   ============================================================ */
body.vk .v-support {
    display: grid;
    grid-template-columns: 1fr 1fr 1.2fr;
    gap: 18px;
}
body.vk .v-support__card {
    padding: 28px;
    border-radius: 20px;
    background: rgba(8, 22, 14, 0.65);
    border: 1px solid rgba(232, 216, 156, 0.14);
    transition: border-color .3s ease, transform .3s ease;
}
body.vk .v-support__card:hover { border-color: rgba(63, 179, 120, 0.40); transform: translateY(-3px); }
body.vk .v-support__card h3 { margin: 0 0 12px; font-size: 20px; font-weight: 700; color: var(--vk-text); }
body.vk .v-support__card p { margin: 0 0 18px; color: var(--vk-text-mid); font-size: 14px; line-height: 1.65; }
body.vk .v-support__stats { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
body.vk .v-support__stats li {
    padding: 14px 16px;
    background: rgba(63, 179, 120, 0.06);
    border: 1px solid rgba(63, 179, 120, 0.20);
    border-radius: 12px;
}
body.vk .v-support__stat-num {
    display: block;
    font-family: var(--vk-font-en-display);
    font-weight: 700;
    font-size: 22px;
    background: var(--vk-grad-text);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    line-height: 1; letter-spacing: -0.025em;
}
body.vk .v-support__stat-label { display: block; margin-top: 4px; font-size: 11px; color: var(--vk-text-mid); }
@media (max-width: 880px) { body.vk .v-support { grid-template-columns: 1fr; } }

/* ============================================================
   20. FAQ
   ============================================================ */
body.vk .v-faq {
    max-width: 880px; margin: 0 auto;
    display: flex; flex-direction: column; gap: 10px;
}
body.vk .v-faq__item {
    background: rgba(8, 22, 14, 0.55);
    border: 1px solid rgba(232, 216, 156, 0.12);
    border-radius: 14px;
    overflow: hidden;
    transition: border-color .3s ease;
}
body.vk .v-faq__item[open],
body.vk .v-faq__item:hover { border-color: rgba(63, 179, 120, 0.36); }
body.vk .v-faq__item summary {
    cursor: pointer;
    list-style: none;
    padding: 18px 24px;
    display: flex; align-items: center; justify-content: space-between;
    gap: 16px;
}
body.vk .v-faq__item summary::-webkit-details-marker { display: none; }
body.vk .v-faq__q { font-weight: 600; font-size: 15px; color: var(--vk-text); flex: 1; }
body.vk .v-faq__chev {
    width: 14px; height: 14px;
    border-right: 2px solid var(--vk-green-2);
    border-bottom: 2px solid var(--vk-green-2);
    transform: rotate(45deg);
    transition: transform .3s ease;
    flex-shrink: 0;
}
body.vk .v-faq__item[open] .v-faq__chev { transform: rotate(225deg); }
body.vk .v-faq__answer { padding: 0 24px 20px; color: var(--vk-text-mid); font-size: 14px; line-height: 1.7; }

/* ============================================================
   21. FINAL CTA — emerald banner with red accent button
   ============================================================ */
body.vk .v-final {
    max-width: var(--vk-max); margin: 0 auto;
    padding: clamp(56px, 7vw, 88px) clamp(36px, 5vw, 72px);
    border-radius: 28px;
    background:
        radial-gradient(60% 80% at 0% 0%, rgba(63, 179, 120, 0.30) 0%, transparent 60%),
        radial-gradient(70% 100% at 100% 100%, rgba(232, 216, 156, 0.14) 0%, transparent 60%),
        linear-gradient(135deg, #0F4A2D 0%, #061A0F 100%);
    border: 1px solid rgba(232, 216, 156, 0.30);
    box-shadow: 0 32px 80px rgba(0, 12, 6, 0.55);
    text-align: center;
    position: relative;
    overflow: hidden;
}
body.vk .v-final::before {
    content: ''; position: absolute; inset: 0;
    background: repeating-linear-gradient(45deg, transparent 0 22px, rgba(255, 255, 255, 0.025) 22px 23px);
    pointer-events: none;
}
body.vk .v-final__title {
    margin: 14px auto 14px;
    font-family: var(--vk-font-bn-display);
    font-weight: 700;
    font-size: clamp(34px, 5vw, 60px);
    line-height: 1.05;
    color: var(--vk-text);
    max-width: 18ch;
    position: relative;
}
body.vk .v-final__title strong {
    background: var(--vk-grad-text);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}
body.vk .v-final__sub {
    margin: 0 auto 28px;
    color: var(--vk-text-mid);
    font-size: 16px; line-height: 1.65;
    max-width: 56ch;
    position: relative;
}
body.vk .v-final__cta {
    display: inline-flex; gap: 14px; flex-wrap: wrap; justify-content: center;
    position: relative;
}

/* ============================================================
   22. FOOTER
   ============================================================ */
body.vk .vk-footer {
    background: linear-gradient(180deg, #050D08 0%, #03080500 100%);
    position: relative;
}
body.vk .vk-footer::before {
    content: '';
    position: absolute; left: 0; right: 0; top: 0; height: 1px;
    background: linear-gradient(90deg, transparent, rgba(232, 216, 156, 0.45), transparent);
    pointer-events: none;
}
body.vk .vk-footer__glow {
    background:
        radial-gradient(70% 60% at 50% 0%, rgba(63, 179, 120, 0.25) 0%, transparent 60%),
        radial-gradient(40% 30% at 80% 100%, rgba(232, 216, 156, 0.10) 0%, transparent 65%);
}

/* Stat numbers in old vk-stat (compat) */
body.vk .vk-stat__num {
    background: var(--vk-grad-text);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

/* Scrollbar */
body.vk *::-webkit-scrollbar { width: 10px; height: 10px; }
body.vk *::-webkit-scrollbar-track { background: #08160E; }
body.vk *::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--vk-green) 0%, var(--vk-green-deep) 100%);
    border-radius: 10px;
    border: 2px solid #08160E;
}
body.vk *::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, var(--vk-cream-2), var(--vk-cream-3));
}

/* Premium typography refinements (kept from earlier phases) */
body.vk {
    font-family: var(--vk-font-bn);
    font-feature-settings: "kern", "calt", "liga";
    text-rendering: optimizeLegibility;
}

/* ============================================================
   23. COMPACT HOMEPAGE — tighten vertical rhythm + scale type.
       Goal: each section fits comfortably in a single viewport,
       gaps trimmed roughly in half, headlines/leads dialed back
       so the hierarchy stays clear without feeling oversized.
   ============================================================ */

/* Section primitives */
body.vk .v-sec { padding-block: clamp(28px, 3.2vw, 52px); }
body.vk .v-sec__head { margin-bottom: 18px; }
body.vk .v-sec__title {
    margin: 6px auto 8px;
    font-size: clamp(20px, 2.4vw, 30px);
    line-height: 1.15;
    max-width: 26ch;
}
body.vk .v-sec__lead { font-size: 13px; line-height: 1.6; max-width: 60ch; }
body.vk .vk-eyebrow, body.vk .v-eyebrow { font-size: 10px; letter-spacing: 0.14em; }
body.vk .vk-eyebrow:lang(bn), body.vk .v-eyebrow:lang(bn) { font-size: 11px; }

/* Hero — header is sticky (not fixed), so top padding is pure whitespace */
body.vk .v-hero--split,
body.vk :is(.v-hero--premium, .v-hero--split) { padding: clamp(22px, 3vw, 44px) var(--vk-pad) clamp(24px, 3.2vw, 44px); }
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__inner { gap: 14px; max-width: 920px; }

/* ============================================================
   SPLIT HERO — left copy column + right product preview card
   ============================================================ */
body.vk .v-hero--split {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(60% 70% at 18% 22%, rgba(245, 200, 66, 0.14) 0%, transparent 60%),
        radial-gradient(50% 60% at 82% 78%, rgba(230, 57, 70, 0.10) 0%, transparent 65%),
        radial-gradient(55% 65% at 50% 100%, rgba(79, 189, 239, 0.08) 0%, transparent 60%),
        linear-gradient(180deg, #0A1628 0%, #060E1C 60%, #03070F 100%);
}
body.vk .v-hero--split .v-hero__split {
    position: relative;
    z-index: 2;
    max-width: var(--vk-max);
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(28px, 3.5vw, 48px);
}

/* ============================================================
   BENTO GRID HERO — Apple/Cal.com-style 3-column dashboard
   ============================================================ */
body.vk .v-hero__bento {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 1.4fr) minmax(0, 1fr);
    grid-template-rows: 1fr 1fr;
    gap: 14px;
    width: 100%;
    align-items: stretch;
}
body.vk .v-hero__bento .v-hero__preview--chat {
    grid-column: 2;
    grid-row: 1 / 3;
    margin: 0;
    max-width: none;
    transform: none;
}
body.vk .v-hero__bento .v-hero__preview--chat:hover { transform: translateY(-3px); }
body.vk .v-hero__bento .v-hero__preview--chat::after { display: none; } /* drop the floor reflection in bento mode */

/* Explicit cell placement for the 4 side cards — prevents auto-placement bugs */
body.vk .v-hero__bento-card--payments { grid-column: 1; grid-row: 1; }
body.vk .v-hero__bento-card--match    { grid-column: 1; grid-row: 2; }
body.vk .v-hero__bento-card--agents   { grid-column: 3; grid-row: 1; }
body.vk .v-hero__bento-card--withdraw { grid-column: 3; grid-row: 2; }

/* Side data cards (4 around the chat) — content centered */
body.vk .v-hero__bento-card {
    position: relative;
    overflow: hidden;
    padding: 14px 14px;
    border-radius: 18px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.01) 100%),
        rgba(8, 18, 32, 0.78);
    border: 1px solid rgba(245, 200, 66, 0.18);
    box-shadow:
        0 16px 40px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    display: flex;
    flex-direction: column;
    align-items: center;        /* horizontal center */
    justify-content: center;    /* vertical center */
    text-align: center;
    gap: 6px;
    transition: transform .35s cubic-bezier(.2,.7,.15,1), border-color .3s ease, box-shadow .3s ease;
}
/* Inner pieces — centered */
body.vk .v-hero__bento-card-head {
    justify-content: center;
}
body.vk .v-hero__bento-num {
    text-align: center;
    margin: 0 auto;
}
body.vk .v-hero__bento-sub {
    justify-content: center;
    text-align: center;
    margin-top: auto;
}
/* Match-card teams stay inline-centered */
body.vk .v-hero__bento-match {
    justify-content: center;
    margin: 0 auto;
}
/* Avatar stack centers */
body.vk .v-hero__bento-stack {
    justify-content: center;
    margin: 0 auto;
}
/* Progress bar fills full width */
body.vk .v-hero__bento-bar { width: 100%; }
body.vk .v-hero__bento-card:hover {
    transform: translateY(-3px);
    border-color: rgba(245, 200, 66, 0.40);
    box-shadow:
        0 24px 56px rgba(0, 0, 0, 0.55),
        0 0 32px rgba(245, 200, 66, 0.12);
}

body.vk .v-hero__bento-card-head {
    display: flex; align-items: center; gap: 8px;
}
body.vk .v-hero__bento-icon {
    width: 28px; height: 28px;
    border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
body.vk .v-hero__bento-icon[data-tone="gold"] {
    background: rgba(245, 200, 66, 0.15);
    border: 1px solid rgba(245, 200, 66, 0.35);
    color: #F5C842;
}
body.vk .v-hero__bento-icon[data-tone="rose"] {
    background: rgba(230, 57, 70, 0.14);
    border: 1px solid rgba(230, 57, 70, 0.40);
    color: #FF8FA3;
}
body.vk .v-hero__bento-icon[data-tone="emerald"] {
    background: rgba(63, 179, 120, 0.14);
    border: 1px solid rgba(63, 179, 120, 0.40);
    color: #6EE7AE;
}
body.vk .v-hero__bento-icon[data-tone="cyan"] {
    background: rgba(79, 189, 239, 0.14);
    border: 1px solid rgba(79, 189, 239, 0.40);
    color: #4FBDEF;
}

body.vk .v-hero__bento-label {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.10em;
    color: rgba(232, 220, 180, 0.65);
}
body.vk .v-hero__bento-live {
    width: 6px; height: 6px;
    background: #FF4D6D;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(255, 77, 109, 0.7);
    animation: v-pulse-live 1.4s ease-in-out infinite;
    display: inline-block;
}

body.vk .v-hero__bento-num {
    display: inline-block;
    font-family: var(--vk-font-en-display);
    font-weight: 800;
    font-size: clamp(22px, 2.6vw, 30px);
    line-height: 1.3;
    padding: 4px 0 2px;
    overflow: visible;
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #B57E1A 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    letter-spacing: -0.025em;
}
body.vk .v-hero__bento-num small {
    font-size: 0.5em;
    vertical-align: super;
    margin-left: 2px;
}

body.vk .v-hero__bento-sub {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 11px;
    color: rgba(232, 220, 180, 0.55);
    line-height: 1.4;
    margin-top: auto;
}
body.vk .v-hero__bento-trend {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
}
body.vk .v-hero__bento-trend--up {
    background: rgba(63, 179, 120, 0.16);
    color: #6EE7AE;
    border: 1px solid rgba(63, 179, 120, 0.35);
}

/* Match card — team rows */
body.vk .v-hero__bento-match {
    display: flex; align-items: center; gap: 8px;
    margin: 6px 0;
}
body.vk .v-hero__bento-team {
    flex: 1; min-width: 0;
    display: flex; flex-direction: column;
}
body.vk .v-hero__bento-team strong {
    font-size: 12px; font-weight: 700;
    color: var(--vk-text);
    line-height: 1.3;
}
body.vk .v-hero__bento-team span {
    font-family: var(--vk-font-en-display);
    font-size: 16px; font-weight: 700;
    color: #FFE89F;
    line-height: 1.3;
    padding-top: 2px;
    letter-spacing: -0.02em;
}
body.vk .v-hero__bento-vs {
    font-size: 9px; font-weight: 700;
    color: var(--vk-text-dim);
    text-transform: uppercase;
    letter-spacing: 0.10em;
}

/* Agents card — avatar stack */
body.vk .v-hero__bento-stack {
    display: inline-flex;
    margin: 4px 0;
}
body.vk .v-hero__bento-avatar {
    width: 24px; height: 24px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 10px; font-weight: 800;
    border: 2px solid #08160E;
    margin-left: -8px;
    background: linear-gradient(135deg, #F5C842, #B57E1A);
    color: #08160E;
    box-sizing: border-box;
}
body.vk .v-hero__bento-avatar:first-child { margin-left: 0; }
body.vk .v-hero__bento-avatar[data-color="emerald"] { background: linear-gradient(135deg, #3FB378, #1B6B47); color: #fff; }
body.vk .v-hero__bento-avatar[data-color="gold"]    { background: linear-gradient(135deg, #FFE89F, #B57E1A); color: #08160E; }
body.vk .v-hero__bento-avatar[data-color="rose"]    { background: linear-gradient(135deg, #FF8FA3, #C8102E); color: #fff; }
body.vk .v-hero__bento-avatar[data-color="cyan"]    { background: linear-gradient(135deg, #4FBDEF, #2A6FAA); color: #fff; }
body.vk .v-hero__bento-avatar--more {
    background: rgba(245, 200, 66, 0.18);
    color: #FFE89F;
    border-color: rgba(245, 200, 66, 0.45);
}

/* Withdraw card — progress bar */
body.vk .v-hero__bento-bar {
    width: 100%;
    height: 4px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 999px;
    overflow: hidden;
    margin: 6px 0 4px;
}
body.vk .v-hero__bento-bar-fill {
    display: block;
    height: 100%;
    width: var(--w, 100%);
    background: linear-gradient(90deg, #6EE7AE 0%, #F5C842 100%);
    border-radius: 999px;
    box-shadow: 0 0 8px rgba(245, 200, 66, 0.5);
    animation: v-bar-fill 1.6s cubic-bezier(.2,.7,.15,1) 0.4s both;
}
@keyframes v-bar-fill {
    from { width: 0; }
    to   { width: var(--w, 100%); }
}

/* Tablet & mobile collapse */
@media (max-width: 1100px) {
    body.vk .v-hero__bento {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto auto;
    }
    body.vk .v-hero__bento .v-hero__preview--chat {
        grid-column: 1 / -1;
        grid-row: 1;
        max-width: 460px;
        margin: 0 auto;
        width: 100%;
    }
    body.vk .v-hero__bento-card--payments { grid-column: 1; grid-row: 2; }
    body.vk .v-hero__bento-card--match    { grid-column: 2; grid-row: 2; }
    body.vk .v-hero__bento-card--agents   { grid-column: 1; grid-row: 3; }
    body.vk .v-hero__bento-card--withdraw { grid-column: 2; grid-row: 3; }
}
@media (max-width: 600px) {
    body.vk .v-hero__bento { grid-template-columns: 1fr; }
    body.vk .v-hero__bento-card { grid-column: 1 !important; }
    body.vk .v-hero__bento-card--payments { grid-row: 2; }
    body.vk .v-hero__bento-card--match    { grid-row: 3; }
    body.vk .v-hero__bento-card--agents   { grid-row: 4; }
    body.vk .v-hero__bento-card--withdraw { grid-row: 5; }
}
body.vk .v-hero--split .v-hero__split {
    margin-bottom: clamp(56px, 7vw, 96px) !important;
}
body.vk .v-hero--split .v-hero__bottom {
    position: relative; z-index: 2;
    max-width: var(--vk-max);
    margin: 0 auto !important;
    padding-top: clamp(40px, 5vw, 64px);
    display: flex;
    flex-direction: column;
    gap: 20px;
}
/* Ornamental divider: gradient line + center diamond so the bottom panel
   reads as a separate zone from the chat/copy above (no more touching). */
body.vk .v-hero--split .v-hero__bottom::before {
    content: '';
    position: absolute;
    top: 0; left: 50%;
    width: clamp(180px, 36vw, 360px);
    height: 1px;
    transform: translateX(-50%);
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(245, 200, 66, 0.55) 50%,
        transparent 100%);
    pointer-events: none;
}
body.vk .v-hero--split .v-hero__bottom::after {
    content: '';
    position: absolute;
    top: -5px; left: 50%;
    width: 10px; height: 10px;
    transform: translateX(-50%) rotate(45deg);
    background: linear-gradient(135deg, #F5C842 0%, #FFFAEC 100%);
    border: 1px solid rgba(245, 200, 66, 0.55);
    box-shadow: 0 0 14px rgba(245, 200, 66, 0.65);
    animation: v-divider-pulse 2.6s ease-in-out infinite;
    pointer-events: none;
}
@keyframes v-divider-pulse {
    0%, 100% { transform: translateX(-50%) rotate(45deg)  scale(1);   box-shadow: 0 0 12px rgba(245, 200, 66, 0.5); }
    50%      { transform: translateX(-50%) rotate(225deg) scale(1.25); box-shadow: 0 0 22px rgba(245, 200, 66, 1); }
}
@media (prefers-reduced-motion: reduce) {
    body.vk .v-hero--split .v-hero__bottom::after { animation: none; }
}

/* COPY BLOCK — centered Stripe/Linear-style hero text */
body.vk .v-hero__copy {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    max-width: 820px;
    text-align: center;
}
body.vk .v-hero__copy .v-hero__pill--premium { align-self: center; }
body.vk .v-hero--split .v-hero__title {
    margin: 0;
    font-family: var(--vk-font-bn-display);
    font-weight: 700;
    font-size: clamp(38px, 6vw, 78px);
    line-height: 1.05;
    letter-spacing: -0.025em;
    color: #F5F1E6;
    text-align: center;
    align-items: center;
}
body.vk .v-hero--split .v-hero__title-line { display: block; text-align: center; }
body.vk .v-hero--split .v-hero__lead {
    margin: 0 auto;
    text-align: center;
    font-size: clamp(14px, 1.15vw, 16.5px);
    line-height: 1.7;
    color: rgba(232, 220, 180, 0.80);
    max-width: 60ch;
}
body.vk .v-hero--split .v-hero__lead strong { color: #FFE89F; font-weight: 700; }
body.vk .v-hero--split .v-hero__cta {
    display: flex; gap: 14px;
    flex-wrap: wrap;
    margin-top: 8px;
    justify-content: center;
}
body.vk .v-hero--split .v-hero__chips {
    justify-content: center;
}

/* Highlight chips below the CTAs */
body.vk .v-hero__chips {
    list-style: none; padding: 0;
    margin: 8px 0 0;
    display: flex; flex-wrap: wrap;
    gap: 8px;
}
body.vk .v-hero__chips li {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 5px 11px;
    background: rgba(245, 200, 66, 0.08);
    border: 1px solid rgba(245, 200, 66, 0.25);
    border-radius: 999px;
    font-size: 11px;
    color: #FFE89F;
}
body.vk .v-hero__chips li svg { color: #F5C842; }

/* PRODUCT SHOWCASE — centered chat preview, larger, with subtle floor reflection */
body.vk .v-hero__preview {
    position: relative;
    width: 100%;
    max-width: 460px;
    margin: 0 auto;
    padding: 20px 20px 16px;
    border-radius: 20px;
    background:
        linear-gradient(180deg, rgba(13, 24, 48, 0.92) 0%, rgba(7, 14, 28, 0.96) 100%);
    border: 1px solid rgba(245, 200, 66, 0.22);
    box-shadow:
        0 32px 80px rgba(0, 0, 0, 0.65),
        0 0 60px rgba(245, 200, 66, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transform: perspective(1600px) rotateX(2deg);
    transition: transform .55s cubic-bezier(.2,.7,.15,1), box-shadow .4s ease;
}
body.vk .v-hero__preview:hover {
    transform: perspective(1600px) rotateX(0deg) translateY(-4px);
    box-shadow:
        0 44px 100px rgba(0, 0, 0, 0.75),
        0 0 80px rgba(245, 200, 66, 0.22);
}
/* Soft floor reflection underneath — Stripe/Linear product shot trick */
body.vk .v-hero__preview::after {
    content: '';
    position: absolute;
    left: 8%; right: 8%;
    bottom: -28px;
    height: 60px;
    background: radial-gradient(50% 100% at 50% 0%, rgba(245, 200, 66, 0.20) 0%, transparent 70%);
    filter: blur(12px);
    pointer-events: none;
    z-index: -1;
}
body.vk .v-hero__preview::before {
    content: '';
    position: absolute; inset: -1px;
    border-radius: inherit;
    padding: 1px;
    background: conic-gradient(from 0deg,
        rgba(245, 200, 66, 0.65) 0%,
        rgba(255, 250, 236, 0.50) 25%,
        rgba(230, 57, 70, 0.55) 50%,
        rgba(79, 189, 239, 0.50) 75%,
        rgba(245, 200, 66, 0.65) 100%);
    -webkit-mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);
    -webkit-mask-composite: xor;
            mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);
            mask-composite: exclude;
    animation: v-conic-spin 12s linear infinite;
    pointer-events: none;
    opacity: 0.55;
}

body.vk .v-hero__preview-head {
    display: flex; align-items: center; gap: 10px;
    padding-bottom: 14px;
    margin-bottom: 12px;
    border-bottom: 1px dashed rgba(245, 200, 66, 0.20);
}
body.vk .v-hero__live-dot {
    width: 8px; height: 8px;
    background: #FF4D6D;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(255, 77, 109, 0.65);
    animation: v-pulse-live 1.4s ease-in-out infinite;
}
@keyframes v-pulse-live {
    0%,100% { box-shadow: 0 0 0 0 rgba(255, 77, 109, 0.65); }
    50%     { box-shadow: 0 0 0 8px rgba(255, 77, 109, 0); }
}
body.vk .v-hero__preview-label {
    flex: 1;
    font-size: 11px; font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #FFE89F;
}
body.vk .v-hero__preview-count {
    padding: 3px 10px;
    background: rgba(245, 200, 66, 0.14);
    border: 1px solid rgba(245, 200, 66, 0.32);
    border-radius: 999px;
    font-family: var(--vk-font-en-display);
    font-weight: 700; font-size: 11px;
    color: #F5C842;
}

body.vk .v-hero__agents {
    list-style: none; padding: 0; margin: 0;
    display: flex; flex-direction: column; gap: 8px;
}
body.vk .v-hero__agent {
    display: grid;
    grid-template-columns: 36px 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 9px 11px;
    background: rgba(255, 255, 255, 0.025);
    border: 1px solid rgba(245, 200, 66, 0.12);
    border-radius: 11px;
    transition: background .25s ease, border-color .25s ease, transform .25s ease;
}
body.vk .v-hero__agent:hover {
    background: rgba(245, 200, 66, 0.06);
    border-color: rgba(245, 200, 66, 0.32);
    transform: translateX(3px);
}
body.vk .v-hero__agent-avatar {
    width: 36px; height: 36px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-weight: 800; font-size: 14px;
    color: #08160E;
    background: linear-gradient(135deg, #F5C842, #B57E1A);
    border: 1.5px solid rgba(255, 250, 236, 0.45);
}
body.vk .v-hero__agent-avatar[data-color="emerald"] { background: linear-gradient(135deg, #3FB378, #1B6B47); color: #fff; }
body.vk .v-hero__agent-avatar[data-color="gold"]    { background: linear-gradient(135deg, #FFE89F, #B57E1A); color: #08160E; }
body.vk .v-hero__agent-avatar[data-color="rose"]    { background: linear-gradient(135deg, #FF8FA3, #C8102E); color: #fff; }
body.vk .v-hero__agent-avatar[data-color="cyan"]    { background: linear-gradient(135deg, #4FBDEF, #2A6FAA); color: #fff; }

body.vk .v-hero__agent-body { display: flex; flex-direction: column; min-width: 0; }
body.vk .v-hero__agent-body strong {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 12.5px; font-weight: 700;
    color: #F5F1E6;
    line-height: 1.2;
}
body.vk .v-hero__agent-body strong svg { color: #4FBDEF; }
body.vk .v-hero__agent-body em {
    font-style: normal;
    font-size: 10.5px;
    color: rgba(232, 220, 180, 0.55);
    margin-top: 1px;
    letter-spacing: 0.02em;
}
body.vk .v-hero__agent-status {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 9.5px; font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.10em;
    padding: 3px 8px;
    border-radius: 999px;
}
body.vk .v-hero__agent-status::before {
    content: ''; width: 5px; height: 5px;
    border-radius: 50%; background: currentColor;
    box-shadow: 0 0 0 0 currentColor;
    animation: v-pulse-live 2s ease-in-out infinite;
}
body.vk .v-hero__agent-status--online {
    background: rgba(63, 179, 120, 0.14);
    color: #6EE7AE;
}
body.vk .v-hero__agent-status--away {
    background: rgba(255, 179, 71, 0.12);
    color: #FFB347;
}
body.vk .v-hero__agent-status--away::before { animation: none; }

body.vk .v-hero__preview-cta {
    display: flex; align-items: center; justify-content: center;
    gap: 8px;
    margin-top: 12px;
    padding: 10px 14px;
    background: rgba(245, 200, 66, 0.08);
    border: 1px solid rgba(245, 200, 66, 0.32);
    border-radius: 11px;
    color: #FFE89F;
    font-weight: 700; font-size: 12.5px;
    transition: background .25s ease, border-color .25s ease, gap .25s ease;
}
body.vk .v-hero__preview-cta:hover {
    background: rgba(245, 200, 66, 0.16);
    border-color: rgba(245, 200, 66, 0.55);
    gap: 12px;
}

/* Floating verified seal sticker (top-right of preview card) */
body.vk .v-hero__seal {
    position: absolute;
    top: -22px; right: -18px;
    width: 80px; height: 80px;
    display: flex; align-items: center; justify-content: center;
    z-index: 3;
    animation: v-seal-rotate 18s linear infinite;
    filter: drop-shadow(0 8px 24px rgba(245, 200, 66, 0.45));
}
@keyframes v-seal-rotate {
    from { transform: rotate(-8deg); }
    50%  { transform: rotate(8deg); }
    to   { transform: rotate(-8deg); }
}
body.vk .v-hero__seal-label {
    position: absolute;
    inset: 0;
    display: flex; align-items: center; justify-content: center;
    font-size: 0; /* visible only to AT */
}

/* ============================================================
   BOTTOM STRIP — premium stat cards with icons
   ============================================================ */
body.vk .v-hero__stats--strip {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    padding: 6px;
    border-radius: 18px;
    border: 1px solid rgba(245, 200, 66, 0.25);
    background:
        radial-gradient(60% 100% at 50% 0%, rgba(245, 200, 66, 0.08) 0%, transparent 60%),
        linear-gradient(180deg, rgba(13, 24, 48, 0.85) 0%, rgba(5, 12, 26, 0.96) 100%);
    box-shadow:
        0 20px 56px rgba(0, 0, 0, 0.55),
        0 0 32px rgba(245, 200, 66, 0.06),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
    overflow: hidden;
}

/* Animated gold sweep across the strip top */
body.vk .v-hero__stats--strip::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(245, 200, 66, 0.55) 30%,
        rgba(255, 250, 236, 0.85) 50%,
        rgba(245, 200, 66, 0.55) 70%,
        transparent 100%);
    background-size: 200% 100%;
    animation: v-strip-sweep 4s linear infinite;
    opacity: 0.7;
    pointer-events: none;
}
@keyframes v-strip-sweep {
    0%   { background-position: -200% 50%; }
    100% { background-position: 200% 50%; }
}

body.vk .v-hero__stats--strip .v-hero__stat {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 16px 10px 14px;
    border: none;
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.025) 0%, rgba(255, 255, 255, 0.005) 100%);
    transition: background .3s ease, transform .3s ease, box-shadow .3s ease;
    cursor: default;
}
body.vk .v-hero__stats--strip .v-hero__stat::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(135deg,
        rgba(245, 200, 66, 0.0) 0%,
        rgba(245, 200, 66, 0.0) 100%);
    opacity: 0;
    transition: opacity .3s ease;
    pointer-events: none;
}
body.vk .v-hero__stats--strip .v-hero__stat:hover {
    background: rgba(245, 200, 66, 0.06);
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
}
body.vk .v-hero__stats--strip .v-hero__stat:hover::after {
    opacity: 1;
    background: linear-gradient(135deg, rgba(245, 200, 66, 0.10) 0%, transparent 60%);
}

/* Stat icon — circular gold tinted background */
body.vk .v-hero__stat-icon {
    width: 36px; height: 36px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background:
        radial-gradient(circle at 30% 30%, rgba(245, 200, 66, 0.30) 0%, transparent 70%),
        linear-gradient(135deg, rgba(245, 200, 66, 0.14), rgba(245, 200, 66, 0.04));
    border: 1px solid rgba(245, 200, 66, 0.32);
    color: #F5C842;
    box-shadow: inset 0 1px 0 rgba(255, 250, 236, 0.20), 0 4px 12px rgba(245, 200, 66, 0.16);
    margin-bottom: 4px;
}
body.vk .v-hero__stats--strip .v-hero__stat:hover .v-hero__stat-icon {
    transform: scale(1.06);
    transition: transform .3s ease;
}

/* Number + label */
body.vk .v-hero__stats--strip .v-hero__stat-num {
    display: inline-block;
    font-family: var(--vk-font-en-display);
    font-weight: 700;
    font-size: clamp(20px, 2.4vw, 26px);
    line-height: 1.4;
    padding: 4px 4px 2px;
    overflow: visible;
    white-space: nowrap;
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #E8B86C 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    letter-spacing: -0.02em;
    text-align: center;
}
body.vk .v-hero__stats--strip .v-hero__stat-num small {
    font-size: 0.6em;
    vertical-align: super;
    line-height: 1;
}
body.vk .v-hero__stats--strip .v-hero__stat-lbl {
    display: block;
    margin-top: 2px;
    font-size: 10.5px;
    color: rgba(232, 220, 180, 0.65);
    text-transform: uppercase;
    letter-spacing: 0.10em;
    line-height: 1.45;
    padding-top: 1px;
    text-align: center;
}

@media (max-width: 720px) {
    body.vk .v-hero__stats--strip { grid-template-columns: 1fr 1fr; gap: 8px; padding: 6px; }
    body.vk .v-hero__stats--strip .v-hero__stat { padding: 14px 8px; }
}
@media (max-width: 380px) {
    body.vk .v-hero__stats--strip { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    body.vk .v-hero__stats--strip::before { animation: none; }
}

/* ============================================================
   RESPONSIVE — collapse to single column under 920px
   ============================================================ */
@media (max-width: 920px) {
    body.vk .v-hero__preview { transform: none; max-width: 100%; }
    body.vk .v-hero__seal { width: 64px; height: 64px; top: -16px; right: -10px; }
}

/* Animated background extras */
body.vk .v-hero__rays {
    position: absolute; inset: -10%;
    background:
        conic-gradient(from 90deg at 50% 110%,
            transparent 0deg,
            rgba(63, 179, 120, 0.12) 30deg,
            transparent 60deg,
            rgba(232, 216, 156, 0.10) 90deg,
            transparent 120deg,
            rgba(200, 16, 46, 0.08) 150deg,
            transparent 180deg);
    opacity: 0.55;
    mix-blend-mode: screen;
    pointer-events: none;
    animation: v-rays-drift 36s linear infinite;
}
@keyframes v-rays-drift {
    0%   { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

body.vk .v-hero__beam {
    position: absolute; top: -20%; left: 50%;
    width: 2px; height: 60%;
    background: linear-gradient(to bottom, transparent, rgba(232, 216, 156, 0.5), transparent);
    transform: translateX(-50%);
    filter: blur(2px);
    opacity: 0.6;
    animation: v-beam-sweep 8s ease-in-out infinite;
    pointer-events: none;
}
@keyframes v-beam-sweep {
    0%, 100% { transform: translateX(-50%) rotate(-15deg); opacity: 0.3; }
    50%      { transform: translateX(-50%) rotate(15deg);  opacity: 0.7; }
}

body.vk .v-hero__particles { position: absolute; inset: 0; pointer-events: none; }
body.vk .v-hero__particles span {
    position: absolute;
    width: 4px; height: 4px;
    border-radius: 50%;
    background: var(--vk-cream-2);
    box-shadow: 0 0 12px rgba(232, 216, 156, 0.6);
    opacity: 0;
    animation: v-particle-float 9s ease-in-out infinite;
}
body.vk .v-hero__particles span:nth-child(1) { left: 10%; top: 80%; animation-delay: 0s; }
body.vk .v-hero__particles span:nth-child(2) { left: 25%; top: 65%; animation-delay: 1.2s; background: var(--vk-green-2); box-shadow: 0 0 12px rgba(63, 179, 120, 0.6); }
body.vk .v-hero__particles span:nth-child(3) { left: 45%; top: 75%; animation-delay: 2.4s; }
body.vk .v-hero__particles span:nth-child(4) { left: 65%; top: 60%; animation-delay: 3.6s; background: var(--vk-green-2); box-shadow: 0 0 12px rgba(63, 179, 120, 0.6); }
body.vk .v-hero__particles span:nth-child(5) { left: 88%; top: 70%; animation-delay: 4.8s; }
body.vk .v-hero__particles span:nth-child(6) { left: 35%; top: 85%; animation-delay: 6.0s; background: var(--vk-red-2); box-shadow: 0 0 12px rgba(230, 57, 70, 0.6); }
body.vk .v-hero__particles span:nth-child(7) { left: 60%; top: 90%; animation-delay: 1.8s; }
body.vk .v-hero__particles span:nth-child(8) { left: 78%; top: 55%; animation-delay: 3.0s; background: var(--vk-green-2); box-shadow: 0 0 12px rgba(63, 179, 120, 0.6); }
@keyframes v-particle-float {
    0%   { opacity: 0; transform: translateY(0) scale(0.4); }
    20%  { opacity: 1; transform: translateY(-30px) scale(1); }
    80%  { opacity: 1; transform: translateY(-120px) scale(1); }
    100% { opacity: 0; transform: translateY(-160px) scale(0.4); }
}

/* Trust strip */
body.vk .v-hero__trust {
    display: inline-flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
    justify-content: center;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.08em;
    color: var(--vk-text-dim);
    margin-bottom: 4px;
}
body.vk .v-hero__trust span { display: inline-flex; align-items: center; gap: 6px; }
body.vk .v-hero__trust span:nth-child(1) svg { color: var(--vk-green-2); }
body.vk .v-hero__trust span:nth-child(2) svg { color: var(--vk-cream-2); }
body.vk .v-hero__trust span:nth-child(3) svg { color: #FFB347; }
body.vk .v-hero__trust span:nth-child(4) svg { color: #4FBDEF; }

/* Premium pill — frosted with shimmer sweep */
body.vk .v-hero__pill--premium {
    position: relative;
    overflow: hidden;
    padding: 6px 14px;
    font-size: 11px;
    background: linear-gradient(135deg, rgba(63, 179, 120, 0.14) 0%, rgba(232, 216, 156, 0.08) 100%);
    border: 1px solid rgba(232, 216, 156, 0.30);
    color: var(--vk-cream);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.10),
        0 8px 24px rgba(0, 12, 6, 0.45);
}
body.vk .v-hero__pill--premium:lang(bn) { font-size: 12px; }
body.vk .v-hero__pill-shine {
    position: absolute;
    top: 0; left: -60%;
    width: 50%; height: 100%;
    background: linear-gradient(105deg, transparent 0%, rgba(255, 255, 255, 0.18) 50%, transparent 100%);
    animation: v-pill-shine 4.5s ease-in-out infinite;
    pointer-events: none;
}
@keyframes v-pill-shine {
    0%, 100% { left: -60%; }
    50%      { left: 160%; }
}

/* Title — line-by-line reveal with shimmer brand */
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__title {
    font-size: clamp(32px, 4.8vw, 60px);
    line-height: 1.02;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}
body.vk .v-hero__title-line {
    display: block;
    opacity: 0;
    transform: translateY(18px);
    animation: v-line-up 0.8s cubic-bezier(0.2, 0.7, 0.2, 1) forwards;
}
body.vk .v-hero__title-line:nth-child(1) { animation-delay: 0.20s; }
body.vk .v-hero__title-line:nth-child(2) { animation-delay: 0.35s; }
body.vk .v-hero__title-line:nth-child(3) { animation-delay: 0.50s; }
@keyframes v-line-up { to { opacity: 1; transform: translateY(0); } }

body.vk .v-hero__title-line--brand strong {
    background: linear-gradient(110deg,
        #FBF6E0 0%, #E8D89C 25%, #3FB378 50%, #E8D89C 75%, #FBF6E0 100%);
    background-size: 220% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    animation: v-text-shimmer 7s linear infinite;
    text-shadow: 0 4px 32px rgba(232, 216, 156, 0.20);
}
@keyframes v-text-shimmer {
    0%   { background-position: 220% 50%; }
    100% { background-position: -120% 50%; }
}

/* Decorative animated divider */
body.vk .v-hero__divider {
    position: relative;
    width: 200px; height: 1px;
    margin: 6px auto;
    background: linear-gradient(90deg, transparent, rgba(232, 216, 156, 0.55), transparent);
}
body.vk .v-hero__divider-dot {
    position: absolute;
    left: 50%; top: 50%;
    width: 9px; height: 9px;
    transform: translate(-50%, -50%) rotate(45deg);
    background: linear-gradient(135deg, var(--vk-cream-2), var(--vk-green-2));
    box-shadow: 0 0 18px rgba(232, 216, 156, 0.7);
    animation: v-dot-pulse 2.4s ease-in-out infinite;
}
@keyframes v-dot-pulse {
    0%, 100% { transform: translate(-50%, -50%) rotate(45deg) scale(1);   box-shadow: 0 0 14px rgba(232, 216, 156, 0.5); }
    50%      { transform: translate(-50%, -50%) rotate(225deg) scale(1.3); box-shadow: 0 0 24px rgba(63, 179, 120, 0.7); }
}

/* Lead */
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__lead {
    font-size: clamp(12px, 1.05vw, 14.5px);
    line-height: 1.7;
    max-width: 60ch;
    color: var(--vk-text-mid);
}

/* CTA spacing */
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__cta { gap: 12px; margin-top: 6px; }

/* Stats card — animated conic gradient border */
body.vk .v-hero__stats--premium {
    position: relative;
    margin-top: 14px;
    max-width: 780px;
    border: none;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.01) 100%),
        rgba(8, 22, 14, 0.78);
    box-shadow: 0 24px 64px rgba(0, 12, 6, 0.55);
}
body.vk .v-hero__stats--premium::before {
    content: '';
    position: absolute; inset: 0;
    border-radius: inherit;
    padding: 1px;
    background: conic-gradient(from 0deg,
        rgba(63, 179, 120, 0.55) 0%,
        rgba(232, 216, 156, 0.55) 25%,
        rgba(200, 16, 46, 0.55) 50%,
        rgba(232, 216, 156, 0.55) 75%,
        rgba(63, 179, 120, 0.55) 100%);
    -webkit-mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);
    -webkit-mask-composite: xor;
            mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);
            mask-composite: exclude;
    animation: v-conic-spin 10s linear infinite;
    pointer-events: none;
}
@keyframes v-conic-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
body.vk .v-hero__stats--premium .v-hero__stat {
    padding: 14px 12px;
    transition: background .3s ease, transform .3s ease;
}
body.vk .v-hero__stats--premium .v-hero__stat:hover {
    background: rgba(63, 179, 120, 0.06);
}
body.vk .v-hero__stats--premium .v-hero__stat-num {
    font-size: clamp(20px, 2.4vw, 30px);
    line-height: 1.25;
    padding-top: 3px;
    overflow: visible;
    transition: transform .3s ease;
}
body.vk .v-hero__stats--premium .v-hero__stat:hover .v-hero__stat-num {
    transform: scale(1.06);
}
body.vk .v-hero__stats--premium .v-hero__stat-lbl {
    margin-top: 4px;
    font-size: 10px;
    letter-spacing: 0.10em;
}

/* Scroll indicator */
body.vk .v-hero__scroll {
    margin-top: 18px;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    color: var(--vk-text-dim);
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.18em;
}
body.vk .v-hero__scroll-mouse {
    width: 20px; height: 32px;
    border: 1px solid rgba(232, 216, 156, 0.45);
    border-radius: 11px;
    position: relative;
    box-shadow: 0 0 16px rgba(232, 216, 156, 0.10);
}
body.vk .v-hero__scroll-wheel {
    position: absolute;
    top: 6px; left: 50%;
    width: 3px; height: 7px;
    transform: translateX(-50%);
    background: var(--vk-cream-2);
    border-radius: 2px;
    animation: v-scroll-wheel 1.8s ease-in-out infinite;
}
@keyframes v-scroll-wheel {
    0%, 100% { transform: translate(-50%, 0);    opacity: 1; }
    60%      { transform: translate(-50%, 12px); opacity: 0.2; }
    100%     { transform: translate(-50%, 0);    opacity: 1; }
}

/* Premium button — extra glow, ripple-on-hover */
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red {
    position: relative;
    overflow: hidden;
}
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red::after {
    content: '';
    position: absolute; top: 50%; left: 50%;
    width: 0; height: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.18);
    transform: translate(-50%, -50%);
    transition: width .55s ease, height .55s ease;
    pointer-events: none;
}
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red:hover::after {
    width: 320px; height: 320px;
}

/* ============================================================
   PREMIUM HERO — MIDNIGHT + CHAMPAGNE GOLD palette (scoped)
   Site-wide green stays; only the hero is recolored to a luxe scheme.
   ============================================================ */

/* Hero base — deep midnight navy gradient */
body.vk :is(.v-hero--premium, .v-hero--split) {
    position: relative;
    background:
        radial-gradient(60% 70% at 18% 22%, rgba(245, 200, 66, 0.14) 0%, transparent 60%),
        radial-gradient(50% 60% at 82% 78%, rgba(230, 57, 70, 0.10) 0%, transparent 65%),
        radial-gradient(55% 65% at 50% 100%, rgba(79, 189, 239, 0.08) 0%, transparent 60%),
        linear-gradient(180deg, #0A1628 0%, #060E1C 60%, #03070F 100%);
}

/* Recolor existing orbs to gold/crimson/cyan — overrides green */
body.vk :is(.v-hero--premium, .v-hero--split) .vk-orb--a { background: radial-gradient(circle, #F5C842 0%, transparent 65%); opacity: .42; }
body.vk :is(.v-hero--premium, .v-hero--split) .vk-orb--b { background: radial-gradient(circle, #E63946 0%, transparent 65%); opacity: .35; }
body.vk :is(.v-hero--premium, .v-hero--split) .vk-orb--c { background: radial-gradient(circle, #4FBDEF 0%, transparent 65%); opacity: .28; }

/* Recolor grid lines to gold */
body.vk :is(.v-hero--premium, .v-hero--split) .vk-grid {
    background-image:
        linear-gradient(rgba(245, 200, 66, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(245, 200, 66, 0.05) 1px, transparent 1px);
}

/* Recolor rays to warm gold + crimson */
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__rays {
    background:
        conic-gradient(from 90deg at 50% 110%,
            transparent 0deg,
            rgba(245, 200, 66, 0.16) 30deg,
            transparent 60deg,
            rgba(255, 250, 236, 0.10) 90deg,
            transparent 120deg,
            rgba(230, 57, 70, 0.10) 150deg,
            transparent 180deg);
    opacity: 0.6;
}

/* Recolor beam */
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__beam {
    background: linear-gradient(to bottom, transparent, rgba(255, 232, 159, 0.6), transparent);
}

/* Recolor particles — gold/crimson/cyan instead of green */
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__particles span:nth-child(1),
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__particles span:nth-child(3),
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__particles span:nth-child(5),
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__particles span:nth-child(7) {
    background: #FFE89F;
    box-shadow: 0 0 12px rgba(255, 232, 159, 0.7);
}
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__particles span:nth-child(2),
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__particles span:nth-child(4),
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__particles span:nth-child(8) {
    background: #F5C842;
    box-shadow: 0 0 14px rgba(245, 200, 66, 0.7);
}
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__particles span:nth-child(6) {
    background: #E63946;
    box-shadow: 0 0 14px rgba(230, 57, 70, 0.7);
}

/* Trust strip — gold + cyan icon palette */
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__trust { color: rgba(232, 220, 180, 0.65); }
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__trust span:nth-child(1) svg { color: #F5C842; }
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__trust span:nth-child(2) svg { color: #FFE89F; }
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__trust span:nth-child(3) svg { color: #FFB347; }
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__trust span:nth-child(4) svg { color: #4FBDEF; }

/* Pill — champagne gold frosted glass */
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__pill--premium {
    background: linear-gradient(135deg, rgba(245, 200, 66, 0.16) 0%, rgba(255, 250, 236, 0.06) 100%);
    border: 1px solid rgba(245, 200, 66, 0.45);
    color: #FFE89F;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.12),
        0 8px 24px rgba(245, 200, 66, 0.12),
        0 12px 32px rgba(0, 0, 0, 0.45);
}
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__pill-dot {
    background: #F5C842;
    box-shadow: 0 0 0 0 rgba(245, 200, 66, 0.75);
    animation: v-pulse-gold 1.8s ease-in-out infinite;
}
@keyframes v-pulse-gold {
    0%, 100% { box-shadow: 0 0 0 0 rgba(245, 200, 66, 0.75); }
    50%      { box-shadow: 0 0 0 10px rgba(245, 200, 66, 0); }
}

/* Title — pure gold shimmer (no green tint) */
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__title-line--brand strong {
    background: linear-gradient(110deg,
        #FFFAEC 0%, #F5C842 25%, #FFE89F 50%, #F5C842 75%, #FFFAEC 100%);
    background-size: 220% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 4px 32px rgba(245, 200, 66, 0.30);
}
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__title em {
    color: #F5C842;
    font-style: normal;
    text-shadow: 0 2px 18px rgba(245, 200, 66, 0.35);
}
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__title { color: #F5F1E6; }

/* Divider — gold */
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__divider {
    background: linear-gradient(90deg, transparent, rgba(245, 200, 66, 0.55), transparent);
}
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__divider-dot {
    background: linear-gradient(135deg, #F5C842, #FFFAEC);
    box-shadow: 0 0 18px rgba(245, 200, 66, 0.7);
}

/* Lead */
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__lead { color: rgba(232, 220, 180, 0.78); }
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__lead strong { color: #FFE89F; }

/* Stats card — midnight glass with champagne conic border + 3D tilt */
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__stats--premium {
    background:
        linear-gradient(180deg, rgba(13, 24, 48, 0.75) 0%, rgba(7, 14, 28, 0.92) 100%);
    border-radius: 16px;
    transform: perspective(1400px) rotateX(3deg);
    transition: transform .55s cubic-bezier(.2,.7,.15,1), box-shadow .4s ease;
    box-shadow:
        0 28px 70px rgba(0, 0, 0, 0.55),
        0 0 40px rgba(245, 200, 66, 0.06);
}
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__stats--premium:hover {
    transform: perspective(1400px) rotateX(0deg) translateY(-4px);
    box-shadow:
        0 36px 90px rgba(0, 0, 0, 0.65),
        0 0 60px rgba(245, 200, 66, 0.18);
}
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__stats--premium::before {
    background: conic-gradient(from 0deg,
        rgba(245, 200, 66, 0.65) 0%,
        rgba(255, 250, 236, 0.55) 25%,
        rgba(230, 57, 70, 0.55) 50%,
        rgba(79, 189, 239, 0.50) 75%,
        rgba(245, 200, 66, 0.65) 100%);
}
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__stat {
    border-right-color: rgba(245, 200, 66, 0.18);
}
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__stat-num {
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #E8B86C 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__stat-lbl { color: rgba(232, 220, 180, 0.55); }

/* Corner ornaments — premium gold L-brackets with glow dot */
body.vk .v-hero__corner {
    position: absolute;
    width: 56px; height: 56px;
    pointer-events: none;
    z-index: 1;
    opacity: 0;
    animation: v-corner-fade 1.2s ease 0.6s forwards;
}
@keyframes v-corner-fade { to { opacity: 1; } }
body.vk .v-hero__corner--tl { top: clamp(16px, 2vw, 28px); left: clamp(16px, 2vw, 28px);
    border-top: 1.5px solid rgba(245, 200, 66, 0.55); border-left: 1.5px solid rgba(245, 200, 66, 0.55); }
body.vk .v-hero__corner--tr { top: clamp(16px, 2vw, 28px); right: clamp(16px, 2vw, 28px);
    border-top: 1.5px solid rgba(245, 200, 66, 0.55); border-right: 1.5px solid rgba(245, 200, 66, 0.55); }
body.vk .v-hero__corner--bl { bottom: clamp(16px, 2vw, 28px); left: clamp(16px, 2vw, 28px);
    border-bottom: 1.5px solid rgba(245, 200, 66, 0.55); border-left: 1.5px solid rgba(245, 200, 66, 0.55); }
body.vk .v-hero__corner--br { bottom: clamp(16px, 2vw, 28px); right: clamp(16px, 2vw, 28px);
    border-bottom: 1.5px solid rgba(245, 200, 66, 0.55); border-right: 1.5px solid rgba(245, 200, 66, 0.55); }
body.vk .v-hero__corner::before {
    content: ''; position: absolute;
    width: 7px; height: 7px;
    background: #F5C842;
    border-radius: 50%;
    box-shadow: 0 0 14px rgba(245, 200, 66, 0.85);
    animation: v-corner-glow 2.4s ease-in-out infinite;
}
body.vk .v-hero__corner--tl::before { top: -4px; left: -4px; }
body.vk .v-hero__corner--tr::before { top: -4px; right: -4px; }
body.vk .v-hero__corner--bl::before { bottom: -4px; left: -4px; }
body.vk .v-hero__corner--br::before { bottom: -4px; right: -4px; }
@keyframes v-corner-glow {
    0%, 100% { box-shadow: 0 0 10px rgba(245, 200, 66, 0.6); transform: scale(1); }
    50%      { box-shadow: 0 0 22px rgba(245, 200, 66, 1);   transform: scale(1.25); }
}
@media (max-width: 720px) {
    body.vk .v-hero__corner { width: 36px; height: 36px; }
}

/* ============================================================
   PAYMENT PARTNERS — premium card matching the stats strip
   ============================================================ */
body.vk .v-hero__partners {
    position: relative;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 18px;
    width: 100%;
    margin: 0;
    padding: 14px 18px;
    border-radius: 18px;
    border: 1px solid rgba(245, 200, 66, 0.22);
    background:
        radial-gradient(70% 100% at 50% 100%, rgba(245, 200, 66, 0.06) 0%, transparent 60%),
        linear-gradient(180deg, rgba(13, 24, 48, 0.85) 0%, rgba(5, 12, 26, 0.96) 100%);
    box-shadow:
        0 20px 56px rgba(0, 0, 0, 0.55),
        0 0 32px rgba(245, 200, 66, 0.05),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
    overflow: hidden;
}

/* Animated gold sweep along the bottom edge */
body.vk .v-hero__partners::before {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(245, 200, 66, 0.55) 30%,
        rgba(255, 250, 236, 0.85) 50%,
        rgba(245, 200, 66, 0.55) 70%,
        transparent 100%);
    background-size: 200% 100%;
    animation: v-strip-sweep 4s linear infinite;
    animation-direction: reverse;
    opacity: 0.65;
    pointer-events: none;
}

/* Label column with vertical separator */
body.vk .v-hero__partners-label {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 6px 16px 6px 0;
    margin-right: 2px;
    font-size: 10.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: #FFE89F;
    white-space: nowrap;
}
body.vk .v-hero__partners-label::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #F5C842;
    box-shadow: 0 0 10px rgba(245, 200, 66, 0.7);
    animation: v-pulse-gold 2s ease-in-out infinite;
}
body.vk .v-hero__partners-label::after {
    content: '';
    position: absolute;
    right: 0; top: 50%;
    transform: translateY(-50%);
    width: 1px; height: 24px;
    background: linear-gradient(to bottom, transparent, rgba(245, 200, 66, 0.40), transparent);
}

/* Partner badges row */
body.vk .v-hero__partners-track {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
}

/* Premium partner badges — pill cards with brand-color hover glow */
body.vk .v-hero__partner {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: 10px;
    font-family: var(--vk-font-en);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.02em;
    line-height: 1.2;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.01) 100%),
        rgba(8, 18, 32, 0.55);
    border: 1px solid rgba(245, 200, 66, 0.18);
    color: #FFE89F;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.06),
        0 4px 12px rgba(0, 0, 0, 0.30);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    transition: transform .3s cubic-bezier(.2,.7,.15,1),
                border-color .3s ease,
                box-shadow .3s ease,
                background .3s ease;
    cursor: default;
}
body.vk .v-hero__partner::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: currentColor;
    box-shadow: 0 0 8px currentColor;
    opacity: 0.85;
    flex-shrink: 0;
}
body.vk .v-hero__partner:hover {
    transform: translateY(-3px);
    border-color: currentColor;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.02) 100%),
        rgba(8, 18, 32, 0.65);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.10),
        0 8px 22px rgba(0, 0, 0, 0.45),
        0 0 24px currentColor;
}

/* Per-brand colors (dot + glow inherits from currentColor) */
body.vk .v-hero__partner--bkash  { color: #E2136E; }
body.vk .v-hero__partner--nagad  { color: #FF6A1F; }
body.vk .v-hero__partner--rocket { color: #B57BD6; }
body.vk .v-hero__partner--bank   { color: #4FBDEF; }
body.vk .v-hero__partner--mc     { color: #FF5F00; }

/* Visa is special — white card with navy text (real card aesthetic) */
body.vk .v-hero__partner--visa {
    color: #1A1F71;
    background: linear-gradient(180deg, #FFFFFF 0%, #F5F1E6 100%);
    border-color: rgba(245, 200, 66, 0.45);
}
body.vk .v-hero__partner--visa::before { background: #1A1F71; box-shadow: 0 0 8px rgba(26, 31, 113, 0.5); }
body.vk .v-hero__partner--visa:hover {
    background: #FFFFFF;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.6),
        0 8px 22px rgba(0, 0, 0, 0.45),
        0 0 24px rgba(26, 31, 113, 0.5);
}

@media (max-width: 720px) {
    body.vk .v-hero__partners {
        grid-template-columns: 1fr;
        gap: 12px;
        padding: 14px;
        text-align: center;
    }
    body.vk .v-hero__partners-label { justify-content: center; padding: 0; margin: 0; }
    body.vk .v-hero__partners-label::after { display: none; }
    body.vk .v-hero__partners-track { justify-content: center; }
}

/* Scroll indicator — gold */
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__scroll { color: rgba(232, 220, 180, 0.55); }
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__scroll-mouse {
    border-color: rgba(245, 200, 66, 0.55);
    box-shadow: 0 0 16px rgba(245, 200, 66, 0.18);
}
body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__scroll-wheel { background: #F5C842; }

/* Buttons inside the premium hero — subtle gold rim accent on top of red */
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red {
    box-shadow:
        0 0 0 1px rgba(245, 200, 66, 0.30) inset,
        0 14px 36px rgba(200, 16, 46, 0.45),
        0 0 32px rgba(245, 200, 66, 0.14);
}
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red:hover {
    box-shadow:
        0 0 0 1px rgba(245, 200, 66, 0.55) inset,
        0 22px 56px rgba(200, 16, 46, 0.60),
        0 0 48px rgba(245, 200, 66, 0.28);
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
    body.vk .v-hero__rays,
    body.vk .v-hero__beam,
    body.vk .v-hero__particles span,
    body.vk .v-hero__pill-shine,
    body.vk .v-hero__pill-dot,
    body.vk .v-hero__title-line--brand strong,
    body.vk .v-hero__divider-dot,
    body.vk .v-hero__stats--premium::before,
    body.vk .v-hero__scroll-wheel,
    body.vk .v-hero__corner,
    body.vk .v-hero__corner::before { animation: none !important; }
    body.vk .v-hero__title-line { opacity: 1; transform: none; }
    body.vk :is(.v-hero--premium, .v-hero--split) .v-hero__stats--premium { transform: none; }
}

/* ============================================================
   25. SPLIT HERO — spacing fixes, Bengali-safe line-heights, premium buttons
   ============================================================ */

/* Title — give Bengali matras (ী, ি, ৃ, reph) breathing room
   line-height: 1.04 was clipping diacritics; bump to 1.18 + padding-top */
body.vk .v-hero--split .v-hero__title {
    line-height: 1.18;
    padding-top: 0.08em;
    margin-bottom: 4px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
body.vk .v-hero--split .v-hero__title-line {
    line-height: 1.18;
    padding: 0.04em 0;
    overflow: visible;
}
body.vk .v-hero--split .v-hero__title-line--brand {
    line-height: 1.22; /* shimmer text needs extra room */
    padding: 0.06em 0 0.04em;
}
body.vk .v-hero--split .v-hero__title em {
    line-height: 1.22;
    padding: 0 0.05em;
}

/* Lead — looser line-height for matras */
body.vk .v-hero--split .v-hero__lead {
    line-height: 1.78;
}

/* Pill — small breathing top/bottom, prevent text touching border */
body.vk .v-hero--split .v-hero__pill--premium {
    padding: 7px 16px;
    line-height: 1.4;
    margin-bottom: 4px;
}

/* Copy column — increase gap between major elements */
body.vk .v-hero__copy { gap: 18px; }

/* Preview card — tighten spacing internally, extra padding-bottom for seal */
body.vk .v-hero__preview {
    padding: 22px 22px 18px;
}
body.vk .v-hero__preview-head {
    padding-bottom: 16px;
    margin-bottom: 14px;
}
body.vk .v-hero__agents { gap: 10px; }
body.vk .v-hero__agent { padding: 11px 13px; gap: 14px; }
body.vk .v-hero__agent-body strong { line-height: 1.35; padding-top: 2px; }
body.vk .v-hero__agent-body em { line-height: 1.4; margin-top: 2px; }

/* Seal — pull slightly more inside so it doesn't get clipped */
body.vk .v-hero__seal { top: -18px; right: -10px; }

/* Stats strip — protect Bengali matras (top diacritics) + descenders.
   Gradient text with -webkit-text-fill-color:transparent clips outside
   line-box, so we need: tall line-height + vertical padding + display:inline-block + visible overflow. */
body.vk .v-hero__stats--strip .v-hero__stat { padding: 18px 14px; }
body.vk .v-hero__stats--strip .v-hero__stat-num {
    display: inline-block;
    line-height: 1.45;
    padding: 6px 4px 6px;
    overflow: visible;
    text-overflow: clip;
    white-space: nowrap;
    vertical-align: baseline;
}
body.vk .v-hero__stats--strip .v-hero__stat-num small {
    font-size: 0.55em;
    line-height: 1;
    vertical-align: super;
}
body.vk .v-hero__stats--strip .v-hero__stat-lbl {
    margin-top: 6px;
    line-height: 1.45;
    padding-top: 2px;
}

/* Bottom strip — internal gap between stats card & partners card */
body.vk .v-hero--split .v-hero__bottom > * + * { margin-top: 4px; }
body.vk .v-hero__partners-track { gap: 10px; }
body.vk .v-hero__partner-card-spacing { /* placeholder kept for clarity */ }

/* Chips — give them space so they don't crowd the CTAs */
body.vk .v-hero__chips { gap: 10px; margin: 4px 0 0; }
body.vk .v-hero__chips li { padding: 6px 12px; line-height: 1.4; }

/* Hero CTA gap larger so buttons breathe */
body.vk .v-hero--split .v-hero__cta { gap: 14px; margin-top: 8px; }

/* ============================================================
   26. PREMIUM BUTTON — luxury red with gold-rim halo & sweep
   Applies to vk-btn--red used inside the split hero. Subtler
   variant for the rest of the site keeps the existing red look.
   ============================================================ */
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red,
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--xl.vk-btn--red {
    position: relative;
    overflow: hidden;
    padding: 14px 26px;
    border-radius: 14px;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0.015em;
    color: #FFFAEC;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.10) 0%, transparent 35%),
        linear-gradient(135deg, #F26B7E 0%, #E63946 35%, #C8102E 70%, #8B0F1F 100%);
    border: 1px solid rgba(255, 232, 159, 0.45);
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.28),
        inset 0 0 0 1px rgba(245, 200, 66, 0.22),
        0 1px 0 rgba(0, 0, 0, 0.35),
        0 14px 30px rgba(200, 16, 46, 0.45),
        0 0 36px rgba(245, 200, 66, 0.14);
    transition:
        transform .35s cubic-bezier(.2,.7,.15,1),
        box-shadow .35s ease,
        gap .25s ease;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red svg { transition: transform .3s ease; }
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red:hover {
    transform: translateY(-2px);
    gap: 14px;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.40),
        inset 0 0 0 1px rgba(245, 200, 66, 0.55),
        0 1px 0 rgba(0, 0, 0, 0.45),
        0 22px 48px rgba(200, 16, 46, 0.65),
        0 0 60px rgba(245, 200, 66, 0.30);
}
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red:hover svg { transform: translateX(3px); }
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red:active {
    transform: translateY(0);
}

/* Animated gold sheen sweep across the button */
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red::before {
    content: '';
    position: absolute;
    top: 0; left: -75%;
    width: 50%; height: 100%;
    background: linear-gradient(105deg,
        transparent 0%,
        rgba(255, 232, 159, 0.22) 50%,
        transparent 100%);
    transform: skewX(-18deg);
    animation: v-btn-sweep 4.5s ease-in-out infinite;
    pointer-events: none;
}
@keyframes v-btn-sweep {
    0%, 100% { left: -75%; }
    55%      { left: 145%; }
}

/* Soft gold halo behind button on hover */
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red::after {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    background: linear-gradient(135deg, rgba(245, 200, 66, 0.0), rgba(245, 200, 66, 0.45), rgba(255, 250, 236, 0.35));
    z-index: -1;
    opacity: 0;
    filter: blur(12px);
    transition: opacity .35s ease;
    pointer-events: none;
}
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red:hover::after { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
    body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red::before { animation: none; }
}

/* ============================================================
   27. CHAT PREVIEW — WhatsApp-style demo (replaces agent list)
   ============================================================ */
body.vk .v-hero__preview--chat { padding: 0; overflow: hidden; }

/* Chat header — sticky-like top bar, WhatsApp dark green accent */
body.vk .v-hero__chat-head {
    display: grid;
    grid-template-columns: 40px 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    background: linear-gradient(180deg, rgba(7, 60, 39, 0.65) 0%, rgba(5, 40, 28, 0.85) 100%);
    border-bottom: 1px solid rgba(245, 200, 66, 0.16);
    border-radius: 20px 20px 0 0;
}
body.vk .v-hero__chat-avatar {
    width: 40px; height: 40px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
    color: #fff;
    border: 1.5px solid rgba(255, 255, 255, 0.25);
    box-shadow: 0 4px 14px rgba(37, 211, 102, 0.45);
}
body.vk .v-hero__chat-meta { display: flex; flex-direction: column; min-width: 0; }
body.vk .v-hero__chat-meta strong {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 13px; font-weight: 700;
    color: #FFFAEC;
    line-height: 1.35;
    padding-top: 2px;
}
body.vk .v-hero__chat-meta strong svg { color: #4FBDEF; }
body.vk .v-hero__chat-meta em {
    display: inline-flex; align-items: center; gap: 6px;
    font-style: normal;
    font-size: 10.5px;
    color: rgba(110, 231, 174, 0.85);
    margin-top: 1px;
    line-height: 1.4;
}
body.vk .v-hero__chat-encrypted {
    display: inline-flex; align-items: center; gap: 4px;
    padding: 3px 8px;
    background: rgba(245, 200, 66, 0.10);
    border: 1px solid rgba(245, 200, 66, 0.30);
    border-radius: 999px;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.10em;
    color: #FFE89F;
}

/* Chat body — WhatsApp-like patterned background */
body.vk .v-hero__chat-body {
    padding: 16px 14px 12px;
    background:
        radial-gradient(circle at 20% 30%, rgba(63, 179, 120, 0.04) 0%, transparent 40%),
        radial-gradient(circle at 80% 70%, rgba(245, 200, 66, 0.03) 0%, transparent 40%),
        linear-gradient(180deg, rgba(8, 24, 14, 0.6) 0%, rgba(5, 16, 10, 0.7) 100%);
    display: flex; flex-direction: column; gap: 8px;
    min-height: 220px;
}

/* Chat bubbles — animated reveal */
body.vk .v-hero__chat-bubble {
    max-width: 78%;
    padding: 9px 13px 7px;
    border-radius: 12px;
    font-size: 12.5px;
    line-height: 1.5;
    color: #F5F1E6;
    position: relative;
    opacity: 0;
    transform: translateY(8px);
    animation: v-chat-in .55s cubic-bezier(.2,.7,.15,1) forwards;
    animation-delay: calc(var(--i, 1) * 0.4s + 0.6s);
}
@keyframes v-chat-in { to { opacity: 1; transform: translateY(0); } }
body.vk .v-hero__chat-bubble p { margin: 0; padding-top: 1px; }
body.vk .v-hero__chat-bubble p strong { color: #FFE89F; font-weight: 700; }

/* Incoming (left, dark gray) */
body.vk .v-hero__chat-bubble--in {
    align-self: flex-start;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-bottom-left-radius: 4px;
}

/* Outgoing (right, WhatsApp green tint) */
body.vk .v-hero__chat-bubble--out {
    align-self: flex-end;
    background: linear-gradient(135deg, rgba(37, 211, 102, 0.22) 0%, rgba(18, 140, 126, 0.18) 100%);
    border: 1px solid rgba(37, 211, 102, 0.32);
    border-bottom-right-radius: 4px;
}

body.vk .v-hero__chat-time {
    display: inline-flex; align-items: center; gap: 4px;
    margin-top: 3px;
    font-size: 9.5px;
    font-family: var(--vk-font-en);
    color: rgba(232, 220, 180, 0.55);
    line-height: 1;
}
body.vk .v-hero__chat-bubble--out .v-hero__chat-time { color: rgba(110, 231, 174, 0.85); }
body.vk .v-hero__chat-time svg { color: #4FBDEF; }

/* Typing indicator — 3 bouncing dots */
body.vk .v-hero__chat-typing {
    align-self: flex-start;
    display: inline-flex; align-items: center; gap: 4px;
    padding: 9px 13px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    border-bottom-left-radius: 4px;
    opacity: 0;
    animation: v-chat-in .5s ease 2.6s forwards;
}
body.vk .v-hero__chat-typing span {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: rgba(232, 220, 180, 0.55);
    animation: v-typing-dot 1.4s ease-in-out infinite;
}
body.vk .v-hero__chat-typing span:nth-child(2) { animation-delay: 0.2s; }
body.vk .v-hero__chat-typing span:nth-child(3) { animation-delay: 0.4s; }
@keyframes v-typing-dot {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.5; }
    30%           { transform: translateY(-4px); opacity: 1; }
}

/* Chat CTA — WhatsApp green action button */
body.vk .v-hero__chat-cta {
    display: flex; align-items: center; justify-content: center;
    gap: 10px;
    margin: 0;
    padding: 13px 16px;
    background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
    color: #fff;
    font-weight: 800; font-size: 13px;
    letter-spacing: 0.01em;
    border-top: 1px solid rgba(245, 200, 66, 0.20);
    border-radius: 0 0 20px 20px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.30);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.20);
    transition: filter .25s ease, gap .25s ease;
}
body.vk .v-hero__chat-cta:hover { filter: brightness(1.08); gap: 14px; }
body.vk .v-hero__chat-cta svg { color: #fff; }

/* Live dot in header (re-uses existing keyframe) */
body.vk .v-hero__chat-meta .v-hero__live-dot {
    width: 7px; height: 7px;
    background: #6EE7AE;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(110, 231, 174, 0.65);
    animation: v-pulse-live 1.4s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
    body.vk .v-hero__chat-bubble,
    body.vk .v-hero__chat-typing { opacity: 1; transform: none; animation: none; }
    body.vk .v-hero__chat-typing span { animation: none; }
}

/* ============================================================
   28. CHAT PREVIEW v2 — premium WhatsApp product mockup
   Refines header (call icons, presence dot), adds encryption notice,
   date pill, voice message bubble w/ animated waveform, message input bar.
   ============================================================ */

/* Avatar — fix cropping: border-box so 1.5px border fits inside 40px,
   roomy grid cell so the online dot (which sits at bottom/right -1px with a 2.5px ring)
   isn't clipped by the chat-head edge or the preview card's overflow:hidden. */
body.vk .v-hero__chat-avatar {
    position: relative;
    box-sizing: border-box;
    min-width: 40px;
    min-height: 40px;
    flex-shrink: 0;
    overflow: visible;
}
body.vk .v-hero__chat-avatar svg { flex-shrink: 0; display: block; }
body.vk .v-hero__chat-avatar-dot {
    position: absolute;
    bottom: 0; right: 0;
    width: 10px; height: 10px;
    background: #25D366;
    border-radius: 50%;
    border: 2px solid #052812;
    box-sizing: border-box;
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
    animation: v-pulse-live 1.6s ease-in-out infinite;
    z-index: 2;
}

/* Header — slimmer, with call/menu actions on the right.
   Grid column raised to 44px to give avatar (40px + visible online dot) breathing room. */
body.vk .v-hero__chat-head {
    grid-template-columns: 44px 1fr auto;
    gap: 10px;
    padding: 14px 16px;
    background:
        linear-gradient(180deg, rgba(7, 60, 39, 0.78) 0%, rgba(4, 36, 24, 0.92) 100%);
    box-shadow: 0 1px 0 rgba(245, 200, 66, 0.16);
}
body.vk .v-hero__chat-meta em { color: rgba(110, 231, 174, 0.85); }
body.vk .v-hero__chat-actions {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
body.vk .v-hero__chat-icon {
    width: 28px; height: 28px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 8px;
    color: rgba(232, 220, 180, 0.70);
    transition: background .25s ease, color .25s ease;
}
body.vk .v-hero__chat-icon:hover {
    background: rgba(255, 255, 255, 0.06);
    color: #FFE89F;
}
/* Hide the old encryption pill on right of header — replaced by inline notice below */
body.vk .v-hero__preview--chat .v-hero__chat-encrypted { display: none; }

/* Encryption notice (inline gold pill at top of body, like real WhatsApp's amber notice) */
body.vk .v-hero__chat-notice {
    align-self: center;
    display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 12px;
    background: rgba(245, 200, 66, 0.12);
    border: 1px solid rgba(245, 200, 66, 0.25);
    border-radius: 8px;
    font-size: 10.5px;
    color: #FFE89F;
    margin: 0 auto 6px;
    line-height: 1.4;
    text-align: center;
    max-width: 80%;
}
body.vk .v-hero__chat-notice svg { color: #F5C842; flex-shrink: 0; }

/* Date pill separator */
body.vk .v-hero__chat-date {
    align-self: center;
    margin: 4px 0 6px;
}
body.vk .v-hero__chat-date span {
    display: inline-block;
    padding: 4px 14px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 600;
    color: rgba(232, 220, 180, 0.65);
    letter-spacing: 0.04em;
    backdrop-filter: blur(6px);
}

/* Chat body — refined patterned background like real WhatsApp dark theme */
body.vk .v-hero__chat-body {
    padding: 12px 14px 10px;
    background:
        radial-gradient(circle at 12% 18%, rgba(63, 179, 120, 0.05) 0%, transparent 38%),
        radial-gradient(circle at 88% 82%, rgba(245, 200, 66, 0.04) 0%, transparent 40%),
        radial-gradient(circle at 50% 50%, rgba(37, 211, 102, 0.025) 0%, transparent 60%),
        linear-gradient(180deg, rgba(8, 24, 14, 0.65) 0%, rgba(5, 16, 10, 0.78) 100%);
    min-height: 260px;
}

/* Bubbles — premium depth: soft shadow + subtle inner highlight */
body.vk .v-hero__chat-bubble {
    padding: 8px 12px 6px;
    border-radius: 10px;
    font-size: 12.5px;
    line-height: 1.5;
    box-shadow:
        0 1px 1px rgba(0, 0, 0, 0.25),
        0 4px 12px rgba(0, 0, 0, 0.18);
}
body.vk .v-hero__chat-bubble--in {
    background: linear-gradient(180deg, rgba(40, 44, 50, 0.92) 0%, rgba(32, 36, 42, 0.95) 100%);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-bottom-left-radius: 4px;
}
body.vk .v-hero__chat-bubble--out {
    background: linear-gradient(180deg, rgba(0, 95, 60, 0.85) 0%, rgba(0, 70, 45, 0.92) 100%);
    border: 1px solid rgba(37, 211, 102, 0.30);
    border-bottom-right-radius: 4px;
    color: #ECFFF4;
}
body.vk .v-hero__chat-bubble--out p strong { color: #FFE89F; }
body.vk .v-hero__chat-bubble--out .v-hero__chat-time { color: rgba(150, 232, 195, 0.90); }
body.vk .v-hero__chat-bubble--out .v-hero__chat-time svg { color: #4FBDEF; }

/* Voice message bubble */
body.vk .v-hero__chat-bubble--voice {
    display: inline-grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    min-width: 200px;
}
body.vk .v-hero__chat-play {
    width: 26px; height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, #25D366, #128C7E);
    color: #fff;
    border: none;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 3px 8px rgba(37, 211, 102, 0.40);
    transition: transform .25s ease;
    padding-left: 1px;
}
body.vk .v-hero__chat-play:hover { transform: scale(1.08); }

/* Animated waveform — bars with random height + ripple animation */
body.vk .v-hero__chat-wave {
    display: inline-flex; align-items: center;
    gap: 2px;
    height: 22px;
}
body.vk .v-hero__chat-wave i {
    display: inline-block;
    width: 2px;
    background: rgba(150, 232, 195, 0.75);
    border-radius: 999px;
    animation: v-wave-pulse 1.2s ease-in-out infinite;
}
body.vk .v-hero__chat-wave i:nth-child(1)  { height: 6px;  animation-delay: 0.00s; }
body.vk .v-hero__chat-wave i:nth-child(2)  { height: 11px; animation-delay: 0.05s; }
body.vk .v-hero__chat-wave i:nth-child(3)  { height: 14px; animation-delay: 0.10s; }
body.vk .v-hero__chat-wave i:nth-child(4)  { height: 18px; animation-delay: 0.15s; }
body.vk .v-hero__chat-wave i:nth-child(5)  { height: 12px; animation-delay: 0.20s; }
body.vk .v-hero__chat-wave i:nth-child(6)  { height: 8px;  animation-delay: 0.25s; }
body.vk .v-hero__chat-wave i:nth-child(7)  { height: 16px; animation-delay: 0.30s; }
body.vk .v-hero__chat-wave i:nth-child(8)  { height: 20px; animation-delay: 0.35s; }
body.vk .v-hero__chat-wave i:nth-child(9)  { height: 13px; animation-delay: 0.40s; }
body.vk .v-hero__chat-wave i:nth-child(10) { height: 9px;  animation-delay: 0.45s; }
body.vk .v-hero__chat-wave i:nth-child(11) { height: 15px; animation-delay: 0.50s; }
body.vk .v-hero__chat-wave i:nth-child(12) { height: 18px; animation-delay: 0.55s; }
body.vk .v-hero__chat-wave i:nth-child(13) { height: 11px; animation-delay: 0.60s; }
body.vk .v-hero__chat-wave i:nth-child(14) { height: 7px;  animation-delay: 0.65s; }
body.vk .v-hero__chat-wave i:nth-child(15) { height: 14px; animation-delay: 0.70s; }
body.vk .v-hero__chat-wave i:nth-child(16) { height: 10px; animation-delay: 0.75s; }
body.vk .v-hero__chat-wave i:nth-child(17) { height: 17px; animation-delay: 0.80s; }
body.vk .v-hero__chat-wave i:nth-child(18) { height: 13px; animation-delay: 0.85s; }
body.vk .v-hero__chat-wave i:nth-child(19) { height: 8px;  animation-delay: 0.90s; }
body.vk .v-hero__chat-wave i:nth-child(20) { height: 5px;  animation-delay: 0.95s; }
@keyframes v-wave-pulse {
    0%, 100% { opacity: 0.4; transform: scaleY(0.6); }
    50%      { opacity: 1;   transform: scaleY(1); }
}
body.vk .v-hero__chat-voice-time {
    font-size: 10px;
    color: rgba(232, 220, 180, 0.65);
    font-family: var(--vk-font-en);
    margin-left: 2px;
}
body.vk .v-hero__chat-bubble--voice .v-hero__chat-time {
    grid-column: 1 / -1;
    margin-top: 2px;
}

/* Bottom message input bar (mockup of WhatsApp's compose row) */
body.vk .v-hero__chat-input {
    display: grid;
    grid-template-columns: auto 1fr auto auto auto;
    align-items: center;
    gap: 6px;
    padding: 10px 12px;
    background: linear-gradient(180deg, rgba(8, 24, 14, 0.95) 0%, rgba(4, 14, 8, 1) 100%);
    border-top: 1px solid rgba(245, 200, 66, 0.16);
    border-radius: 0 0 20px 20px;
}
body.vk .v-hero__chat-input-icon {
    width: 28px; height: 28px;
    display: flex; align-items: center; justify-content: center;
    color: rgba(232, 220, 180, 0.55);
    border-radius: 8px;
    transition: background .25s ease, color .25s ease;
}
body.vk .v-hero__chat-input-icon:hover {
    background: rgba(255, 255, 255, 0.05);
    color: #FFE89F;
}
body.vk .v-hero__chat-input-field {
    padding: 7px 12px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 999px;
    font-size: 12px;
    color: rgba(232, 220, 180, 0.45);
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
body.vk .v-hero__chat-send {
    width: 30px; height: 30px;
    border-radius: 50%;
    background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 10px rgba(37, 211, 102, 0.45);
    transition: transform .25s ease, box-shadow .25s ease;
}
body.vk .v-hero__chat-send:hover {
    transform: scale(1.08);
    box-shadow: 0 6px 16px rgba(37, 211, 102, 0.65);
}
body.vk .v-hero__chat-send svg { transform: translateX(1px); }

/* Hide the old chat CTA (replaced by send button in input bar) */
body.vk .v-hero__preview--chat .v-hero__chat-cta { display: none; }

@media (prefers-reduced-motion: reduce) {
    body.vk .v-hero__chat-wave i,
    body.vk .v-hero__chat-avatar-dot { animation: none; }
}

/* ============================================================
   32. CHAT v3 — premium WhatsApp-class details
   image attachment, system divider, reaction sticker, named typing
   ============================================================ */

/* Image / file attachment bubble */
body.vk .v-hero__chat-bubble--image {
    padding: 6px 9px 5px;
    min-width: 180px;
}
body.vk .v-hero__chat-image {
    display: grid;
    grid-template-columns: 36px 1fr auto;
    align-items: center;
    column-gap: 9px;
    padding: 6px 8px;
    border-radius: 7px;
    background: linear-gradient(135deg, rgba(63, 179, 120, 0.18), rgba(63, 179, 120, 0.06));
    border: 1px solid rgba(63, 179, 120, 0.32);
    margin-bottom: 4px;
}
body.vk .v-hero__chat-image > svg {
    width: 36px; height: 28px;
    color: #6EE7AE;
    background: rgba(8, 24, 14, 0.45);
    border-radius: 5px;
    padding: 4px;
    box-sizing: border-box;
}
body.vk .v-hero__chat-image span {
    font-size: 11px;
    font-weight: 600;
    color: #ECFFF4;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
body.vk .v-hero__chat-image em {
    font-style: normal;
    font-size: 9.5px;
    color: rgba(150, 232, 195, 0.75);
    grid-column: 2;
    grid-row: 2;
    margin-top: 1px;
}

/* System / status divider message (centered pill in the chat flow) */
body.vk .v-hero__chat-system {
    align-self: center;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    background: rgba(245, 200, 66, 0.12);
    border: 1px solid rgba(245, 200, 66, 0.30);
    border-radius: 999px;
    font-size: 10px;
    font-weight: 600;
    color: #FFE89F;
    line-height: 1.4;
    margin: 2px 0;
    max-width: 90%;
    text-align: center;
}
body.vk .v-hero__chat-system svg { color: #F5C842; flex-shrink: 0; }

/* Reaction sticker pinned to a bubble corner */
body.vk .v-hero__chat-bubble--reacted { position: relative; padding-bottom: 12px; }
body.vk .v-hero__chat-reaction {
    position: absolute;
    bottom: -10px;
    left: -8px;
    width: 22px; height: 22px;
    border-radius: 50%;
    background: rgba(8, 18, 14, 0.95);
    border: 1.5px solid rgba(245, 200, 66, 0.40);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    line-height: 1;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
    animation: v-react-in 0.6s cubic-bezier(.34,1.56,.64,1) 2.4s both;
}
@keyframes v-react-in {
    from { transform: scale(0); opacity: 0; }
    to   { transform: scale(1); opacity: 1; }
}
body.vk .v-hero__chat-bubble--out.v-hero__chat-bubble--reacted .v-hero__chat-reaction {
    left: auto;
    right: -8px;
}

/* Typing wrapper with name */
body.vk .v-hero__chat-typing-wrap {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    align-self: flex-start;
    margin-top: 2px;
}
body.vk .v-hero__chat-typing-wrap .v-hero__chat-typing { padding: 6px 10px; margin: 0; }
body.vk .v-hero__chat-typing-name {
    font-size: 9.5px;
    color: rgba(232, 220, 180, 0.55);
    font-style: italic;
    letter-spacing: 0.02em;
}

/* Buttons — slightly smaller for compact rhythm */
body.vk .vk-btn--lg { padding: 10px 20px; font-size: 13px; }
body.vk .vk-btn--xl { padding: 12px 22px; font-size: 14px; }

/* Agent cards — 7 service tiles laid out as two rows of 4 (last row's 3 cards centered) */
body.vk .v-agents {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
}
body.vk .v-agent {
    flex: 0 1 calc((100% - 36px) / 4); /* 4 cols, 3 gaps × 12px */
    min-width: 180px;
    padding: 16px 14px 14px;
    min-height: 0;
    border-radius: 14px;
}
body.vk .v-agent__badge { padding: 2px 9px; font-size: 9px; margin-bottom: 10px; letter-spacing: 0.06em; }
body.vk .v-agent__title { font-size: 15px; margin: 0 0 2px; line-height: 1.2; }
body.vk .v-agent__sub { font-size: 10px; margin: 0 0 8px; letter-spacing: 0.06em; }
body.vk .v-agent__desc { font-size: 12px; line-height: 1.55; margin: 0 0 12px; }
body.vk .v-agent__foot { padding-top: 10px; }
body.vk .v-agent__count { font-size: 16px; }
body.vk .v-agent__count small { font-size: 0.6em; }
body.vk .v-agent__cta { font-size: 11.5px; }
@media (max-width: 880px) { body.vk .v-agent { flex-basis: calc((100% - 24px) / 3); } } /* 3 cols */
@media (max-width: 640px) { body.vk .v-agent { flex-basis: calc((100% - 12px) / 2); } } /* 2 cols */
@media (max-width: 380px) { body.vk .v-agent { flex-basis: 100%; } }

/* Why cards (6) */
body.vk .v-why { gap: 12px; }
body.vk .v-why__card { padding: 16px 16px; border-radius: 14px; }
body.vk .v-why__icon { width: 38px; height: 38px; border-radius: 10px; margin-bottom: 10px; }
body.vk .v-why__icon svg { width: 19px; height: 19px; }
body.vk .v-why__num { top: 12px; right: 14px; font-size: 24px; }
body.vk .v-why__title { font-size: 14px; margin: 0 0 4px; }
body.vk .v-why__desc { font-size: 12.5px; line-height: 1.55; }

/* Steps (4) */
body.vk .v-steps { gap: 14px; }
body.vk .v-steps::before { top: 22px; }
body.vk .v-step__num {
    width: 44px; height: 44px;
    margin: 0 auto 10px;
    font-size: 18px;
    border-width: 1px;
    box-shadow: 0 4px 14px rgba(63, 179, 120, 0.25), 0 0 0 3px var(--vk-bg);
}
body.vk .v-step__title { font-size: 13.5px; margin: 0 0 3px; }
body.vk .v-step__desc { font-size: 12px; line-height: 1.55; }

/* Quotes (3) */
body.vk .v-quotes { gap: 12px; }
body.vk .v-quote { padding: 18px 18px 16px; border-radius: 14px; }
body.vk .v-quote__mark { font-size: 56px; top: -2px; left: 16px; }
body.vk .v-quote__rating { margin-bottom: 8px; }
body.vk .v-quote__rating svg { width: 12px; height: 12px; }
body.vk .v-quote blockquote { font-size: 13px; line-height: 1.6; margin: 0 0 14px; }
body.vk .v-quote__who { gap: 10px; padding-top: 10px; }
body.vk .v-quote__avatar { width: 32px; height: 32px; font-size: 11px; }
body.vk .v-quote__name strong { font-size: 12.5px; }
body.vk .v-quote__name em { font-size: 11px; }

/* Live feed (legacy — winners showcase replaces v-live) */
body.vk .v-live { gap: 7px; max-width: 820px; }
body.vk .v-live__item { padding: 10px 16px; gap: 12px; border-radius: 11px; }
body.vk .v-live__avatar { width: 32px; height: 32px; font-size: 12px; }
body.vk .v-live__body strong { font-size: 12.5px; }
body.vk .v-live__body em { font-size: 11px; }
body.vk .v-live__what { font-size: 12px; }
body.vk .v-live__time { font-size: 10px; }

/* ============================================================
   29. WINNERS SHOWCASE — featured spotlight + secondary list
   ============================================================ */
body.vk .v-winners {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
    gap: 18px;
    align-items: stretch;
}
@media (max-width: 880px) {
    body.vk .v-winners { grid-template-columns: 1fr; }
}

/* FEATURED spotlight card */
body.vk .v-winner--featured {
    position: relative;
    overflow: hidden;
    padding: 16px 18px 14px;
    border-radius: 18px;
    background:
        radial-gradient(70% 80% at 0% 0%, rgba(245, 200, 66, 0.18) 0%, transparent 60%),
        radial-gradient(60% 60% at 100% 100%, rgba(200, 16, 46, 0.10) 0%, transparent 65%),
        linear-gradient(180deg, rgba(13, 24, 28, 0.92) 0%, rgba(8, 18, 22, 0.96) 100%);
    border: 1px solid rgba(245, 200, 66, 0.32);
    box-shadow:
        0 24px 60px rgba(0, 0, 0, 0.55),
        0 0 40px rgba(245, 200, 66, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;        /* match the secondary list column height */
    box-sizing: border-box;
}
/* Animated gold confetti pattern */
body.vk .v-winner--featured::before {
    content: '';
    position: absolute; inset: 0;
    background:
        radial-gradient(circle at 18% 22%, rgba(245, 200, 66, 0.18) 1px, transparent 2px),
        radial-gradient(circle at 78% 18%, rgba(255, 250, 236, 0.18) 1px, transparent 2px),
        radial-gradient(circle at 88% 65%, rgba(245, 200, 66, 0.12) 1px, transparent 2px),
        radial-gradient(circle at 12% 80%, rgba(245, 200, 66, 0.15) 1px, transparent 2px);
    background-size: 220px 220px;
    opacity: 0.5;
    pointer-events: none;
    animation: v-confetti-drift 24s linear infinite;
}
@keyframes v-confetti-drift {
    from { background-position: 0 0, 0 0, 0 0, 0 0; }
    to   { background-position: 220px 220px, -220px 220px, 220px -220px, -220px -220px; }
}

body.vk .v-winner__top {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 8px;
    position: relative; z-index: 1;
}
body.vk .v-winner__rank {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 5px 11px;
    background: rgba(245, 200, 66, 0.16);
    border: 1px solid rgba(245, 200, 66, 0.45);
    border-radius: 999px;
    font-size: 10.5px; font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.10em;
    color: #FFE89F;
}
body.vk .v-winner__rank svg { color: #F5C842; }
body.vk .v-winner__verified {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 4px 10px;
    background: rgba(63, 179, 120, 0.14);
    border: 1px solid rgba(63, 179, 120, 0.35);
    border-radius: 999px;
    font-size: 10px; font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #6EE7AE;
}
body.vk .v-winner__verified svg { color: #6EE7AE; }

body.vk .v-winner__amount-wrap {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    margin: 0 0 10px;
    position: relative; z-index: 1;
}
body.vk .v-winner__currency {
    font-family: var(--vk-font-en-display);
    font-weight: 700;
    font-size: clamp(20px, 2.2vw, 26px);
    color: rgba(255, 232, 159, 0.85);
    line-height: 1;
}
body.vk .v-winner__amount {
    font-family: var(--vk-font-en-display);
    font-weight: 800;
    font-size: clamp(26px, 3.2vw, 38px);
    line-height: 1.15;
    letter-spacing: -0.025em;
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #B57E1A 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    padding: 2px 0;
    overflow: visible;
    text-shadow: 0 4px 32px rgba(245, 200, 66, 0.30);
}

body.vk .v-winner__player {
    display: grid;
    grid-template-columns: 34px 1fr;
    align-items: center;
    gap: 10px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px dashed rgba(245, 200, 66, 0.20);
    position: relative; z-index: 1;
}
body.vk .v-winner__avatar {
    width: 34px; height: 34px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-weight: 800; font-size: 13px;
    background: linear-gradient(135deg, #F5C842, #B57E1A);
    color: #08160E;
    border: 1.5px solid rgba(255, 250, 236, 0.45);
    box-sizing: border-box;
    flex-shrink: 0;
}
body.vk .v-winner__avatar[data-color="emerald"] { background: linear-gradient(135deg, #3FB378, #1B6B47); color: #fff; }
body.vk .v-winner__avatar[data-color="rose"]    { background: linear-gradient(135deg, #FF8FA3, #C8102E); color: #fff; }
body.vk .v-winner__avatar[data-color="cyan"]    { background: linear-gradient(135deg, #4FBDEF, #2A6FAA); color: #fff; }
body.vk .v-winner__avatar[data-color="amber"]   { background: linear-gradient(135deg, #FFB347, #B57E1A); color: #08160E; }

body.vk .v-winner__player-meta { display: flex; flex-direction: column; min-width: 0; }
body.vk .v-winner__player-meta strong {
    font-size: 14px; font-weight: 700;
    color: var(--vk-text);
    line-height: 1.3;
}
body.vk .v-winner__player-meta em {
    font-style: normal;
    font-size: 11px;
    color: var(--vk-text-dim);
    margin-top: 2px;
    letter-spacing: 0.02em;
}

body.vk .v-winner__game {
    display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
    margin-bottom: 8px;
    position: relative; z-index: 1;
}
body.vk .v-winner__game-pill {
    padding: 4px 10px;
    background: rgba(63, 179, 120, 0.14);
    border: 1px solid rgba(63, 179, 120, 0.32);
    border-radius: 999px;
    font-size: 10.5px; font-weight: 700;
    color: #6EE7AE;
    letter-spacing: 0.04em;
}
body.vk .v-winner__game-name {
    font-size: 12.5px;
    color: var(--vk-text-mid);
    font-weight: 600;
}

body.vk .v-winner__foot {
    display: flex; justify-content: space-between; align-items: center;
    margin-top: auto;
    padding-top: 8px;
    font-size: 10.5px;
    color: var(--vk-text-dim);
    position: relative; z-index: 1;
}
body.vk .v-winner__multiplier {
    padding: 3px 9px;
    background: linear-gradient(135deg, rgba(230, 57, 70, 0.18), rgba(200, 16, 46, 0.10));
    border: 1px solid rgba(230, 57, 70, 0.40);
    border-radius: 999px;
    font-weight: 800; font-size: 10.5px;
    color: #FF8FA3;
    letter-spacing: 0.04em;
}

/* SECONDARY winners list (right column) */
body.vk .v-winners__list {
    display: flex; flex-direction: column;
    gap: 10px;
}
body.vk .v-winner--row {
    display: grid;
    grid-template-columns: 22px 36px 1fr auto;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 12px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.025) 0%, rgba(255, 255, 255, 0.005) 100%),
        rgba(8, 22, 14, 0.65);
    border: 1px solid rgba(232, 216, 156, 0.14);
    transition: border-color .25s ease, transform .25s ease, background .25s ease;
}
body.vk .v-winner--row:hover {
    border-color: rgba(245, 200, 66, 0.40);
    transform: translateX(3px);
    background:
        linear-gradient(180deg, rgba(245, 200, 66, 0.06) 0%, rgba(245, 200, 66, 0.01) 100%),
        rgba(8, 22, 14, 0.7);
}
body.vk .v-winner__rank-num {
    font-family: var(--vk-font-en-display);
    font-weight: 700; font-size: 18px;
    color: rgba(245, 200, 66, 0.45);
    text-align: center;
    line-height: 1;
    letter-spacing: -0.02em;
}
body.vk .v-winner--row .v-winner__avatar {
    width: 36px; height: 36px;
    font-size: 13px;
}
body.vk .v-winner__row-body { min-width: 0; }
body.vk .v-winner__row-body strong {
    display: block;
    font-size: 13px; font-weight: 700;
    color: var(--vk-text);
    line-height: 1.3;
}
body.vk .v-winner__row-body strong em {
    font-style: normal;
    font-size: 11px;
    color: var(--vk-text-dim);
    font-weight: 500;
}
body.vk .v-winner__row-body p {
    margin: 2px 0 0;
    font-size: 11.5px;
    color: var(--vk-text-mid);
    line-height: 1.4;
}
body.vk .v-winner__row-amount {
    text-align: right;
    display: flex; flex-direction: column; align-items: flex-end;
    gap: 1px;
}
body.vk .v-winner__row-amount span {
    font-family: var(--vk-font-en-display);
    font-weight: 700;
    font-size: 14.5px;
    line-height: 1.3;
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 60%, #B57E1A 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    letter-spacing: -0.02em;
    white-space: nowrap;
}
body.vk .v-winner__row-amount em {
    font-style: normal;
    font-size: 9.5px;
    color: var(--vk-text-dim);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

/* Aggregate trust footer */
body.vk .v-winners__totals {
    margin-top: 24px;
    padding: 16px 18px;
    border-radius: 14px;
    border: 1px solid rgba(245, 200, 66, 0.22);
    background:
        radial-gradient(60% 100% at 50% 0%, rgba(245, 200, 66, 0.06) 0%, transparent 60%),
        linear-gradient(180deg, rgba(13, 24, 48, 0.45) 0%, rgba(8, 16, 30, 0.55) 100%);
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    align-items: center;
}
body.vk .v-winners__total {
    text-align: center;
    padding: 6px 8px;
    border-right: 1px dashed rgba(245, 200, 66, 0.14);
}
body.vk .v-winners__total:last-child { border-right: none; }
body.vk .v-winners__total-num {
    display: inline-block;
    font-family: var(--vk-font-en-display);
    font-weight: 700;
    font-size: clamp(15px, 1.8vw, 19px);
    line-height: 1.4;
    padding: 3px 2px;
    overflow: visible;
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #E8B86C 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    letter-spacing: -0.015em;
}
body.vk .v-winners__total-num small { font-size: 0.55em; vertical-align: super; }
body.vk .v-winners__total-lbl {
    display: block;
    margin-top: 3px;
    font-size: 10px;
    color: var(--vk-text-dim);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    line-height: 1.3;
}
@media (max-width: 720px) {
    body.vk .v-winners__totals { grid-template-columns: 1fr 1fr; gap: 12px; }
    body.vk .v-winners__total:nth-child(2n) { border-right: none; }
    body.vk .v-winners__total:nth-child(-n+2) { border-bottom: 1px dashed rgba(245, 200, 66, 0.14); padding-bottom: 12px; }
}
@media (max-width: 480px) {
    body.vk .v-winner--row { grid-template-columns: 18px 32px 1fr auto; gap: 8px; padding: 10px 12px; }
    body.vk .v-winner--row .v-winner__avatar { width: 32px; height: 32px; font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
    body.vk .v-winner--featured::before { animation: none; }
}

/* ============================================================
   30. WINNERS LIVE-ROTATION animation hooks
   ============================================================ */
body.vk .v-winner--row,
body.vk .v-winner--featured {
    transition: opacity .32s cubic-bezier(.2,.7,.15,1),
                transform .32s cubic-bezier(.2,.7,.15,1);
    will-change: opacity, transform;
}
body.vk .v-winner--row.is-leaving        { opacity: 0; transform: translateY(-12px); }
body.vk .v-winner--featured.is-leaving   { opacity: 0; transform: translateY(-10px) scale(0.985); }
body.vk .v-winner--row.is-entering       { opacity: 0; transform: translateY(12px);  transition: none !important; }
body.vk .v-winner--featured.is-entering  { opacity: 0; transform: translateY(10px) scale(0.985); transition: none !important; }

/* Pulsing red LIVE dot in eyebrow */
body.vk .v-winners__live-dot {
    display: inline-block;
    width: 7px; height: 7px;
    background: #FF4D6D;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(255, 77, 109, 0.75);
    animation: v-pulse-live 1.4s ease-in-out infinite;
    vertical-align: middle;
    transform: translateY(-1px);
}

/* Time field flashes briefly when it updates (CSS-only via animation re-run) */
body.vk .v-winner__row-amount em,
body.vk .v-winner__foot time {
    transition: color .3s ease;
}

@media (prefers-reduced-motion: reduce) {
    body.vk .v-winner--row,
    body.vk .v-winner--featured { transition: none; }
    body.vk .v-winner--row.is-leaving,
    body.vk .v-winner--featured.is-leaving,
    body.vk .v-winner--row.is-entering,
    body.vk .v-winner--featured.is-entering { opacity: 1; transform: none; }
}

/* ============================================================
   31. HERO ONE-VIEWPORT — hard-fit to a single window
   Sticky header is ~64–80px; account for it (admin-bar +32 logged-in).
   ============================================================ */
body.vk .v-hero--split {
    --vk-header-h: 76px;
    /* min-height (not height) — content can grow if needed, but always fills the window */
    min-height: calc(100vh - var(--vk-header-h));
    min-height: calc(100dvh - var(--vk-header-h));
    padding: clamp(10px, 1.2vw, 18px) var(--vk-pad);
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-sizing: border-box;
    /* removed overflow:hidden — was masking real layout problems and clipping decoration */
}
body.vk.admin-bar .v-hero--split {
    --vk-header-h: 108px;
}
body.vk .v-hero--split .v-hero__split {
    gap: clamp(16px, 2vw, 28px);
    width: 100%;
    max-width: var(--vk-max);
    margin: 0 auto;
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    align-items: center;
    min-height: 0;
}
body.vk .v-hero__col {
    display: flex;
    flex-direction: column;
    gap: clamp(14px, 1.6vw, 22px);
    min-width: 0;
    min-height: 0;
    position: relative;
    z-index: 2;          /* sit above the corner ornaments */
    isolation: isolate;  /* prevent decorative children from bleeding into the other column */
}
body.vk .v-hero__col--right {
    justify-content: stretch;
    align-items: stretch;
    min-width: 0;
    padding: 0;       /* let the chat fill the column edge-to-edge */
}
body.vk .v-hero__col--right .v-hero__preview--chat {
    width: 100%;
    max-width: none;  /* fill the right column */
    margin: 0;
    height: auto;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    transform: none;
    overflow: hidden;
}
/* Pull the seal INSIDE the card so it can't clash with corners or the bento grid */
body.vk .v-hero__col--right .v-hero__seal {
    top: 6px;
    right: 6px;
    width: 44px;
    height: 44px;
}
body.vk .v-hero__col--right .v-hero__seal svg { width: 44px; height: 44px; }
body.vk .v-hero__bento {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;     /* size to content, no forced equal rows */
    align-content: start;              /* pin to the top of the available area */
    min-height: 0;
    gap: 8px;
}
/* In side-by-side mode the 4 cards live in a 2x2 — re-place them */
body.vk .v-hero__bento-card--payments { grid-column: 1; grid-row: 1; }
body.vk .v-hero__bento-card--match    { grid-column: 2; grid-row: 1; }
body.vk .v-hero__bento-card--agents   { grid-column: 1; grid-row: 2; }
body.vk .v-hero__bento-card--withdraw { grid-column: 2; grid-row: 2; }
/* Each card sizes to its own content; clip anything that does try to overflow */
body.vk .v-hero__bento-card {
    align-self: stretch;
    min-height: 0;
    overflow: hidden;
}
/* Cap the chat preview height so the whole bento row stays within the viewport */
body.vk .v-hero__bento .v-hero__preview--chat {
    max-height: 100%;
    display: flex;
    flex-direction: column;
}
body.vk .v-hero__chat-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

/* Copy block — tighter */
body.vk .v-hero__copy { gap: 10px; max-width: 760px; }
body.vk .v-hero--split .v-hero__title {
    font-size: clamp(26px, 3.6vw, 44px);
    line-height: 1.1;
    gap: 0;
    padding-top: 0;
    margin-bottom: 0;
}
body.vk .v-hero--split .v-hero__title-line { padding: 0; }
body.vk .v-hero--split .v-hero__title-line--brand { padding: 0; line-height: 1.18; }
body.vk .v-hero--split .v-hero__lead {
    font-size: clamp(12px, 0.95vw, 13.5px);
    line-height: 1.55;
    max-width: 56ch;
}
body.vk .v-hero--split .v-hero__cta { margin-top: 2px; gap: 10px; }
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--red,
body.vk :is(.v-hero--premium, .v-hero--split) .vk-btn--xl.vk-btn--red {
    padding: 10px 20px;
    font-size: 13px;
    border-radius: 12px;
}
body.vk .v-hero--split .v-hero__chips { margin: 2px 0 0; gap: 8px; }
body.vk .v-hero--split .v-hero__chips li { padding: 4px 10px; font-size: 10.5px; }
body.vk .v-hero--split .v-hero__pill--premium { padding: 5px 12px; font-size: 11px; margin-bottom: 0; }

/* Bento grid — ultra compact, 2 lines per card */
body.vk .v-hero__bento { gap: 8px; grid-template-rows: auto auto; }
body.vk .v-hero__bento-card {
    padding: 8px 12px;
    gap: 2px;
    border-radius: 12px;
    min-height: 0;
}
/* Line 1: icon + label + number all inline */
body.vk .v-hero__bento-card-head {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
}
body.vk .v-hero__bento-icon { width: 22px; height: 22px; border-radius: 6px; flex-shrink: 0; }
body.vk .v-hero__bento-icon svg { width: 11px; height: 11px; }
body.vk .v-hero__bento-label {
    font-size: 9.5px;
    letter-spacing: 0.06em;
    line-height: 1.2;
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Big number — no longer on its own line if possible */
body.vk .v-hero__bento-num {
    font-size: clamp(16px, 1.8vw, 22px);
    line-height: 1.2;
    padding: 0;
    margin: 0;
    white-space: nowrap;
}
body.vk .v-hero__bento-num small { font-size: 0.5em; vertical-align: super; }

/* Sub line (line 2 — single line, no extras) */
body.vk .v-hero__bento-sub {
    font-size: 10px;
    margin-top: 2px;
    line-height: 1.3;
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: nowrap;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
body.vk .v-hero__bento-trend { padding: 1px 5px; font-size: 9px; }

/* Match card — single inline row instead of multi-line teams */
body.vk .v-hero__bento-match {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    font-size: 11px;
    flex-wrap: nowrap;
    white-space: nowrap;
}
body.vk .v-hero__bento-team {
    display: inline-flex;
    flex-direction: row;
    align-items: baseline;
    gap: 4px;
    flex: 0 0 auto;
}
body.vk .v-hero__bento-team strong { font-size: 10px; font-weight: 600; }
body.vk .v-hero__bento-team span { font-size: 12px; padding: 0; line-height: 1.2; font-weight: 700; }
body.vk .v-hero__bento-vs { font-size: 8px; flex-shrink: 0; }

/* HIDE space-eating extras — keep cards to 2 lines */
body.vk .v-hero__bento-stack { display: none; }
body.vk .v-hero__bento-bar { display: none; }

/* Chat preview — shorter & tighter */
body.vk .v-hero__bento .v-hero__preview--chat { border-radius: 14px; }
body.vk .v-hero__chat-head { padding: 10px 12px; gap: 8px; grid-template-columns: 36px 1fr auto; }
body.vk .v-hero__chat-avatar {
    width: 36px; height: 36px;
    min-width: 36px; min-height: 36px;
}
body.vk .v-hero__chat-avatar svg { width: 18px; height: 18px; }
body.vk .v-hero__chat-meta strong { font-size: 12px; }
body.vk .v-hero__chat-meta em { font-size: 9.5px; }
body.vk .v-hero__chat-icon { width: 24px; height: 24px; }
body.vk .v-hero__chat-icon svg { width: 12px; height: 12px; }
body.vk .v-hero__chat-body { min-height: 0; padding: 10px 12px 8px; gap: 6px; }
body.vk .v-hero__chat-notice { padding: 4px 10px; font-size: 9.5px; margin-bottom: 2px; }
body.vk .v-hero__chat-date span { padding: 3px 12px; font-size: 9.5px; }
body.vk .v-hero__chat-bubble { padding: 6px 10px 4px; font-size: 11.5px; line-height: 1.45; border-radius: 9px; }
body.vk .v-hero__chat-time { font-size: 9px; margin-top: 2px; }
body.vk .v-hero__chat-bubble--voice { padding: 6px 10px; min-width: 170px; }
body.vk .v-hero__chat-play { width: 22px; height: 22px; }
body.vk .v-hero__chat-wave { height: 18px; gap: 1.5px; }
body.vk .v-hero__chat-wave i { width: 1.5px; }
body.vk .v-hero__chat-typing { padding: 7px 11px; }
body.vk .v-hero__chat-typing span { width: 5px; height: 5px; }
body.vk .v-hero__chat-input { padding: 7px 10px; gap: 5px; grid-template-columns: auto 1fr auto auto auto; }
body.vk .v-hero__chat-input-icon { width: 24px; height: 24px; }
body.vk .v-hero__chat-input-icon svg { width: 13px; height: 13px; }
body.vk .v-hero__chat-input-field { padding: 5px 10px; font-size: 11px; }
body.vk .v-hero__chat-send { width: 26px; height: 26px; }
body.vk .v-hero__chat-send svg { width: 12px; height: 12px; }

/* Floating seal — slightly smaller */
body.vk .v-hero__seal { width: 56px; height: 56px; top: -14px; right: -8px; }
body.vk .v-hero__seal svg { width: 56px; height: 56px; }

/* Corner ornaments — sit against section edges, behind everything else */
body.vk .v-hero__corner { width: 28px; height: 28px; z-index: 0; pointer-events: none; }
body.vk .v-hero__corner--tl { top: 8px; left: 8px; }
body.vk .v-hero__corner--tr { top: 8px; right: 8px; }
body.vk .v-hero__corner--bl { bottom: 8px; left: 8px; }
body.vk .v-hero__corner--br { bottom: 8px; right: 8px; }

/* Bottom row — kill the giant divider/margin (only partners now) */
body.vk .v-hero--split .v-hero__split { margin-bottom: clamp(16px, 2vw, 24px) !important; }
body.vk .v-hero--split .v-hero__bottom {
    margin: 0 auto !important;
    padding-top: 0 !important;
    gap: 0;
}
body.vk .v-hero--split .v-hero__bottom::before,
body.vk .v-hero--split .v-hero__bottom::after { display: none !important; }
body.vk .v-hero__partners { padding: 10px 14px; }
body.vk .v-hero__partner { padding: 5px 11px; font-size: 11px; }
body.vk .v-hero__partners-label { font-size: 9.5px; }

/* Hide scroll indicator if present */
body.vk .v-hero__scroll { display: none; }

/* Tablet & mobile — collapse 2-col to single column */
@media (max-width: 920px) {
    body.vk .v-hero--split { height: auto; min-height: 0; max-height: none; }
    body.vk .v-hero--split .v-hero__split {
        grid-template-columns: 1fr;
        gap: 18px;
    }
    body.vk .v-hero__col--right .v-hero__preview--chat { max-width: 460px; }
    body.vk .v-hero__copy { align-items: center; text-align: center; }
    body.vk .v-hero--split .v-hero__cta,
    body.vk .v-hero--split .v-hero__chips { justify-content: center; }
}
@media (max-width: 720px) {
    body.vk .v-hero--split { padding: 12px var(--vk-pad); }
    body.vk .v-hero--split .v-hero__title { font-size: clamp(22px, 6vw, 30px); }
    body.vk .v-hero--split .v-hero__lead { font-size: 12px; }

    /* Mobile: hide the entire bento grid — copy + chat preview only */
    body.vk .v-hero__bento { display: none !important; }
}

/* Social (6) */
body.vk .v-social { gap: 12px; }
body.vk .v-social__card { padding: 16px 16px 14px; border-radius: 14px; }
body.vk .v-social__top { margin-bottom: 10px; }
body.vk .v-social__icon { width: 36px; height: 36px; border-radius: 10px; }
body.vk .v-social__icon svg { width: 18px; height: 18px; }
body.vk .v-social__count { font-size: 15px; }
body.vk .v-social__count em { font-size: 10px; margin-top: 2px; }
body.vk .v-social__name { font-size: 14px; }
body.vk .v-social__desc { font-size: 12px; line-height: 1.55; }
body.vk .v-social__cta { font-size: 12px; padding-top: 10px; }

/* Blog (3) */
body.vk .v-blog { gap: 14px; }
body.vk .v-blog__card { border-radius: 14px; }
body.vk .v-blog__cover { aspect-ratio: 16/9; }
body.vk .v-blog__body { padding: 14px 16px; gap: 6px; }
body.vk .v-blog__meta { font-size: 10px; }
body.vk .v-blog__title { font-size: 14px; line-height: 1.3; }
body.vk .v-blog__excerpt { font-size: 12px; line-height: 1.55; }
body.vk .v-blog__cta { font-size: 12px; padding-top: 8px; }

/* Platforms */
body.vk .v-plat { gap: clamp(20px, 2.8vw, 36px); }
body.vk .v-plat__assure { margin: 14px 0 0; gap: 8px; }
body.vk .v-plat__assure li { padding: 5px 11px; font-size: 11px; }
body.vk .v-plat__links { gap: 10px; }
body.vk .v-plink { padding: 14px 16px; gap: 14px; grid-template-columns: 44px 1fr auto; border-radius: 14px; }
body.vk .v-plink__verify { width: 44px; height: 44px; }
body.vk .v-plink__verify svg { width: 18px; height: 18px; }
body.vk .v-plink__name { font-size: 14px; margin: 0 0 2px; }
body.vk .v-plink__sub { font-size: 11px; margin: 0 0 4px; }
body.vk .v-plink__pill { padding: 2px 7px; font-size: 9px; }
body.vk .v-plink__go { font-size: 12px; }

/* SEO long-form */
body.vk .v-seo { gap: clamp(20px, 2.8vw, 36px); }
body.vk .v-seo__col h3 { margin: 14px 0 5px; font-size: 14px; }
body.vk .v-seo__col p { font-size: 13px; line-height: 1.65; }
body.vk .v-seo__lead { font-size: 13.5px !important; line-height: 1.65; }
body.vk .v-seo__panel { padding: 18px; border-radius: 14px; }
body.vk .v-seo__panel h3 { font-size: 14px; margin: 0 0 6px; }
body.vk .v-seo__panel p { font-size: 12.5px; line-height: 1.55; margin: 0 0 10px; }
body.vk .v-seo__cities li { padding: 3px 9px; font-size: 11px; }
body.vk .v-seo__metrics { margin-top: 12px; border-radius: 10px; }
body.vk .v-seo__metric { padding: 12px 8px; }
body.vk .v-seo__metric-num { font-size: 19px; line-height: 1.3; padding-top: 3px; overflow: visible; }
body.vk .v-seo__metric-lbl { margin-top: 4px; font-size: 10px; letter-spacing: 0.08em; line-height: 1.3; }

/* Contact (4) */
body.vk .v-contact { gap: 10px; }
body.vk .v-contact__card { padding: 16px; border-radius: 14px; gap: 4px; }
body.vk .v-contact__icon { width: 36px; height: 36px; border-radius: 10px; margin-bottom: 4px; }
body.vk .v-contact__icon svg { width: 18px; height: 18px; }
body.vk .v-contact__online { font-size: 9px; }
body.vk .v-contact__name { font-size: 14px; }
body.vk .v-contact__detail { font-size: 12px; }
body.vk .v-contact__sub { font-size: 11px; line-height: 1.45; }
body.vk .v-contact__cta { margin-top: 8px; font-size: 11px; }

/* Support (3) */
body.vk .v-support { gap: 12px; }
body.vk .v-support__card { padding: 18px; border-radius: 14px; }
body.vk .v-support__card h3 { font-size: 15px; margin: 0 0 8px; line-height: 1.35; padding-top: 2px; }
body.vk .v-support__card p { font-size: 12.5px; line-height: 1.55; margin: 0 0 12px; }
body.vk .v-support__stats { gap: 10px; }
body.vk .v-support__stats li { padding: 12px 12px; border-radius: 10px; }
/* Bengali matras (ি, ী, ু, etc.) clip when line-height:1 + transparent gradient fill.
   Give the gradient stat number breathing room above the baseline. */
body.vk .v-support__stat-num { font-size: 17px; line-height: 1.3; padding-top: 3px; overflow: visible; }
body.vk .v-support__stat-label { font-size: 10px; line-height: 1.3; }

/* FAQ */
body.vk .v-faq { gap: 7px; max-width: 820px; }
body.vk .v-faq__item { border-radius: 11px; }
body.vk .v-faq__item summary { padding: 12px 18px; gap: 12px; }
body.vk .v-faq__q { font-size: 13px; }
body.vk .v-faq__chev { width: 11px; height: 11px; }
body.vk .v-faq__answer { padding: 0 18px 14px; font-size: 12.5px; line-height: 1.6; }

/* Final CTA */
body.vk .v-final { padding: clamp(32px, 4.5vw, 56px) clamp(22px, 4vw, 48px); border-radius: 22px; }
body.vk .v-final__title { margin: 8px auto 10px; font-size: clamp(22px, 3vw, 36px); line-height: 1.08; max-width: 22ch; }
body.vk .v-final__sub { margin: 0 auto 18px; font-size: 13px; line-height: 1.55; max-width: 56ch; }
body.vk .v-final__cta { gap: 10px; }

/* Tighten the inline blog/faq button rows added via inline style in front-page.php */
body.vk .v-sec > div[style*="justify-content:center"] { margin-top: 18px !important; gap: 10px !important; }

/* ============================================================
   24. BRAND COLORS — social + contact icons match real platforms
   ============================================================ */

/* Social icons */
body.vk .v-social__card--fb .v-social__icon,
body.vk .v-social__card--page .v-social__icon {
    background: rgba(24, 119, 242, 0.14);
    border-color: rgba(24, 119, 242, 0.45);
    color: #1877F2;
}
body.vk .v-social__card--yt .v-social__icon {
    background: rgba(255, 0, 0, 0.12);
    border-color: rgba(255, 0, 0, 0.42);
    color: #FF0000;
}
body.vk .v-social__card--tg .v-social__icon {
    background: rgba(34, 158, 217, 0.14);
    border-color: rgba(34, 158, 217, 0.45);
    color: #229ED9;
}
body.vk .v-social__card--ig .v-social__icon {
    background: linear-gradient(45deg, rgba(245, 133, 41, 0.20) 0%, rgba(221, 42, 123, 0.20) 50%, rgba(81, 91, 212, 0.20) 100%);
    border-color: rgba(221, 42, 123, 0.45);
    color: #E1306C;
}
body.vk .v-social__card--wa .v-social__icon {
    background: rgba(37, 211, 102, 0.14);
    border-color: rgba(37, 211, 102, 0.45);
    color: #25D366;
}
body.vk .v-social__card--tt .v-social__icon {
    background: linear-gradient(135deg, rgba(255, 0, 80, 0.14) 0%, rgba(0, 242, 234, 0.10) 100%);
    border-color: rgba(255, 255, 255, 0.45);
    color: #FFFFFF;
}

/* Social count numbers tinted to brand on hover for subtle reinforcement */
body.vk .v-social__card--fb:hover,
body.vk .v-social__card--page:hover { border-color: rgba(24, 119, 242, 0.45); }
body.vk .v-social__card--yt:hover { border-color: rgba(255, 0, 0, 0.45); }
body.vk .v-social__card--tg:hover { border-color: rgba(34, 158, 217, 0.45); }
body.vk .v-social__card--ig:hover { border-color: rgba(221, 42, 123, 0.45); }
body.vk .v-social__card--wa:hover { border-color: rgba(37, 211, 102, 0.45); }
body.vk .v-social__card--tt:hover { border-color: rgba(255, 0, 80, 0.55); }

/* Social CTA arrow tinted per brand */
body.vk .v-social__card--fb .v-social__cta,
body.vk .v-social__card--page .v-social__cta { color: #4D94FF; }
body.vk .v-social__card--yt .v-social__cta { color: #FF4D4D; }
body.vk .v-social__card--tg .v-social__cta { color: #4FBDEF; }
body.vk .v-social__card--ig .v-social__cta { color: #E84E94; }
body.vk .v-social__card--wa .v-social__cta { color: #4DDA88; }
body.vk .v-social__card--tt .v-social__cta { color: #FF4D7E; }

/* Contact icons */
body.vk .v-contact__card--telegram .v-contact__icon {
    background: rgba(34, 158, 217, 0.14);
    border-color: rgba(34, 158, 217, 0.45);
    color: #229ED9;
}
body.vk .v-contact__card--email .v-contact__icon {
    background: rgba(234, 67, 53, 0.14);
    border-color: rgba(234, 67, 53, 0.45);
    color: #EA4335;
}
body.vk .v-contact__card--complaint .v-contact__icon {
    background: rgba(232, 216, 156, 0.14);
    border-color: rgba(232, 216, 156, 0.45);
    color: var(--vk-cream-2);
}

/* Contact card hover borders match brand */
body.vk .v-contact__card--telegram:hover { border-color: rgba(34, 158, 217, 0.55); }
body.vk .v-contact__card--email:hover { border-color: rgba(234, 67, 53, 0.55); }
body.vk .v-contact__card--complaint:hover { border-color: rgba(232, 216, 156, 0.55); }

/* Contact CTA arrow per brand */
body.vk .v-contact__card--telegram .v-contact__cta { color: #4FBDEF; }
body.vk .v-contact__card--email .v-contact__cta { color: #F26B5E; }
body.vk .v-contact__card--complaint .v-contact__cta { color: var(--vk-cream-2); }

/* Online indicator dots per brand */
body.vk .v-contact__card--telegram .v-contact__online { color: #4FBDEF; }
body.vk .v-contact__card--telegram .v-contact__online i { background: #229ED9; }

/* Mobile — keep things even more compact */
@media (max-width: 720px) {
    body.vk .v-sec { padding-block: clamp(24px, 6vw, 40px); }
    body.vk .v-sec__head { margin-bottom: 14px; }
    body.vk .v-sec__title { font-size: clamp(19px, 5vw, 24px); max-width: 22ch; }
    body.vk .v-sec__lead { font-size: 12.5px; }
    body.vk .v-hero { padding: clamp(16px, 4vw, 28px) var(--vk-pad) clamp(20px, 4.5vw, 32px); }
    body.vk .v-hero__title { font-size: clamp(26px, 7vw, 38px); }
    body.vk .v-hero__lead { font-size: 13px; }
    body.vk .v-hero__stats { margin-top: 12px; }
    body.vk .v-hero__stat { padding: 10px 8px; }
    body.vk .v-hero__stat-num { font-size: 18px; }
    body.vk .v-hero__stat-lbl { font-size: 9px; }
}

/* ============================================================
   33. NAVIGATION v2 — clean pill nav + bento card mobile menu
   Palette: deep slate / champagne gold / cyan-teal accent / red active
   ============================================================ */

/* ---------- Desktop nav: capsule pill rail ---------- */
body.vk .vk-nav {
    padding: 4px;
    background: rgba(8, 22, 14, 0.45);
    border: 1px solid rgba(245, 200, 66, 0.18);
    border-radius: 999px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: inset 0 1px 0 rgba(255, 250, 236, 0.05);
}
body.vk .vk-nav__list { gap: 2px; }
body.vk .vk-nav__list a {
    color: rgba(232, 220, 180, 0.65);
    font-weight: 600;
    font-size: 12.5px;
    padding: 7px 14px;
    border-radius: 999px;
    border: 1px solid transparent;
    background: transparent;
    transition: color .22s ease, background .22s ease, box-shadow .22s ease;
    line-height: 1.2;
}

/* Disable the legacy "label translateY swap" effect cleanly */
body.vk .vk-nav__list a .vk-nav__label { transform: none !important; transition: none; }
body.vk .vk-nav__list a::before { display: none !important; }

/* Bottom dot — gold becomes cyan on hover for contrast */
body.vk .vk-nav__list a::after {
    bottom: 1px; width: 5px; height: 5px;
    background: var(--vk-green-2);
    box-shadow: 0 0 0 0 transparent;
    transition: transform .25s ease, background .25s ease, box-shadow .25s ease;
}
body.vk .vk-nav__list a:hover {
    color: #FFFAEC;
    background: rgba(245, 200, 66, 0.10);
    box-shadow: inset 0 0 0 1px rgba(245, 200, 66, 0.30);
}
body.vk .vk-nav__list a:hover::after {
    background: #4FBDEF;
    box-shadow: 0 0 8px rgba(79, 189, 239, 0.85);
}
body.vk .vk-nav__list a.is-current {
    color: #08160E;
    background: linear-gradient(135deg, #FFE89F 0%, #F5C842 50%, #B57E1A 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.45),
        0 6px 18px rgba(245, 200, 66, 0.40);
}
body.vk .vk-nav__list a.is-current::after { background: #08160E; box-shadow: none; }

/* Burger (mobile trigger) — emerald glass */
body.vk .vk-burger {
    background: linear-gradient(180deg, rgba(63, 179, 120, 0.10) 0%, rgba(8, 22, 14, 0.50) 100%);
    border: 1px solid rgba(245, 200, 66, 0.30);
    border-radius: 11px;
    color: #FFE89F;
    transition: background .25s ease, border-color .25s ease, transform .2s ease;
}
body.vk .vk-burger:hover {
    background: linear-gradient(180deg, rgba(63, 179, 120, 0.18) 0%, rgba(8, 22, 14, 0.60) 100%);
    border-color: rgba(245, 200, 66, 0.55);
    transform: translateY(-1px);
}
body.vk .vk-burger[aria-expanded="true"] {
    background: linear-gradient(135deg, var(--vk-red-2), var(--vk-red)) !important;
    border-color: rgba(230, 57, 70, 0.55) !important;
    color: #fff !important;
    box-shadow: 0 8px 22px rgba(200, 16, 46, 0.45);
}

/* ---------- Mobile menu — solid vertical card list (rewritten) ---------- */
/* Container */
body.vk .vk-mobile {
    background:
        radial-gradient(60% 40% at 15% 5%, rgba(79, 189, 239, 0.10) 0%, transparent 55%),
        radial-gradient(55% 50% at 90% 95%, rgba(245, 200, 66, 0.10) 0%, transparent 55%),
        linear-gradient(180deg, #060E1C 0%, #03070F 100%);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    padding: 80px 16px 24px;
}
body.vk .vk-mobile__inner {
    max-width: 440px;
    margin: 0 auto;
}

/* List wrapper */
body.vk .vk-mobile ul {
    list-style: none;
    margin: 0 0 18px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
body.vk .vk-mobile li { list-style: none; }

/* Standard menu link — high specificity so velki-home defaults are overridden */
body.vk .vk-mobile li > a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 16px;
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.3;
    color: #F5F1E6;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(245, 200, 66, 0.16);
    border-radius: 12px;
    text-decoration: none;
    transition: transform .22s ease,
                background .22s ease,
                border-color .22s ease,
                color .22s ease,
                box-shadow .22s ease;
}

/* The chevron span at end of every link */
body.vk .vk-mobile li > a > span {
    flex-shrink: 0;
    color: rgba(245, 200, 66, 0.50);
    font-size: 16px;
    line-height: 1;
    transition: color .22s ease, transform .22s ease;
}

/* Hover/focus — gold border + slide */
body.vk .vk-mobile li > a:hover,
body.vk .vk-mobile li > a:focus-visible {
    background: linear-gradient(135deg, rgba(245, 200, 66, 0.14) 0%, rgba(79, 189, 239, 0.06) 100%);
    border-color: rgba(245, 200, 66, 0.50);
    color: #FFE89F;
    transform: translateX(4px);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.40);
}
body.vk .vk-mobile li > a:hover > span,
body.vk .vk-mobile li > a:focus-visible > span {
    color: #FFE89F;
    transform: translateX(3px);
}

/* CTA item — overrides regular link styling, uses red gradient */
body.vk .vk-mobile__cta { margin-top: 4px; }
body.vk .vk-mobile li.vk-mobile__cta > a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 15px 18px;
    font-size: 14.5px;
    font-weight: 800;
    color: #FFFAEC;
    background: linear-gradient(135deg, #E63946 0%, #C8102E 60%, #8B0F1F 100%);
    border: 1px solid rgba(245, 200, 66, 0.45);
    border-radius: 12px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.30);
    transform: none;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.25),
        0 12px 28px rgba(200, 16, 46, 0.45);
}
body.vk .vk-mobile li.vk-mobile__cta > a:hover {
    background: linear-gradient(135deg, #F26B7E 0%, #E63946 50%, #C8102E 100%);
    transform: translateY(-2px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.40),
        0 18px 40px rgba(200, 16, 46, 0.60);
}

/* Footer */
body.vk .vk-mobile__foot {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid rgba(245, 200, 66, 0.20);
    color: rgba(232, 220, 180, 0.50);
    font-size: 11px;
    letter-spacing: 0.08em;
}
body.vk .vk-mobile__foot span:first-child {
    color: #FFE89F;
    font-weight: 700;
}

/* ---------- Search panel — gold trim ---------- */
body.vk .vk-search-panel {
    background: linear-gradient(180deg, rgba(5, 13, 8, 0.96) 0%, rgba(8, 22, 14, 0.92) 100%);
    border-bottom: 1px solid rgba(245, 200, 66, 0.32);
}

/* ---------- Mobile menu logo (top of .vk-mobile__inner) ---------- */
body.vk .vk-mobile__brand {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 20px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(245, 200, 66, 0.18);
    text-decoration: none;
}
body.vk .vk-mobile__brand img {
    display: block;
    width: auto;
    max-width: 200px;
    height: 56px;
    max-height: 56px;
    object-fit: contain;
    filter: drop-shadow(0 4px 14px rgba(245, 200, 66, 0.25));
    transition: transform .3s ease, filter .3s ease;
}
body.vk .vk-mobile__brand:hover img {
    transform: scale(1.04);
    filter: drop-shadow(0 6px 22px rgba(245, 200, 66, 0.45));
}

@media (prefers-reduced-motion: reduce) {
    body.vk .vk-mobile__inner::after { animation: none; }
}

/* ============================================================
   34. MOBILE-FIRST PREMIUM — center everything, larger touch targets,
   tighter rhythm, premium type scale. Mobile is the primary audience.
   ============================================================ */
@media (max-width: 720px) {

    /* ---- Section primitives ---- */
    body.vk .v-sec {
        padding-block: clamp(28px, 7vw, 44px);
        padding-inline: clamp(14px, 4vw, 22px);
        text-align: center;
    }
    body.vk .v-sec__head {
        margin-bottom: 18px;
        text-align: center !important;
    }
    body.vk .v-sec__title,
    body.vk .v-sec__title em {
        text-align: center !important;
        margin-left: auto !important;
        margin-right: auto !important;
        max-width: 22ch;
    }
    body.vk .v-sec__title { font-size: clamp(20px, 6vw, 26px) !important; line-height: 1.22 !important; }
    body.vk .v-sec__lead {
        font-size: 12.5px;
        text-align: center;
        margin: 0 auto;
        max-width: 42ch;
    }
    body.vk .vk-eyebrow,
    body.vk .v-eyebrow {
        justify-content: center;
        text-align: center;
        margin: 0 auto;
    }

    /* ---- HERO ---- */
    body.vk .v-hero--split { padding: 14px var(--vk-pad); }
    body.vk .v-hero__copy {
        align-items: center !important;
        text-align: center !important;
        gap: 12px;
    }
    body.vk .v-hero__copy > * { width: 100%; max-width: 100%; }
    body.vk .v-hero__pill,
    body.vk .v-hero__pill--premium {
        align-self: center;
        margin: 0 auto;
        justify-content: center;
        text-align: center;
        line-height: 1.4;
    }
    body.vk .v-hero--split .v-hero__title {
        font-size: clamp(22px, 7vw, 30px);
        text-align: center;
        align-items: center;
    }
    body.vk .v-hero--split .v-hero__lead {
        text-align: center;
        margin: 0 auto;
        max-width: 38ch;
    }
    body.vk .v-hero--split .v-hero__cta {
        flex-direction: column;
        gap: 10px;
        width: 100%;
        align-items: stretch;
    }
    body.vk .v-hero--split .v-hero__cta .vk-btn {
        width: 100%;
        justify-content: center;
        min-height: 48px;
    }
    body.vk .v-hero--split .v-hero__chips {
        justify-content: center;
        margin: 4px auto 0;
    }
    body.vk .v-hero__col--right { padding: 0; }
    body.vk .v-hero__col--right .v-hero__preview--chat { max-width: 380px; margin: 0 auto; }

    /* ---- AGENT CARDS (7 service tiles) ---- */
    body.vk .v-agents { gap: 10px; }
    body.vk .v-agent {
        padding: 16px 14px;
        text-align: center;
        align-items: center;
    }
    body.vk .v-agent__badge { align-self: center; margin-bottom: 8px; }
    body.vk .v-agent__title,
    body.vk .v-agent__sub,
    body.vk .v-agent__desc { text-align: center; }
    body.vk .v-agent__foot {
        flex-direction: column;
        gap: 8px;
        align-items: center;
        text-align: center;
    }

    /* ---- WHY-US CARDS ---- */
    body.vk .v-why { gap: 10px; }
    body.vk .v-why__card {
        padding: 18px 16px;
        text-align: center;
    }
    body.vk .v-why__icon { margin: 0 auto 10px; }
    body.vk .v-why__num { display: none; } /* declutter on mobile */
    body.vk .v-why__title,
    body.vk .v-why__desc { text-align: center; }

    /* ---- HOW-IT-WORKS STEPS ---- */
    body.vk .v-step { text-align: center; padding: 0; }
    body.vk .v-step__num { margin: 0 auto 10px; }
    body.vk .v-step__title,
    body.vk .v-step__desc { text-align: center; }

    /* ---- TESTIMONIALS ---- */
    body.vk .v-quote {
        padding: 18px 16px;
        text-align: center;
    }
    body.vk .v-quote__rating { justify-content: center; }
    body.vk .v-quote blockquote { text-align: center; }
    body.vk .v-quote__who { justify-content: center; flex-direction: column; gap: 6px; }
    body.vk .v-quote__name { align-items: center; }

    /* ---- COMMUNITY SOCIAL ---- */
    body.vk .v-social__card {
        text-align: center;
        align-items: center;
        padding: 18px 16px;
    }
    body.vk .v-social__top {
        flex-direction: column;
        gap: 8px;
        align-items: center;
        margin-bottom: 8px;
    }
    body.vk .v-social__icon { margin: 0 auto; }
    body.vk .v-social__count { text-align: center; }
    body.vk .v-social__name,
    body.vk .v-social__desc { text-align: center; }
    body.vk .v-social__cta { justify-content: center; align-self: center; }

    /* ---- BLOG CARDS ---- */
    body.vk .v-blog__body { text-align: center; align-items: center; }
    body.vk .v-blog__meta { justify-content: center; }
    body.vk .v-blog__title,
    body.vk .v-blog__excerpt { text-align: center; }
    body.vk .v-blog__cta { justify-content: center; align-self: center; }

    /* ---- PLATFORMS ---- */
    body.vk .v-plat__copy { text-align: center; }
    body.vk .v-plat__copy .v-sec__title { text-align: center !important; margin-left: auto !important; }
    body.vk .v-plat__copy .v-sec__lead { text-align: center !important; margin: 0 auto !important; }
    body.vk .v-plat__assure { justify-content: center; }
    body.vk .v-plink {
        text-align: center;
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 10px;
        padding: 16px;
    }
    body.vk .v-plink__verify { margin: 0 auto; }
    body.vk .v-plink__pills { justify-content: center; }
    body.vk .v-plink__go { margin: 0 auto; }

    /* ---- SEO LONG-FORM ---- */
    body.vk .v-seo__col { text-align: center; }
    body.vk .v-seo__col h3 { text-align: center; }
    body.vk .v-seo__col p { text-align: left; } /* keep paragraphs readable */
    body.vk .v-seo__panel { text-align: center; padding: 18px; }
    body.vk .v-seo__cities { justify-content: center; }
    body.vk .v-seo__metrics { grid-template-columns: 1fr 1fr; }

    /* ---- WINNERS SHOWCASE ---- */
    body.vk .v-winner--featured {
        text-align: center;
        align-items: center;
        padding: 16px;
    }
    body.vk .v-winner__top { justify-content: center; gap: 8px; flex-wrap: wrap; }
    body.vk .v-winner__amount-wrap { justify-content: center; align-self: center; }
    body.vk .v-winner__player {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }
    body.vk .v-winner__avatar { margin: 0 auto; }
    body.vk .v-winner__player-meta { align-items: center; }
    body.vk .v-winner__game { justify-content: center; }
    body.vk .v-winner__foot { flex-direction: column; gap: 6px; align-items: center; }

    /* Secondary winner rows stay grid-row but text centered where useful */
    body.vk .v-winner__row-body { text-align: left; min-width: 0; }
    body.vk .v-winner__row-amount { text-align: right; }
    body.vk .v-winners__totals { grid-template-columns: 1fr 1fr; }
    body.vk .v-winners__total { text-align: center; }

    /* ---- CONTACT ---- */
    body.vk .v-contact__card {
        text-align: center;
        align-items: center;
        padding: 16px;
    }
    body.vk .v-contact__icon { margin: 0 auto 6px; }
    body.vk .v-contact__online { align-self: center; margin-bottom: 4px; }
    body.vk .v-contact__name,
    body.vk .v-contact__detail,
    body.vk .v-contact__sub { text-align: center; }
    body.vk .v-contact__cta { align-self: center; justify-content: center; }

    /* ---- SUPPORT ---- */
    body.vk .v-support__card {
        text-align: center;
        padding: 18px;
    }
    body.vk .v-support__card h3,
    body.vk .v-support__card p { text-align: center; }
    body.vk .v-support__stats {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        justify-content: center;
    }
    body.vk .v-support__stats li { text-align: center; }

    /* ---- FAQ ---- */
    body.vk .v-faq__item summary { padding: 12px 14px; gap: 10px; }
    body.vk .v-faq__q { font-size: 13px; }
    body.vk .v-faq__answer { padding: 0 14px 14px; font-size: 12.5px; text-align: center; }

    /* ---- FINAL CTA ---- */
    body.vk .v-final {
        text-align: center;
        padding: clamp(28px, 6vw, 44px) clamp(18px, 4vw, 28px);
    }
    body.vk .v-final__cta { flex-direction: column; gap: 10px; width: 100%; align-items: stretch; }
    body.vk .v-final__cta .vk-btn { width: 100%; justify-content: center; min-height: 48px; }

    /* ---- BUTTONS — bigger touch targets across the site ---- */
    body.vk .vk-btn { min-height: 44px; }
    body.vk .vk-btn--xl { min-height: 50px; padding: 14px 22px; font-size: 14.5px; }

    /* ---- INLINE CTA ROWS (the small "view all" rows added inline-style in front-page) ---- */
    body.vk .v-sec > div[style*="justify-content:center"] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
    }
    body.vk .v-sec > div[style*="justify-content:center"] .vk-btn {
        width: 100%;
        justify-content: center;
    }

    /* ---- FOOTER ---- */
    body.vk .vk-footer__top {
        text-align: center;
        padding-block: 28px;
    }
    body.vk .vk-footer__brand { align-items: center; text-align: center; }
    body.vk .vk-footer__brand p { text-align: center; }
    body.vk .vk-footer__social { justify-content: center; }
    body.vk .vk-footer__col { text-align: center; }
    body.vk .vk-footer__col h4 { text-align: center; }
    body.vk .vk-footer__col ul { padding: 0; list-style: none; }
    body.vk .vk-footer__bot {
        flex-direction: column;
        text-align: center;
        gap: 6px;
    }
}

/* ---- Extra-small phones ---- */
@media (max-width: 480px) {
    body.vk .v-sec__title { font-size: clamp(18px, 5.6vw, 22px) !important; }
    body.vk .v-sec__lead { font-size: 12px; }
    body.vk .v-hero--split .v-hero__title { font-size: clamp(20px, 7vw, 26px); }
    body.vk .v-hero--split .v-hero__lead { font-size: 12px; }

    body.vk .v-winners { gap: 12px; }
    body.vk .v-winners__totals { grid-template-columns: 1fr 1fr; gap: 6px; padding: 12px; }
    body.vk .v-winners__total { padding: 4px; }
    body.vk .v-winners__total-num { font-size: 14px; }
    body.vk .v-winners__total-lbl { font-size: 9px; }

    body.vk .v-support__stats { grid-template-columns: 1fr; }
    body.vk .v-seo__metrics { grid-template-columns: 1fr; }

    body.vk .vk-btn--xl { padding: 13px 18px; font-size: 14px; }
}

/* ============================================================
   35. AMBASSADOR PAGE — recolor to site palette
   Replaces the legacy gold-only theme (#F5C242 / #FFE9A8) with the
   site's emerald + champagne + crimson + cyan accent system.
   ============================================================ */

/* ---- Ambassador page background ---- */
body.vk.page-template-page-ambassador-vault,
body.vk .vk-amb-vault {
    background:
        radial-gradient(60% 50% at 12% 0%, rgba(245, 200, 66, 0.10) 0%, transparent 60%),
        radial-gradient(50% 60% at 90% 25%, rgba(63, 179, 120, 0.10) 0%, transparent 65%),
        radial-gradient(55% 60% at 50% 100%, rgba(230, 57, 70, 0.06) 0%, transparent 65%),
        linear-gradient(180deg, #0A1628 0%, #060E1C 60%, #03070F 100%);
}

/* ---- Eyebrows — gold pill matching the rest of the site ---- */
body.vk .vk-amb-eyebrow {
    background: rgba(245, 200, 66, 0.10);
    border: 1px solid rgba(245, 200, 66, 0.32);
    color: #FFE89F;
}
body.vk .vk-amb-eyebrow--gold {
    background: rgba(245, 200, 66, 0.14);
    border-color: rgba(245, 200, 66, 0.45);
    color: #FFFAEC;
}
body.vk .vk-amb-eyebrow__dot,
body.vk .vk-amb-eyebrow--gold::before {
    background: #F5C842;
    box-shadow: 0 0 10px rgba(245, 200, 66, 0.85);
}

/* ---- Headings — clean cream + champagne shimmer ---- */
body.vk .vk-amb-h2 { color: #F5F1E6; }
body.vk .vk-amb-gold,
body.vk .vk-amb-vault .vk-amb-gold {
    background: linear-gradient(95deg, #FFFAEC 0%, #FFE89F 35%, #F5C842 70%, #FFFAEC 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
body.vk .vk-amb-section-lead { color: rgba(232, 220, 180, 0.78); }

/* ---- Mini stats ---- */
body.vk .vk-amb-stat {
    background: linear-gradient(180deg, rgba(245, 200, 66, 0.10), rgba(245, 200, 66, 0.02));
    border-color: rgba(245, 200, 66, 0.28);
}
body.vk .vk-amb-stat__val {
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 60%, #B57E1A 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

/* ---- Cover (hero) ---- */
body.vk .vk-amb-cover { background: transparent; }
body.vk .vk-amb-cover__halo--gold {
    background: radial-gradient(circle, rgba(245, 200, 66, 0.40) 0%, transparent 65%);
}
body.vk .vk-amb-cover__halo--violet {
    background: radial-gradient(circle, rgba(63, 179, 120, 0.32) 0%, transparent 65%);
}
body.vk .vk-amb-cover__title { color: #F5F1E6; }
body.vk .vk-amb-cover__title-em {
    background: linear-gradient(110deg, #FFFAEC 0%, #F5C842 50%, #FFE89F 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
body.vk .vk-amb-cover__lead { color: rgba(232, 220, 180, 0.78); }
body.vk .vk-amb-cover__issue {
    color: #F5C842;
    border-color: rgba(245, 200, 66, 0.32);
}

/* Cover portrait frame — gold rim with green inner */
body.vk .vk-amb-cover__portrait-glow {
    background: radial-gradient(60% 60% at 50% 50%, rgba(245, 200, 66, 0.45) 0%, transparent 65%);
}
body.vk .vk-amb-cover__portrait-frame {
    border-color: rgba(245, 200, 66, 0.45);
    box-shadow:
        0 24px 60px rgba(0, 0, 0, 0.55),
        0 0 40px rgba(245, 200, 66, 0.18),
        inset 0 1px 0 rgba(255, 250, 236, 0.15);
}
body.vk .vk-amb-cover__cap-no {
    background: linear-gradient(135deg, #FFE89F 0%, #F5C842 50%, #B57E1A 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
body.vk .vk-amb-cover__cap-name { color: #FFFAEC; }
body.vk .vk-amb-cover__cap-role { color: #6EE7AE; }

/* ---- Stats band ---- */
body.vk .vk-amb-stats-band {
    background: linear-gradient(180deg, rgba(13, 24, 48, 0.85) 0%, rgba(7, 14, 28, 0.92) 100%);
    border-color: rgba(245, 200, 66, 0.25);
}
body.vk .vk-amb-stats-band__num {
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #E8B86C 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
body.vk .vk-amb-stats-band__lbl { color: rgba(232, 220, 180, 0.55); }
body.vk .vk-amb-stats-band__item + .vk-amb-stats-band__item::before {
    background: rgba(245, 200, 66, 0.18);
}

/* ---- Roster cards (the main grid of ambassadors) ---- */
body.vk .vk-amb-roster__card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(8, 22, 32, 0.85) 100%);
    border-color: rgba(245, 200, 66, 0.20);
}
body.vk .vk-amb-roster__card:hover {
    border-color: rgba(245, 200, 66, 0.55);
    box-shadow:
        0 28px 60px rgba(0, 0, 0, 0.55),
        0 0 40px rgba(245, 200, 66, 0.18);
}
body.vk .vk-amb-roster__card::before {
    background: linear-gradient(90deg, transparent, rgba(245, 200, 66, 0.85), transparent);
}
body.vk .vk-amb-roster__rank {
    background: rgba(8, 22, 32, 0.85);
    border-color: rgba(245, 200, 66, 0.40);
    color: #FFE89F;
}
body.vk .vk-amb-roster__rank span { color: #F5C842; }
body.vk .vk-amb-roster__role { color: #6EE7AE; }
body.vk .vk-amb-roster__name { color: #FFFAEC; }
body.vk .vk-amb-roster__cta { color: #FFE89F; }
body.vk .vk-amb-roster__card:hover .vk-amb-roster__cta { color: #F5C842; }

/* ---- Spotlight section ---- */
body.vk .vk-amb-spotlight__pill {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(245, 200, 66, 0.22);
    color: rgba(232, 220, 180, 0.65);
}
body.vk .vk-amb-spotlight__pill:hover {
    border-color: rgba(245, 200, 66, 0.55);
    color: #FFE89F;
    background: rgba(245, 200, 66, 0.06);
}
body.vk .vk-amb-spotlight__pill.is-active {
    background: linear-gradient(135deg, #FFE89F 0%, #F5C842 50%, #B57E1A 100%);
    border-color: rgba(245, 200, 66, 0.85);
    color: #08160E;
    box-shadow: 0 8px 22px rgba(245, 200, 66, 0.40);
}
body.vk .vk-amb-spotlight__pill-no { color: inherit; }

body.vk .vk-amb-spotlight__panel {
    background: linear-gradient(180deg, rgba(13, 24, 48, 0.85) 0%, rgba(7, 14, 28, 0.95) 100%);
    border-color: rgba(245, 200, 66, 0.22);
}
body.vk .vk-amb-spotlight__panel::before {
    background: conic-gradient(from 0deg,
        rgba(245, 200, 66, 0.45) 0%,
        rgba(63, 179, 120, 0.40) 25%,
        rgba(230, 57, 70, 0.40) 50%,
        rgba(79, 189, 239, 0.40) 75%,
        rgba(245, 200, 66, 0.45) 100%);
}
body.vk .vk-amb-spotlight__halo {
    background: radial-gradient(circle, rgba(245, 200, 66, 0.45) 0%, transparent 65%);
}
body.vk .vk-amb-spotlight__plate {
    background: linear-gradient(180deg, rgba(8, 22, 32, 0.85) 0%, rgba(5, 12, 22, 0.95) 100%);
    border-top-color: rgba(245, 200, 66, 0.30);
}
body.vk .vk-amb-spotlight__plate-no {
    background: linear-gradient(135deg, #FFE89F, #F5C842);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
body.vk .vk-amb-spotlight__plate-name { color: #FFFAEC; }
body.vk .vk-amb-spotlight__name { color: #FFFAEC; }
body.vk .vk-amb-spotlight__years { color: #6EE7AE; }
body.vk .vk-amb-spotlight__bio { color: rgba(232, 220, 180, 0.78); }
body.vk .vk-amb-spotlight__quote {
    background: rgba(245, 200, 66, 0.06);
    border-left: 3px solid #F5C842;
    color: #FFFAEC;
}
body.vk .vk-amb-spotlight__q-mark { color: #F5C842; }

body.vk .vk-amb-spotlight__navbtn {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(245, 200, 66, 0.30);
    color: #FFE89F;
}
body.vk .vk-amb-spotlight__navbtn:hover {
    background: rgba(245, 200, 66, 0.10);
    border-color: rgba(245, 200, 66, 0.55);
    color: #FFFAEC;
}
body.vk .vk-amb-spotlight__navbtn--primary {
    background: linear-gradient(135deg, #E63946 0%, #C8102E 60%, #8B0F1F 100%);
    border-color: rgba(245, 200, 66, 0.45);
    color: #FFFAEC;
    box-shadow: 0 12px 28px rgba(200, 16, 46, 0.40);
}
body.vk .vk-amb-spotlight__navbtn--primary:hover {
    box-shadow:
        0 18px 40px rgba(200, 16, 46, 0.55),
        0 0 32px rgba(245, 200, 66, 0.25);
}
body.vk .vk-amb-spotlight__counter { color: rgba(232, 220, 180, 0.55); }

/* ---- Quote wall ---- */
body.vk .vk-amb-quotewall__mark { color: rgba(245, 200, 66, 0.30); }

/* ---- Legacy ambassador cards (.baj-amb-card) ---- */
body.vk .baj-amb-card {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(8, 22, 32, 0.85)) !important;
    border-color: rgba(245, 200, 66, 0.22) !important;
}
body.vk .baj-amb-card:hover {
    border-color: rgba(245, 200, 66, 0.55) !important;
    box-shadow:
        0 32px 64px -22px rgba(0, 0, 0, 0.7),
        0 18px 40px -18px rgba(245, 200, 66, 0.35) !important;
}
body.vk .baj-amb-card::before {
    background: linear-gradient(90deg, transparent, #F5C842, transparent) !important;
    box-shadow: 0 0 12px rgba(245, 200, 66, 0.55) !important;
}
body.vk .baj-amb-card__photo {
    background: linear-gradient(180deg, rgba(8, 22, 32, 0.65) 0%, rgba(3, 10, 14, 0.92) 100%) !important;
}
body.vk .baj-amb-card__overlay {
    background:
        linear-gradient(180deg, rgba(8, 22, 32, 0.30) 0%, rgba(8, 22, 32, 0.10) 30%, rgba(3, 10, 14, 0.95) 100%) !important;
}
body.vk .baj-amb-card__badge {
    background: rgba(8, 22, 32, 0.78) !important;
    border-color: rgba(245, 200, 66, 0.40) !important;
    color: #FFE89F !important;
}
body.vk .baj-amb-card__year {
    background: rgba(245, 200, 66, 0.18) !important;
    border-color: rgba(245, 200, 66, 0.50) !important;
    color: #FFFAEC !important;
}
body.vk .baj-amb-card__accent {
    background: linear-gradient(90deg, #FFE89F, #F5C842) !important;
    box-shadow: 0 0 10px rgba(245, 200, 66, 0.65) !important;
}
body.vk .baj-amb-card__name { color: #F5F1E6 !important; }
body.vk .baj-amb-card__sub { color: rgba(232, 220, 180, 0.70) !important; }
body.vk .baj-amb-card__btn { color: #FFE89F !important; }
body.vk .baj-amb-card:hover .baj-amb-card__btn { color: #F5C842 !important; }

/* ============================================================
   36. AGENT LIST PAGES — recolor to site palette
   /master-agent-list-bd/, /super-agent-list-bd/, /admin-list-bd/, /sub-admin-list-bd/
   Replaces gold + violet (rgba(168,85,247...)) with site's emerald + champagne + crimson.
   ============================================================ */

/* ---- Page hero ---- */
body.vk .vk-pagehero {
    background:
        radial-gradient(60% 70% at 20% 0%, rgba(245, 200, 66, 0.14), transparent 70%),
        radial-gradient(60% 70% at 80% 100%, rgba(63, 179, 120, 0.12), transparent 70%),
        radial-gradient(55% 60% at 50% 50%, rgba(230, 57, 70, 0.06), transparent 65%),
        linear-gradient(180deg, #0A1628 0%, #060E1C 100%);
    border-bottom-color: rgba(245, 200, 66, 0.22);
}

body.vk .vk-pagehero__title { color: #F5F1E6; }
body.vk .vk-pagehero__title em {
    background: linear-gradient(110deg, #FFFAEC 0%, #F5C842 50%, #FFE89F 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
body.vk .vk-pagehero__lead { color: rgba(232, 220, 180, 0.78); }

/* Breadcrumb — emerald hover, gold current */
body.vk .vk-breadcrumb { color: rgba(232, 220, 180, 0.55); }
body.vk .vk-breadcrumb a { color: rgba(232, 220, 180, 0.65); }
body.vk .vk-breadcrumb a:hover { color: #6EE7AE; }
body.vk .vk-breadcrumb svg { color: rgba(245, 200, 66, 0.45); }
body.vk .vk-breadcrumb span { color: #FFE89F; }

/* Page hero stats — same gold gradient as hero stats */
body.vk .vk-pagehero__stats li {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.01) 100%),
        rgba(13, 24, 48, 0.60);
    border-color: rgba(245, 200, 66, 0.25);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
body.vk .vk-pagehero__stat-num {
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #B57E1A 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
body.vk .vk-pagehero__stat-lbl { color: rgba(232, 220, 180, 0.55); }

/* Trust assure pills — gold tint with green hover */
body.vk .vk-pagehero__assure li {
    background: rgba(245, 200, 66, 0.10);
    border-color: rgba(245, 200, 66, 0.32);
    color: #FFE89F;
}
body.vk .vk-pagehero__assure li svg { color: #F5C842; }

/* ---- Feature grid (3-up) ---- */
body.vk .vk-pagefeature {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.01) 100%),
        rgba(8, 22, 32, 0.78);
    border-color: rgba(245, 200, 66, 0.22);
}
body.vk .vk-pagefeature::before {
    background: linear-gradient(90deg, transparent, #F5C842 50%, transparent);
}
body.vk .vk-pagefeature:hover {
    border-color: rgba(245, 200, 66, 0.55);
    box-shadow:
        0 22px 50px -22px rgba(0, 0, 0, 0.65),
        0 0 0 1px rgba(245, 200, 66, 0.28) inset,
        0 0 32px rgba(245, 200, 66, 0.16);
}
body.vk .vk-pagefeature__icon {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.10) 0%, rgba(255, 255, 255, 0.02) 100%),
        radial-gradient(circle at 30% 30%, rgba(245, 200, 66, 0.30) 0%, transparent 70%),
        rgba(245, 200, 66, 0.14);
    border-color: rgba(245, 200, 66, 0.40);
    color: #F5C842;
    box-shadow:
        inset 0 1px 0 rgba(255, 250, 236, 0.15),
        0 8px 22px -10px rgba(245, 200, 66, 0.50);
}
body.vk .vk-pagefeature__title { color: #F5F1E6; }
body.vk .vk-pagefeature__desc { color: rgba(232, 220, 180, 0.75); }

/* ---- Page CTA section ---- */
body.vk .vk-pagecta {
    background:
        radial-gradient(60% 80% at 50% 0%, rgba(245, 200, 66, 0.12), transparent 70%),
        radial-gradient(50% 60% at 50% 100%, rgba(63, 179, 120, 0.08), transparent 70%);
    border-top-color: rgba(245, 200, 66, 0.22);
}

/* ---- Section primitives shared across these pages ---- */
body.vk .vk-section .vk-h2 { color: #F5F1E6; }
body.vk .vk-section .vk-lead { color: rgba(232, 220, 180, 0.78); }

/* Recolor orbs in the page hero (cta-a / cta-b) to gold + emerald */
body.vk .vk-pagehero .vk-orb--cta-a { background: radial-gradient(circle, #F5C842 0%, transparent 65%); opacity: 0.40; }
body.vk .vk-pagehero .vk-orb--cta-b { background: radial-gradient(circle, #3FB378 0%, transparent 65%); opacity: 0.32; }

/* Per-tier accent — give each page hero a subtle differentiator */
body.vk .vk-pagehero--master {
    background:
        radial-gradient(60% 70% at 20% 0%, rgba(245, 200, 66, 0.16), transparent 70%),
        radial-gradient(60% 70% at 80% 100%, rgba(63, 179, 120, 0.14), transparent 70%),
        linear-gradient(180deg, #0A1628 0%, #060E1C 100%);
}
body.vk .vk-pagehero--super {
    background:
        radial-gradient(60% 70% at 20% 0%, rgba(255, 232, 159, 0.18), transparent 70%),
        radial-gradient(60% 70% at 80% 100%, rgba(245, 200, 66, 0.18), transparent 70%),
        radial-gradient(55% 60% at 50% 50%, rgba(230, 57, 70, 0.10), transparent 65%),
        linear-gradient(180deg, #1A1208 0%, #0E0905 100%);
}
body.vk .vk-pagehero--admin {
    background:
        radial-gradient(60% 70% at 20% 0%, rgba(79, 189, 239, 0.16), transparent 70%),
        radial-gradient(60% 70% at 80% 100%, rgba(245, 200, 66, 0.12), transparent 70%),
        linear-gradient(180deg, #0A1828 0%, #050E1C 100%);
}
body.vk .vk-pagehero--sub-admin {
    background:
        radial-gradient(60% 70% at 20% 0%, rgba(63, 179, 120, 0.14), transparent 70%),
        radial-gradient(60% 70% at 80% 100%, rgba(245, 200, 66, 0.12), transparent 70%),
        linear-gradient(180deg, #0A1A0F 0%, #051209 100%);
}

/* ---- Agent shortcode list (rendered inside .vk-pagelist__wrap) — common item card ---- */
body.vk .vk-pagelist__wrap .vk-agent-item,
body.vk .vk-pagelist__wrap .vk-agent-card,
body.vk .vk-pagelist__wrap [class*="agent-card"],
body.vk .vk-pagelist__wrap [class*="agent-item"] {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.01) 100%),
        rgba(8, 22, 32, 0.72) !important;
    border: 1px solid rgba(245, 200, 66, 0.20) !important;
}
body.vk .vk-pagelist__wrap .vk-agent-item:hover,
body.vk .vk-pagelist__wrap .vk-agent-card:hover,
body.vk .vk-pagelist__wrap [class*="agent-card"]:hover,
body.vk .vk-pagelist__wrap [class*="agent-item"]:hover {
    border-color: rgba(245, 200, 66, 0.55) !important;
    box-shadow:
        0 22px 50px -22px rgba(0, 0, 0, 0.65),
        0 0 28px rgba(245, 200, 66, 0.16) !important;
}

/* ============================================================
   37. AGENT MODAL — recolor the search/agent popup
   ============================================================ */

/* Backdrop — deeper, with subtle gold inner glow */
body.vk .search-agent-popup-backdrop {
    background:
        radial-gradient(60% 50% at 50% 30%, rgba(245, 200, 66, 0.08) 0%, transparent 50%),
        rgba(2, 6, 12, 0.85);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    backdrop-filter: blur(14px) saturate(140%);
}

/* Popup container — premium navy glass with conic gold border accent */
body.vk .search-agent-popup {
    position: fixed;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.01) 100%),
        linear-gradient(180deg, rgba(13, 24, 48, 0.96) 0%, rgba(7, 14, 28, 0.98) 100%);
    border: 1px solid rgba(245, 200, 66, 0.32);
    border-radius: 20px;
    box-shadow:
        0 40px 90px rgba(0, 0, 0, 0.75),
        0 0 0 1px rgba(245, 200, 66, 0.12) inset,
        0 0 60px rgba(245, 200, 66, 0.10);
    overflow: hidden;
}
/* Top gold sheen line */
body.vk .search-agent-popup::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(245, 200, 66, 0.55) 30%,
        #FFFAEC 50%,
        rgba(245, 200, 66, 0.55) 70%,
        transparent 100%);
    background-size: 200% 100%;
    animation: v-strip-sweep 4s linear infinite;
    z-index: 5;
    pointer-events: none;
}

/* Close button — red accent on hover (matches site CTA) */
body.vk .search-agent-popup .popup-close-btn {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(245, 200, 66, 0.30);
    color: #FFE89F;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
body.vk .search-agent-popup .popup-close-btn:hover {
    background: linear-gradient(135deg, #E63946 0%, #C8102E 100%);
    color: #fff;
    border-color: rgba(245, 200, 66, 0.55);
    transform: rotate(90deg);
    box-shadow: 0 8px 22px rgba(200, 16, 46, 0.45);
}

/* Header — gold border + decorative ambient glow behind avatar */
body.vk .search-agent-popup .popup-agent-header {
    padding: 22px 22px 18px;
    background:
        radial-gradient(60% 100% at 12% 50%, rgba(245, 200, 66, 0.08) 0%, transparent 60%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.025) 0%, transparent 100%);
    border-bottom: 1px dashed rgba(245, 200, 66, 0.22);
}
body.vk .search-agent-popup .popup-agent-photo img {
    border: 2px solid rgba(245, 200, 66, 0.55);
    box-shadow:
        0 0 0 1px rgba(255, 250, 236, 0.15) inset,
        0 8px 24px -8px rgba(245, 200, 66, 0.55),
        0 0 28px rgba(245, 200, 66, 0.18);
}
body.vk .search-agent-popup .popup-verified-badge {
    background: linear-gradient(135deg, #FFE89F 0%, #F5C842 50%, #B57E1A 100%);
    color: #08160E;
    border: 2px solid #03070F;
    box-shadow: 0 4px 12px rgba(245, 200, 66, 0.55);
}
body.vk .search-agent-popup .popup-agent-name { color: #FFFAEC; }
body.vk .search-agent-popup .popup-agent-group { color: #FFE89F; }
body.vk .search-agent-popup .popup-agent-id { color: rgba(232, 220, 180, 0.65); }
body.vk .search-agent-popup .popup-agent-id span { color: rgba(232, 220, 180, 0.40); }

/* Contact group cards — channel-tinted glass */
body.vk .search-agent-popup .popup-contact-group {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035) 0%, rgba(255, 255, 255, 0.005) 100%),
        rgba(8, 22, 32, 0.65);
    border: 1px solid rgba(245, 200, 66, 0.18);
    border-radius: 14px;
    padding: 12px 14px;
    transition: border-color .25s ease, box-shadow .25s ease;
}
body.vk .search-agent-popup .popup-contact-group:hover {
    border-color: rgba(245, 200, 66, 0.40);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.35);
}
body.vk .search-agent-popup .whatsapp-group {
    border-color: rgba(37, 211, 102, 0.32);
}
body.vk .search-agent-popup .whatsapp-group:hover {
    border-color: rgba(37, 211, 102, 0.55);
    box-shadow:
        0 8px 22px rgba(0, 0, 0, 0.35),
        0 0 24px rgba(37, 211, 102, 0.18);
}
body.vk .search-agent-popup .messenger-group {
    border-color: rgba(34, 158, 217, 0.32);
}
body.vk .search-agent-popup .messenger-group:hover {
    border-color: rgba(34, 158, 217, 0.55);
    box-shadow:
        0 8px 22px rgba(0, 0, 0, 0.35),
        0 0 24px rgba(34, 158, 217, 0.18);
}

body.vk .search-agent-popup .popup-contact-header {
    border-bottom: 1px dashed rgba(245, 200, 66, 0.22);
}
body.vk .search-agent-popup .whatsapp-group .popup-contact-header { color: #25D366; }
body.vk .search-agent-popup .messenger-group .popup-contact-header { color: #4FBDEF; }

/* Contact items */
body.vk .search-agent-popup .popup-contact-item {
    border-bottom: 1px dashed rgba(245, 200, 66, 0.10);
}
body.vk .search-agent-popup .popup-contact-number { color: #F5F1E6; }

/* Copy button — gold tint on hover, green when copied */
body.vk .search-agent-popup .popup-copy-btn {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(245, 200, 66, 0.25);
    color: rgba(232, 220, 180, 0.65);
    transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
body.vk .search-agent-popup .popup-copy-btn:hover {
    background: rgba(245, 200, 66, 0.15);
    color: #FFE89F;
    border-color: rgba(245, 200, 66, 0.55);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(245, 200, 66, 0.20);
}
body.vk .search-agent-popup .popup-copy-btn.copied {
    background: linear-gradient(135deg, #25D366, #128C7E);
    color: #fff;
    border-color: rgba(37, 211, 102, 0.55);
    box-shadow: 0 4px 14px rgba(37, 211, 102, 0.45);
}

/* Message buttons — keep brand colors but add gold rim */
body.vk .search-agent-popup .popup-message-btn {
    border: 1px solid transparent;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
body.vk .search-agent-popup .popup-message-btn.whatsapp-btn {
    background: linear-gradient(135deg, #2EE372 0%, #25D366 50%, #128C7E 100%);
    border-color: rgba(255, 250, 236, 0.25);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.25),
        0 6px 14px -4px rgba(37, 211, 102, 0.55);
}
body.vk .search-agent-popup .popup-message-btn.whatsapp-btn:hover {
    border-color: rgba(245, 200, 66, 0.55);
    transform: translateY(-2px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.35),
        0 12px 24px -6px rgba(37, 211, 102, 0.70),
        0 0 22px rgba(245, 200, 66, 0.20);
}
body.vk .search-agent-popup .popup-message-btn.messenger-btn {
    background: linear-gradient(135deg, #6BC9F8 0%, #4FBDEF 50%, #229ED9 100%);
    border-color: rgba(255, 250, 236, 0.25);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.25),
        0 6px 14px -4px rgba(34, 158, 217, 0.55);
}
body.vk .search-agent-popup .popup-message-btn.messenger-btn:hover {
    border-color: rgba(245, 200, 66, 0.55);
    transform: translateY(-2px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.35),
        0 12px 24px -6px rgba(34, 158, 217, 0.70),
        0 0 22px rgba(245, 200, 66, 0.20);
}

/* ============================================================
   38. QUIZ PAGE — recolor to site palette
   /quiz/ — Quiz Management System plugin
   ============================================================ */

/* Override the plugin's CSS variables (cascades to all qms-* elements) */
body.vk .qms-quiz-wrapper {
    --qms-primary:        #F5C842;
    --qms-primary-dark:   #B57E1A;
    --qms-primary-light:  #FFE89F;
    --qms-accent:         #4FBDEF;
    --qms-success:        #6EE7AE;
    --qms-danger:         #E63946;
    --qms-warning:        #FFB347;
    --qms-gold:           #F5C842;
    --qms-dark:           #0A1628;
    --qms-dark-2:         #060E1C;
    --qms-text:           #F5F1E6;
    --qms-text-muted:     rgba(232, 220, 180, 0.65);
    --qms-border:         rgba(245, 200, 66, 0.22);
    --qms-bg:             transparent;
    --qms-white:          rgba(13, 24, 48, 0.85);
    color: var(--qms-text);
}

/* Wrapper background — full premium dark page */
body.vk .qms-quiz-wrapper {
    background:
        radial-gradient(60% 50% at 12% 0%, rgba(245, 200, 66, 0.10) 0%, transparent 60%),
        radial-gradient(50% 60% at 90% 25%, rgba(63, 179, 120, 0.08) 0%, transparent 65%),
        radial-gradient(55% 60% at 50% 100%, rgba(230, 57, 70, 0.06) 0%, transparent 65%),
        linear-gradient(180deg, #0A1628 0%, #060E1C 60%, #03070F 100%);
    border-radius: 20px;
    padding: 24px 16px 32px;
}

/* ---- Hero ---- */
body.vk .qms-quiz-wrapper .qms-hero {
    background: linear-gradient(145deg, #0F4A2D 0%, #0A1628 50%, #1A1208 100%);
    border: 1px solid rgba(245, 200, 66, 0.32);
    box-shadow:
        0 32px 80px rgba(0, 0, 0, 0.65),
        0 0 0 1px rgba(245, 200, 66, 0.12) inset,
        0 0 60px rgba(245, 200, 66, 0.10);
}
body.vk .qms-quiz-wrapper .qms-hero-overlay {
    background:
        linear-gradient(to right, rgba(8, 22, 40, 0.85) 0%, rgba(8, 22, 40, 0.30) 100%),
        linear-gradient(to top, rgba(3, 7, 15, 0.98) 0%, rgba(3, 7, 15, 0.35) 60%, transparent 100%);
}
body.vk .qms-quiz-wrapper .qms-hero-img img {
    filter: brightness(0.65) saturate(1.15) contrast(1.05);
}
body.vk .qms-quiz-wrapper .qms-hero-title { color: #FFFAEC; }
body.vk .qms-quiz-wrapper .qms-hero-desc { color: rgba(232, 220, 180, 0.85); }
body.vk .qms-quiz-wrapper .qms-hero-meta-item {
    background: rgba(245, 200, 66, 0.14);
    border: 1px solid rgba(245, 200, 66, 0.32);
    color: #FFE89F;
    backdrop-filter: blur(8px);
}
body.vk .qms-quiz-wrapper .qms-hero-badge {
    background: linear-gradient(135deg, #FFE89F 0%, #F5C842 50%, #B57E1A 100%);
    color: #08160E;
    box-shadow: 0 6px 18px rgba(245, 200, 66, 0.45);
}
body.vk .qms-quiz-wrapper .qms-hero-badge-closed {
    background: linear-gradient(135deg, #E63946, #C8102E);
    color: #fff;
    box-shadow: 0 6px 18px rgba(200, 16, 46, 0.45);
}
body.vk .qms-quiz-wrapper .qms-hero-badge-upcoming {
    background: linear-gradient(135deg, #4FBDEF, #2A6FAA);
    color: #fff;
    box-shadow: 0 6px 18px rgba(34, 158, 217, 0.45);
}

/* ---- Timer card ---- */
body.vk .qms-quiz-wrapper .qms-sb-timer {
    background: linear-gradient(145deg, #0A1628 0%, #1A1208 55%, #0F4A2D 100%);
    border-color: rgba(245, 200, 66, 0.32);
}
body.vk .qms-quiz-wrapper .qms-sb-timer::before {
    background: radial-gradient(circle, rgba(245, 200, 66, 0.30) 0%, transparent 70%);
}
body.vk .qms-quiz-wrapper .qms-sb-timer::after {
    background: radial-gradient(circle, rgba(63, 179, 120, 0.20) 0%, transparent 70%);
}
body.vk .qms-quiz-wrapper .qms-sb-unit {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(245, 200, 66, 0.20);
}
body.vk .qms-quiz-wrapper .qms-sb-unit .qms-cd-num { color: #FFE89F; }
body.vk .qms-quiz-wrapper .qms-sb-unit .qms-cd-lbl { color: rgba(232, 220, 180, 0.55); }
body.vk .qms-quiz-wrapper .qms-sb-sep { color: rgba(245, 200, 66, 0.30); }
body.vk .qms-quiz-wrapper .qms-sb-live-dot { background: #FF4D6D; }
body.vk .qms-quiz-wrapper .qms-sb-timer.qms-warning .qms-sb-unit .qms-cd-num,
body.vk .qms-quiz-wrapper .qms-warning .qms-sb-unit .qms-cd-num {
    color: #FFB347;
}
body.vk .qms-quiz-wrapper .qms-sb-timer.qms-expired .qms-sb-unit .qms-cd-num { color: #E63946; }

/* ---- Sidebar cards ---- */
body.vk .qms-quiz-wrapper .qms-sb-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01)),
                rgba(8, 22, 32, 0.78);
    border: 1px solid rgba(245, 200, 66, 0.22);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
}
body.vk .qms-quiz-wrapper .qms-sb-card:hover {
    border-color: rgba(245, 200, 66, 0.45);
    box-shadow:
        0 22px 50px rgba(0, 0, 0, 0.55),
        0 0 28px rgba(245, 200, 66, 0.16);
}
body.vk .qms-quiz-wrapper .qms-sb-prize {
    background: linear-gradient(180deg, rgba(245, 200, 66, 0.10), rgba(8, 22, 14, 0.75));
    border-color: rgba(245, 200, 66, 0.40);
}
body.vk .qms-quiz-wrapper .qms-sb-prize .qms-sb-head {
    background: linear-gradient(135deg, #FFE89F 0%, #F5C842 50%, #B57E1A 100%);
    color: #08160E;
}
body.vk .qms-quiz-wrapper .qms-sb-rules {
    background: linear-gradient(180deg, rgba(79, 189, 239, 0.08), rgba(8, 22, 32, 0.75));
    border-color: rgba(79, 189, 239, 0.32);
}
body.vk .qms-quiz-wrapper .qms-sb-rules .qms-sb-head {
    background: linear-gradient(135deg, #4FBDEF 0%, #2A6FAA 100%);
    color: #fff;
}
body.vk .qms-quiz-wrapper .qms-sb-body { color: rgba(232, 220, 180, 0.85) !important; }

/* ---- Section cards (questions, user info, winners, etc.) ---- */
body.vk .qms-quiz-wrapper .qms-section-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.005)),
                rgba(8, 22, 32, 0.78);
    border: 1px solid rgba(245, 200, 66, 0.22);
    border-radius: 16px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
}
body.vk .qms-quiz-wrapper .qms-section-head {
    color: #FFFAEC;
    border-bottom: 1px dashed rgba(245, 200, 66, 0.22);
}
body.vk .qms-quiz-wrapper .qms-section-icon {
    background: linear-gradient(135deg, rgba(245, 200, 66, 0.20) 0%, rgba(245, 200, 66, 0.04) 100%);
    border: 1px solid rgba(245, 200, 66, 0.40);
    color: #F5C842;
}

/* ---- Question + options ---- */
body.vk .qms-quiz-wrapper .qms-question { color: #F5F1E6; }
body.vk .qms-quiz-wrapper .qms-option {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.005)),
                rgba(8, 22, 32, 0.55);
    border: 1px solid rgba(245, 200, 66, 0.18);
    color: #F5F1E6;
    transition: all .25s ease;
}
body.vk .qms-quiz-wrapper .qms-option:hover {
    border-color: rgba(245, 200, 66, 0.55);
    background: linear-gradient(135deg, rgba(245, 200, 66, 0.12) 0%, rgba(63, 179, 120, 0.05) 100%);
    transform: translateX(3px);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.35);
}
body.vk .qms-quiz-wrapper .qms-option.is-selected,
body.vk .qms-quiz-wrapper .qms-option:has(input:checked) {
    background: linear-gradient(135deg, rgba(245, 200, 66, 0.18), rgba(63, 179, 120, 0.10));
    border-color: rgba(245, 200, 66, 0.65);
    box-shadow:
        inset 0 1px 0 rgba(255, 250, 236, 0.10),
        0 8px 22px rgba(245, 200, 66, 0.20);
}
body.vk .qms-quiz-wrapper .qms-option-letter {
    background: rgba(245, 200, 66, 0.16);
    color: #FFE89F;
    border: 1px solid rgba(245, 200, 66, 0.40);
}
body.vk .qms-quiz-wrapper .qms-option-text { color: #F5F1E6; }
body.vk .qms-quiz-wrapper .qms-option-check { color: #6EE7AE; }
body.vk .qms-quiz-wrapper .qms-tf-true:hover { border-color: rgba(63, 179, 120, 0.55); }
body.vk .qms-quiz-wrapper .qms-tf-false:hover { border-color: rgba(230, 57, 70, 0.55); }

/* Text/Essay inputs */
body.vk .qms-quiz-wrapper .qms-text-input,
body.vk .qms-quiz-wrapper .qms-essay-input {
    background: rgba(8, 22, 32, 0.65);
    border: 1px solid rgba(245, 200, 66, 0.22);
    color: #F5F1E6;
    border-radius: 10px;
}
body.vk .qms-quiz-wrapper .qms-text-input:focus,
body.vk .qms-quiz-wrapper .qms-essay-input:focus {
    border-color: rgba(245, 200, 66, 0.65);
    box-shadow: 0 0 0 3px rgba(245, 200, 66, 0.18);
    outline: none;
}
body.vk .qms-quiz-wrapper .qms-text-input::placeholder,
body.vk .qms-quiz-wrapper .qms-essay-input::placeholder {
    color: rgba(232, 220, 180, 0.40);
}
body.vk .qms-quiz-wrapper .qms-word-count { color: rgba(232, 220, 180, 0.55); }

/* ---- Submit button ---- */
body.vk .qms-quiz-wrapper .qms-submit-btn {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.10) 0%, transparent 35%),
        linear-gradient(135deg, #F26B7E 0%, #E63946 35%, #C8102E 70%, #8B0F1F 100%);
    color: #FFFAEC;
    font-weight: 800;
    border: 1px solid rgba(245, 200, 66, 0.45);
    border-radius: 12px;
    padding: 14px 24px;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.30);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.28),
        inset 0 0 0 1px rgba(245, 200, 66, 0.22),
        0 14px 30px rgba(200, 16, 46, 0.45),
        0 0 36px rgba(245, 200, 66, 0.14);
    transition: transform .22s ease, box-shadow .22s ease;
}
body.vk .qms-quiz-wrapper .qms-submit-btn:hover {
    transform: translateY(-2px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.40),
        inset 0 0 0 1px rgba(245, 200, 66, 0.55),
        0 22px 48px rgba(200, 16, 46, 0.60),
        0 0 60px rgba(245, 200, 66, 0.30);
}

/* ---- Closed / Upcoming states ---- */
body.vk .qms-quiz-wrapper .qms-closed-card,
body.vk .qms-quiz-wrapper .qms-upcoming-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.005)),
                rgba(8, 22, 32, 0.85);
    border: 1px solid rgba(245, 200, 66, 0.32);
}
body.vk .qms-quiz-wrapper .qms-closed-icon-wrap,
body.vk .qms-quiz-wrapper .qms-upcoming-icon-wrap {
    background: rgba(245, 200, 66, 0.14);
    border: 1px solid rgba(245, 200, 66, 0.40);
    color: #F5C842;
}
body.vk .qms-quiz-wrapper .qms-closed-title,
body.vk .qms-quiz-wrapper .qms-upcoming-title { color: #FFFAEC; }
body.vk .qms-quiz-wrapper .qms-closed-msg,
body.vk .qms-quiz-wrapper .qms-upcoming-msg { color: rgba(232, 220, 180, 0.78); }
body.vk .qms-quiz-wrapper .qms-closed-sub,
body.vk .qms-quiz-wrapper .qms-upcoming-note { color: rgba(232, 220, 180, 0.55); }
body.vk .qms-quiz-wrapper .qms-closed-divider,
body.vk .qms-quiz-wrapper .qms-upcoming-divider {
    background: linear-gradient(90deg, transparent, rgba(245, 200, 66, 0.45), transparent);
}
body.vk .qms-quiz-wrapper .qms-closed-thanks { color: #FFE89F; }
body.vk .qms-quiz-wrapper .qms-upcoming-date-wrap {
    background: rgba(245, 200, 66, 0.10);
    border: 1px solid rgba(245, 200, 66, 0.30);
    border-radius: 10px;
}
body.vk .qms-quiz-wrapper .qms-upcoming-date-label { color: rgba(232, 220, 180, 0.55); }
body.vk .qms-quiz-wrapper .qms-upcoming-date-value { color: #FFE89F; }

/* ---- Winners table ---- */
body.vk .qms-quiz-wrapper .qms-winners-card {
    background: linear-gradient(180deg, rgba(245, 200, 66, 0.06), rgba(8, 22, 32, 0.85));
    border: 1px solid rgba(245, 200, 66, 0.32);
}
body.vk .qms-quiz-wrapper .qms-winners-head { color: #FFFAEC; }
body.vk .qms-quiz-wrapper .qms-winners-table-head {
    background: rgba(245, 200, 66, 0.10);
    color: rgba(232, 220, 180, 0.85);
    border-bottom: 1px dashed rgba(245, 200, 66, 0.30);
}
body.vk .qms-quiz-wrapper .qms-winner-row {
    border-bottom: 1px dashed rgba(245, 200, 66, 0.14);
    transition: background .25s ease;
}
body.vk .qms-quiz-wrapper .qms-winner-row:hover {
    background: rgba(245, 200, 66, 0.06);
}
body.vk .qms-quiz-wrapper .qms-winner-pos {
    color: #F5C842;
    font-weight: 800;
}
body.vk .qms-quiz-wrapper .qms-winner-name { color: #FFFAEC; }
body.vk .qms-quiz-wrapper .qms-winner-phone { color: rgba(232, 220, 180, 0.65); }
body.vk .qms-quiz-wrapper .qms-winner-prize {
    background: linear-gradient(135deg, #FFE89F, #F5C842);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-weight: 800;
}

/* ---- User info form ---- */
body.vk .qms-quiz-wrapper .qms-userinfo-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.005)),
                rgba(8, 22, 32, 0.85);
    border: 1px solid rgba(245, 200, 66, 0.22);
}
body.vk .qms-quiz-wrapper .qms-fields-grid label,
body.vk .qms-quiz-wrapper .qms-fields-grid .qms-field-label {
    color: rgba(232, 220, 180, 0.85);
}

/* ============================================================
   39. QUIZ SINGLE / DETAILS PAGE — premium retone
   /quiz/{slug}/ — wrapped in .qms-arc-page.qms-single-page
   The shell uses purple+gold orbs (#FEC611, rgba(67,29,66,...));
   we recolor to the unified site palette + add premium polish.
   ============================================================ */

/* ---- Page shell ---- */
body.vk .qms-arc-page,
body.vk .qms-single-page {
    background:
        radial-gradient(60% 50% at 12% 0%, rgba(245, 200, 66, 0.12) 0%, transparent 60%),
        radial-gradient(50% 60% at 90% 30%, rgba(63, 179, 120, 0.10) 0%, transparent 65%),
        radial-gradient(55% 60% at 50% 100%, rgba(230, 57, 70, 0.06) 0%, transparent 65%),
        linear-gradient(135deg, #0A1628 0%, #060E1C 50%, #03070F 100%);
    color: #F5F1E6;
}

/* ---- Floating orbs ---- */
body.vk .qms-arc-orb-1 {
    background: radial-gradient(circle, rgba(245, 200, 66, 0.42) 0%, transparent 70%);
    width: 540px; height: 540px;
    top: -140px; left: -160px;
    filter: blur(110px);
}
body.vk .qms-arc-orb-2 {
    background: radial-gradient(circle, rgba(63, 179, 120, 0.36) 0%, transparent 70%);
    width: 480px; height: 480px;
    top: 25%; right: -120px;
    filter: blur(100px);
}
body.vk .qms-arc-orb-3 {
    background: radial-gradient(circle, rgba(230, 57, 70, 0.28) 0%, transparent 70%);
    width: 380px; height: 380px;
    bottom: 60px; left: 30%;
    filter: blur(90px);
}

/* ---- Single-quiz wrap — premium centered card frame ---- */
body.vk .qms-single-wrap {
    position: relative;
    z-index: 2;
    max-width: 1180px;
    margin: 0 auto;
    padding: clamp(20px, 3vw, 36px) clamp(14px, 2.5vw, 24px) clamp(40px, 5vw, 64px);
}

/* Decorative gold sheen above the quiz */
body.vk .qms-single-wrap::before {
    content: '';
    position: absolute;
    top: 0; left: 50%;
    transform: translateX(-50%);
    width: clamp(180px, 36vw, 360px);
    height: 1px;
    background: linear-gradient(90deg,
        transparent 0%,
        #4FBDEF 25%,
        #FFE89F 50%,
        #F5C842 75%,
        transparent 100%);
    background-size: 200% 100%;
    animation: v-strip-sweep 5s linear infinite;
    opacity: 0.85;
    pointer-events: none;
}

/* Hero (when shown via partials) — recolor */
body.vk .qms-arc-hero { padding: clamp(40px, 5vw, 64px) 20px clamp(32px, 4vw, 48px); }
body.vk .qms-arc-hero-grid {
    background-image:
        linear-gradient(rgba(245, 200, 66, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(245, 200, 66, 0.04) 1px, transparent 1px);
    background-size: 48px 48px;
}
body.vk .qms-arc-eyebrow-badge {
    background: linear-gradient(135deg, rgba(245, 200, 66, 0.14) 0%, rgba(63, 179, 120, 0.10) 100%);
    box-shadow:
        0 0 0 1px rgba(245, 200, 66, 0.32),
        0 8px 32px rgba(245, 200, 66, 0.10),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
body.vk .qms-arc-eyebrow-icon {
    background: linear-gradient(135deg, rgba(245, 200, 66, 0.30) 0%, rgba(63, 179, 120, 0.18) 100%);
    border-right-color: rgba(245, 200, 66, 0.32);
}
body.vk .qms-arc-eyebrow-icon svg {
    color: #F5C842;
    filter: drop-shadow(0 0 8px rgba(245, 200, 66, 0.85));
}
body.vk .qms-arc-eyebrow-text {
    background: linear-gradient(90deg, #FFFAEC 0%, #F5C842 50%, #4FBDEF 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
body.vk .qms-arc-dot-1 {
    background: #F5C842;
    box-shadow: 0 0 6px rgba(245, 200, 66, 0.95);
}
body.vk .qms-arc-dot-2 {
    background: #6EE7AE;
    box-shadow: 0 0 6px rgba(110, 231, 174, 0.90);
}
body.vk .qms-arc-dot-3 {
    background: #4FBDEF;
    box-shadow: 0 0 6px rgba(79, 189, 239, 0.90);
}

body.vk .qms-arc-hero-title { color: #FFFAEC; }
body.vk .qms-arc-title-highlight {
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #B57E1A 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
body.vk .qms-arc-hero-sub { color: rgba(232, 220, 180, 0.78); }

/* Stat pills in hero */
body.vk .qms-arc-stat-total {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(245, 200, 66, 0.18);
    color: #F5F1E6;
}
body.vk .qms-arc-stat-live {
    background: rgba(63, 179, 120, 0.12);
    border-color: rgba(63, 179, 120, 0.40);
    color: #6EE7AE;
}
body.vk .qms-arc-stat-upcoming {
    background: rgba(245, 200, 66, 0.12);
    border-color: rgba(245, 200, 66, 0.40);
    color: #FFE89F;
}
body.vk .qms-arc-stat-closed {
    background: rgba(232, 220, 180, 0.05);
    border-color: rgba(232, 220, 180, 0.18);
    color: rgba(232, 220, 180, 0.55);
}
body.vk .qms-arc-stat-dot-live {
    background: #6EE7AE;
    box-shadow: 0 0 6px rgba(110, 231, 174, 0.90);
}
body.vk .qms-arc-stat-dot-upcoming {
    background: #F5C842;
    box-shadow: 0 0 6px rgba(245, 200, 66, 0.85);
}
body.vk .qms-arc-stat-dot-closed { background: rgba(232, 220, 180, 0.40); }

/* ---- Card grid (when shown on listing/related) ---- */
body.vk .qms-arc-card {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.01) 100%),
        rgba(8, 22, 32, 0.78);
    border: 1px solid rgba(245, 200, 66, 0.22);
    color: #F5F1E6;
}
body.vk .qms-arc-card:hover {
    color: #FFFAEC;
    box-shadow:
        0 24px 56px rgba(0, 0, 0, 0.55),
        0 0 32px rgba(245, 200, 66, 0.18);
}

/* Status-tinted cards */
body.vk .qms-card-live {
    border-color: rgba(63, 179, 120, 0.40);
    box-shadow: 0 4px 24px rgba(63, 179, 120, 0.12), 0 1px 4px rgba(0, 0, 0, 0.4);
}
body.vk .qms-card-live:hover {
    border-color: rgba(63, 179, 120, 0.70);
    box-shadow:
        0 14px 40px rgba(63, 179, 120, 0.30),
        0 0 0 1px rgba(245, 200, 66, 0.25) inset;
}
body.vk .qms-card-live .qms-card-glow {
    box-shadow: inset 0 0 40px rgba(63, 179, 120, 0.10);
    border: 1px solid rgba(63, 179, 120, 0.50);
}

body.vk .qms-card-upcoming {
    border-color: rgba(245, 200, 66, 0.35);
    box-shadow: 0 4px 24px rgba(245, 200, 66, 0.10), 0 1px 4px rgba(0, 0, 0, 0.4);
}
body.vk .qms-card-upcoming:hover {
    border-color: rgba(245, 200, 66, 0.70);
    box-shadow:
        0 14px 40px rgba(245, 200, 66, 0.28),
        0 0 0 1px rgba(255, 250, 236, 0.18) inset;
}
body.vk .qms-card-upcoming .qms-card-glow {
    box-shadow: inset 0 0 40px rgba(245, 200, 66, 0.10);
    border: 1px solid rgba(245, 200, 66, 0.50);
}

body.vk .qms-card-closed {
    border-color: rgba(230, 57, 70, 0.32);
}
body.vk .qms-card-closed:hover {
    border-color: rgba(230, 57, 70, 0.55);
    box-shadow:
        0 12px 36px rgba(200, 16, 46, 0.22),
        0 0 0 1px rgba(245, 200, 66, 0.18) inset;
}
body.vk .qms-card-closed .qms-card-glow {
    box-shadow: inset 0 0 36px rgba(230, 57, 70, 0.10);
    border: 1px solid rgba(230, 57, 70, 0.40);
}

/* Card thumbnail placeholders */
body.vk .qms-card-live .qms-card-thumb-placeholder {
    background: linear-gradient(135deg, #0F4A2D 0%, #1B6B47 100%);
}
body.vk .qms-card-upcoming .qms-card-thumb-placeholder {
    background: linear-gradient(135deg, #1A1208 0%, #B57E1A 100%);
}
body.vk .qms-card-closed .qms-card-thumb-placeholder {
    background: linear-gradient(135deg, #1E1117 0%, #4A1721 100%);
}
body.vk .qms-card-thumb-overlay {
    background: linear-gradient(to bottom, transparent 40%, rgba(3, 7, 15, 0.92) 100%);
}

/* Status badges */
body.vk .qms-arc-badge {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 250, 236, 0.20);
}
body.vk .qms-arc-badge.qms-badge-live {
    background: linear-gradient(135deg, #3FB378 0%, #1B6B47 100%);
    color: #fff;
    box-shadow: 0 4px 14px rgba(63, 179, 120, 0.45);
}
body.vk .qms-arc-badge.qms-badge-upcoming {
    background: linear-gradient(135deg, #FFE89F 0%, #F5C842 50%, #B57E1A 100%);
    color: #08160E;
    box-shadow: 0 4px 14px rgba(245, 200, 66, 0.45);
}
body.vk .qms-arc-badge.qms-badge-closed {
    background: linear-gradient(135deg, #E63946 0%, #C8102E 100%);
    color: #fff;
    box-shadow: 0 4px 14px rgba(200, 16, 46, 0.45);
}

/* Error state */
body.vk .qms-error {
    background: rgba(230, 57, 70, 0.12);
    border: 1px solid rgba(230, 57, 70, 0.32);
    color: #FF8FA3;
    border-radius: 12px;
    padding: 16px 20px;
    font-size: 14px;
    text-align: center;
}

/* Re-paint the quiz wrapper inside the single page so the inner quiz card sits on top of orbs cleanly */
body.vk .qms-single-page .qms-quiz-wrapper {
    background: linear-gradient(180deg, rgba(13, 24, 48, 0.65) 0%, rgba(7, 14, 28, 0.78) 100%);
    border: 1px solid rgba(245, 200, 66, 0.22);
    box-shadow:
        0 24px 60px rgba(0, 0, 0, 0.55),
        0 0 0 1px rgba(245, 200, 66, 0.10) inset,
        0 0 60px rgba(245, 200, 66, 0.10);
    backdrop-filter: blur(14px) saturate(140%);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
}

/* Mobile tweaks */
@media (max-width: 720px) {
    body.vk .qms-single-wrap { padding: 14px 12px 28px; }
    body.vk .qms-single-page .qms-quiz-wrapper { padding: 16px 12px 22px; border-radius: 16px; }
    body.vk .qms-arc-orb-1 { width: 320px; height: 320px; top: -80px; left: -100px; }
    body.vk .qms-arc-orb-2 { width: 280px; height: 280px; right: -80px; }
    body.vk .qms-arc-orb-3 { width: 240px; height: 240px; }
}

/* ============================================================
   40. LOTTERY LIVE PAGE — hide page header + restore footer
   /lottery-live/ uses the lms-lottery-wrapper (ivory paper theme)
   that contrasts with the site's dark navy footer. Need to:
   1. Hide the theme entry-header on this page
   2. Make sure the footer renders cleanly below the wrapper
   3. Ensure the page background continues to the footer
   ============================================================ */

/* Hide the page entry-header on lottery pages (matches the draw-admin pattern) */
body.page-lottery-live .entry-header.inner-common-header,
body.page-lottery-live > .entry-header.inner-common-header,
body.page.page-lottery-live .entry-header.inner-common-header,
body.vk:has(.lms-lottery-wrapper) .entry-header.inner-common-header,
body.vk:has(.lms-arc-page) .entry-header.inner-common-header {
    display: none !important;
}

/* Generic safety — any page that contains the lottery wrapper */
body.vk .lms-lottery-wrapper ~ * .entry-header.inner-common-header,
body.vk main:has(.lms-lottery-wrapper) ~ * .entry-header.inner-common-header,
body.vk main .entry-header.inner-common-header:has(~ * .lms-lottery-wrapper) {
    display: none !important;
}

/* Plain selector fallback (older browsers without :has()) — assume a slug-class match */
body.vk[class*="lottery"] .entry-header.inner-common-header,
body.vk[class*="lottery"] > .entry-header.inner-common-header {
    display: none !important;
}

/* Footer fix — ensure the wicket footer always renders below the lottery wrapper.
   The wrapper has a light cream/ivory bg; without a clear separator the dark
   footer can appear "cut off" or unstyled because of the contrast jump. */
body.vk .lms-lottery-wrapper {
    margin-bottom: 0 !important;
    padding-bottom: 24px !important;
}

/* Ensure the main content wrapper doesn't clip the footer underneath */
body.vk main:has(.lms-lottery-wrapper),
body.vk #vk-main:has(.lms-lottery-wrapper) {
    overflow: visible !important;
    padding-bottom: 0 !important;
    background: transparent !important;
}

/* Force the footer to be visible and properly stacked */
body.vk:has(.lms-lottery-wrapper) .vk-footer,
body.vk[class*="lottery"] .vk-footer {
    display: block !important;
    visibility: visible !important;
    position: relative !important;
    z-index: 5 !important;
    margin-top: 0 !important;
}

/* Add a clean transition divider between the ivory lottery section and dark footer */
body.vk .lms-lottery-wrapper + .vk-footer,
body.vk .lms-lottery-wrapper ~ .vk-footer {
    border-top: 2px solid rgba(245, 200, 66, 0.40);
    box-shadow: 0 -8px 32px rgba(245, 200, 66, 0.10);
}

/* If the lottery is inside an Elementor/main wrapper, ensure proper spacing */
body.vk .lms-lottery-wrapper + footer,
body.vk .lms-lottery-wrapper ~ footer {
    margin-top: 0 !important;
}

/* ============================================================
   43. LOTTERY PAGE — full dark-luxe recolor
   Overrides the cream/paper theme to match the site's
   midnight + champagne + emerald + crimson palette.
   ============================================================ */

/* Override the wrapper's CSS variables — cascades to most elements */
body.vk .lms-lottery-wrapper {
    /* Surfaces */
    --noir-1:        #0A1628;
    --noir-2:        #0E2517;
    --noir-3:        #143523;
    --noir-soft:     #1A2A1F;

    /* Champagne gold (was olive #d4af37) */
    --gold-50:       #FFFAEC;
    --gold-100:      #FFE89F;
    --gold-300:      #F5C842;
    --gold-400:      #F5C842;
    --gold-500:      #F5C842;
    --gold-600:      #B57E1A;
    --gold-700:      #B57E1A;
    --gold-grad:     linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #B57E1A 100%);

    /* Paper → dark glass */
    --cream:         rgba(13, 24, 48, 0.85);
    --paper:         rgba(8, 22, 32, 0.85);
    --hairline:      rgba(245, 200, 66, 0.22);
    --hairline-soft: rgba(245, 200, 66, 0.12);

    /* Text — invert: was dark on light, now cream on dark */
    --ink:           #F5F1E6;
    --ink-soft:      rgba(232, 220, 180, 0.78);
    --ink-mute:      rgba(232, 220, 180, 0.55);

    /* Brand accents */
    --velvet:        #E63946;
    --emerald:       #3FB378;
    --accent:        #F5C842;
    --accent-soft:   rgba(245, 200, 66, 0.14);

    --shadow-1:    0 1px 2px rgba(0, 0, 0, 0.30), 0 4px 12px rgba(0, 0, 0, 0.40);
    --shadow-2:    0 8px 24px -8px rgba(0, 0, 0, 0.55), 0 2px 8px rgba(0, 0, 0, 0.35);
    --shadow-gold: 0 0 0 1px rgba(245, 200, 66, 0.32), 0 12px 28px -8px rgba(245, 200, 66, 0.30);

    color: #F5F1E6;
}

/* Page wrapper background — full dark luxe with ambient glow */
body.vk .lms-lottery-wrapper {
    background:
        radial-gradient(60% 50% at 12% 0%, rgba(245, 200, 66, 0.10) 0%, transparent 60%),
        radial-gradient(50% 60% at 88% 30%, rgba(63, 179, 120, 0.10) 0%, transparent 65%),
        radial-gradient(55% 60% at 50% 100%, rgba(230, 57, 70, 0.06) 0%, transparent 65%),
        linear-gradient(180deg, #0A1628 0%, #060E1C 60%, #03070F 100%);
    border-radius: 20px;
    padding: 24px 18px 32px;
    margin: 24px auto;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55);
}

/* ---- Hero ---- */
body.vk .lms-hero {
    color: #F5F1E6;
    background: radial-gradient(ellipse at top, #143523 0%, #0A1628 70%);
    border: 1px solid rgba(245, 200, 66, 0.32);
    box-shadow:
        0 24px 60px rgba(0, 0, 0, 0.55),
        0 0 60px rgba(245, 200, 66, 0.10);
}
body.vk .lms-hero-title { color: #FFFAEC; }
body.vk .lms-hero-tag { color: #FFE89F; }
body.vk .lms-hero-meta { color: rgba(232, 220, 180, 0.78); }

/* ---- State chip (LIVE / UPCOMING / CLOSED) ---- */
body.vk .lms-state-chip {
    background: rgba(8, 22, 32, 0.65);
    border: 1px solid rgba(245, 200, 66, 0.32);
}
body.vk .lms-state-chip-live {
    background: rgba(63, 179, 120, 0.14);
    border-color: rgba(63, 179, 120, 0.55);
    color: #6EE7AE;
}
body.vk .lms-state-chip-upcoming {
    background: rgba(79, 189, 239, 0.14);
    border-color: rgba(79, 189, 239, 0.55);
    color: #4FBDEF;
}
body.vk .lms-state-chip-closed {
    background: rgba(230, 57, 70, 0.14);
    border-color: rgba(230, 57, 70, 0.55);
    color: #FF8FA3;
}

/* ---- Grand Prize banner ---- */
body.vk .lms-grand-prize {
    background:
        radial-gradient(60% 100% at 50% 0%, rgba(245, 200, 66, 0.20) 0%, transparent 60%),
        linear-gradient(180deg, rgba(13, 24, 48, 0.85) 0%, rgba(7, 14, 28, 0.95) 100%);
    border: 1px solid rgba(245, 200, 66, 0.45);
    color: #F5F1E6;
    box-shadow:
        0 24px 60px rgba(0, 0, 0, 0.55),
        0 0 40px rgba(245, 200, 66, 0.18);
}
body.vk .lms-gp-title {
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #B57E1A 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}
body.vk .lms-gp-label { color: rgba(232, 220, 180, 0.55); }
body.vk .lms-gp-text { color: #FFE89F; }

/* ---- Meta pills ---- */
body.vk .lms-meta-pill {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01)),
        rgba(8, 22, 32, 0.65);
    border: 1px solid rgba(245, 200, 66, 0.22);
    color: #F5F1E6;
}
body.vk .lms-meta-num {
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #B57E1A 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-weight: 800;
}
body.vk .lms-meta-lbl { color: rgba(232, 220, 180, 0.55); }

/* ---- Result banner ---- */
body.vk .lms-result-banner {
    background:
        radial-gradient(60% 100% at 50% 0%, rgba(63, 179, 120, 0.18) 0%, transparent 60%),
        linear-gradient(180deg, rgba(13, 38, 28, 0.85) 0%, rgba(8, 22, 14, 0.95) 100%);
    border: 1px solid rgba(63, 179, 120, 0.45);
    color: #ECFFF4;
}
body.vk .lms-result-banner-glyph {
    background: linear-gradient(135deg, #6EE7AE, #1B6B47);
    color: #fff;
}
body.vk .lms-result-banner strong { color: #FFFAEC; }
body.vk .lms-result-banner span { color: rgba(150, 232, 195, 0.85); }

/* ---- Tabs (must beat the plugin's !important rules on button.lms-tab) ---- */
body.vk .lms-tabs-wrap {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01)),
        rgba(8, 22, 32, 0.65);
    border: 1px solid rgba(245, 200, 66, 0.22);
    border-radius: 14px;
}
body.vk .lms-lottery-wrapper button.lms-tab,
body.vk .lms-lottery-wrapper .lms-tab {
    background: transparent !important;
    color: rgba(232, 220, 180, 0.60) !important;
    border-right-color: rgba(245, 200, 66, 0.18) !important;
}
body.vk .lms-lottery-wrapper button.lms-tab:hover,
body.vk .lms-lottery-wrapper .lms-tab:hover {
    background: rgba(245, 200, 66, 0.08) !important;
    color: #FFE89F !important;
}
body.vk .lms-lottery-wrapper button.lms-tab.is-active,
body.vk .lms-lottery-wrapper .lms-tab.is-active {
    background: linear-gradient(135deg, #FFE89F 0%, #F5C842 50%, #B57E1A 100%) !important;
    color: #08160E !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.40),
        0 6px 18px rgba(245, 200, 66, 0.45) !important;
}
body.vk .lms-lottery-wrapper button.lms-tab.is-active .lms-tab-text,
body.vk .lms-lottery-wrapper .lms-tab.is-active .lms-tab-text {
    color: #08160E !important;
    font-weight: 800;
}
body.vk .lms-lottery-wrapper button.lms-tab.is-active .lms-tab-icon,
body.vk .lms-lottery-wrapper .lms-tab.is-active .lms-tab-icon {
    color: #08160E !important;
}
body.vk .lms-tabs-indicator {
    background: linear-gradient(90deg, #F5C842, #FFE89F) !important;
    box-shadow: 0 0 10px rgba(245, 200, 66, 0.85);
}

/* ---- Info card (Prizes + Rules) ---- */
body.vk .lms-info-card {
    background:
        radial-gradient(circle at top right, rgba(245, 200, 66, 0.08), transparent 60%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01)),
        rgba(8, 22, 32, 0.78);
    border: 1px solid rgba(245, 200, 66, 0.22);
    color: #F5F1E6;
}
body.vk .lms-info-card::before {
    background: linear-gradient(90deg, transparent, #F5C842 50%, transparent);
    height: 1px;
}
body.vk .lms-info-card::after {
    background-image: radial-gradient(circle, rgba(245, 200, 66, 0.14) 1px, transparent 1.4px);
}
body.vk .lms-info-corner {
    border-color: rgba(245, 200, 66, 0.45) !important;
}
body.vk .lms-info-card-eyebrow {
    color: #FFE89F;
    background: rgba(245, 200, 66, 0.10);
    border: 1px solid rgba(245, 200, 66, 0.32);
    border-radius: 999px;
    padding: 4px 12px;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
body.vk .lms-info-card-titles { color: #FFFAEC; }
body.vk .lms-info-glyph {
    background: linear-gradient(135deg, rgba(245, 200, 66, 0.20), rgba(245, 200, 66, 0.04));
    border: 1px solid rgba(245, 200, 66, 0.40);
    color: #F5C842;
}

/* ---- Prizes list ---- */
body.vk .lms-prize-item {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(245, 200, 66, 0.18);
    color: #F5F1E6;
    transition: border-color .25s ease, background .25s ease, transform .25s ease;
}
body.vk .lms-prize-item:hover {
    border-color: rgba(245, 200, 66, 0.55);
    background: rgba(245, 200, 66, 0.06);
    transform: translateX(3px);
}
body.vk .lms-prize-rank-disc {
    background: linear-gradient(135deg, #FFE89F 0%, #F5C842 50%, #B57E1A 100%);
    color: #08160E;
    box-shadow: 0 4px 14px rgba(245, 200, 66, 0.40);
}
body.vk .lms-prize-rank-num { color: inherit; }
body.vk .lms-prize-rank-ring { border-color: rgba(245, 200, 66, 0.45); }
body.vk .lms-prize-tier-label { color: #FFE89F; }
body.vk .lms-prize-name { color: #FFFAEC; }
body.vk .lms-prize-desc { color: rgba(232, 220, 180, 0.78); }
/* Prize count badge — premium glass card with gold gradient number */
body.vk .lms-prize-count {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 10px 14px;
    min-width: 68px;
    border-radius: 12px;
    background:
        radial-gradient(80% 100% at 50% 0%, rgba(245, 200, 66, 0.12) 0%, transparent 70%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.01) 100%),
        rgba(8, 22, 32, 0.85);
    border: 1px solid rgba(245, 200, 66, 0.32);
    line-height: 1;
    box-shadow:
        inset 0 1px 0 rgba(255, 250, 236, 0.08),
        0 4px 12px rgba(0, 0, 0, 0.30);
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
body.vk .lms-prize-count:hover {
    transform: translateY(-2px);
    border-color: rgba(245, 200, 66, 0.55);
    box-shadow:
        inset 0 1px 0 rgba(255, 250, 236, 0.15),
        0 8px 22px rgba(0, 0, 0, 0.45),
        0 0 18px rgba(245, 200, 66, 0.25);
}
body.vk .lms-prize-count strong {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 24px;
    font-weight: 800;
    line-height: 1.15;
    padding-top: 2px;
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #B57E1A 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    letter-spacing: -0.01em;
    text-shadow: 0 2px 12px rgba(245, 200, 66, 0.20);
    overflow: visible;
}
body.vk .lms-prize-count span {
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.20em;
    text-transform: uppercase;
    color: #FFE89F;
    margin-top: 2px;
    line-height: 1.3;
}

/* ---- Rules body ---- */
body.vk .lms-rules-body {
    color: #F5F1E6;
}
body.vk .lms-rules-body strong { color: #FFFAEC; }
body.vk .lms-rules-body em { color: #FFE89F; font-style: italic; }
body.vk .lms-rules-body a { color: #6EE7AE; }
body.vk .lms-rules-body a:hover { color: #FFE89F; }
body.vk .lms-rules-body ol > li {
    border-bottom: 1px dashed rgba(245, 200, 66, 0.18);
    color: rgba(232, 220, 180, 0.85);
}
body.vk .lms-rules-body ol > li::before {
    background: linear-gradient(135deg, #FFE89F, #F5C842);
    color: #08160E;
}

/* ---- Rules footer (eligibility note) ---- */
body.vk .lms-rules-footer {
    background: rgba(245, 200, 66, 0.06);
    border-top: 1px dashed rgba(245, 200, 66, 0.22);
    color: rgba(232, 220, 180, 0.75);
}
body.vk .lms-rules-footer-text { color: #FFE89F; }
body.vk .lms-rules-footer-line {
    background: linear-gradient(90deg, transparent, rgba(245, 200, 66, 0.45), transparent);
}
body.vk .lms-eligibility-note {
    color: rgba(232, 220, 180, 0.75);
    background: rgba(79, 189, 239, 0.08);
    border-left: 3px solid #4FBDEF;
}
body.vk .lms-note-glyph { color: #4FBDEF; }

/* ---- Brand mark (top of wrapper) ---- */
body.vk .lms-brand-mark {
    background:
        linear-gradient(180deg, rgba(245, 200, 66, 0.08) 0%, rgba(8, 22, 32, 0.85) 100%);
    border: 1px solid rgba(245, 200, 66, 0.32);
    color: #F5F1E6;
}
body.vk .lms-brand-tag {
    color: #FFE89F;
    font-weight: 700;
}
body.vk .lms-brand-divider { background: rgba(245, 200, 66, 0.25); }

/* ---- Hero corners (decorative L brackets) ---- */
body.vk .lms-hero-corner {
    border-color: rgba(245, 200, 66, 0.55) !important;
}

/* ---- Hero sparks (decorative dots) ---- */
body.vk .lms-hero-spark { background: #F5C842; box-shadow: 0 0 10px rgba(245, 200, 66, 0.85); }

/* ---- State row (live indicator) ---- */
body.vk .lms-state-row { color: rgba(232, 220, 180, 0.85); }
body.vk .lms-state-bullet { background: #F5C842; box-shadow: 0 0 10px rgba(245, 200, 66, 0.85); }

/* ---- Submit / form buttons inside lottery — premium red ---- */
body.vk .lms-lottery-wrapper button[type="submit"],
body.vk .lms-submit-btn {
    background: linear-gradient(135deg, #F26B7E 0%, #E63946 35%, #C8102E 70%, #8B0F1F 100%) !important;
    border: 1px solid rgba(245, 200, 66, 0.45) !important;
    color: #FFFAEC !important;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.30) !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.28),
        0 12px 28px rgba(200, 16, 46, 0.45) !important;
}
body.vk .lms-lottery-wrapper button[type="submit"]:hover,
body.vk .lms-submit-btn:hover {
    transform: translateY(-2px);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.40),
        0 18px 40px rgba(200, 16, 46, 0.60),
        0 0 32px rgba(245, 200, 66, 0.20) !important;
}

/* ---- Form inputs inside lottery ---- */
body.vk .lms-lottery-wrapper input[type="text"],
body.vk .lms-lottery-wrapper input[type="tel"],
body.vk .lms-lottery-wrapper input[type="email"],
body.vk .lms-lottery-wrapper input[type="number"],
body.vk .lms-lottery-wrapper textarea,
body.vk .lms-lottery-wrapper select {
    background: rgba(8, 22, 32, 0.65) !important;
    border: 1px solid rgba(245, 200, 66, 0.22) !important;
    color: #F5F1E6 !important;
    border-radius: 10px !important;
}
body.vk .lms-lottery-wrapper input:focus,
body.vk .lms-lottery-wrapper textarea:focus,
body.vk .lms-lottery-wrapper select:focus {
    border-color: rgba(245, 200, 66, 0.65) !important;
    box-shadow: 0 0 0 3px rgba(245, 200, 66, 0.18) !important;
    outline: none !important;
}
body.vk .lms-lottery-wrapper input::placeholder,
body.vk .lms-lottery-wrapper textarea::placeholder {
    color: rgba(232, 220, 180, 0.40) !important;
}
body.vk .lms-lottery-wrapper label {
    color: rgba(232, 220, 180, 0.85) !important;
}

/* Decorative ornament (gold line + diamond divider in template) */
body.vk .lms-ornament-line {
    background: linear-gradient(90deg, transparent, rgba(245, 200, 66, 0.55), transparent);
}
body.vk .lms-ornament-diamond {
    background: linear-gradient(135deg, #F5C842, #FFFAEC);
    box-shadow: 0 0 14px rgba(245, 200, 66, 0.85);
}

/* Card title — fix truncation: allow 3 lines + Bengali-safe line-height */
body.vk .lms-card-title {
    font-size: 18px;
    line-height: 1.45;
    color: #FFFAEC;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    min-height: 0;
    max-height: none;
    padding-top: 2px;
    overflow: visible;
    word-break: break-word;
    overflow-wrap: anywhere;
    white-space: normal;
    text-overflow: clip;
}

/* ============================================================
   44. LOTTERY READABILITY — fix dark-on-dark / light-on-light
   The plugin has many hardcoded light backgrounds (#fff, #fef*)
   and dark text colors (#2a1a02, #7f1d1d, #14182f) designed for
   the original cream/paper theme. Without this layer, retoning
   the vars to dark made some elements invisible. Override every
   hardcoded combo below so all text reads cleanly on dark bg.
   ============================================================ */

/* === Override hardcoded LIGHT backgrounds → dark navy glass === */
body.vk .lms-lottery-wrapper [style*="background: #fff"],
body.vk .lms-lottery-wrapper [style*="background:#fff"] {
    background: rgba(8, 22, 32, 0.78) !important;
}
body.vk .lms-result-error {
    background: linear-gradient(180deg, rgba(230, 57, 70, 0.10), rgba(230, 57, 70, 0.04)) !important;
    border-color: rgba(230, 57, 70, 0.45) !important;
    color: #FF8FA3 !important;
}
body.vk .lms-result-info {
    background: rgba(8, 22, 32, 0.65) !important;
    color: #F5F1E6 !important;
    border-color: rgba(245, 200, 66, 0.22) !important;
}

/* Result cards on light bg */
body.vk .lms-lottery-wrapper [class*="-result"] {
    color: #F5F1E6;
}

/* Tier heads (1st, 2nd, 3rd) — were cream gradients, retone to gold/silver/bronze */
body.vk .lms-tier-rank-1 .lms-tier-head {
    background: linear-gradient(135deg, rgba(255, 232, 159, 0.20), rgba(245, 200, 66, 0.10)) !important;
    color: #FFE89F !important;
    border-color: rgba(245, 200, 66, 0.40) !important;
}
body.vk .lms-tier-rank-2 .lms-tier-head {
    background: linear-gradient(135deg, rgba(232, 220, 180, 0.14), rgba(180, 175, 155, 0.06)) !important;
    color: #E8DCB4 !important;
    border-color: rgba(232, 220, 180, 0.32) !important;
}
body.vk .lms-tier-rank-3 .lms-tier-head {
    background: linear-gradient(135deg, rgba(254, 215, 170, 0.18), rgba(180, 90, 30, 0.08)) !important;
    color: #FFB347 !important;
    border-color: rgba(255, 179, 71, 0.40) !important;
}
body.vk .lms-tier-rank-1 .lms-prize-tier-label,
body.vk .lms-tier-rank-2 .lms-prize-tier-label,
body.vk .lms-tier-rank-3 .lms-prize-tier-label { color: inherit !important; }

/* Tier-specific borders that were light-themed colors */
body.vk .lms-prize-rank-2 .lms-prize-tier-label { color: #E8DCB4 !important; }
body.vk .lms-prize-rank-3 .lms-prize-tier-label { color: #FFB347 !important; }

/* === Tooltips / pills that had light bg + dark text === */
body.vk .lms-lottery-wrapper [class*="tooltip"],
body.vk .lms-lottery-wrapper [class*="-tip"]:not(input):not(textarea),
body.vk .lms-lottery-wrapper [class*="popover"] {
    background: linear-gradient(135deg, rgba(13, 24, 48, 0.92), rgba(7, 14, 28, 0.96)) !important;
    color: #F5F1E6 !important;
    border-color: rgba(245, 200, 66, 0.40) !important;
}

/* === Force readable text on common content elements === */
body.vk .lms-lottery-wrapper p,
body.vk .lms-lottery-wrapper li,
body.vk .lms-lottery-wrapper td,
body.vk .lms-lottery-wrapper th,
body.vk .lms-lottery-wrapper dt,
body.vk .lms-lottery-wrapper dd,
body.vk .lms-lottery-wrapper span:not([class*="--gold"]):not([class*="-gold"]):not([class*="-num"]):not([class*="-meta-num"]):not([class*="-tag"]):not([class*="rank-num"]),
body.vk .lms-lottery-wrapper div:not([class*="bg"]):not([class*="banner"]):not([class*="hero"]) {
    color: inherit;
}
body.vk .lms-lottery-wrapper {
    color: #F5F1E6 !important;
}
body.vk .lms-lottery-wrapper p {
    color: rgba(232, 220, 180, 0.85);
}
body.vk .lms-lottery-wrapper h1,
body.vk .lms-lottery-wrapper h2,
body.vk .lms-lottery-wrapper h3,
body.vk .lms-lottery-wrapper h4,
body.vk .lms-lottery-wrapper h5,
body.vk .lms-lottery-wrapper h6 {
    color: #FFFAEC;
}
body.vk .lms-lottery-wrapper strong { color: #FFFAEC; }
body.vk .lms-lottery-wrapper em { color: #FFE89F; }
body.vk .lms-lottery-wrapper small { color: rgba(232, 220, 180, 0.65); }

/* Tables (winners list, etc.) */
body.vk .lms-lottery-wrapper table {
    background: rgba(8, 22, 32, 0.55);
    color: #F5F1E6;
}
body.vk .lms-lottery-wrapper table thead {
    background: rgba(245, 200, 66, 0.10);
    color: #FFFAEC;
}
body.vk .lms-lottery-wrapper table tbody tr {
    border-bottom: 1px dashed rgba(245, 200, 66, 0.14);
}
body.vk .lms-lottery-wrapper table tbody tr:hover {
    background: rgba(245, 200, 66, 0.06);
}
body.vk .lms-lottery-wrapper table th { color: #FFE89F; }
body.vk .lms-lottery-wrapper table td { color: #F5F1E6; }

/* Help/note text that was muted */
body.vk .lms-lottery-wrapper .help-text,
body.vk .lms-lottery-wrapper .note-text,
body.vk .lms-lottery-wrapper [class*="-note"]:not(:has(input)):not(:has(textarea)) {
    color: rgba(232, 220, 180, 0.78);
}

/* Date/timestamp elements */
body.vk .lms-lottery-wrapper time,
body.vk .lms-lottery-wrapper [class*="-date"],
body.vk .lms-lottery-wrapper [class*="-time"] {
    color: rgba(232, 220, 180, 0.85);
}

/* Force dark-text-on-gold-bg elements to keep their dark text
   (these are intentional — gold buttons/badges with #2a1a02 text are readable) */
body.vk .lms-lottery-wrapper .lms-tab.is-active,
body.vk .lms-lottery-wrapper .lms-prize-rank-disc,
body.vk .lms-lottery-wrapper .lms-submit-btn-gold {
    color: #08160E !important;
}

/* Badges that had dark text on red bg (was #7f1d1d) — re-tone */
body.vk .lms-lottery-wrapper [class*="-badge-error"],
body.vk .lms-lottery-wrapper [class*="-error-badge"] {
    background: rgba(230, 57, 70, 0.16);
    border-color: rgba(230, 57, 70, 0.45);
    color: #FF8FA3;
}

/* Cyan tinted upcoming badges (was light blue + light text) */
body.vk .lms-state-chip-upcoming,
body.vk .lms-badge-upcoming {
    background: rgba(79, 189, 239, 0.14);
    border-color: rgba(79, 189, 239, 0.55) !important;
    color: #4FBDEF !important;
}

/* Generic catch-all: any element using --ink as text on bg that's dark navy
   (we already set --ink to cream, but some inline color: #14182f sneaks in) */
body.vk .lms-lottery-wrapper [style*="color: #14182f"],
body.vk .lms-lottery-wrapper [style*="color:#14182f"],
body.vk .lms-lottery-wrapper [style*="color: #2a1a02"],
body.vk .lms-lottery-wrapper [style*="color:#2a1a02"] {
    color: #F5F1E6 !important;
}

/* Ensure links inside lottery wrapper are visible */
body.vk .lms-lottery-wrapper a:not([class*="btn"]):not(.lms-tab):not([class*="-rank"]) {
    color: #FFE89F;
    transition: color .25s ease;
}
body.vk .lms-lottery-wrapper a:not([class*="btn"]):not(.lms-tab):not([class*="-rank"]):hover {
    color: #6EE7AE;
}

/* Notification / alert text */
body.vk .lms-lottery-wrapper .lms-notice,
body.vk .lms-lottery-wrapper .lms-alert,
body.vk .lms-lottery-wrapper [class*="-message"] {
    color: #F5F1E6 !important;
}
body.vk .lms-lottery-wrapper .lms-notice-success,
body.vk .lms-lottery-wrapper [class*="-success"] {
    background: rgba(63, 179, 120, 0.10) !important;
    border-color: rgba(63, 179, 120, 0.45) !important;
    color: #6EE7AE !important;
}
body.vk .lms-lottery-wrapper .lms-notice-error,
body.vk .lms-lottery-wrapper [class*="-error"]:not(input):not(textarea) {
    background: rgba(230, 57, 70, 0.10);
    border-color: rgba(230, 57, 70, 0.45);
    color: #FF8FA3;
}
body.vk .lms-lottery-wrapper .lms-notice-warning,
body.vk .lms-lottery-wrapper [class*="-warning"]:not(input):not(textarea) {
    background: rgba(255, 179, 71, 0.10);
    border-color: rgba(255, 179, 71, 0.45);
    color: #FFB347;
}

/* Card body / content paragraphs */
body.vk .lms-lottery-wrapper .lms-card-body,
body.vk .lms-lottery-wrapper [class*="-content"]:not([class*="hero"]):not([class*="banner"]) {
    color: #F5F1E6;
}

/* ============================================================
   45. LOTTERY ARCHIVE PAGE — /lottery/ — full dark luxe recolor
   The .lms-archive-shell has its own CSS-var scope (separate from
   the single .lms-lottery-wrapper), so we override it here.
   ============================================================ */

/* Override archive shell variables → site palette */
body.vk .lms-archive-shell {
    --noir-1:        #0A1628;
    --noir-2:        #0E2517;
    --noir-3:        #143523;

    --gold-50:       #FFFAEC;
    --gold-100:      #FFE89F;
    --gold-300:      #F5C842;
    --gold-400:      #F5C842;
    --gold-500:      #F5C842;
    --gold-600:      #B57E1A;
    --gold-700:      #B57E1A;
    --gold-grad:     linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #B57E1A 100%);

    --cream:         rgba(13, 24, 48, 0.85);
    --paper:         rgba(8, 22, 32, 0.85);
    --hairline:      rgba(245, 200, 66, 0.22);

    --ink:           #F5F1E6;
    --ink-soft:      rgba(232, 220, 180, 0.78);
    --ink-mute:      rgba(232, 220, 180, 0.55);

    --shadow-1:    0 1px 2px rgba(0, 0, 0, 0.30), 0 4px 12px rgba(0, 0, 0, 0.40);
    --shadow-2:    0 8px 24px -8px rgba(0, 0, 0, 0.55), 0 2px 8px rgba(0, 0, 0, 0.35);

    /* Replace flat paper bg with site's premium dark gradient */
    background:
        radial-gradient(60% 40% at 12% 0%, rgba(245, 200, 66, 0.10) 0%, transparent 55%),
        radial-gradient(50% 50% at 88% 30%, rgba(63, 179, 120, 0.10) 0%, transparent 60%),
        radial-gradient(55% 50% at 50% 100%, rgba(230, 57, 70, 0.06) 0%, transparent 65%),
        linear-gradient(180deg, #0A1628 0%, #060E1C 50%, #03070F 100%) !important;
    color: #F5F1E6 !important;
    margin: 0 !important;
    padding-bottom: 60px !important;
}

/* ---- Archive hero ---- */
body.vk .lms-archive-hero {
    background:
        radial-gradient(ellipse at top, rgba(20, 53, 35, 0.8) 0%, rgba(10, 22, 40, 0.95) 70%) !important;
    box-shadow:
        0 1px 0 rgba(245, 200, 66, 0.30) inset,
        0 -1px 0 rgba(245, 200, 66, 0.30) inset,
        0 0 60px rgba(245, 200, 66, 0.10) inset !important;
}
body.vk .lms-archive-hero .lms-hero-veil {
    background: linear-gradient(180deg, transparent 0%, rgba(3, 7, 15, 0.55) 70%, rgba(3, 7, 15, 0.92) 100%) !important;
}
body.vk .lms-archive-hero .lms-hero-pattern {
    background-image: radial-gradient(circle, rgba(245, 200, 66, 0.14) 1px, transparent 1.4px) !important;
}
body.vk .lms-archive-hero .lms-hero-spark {
    background: #F5C842 !important;
    box-shadow: 0 0 14px rgba(245, 200, 66, 0.85) !important;
}
body.vk .lms-archive-hero .lms-hero-corner::before,
body.vk .lms-archive-hero .lms-hero-corner::after {
    background: #F5C842 !important;
    box-shadow: 0 0 8px rgba(245, 200, 66, 0.55) !important;
}
body.vk .lms-archive-hero .lms-state-chip {
    background: rgba(245, 200, 66, 0.10);
    border-color: rgba(245, 200, 66, 0.45) !important;
    color: #FFE89F !important;
}
body.vk .lms-archive-h1 {
    color: #FFFAEC;
    background: linear-gradient(110deg, #FFFAEC 0%, #F5C842 50%, #FFE89F 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
body.vk .lms-archive-tag {
    color: rgba(232, 220, 180, 0.78);
}

/* ---- Hero stats — gold, emerald, cyan accents ---- */
body.vk .lms-archive-hero .lms-hero-stats {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 24px;
}
body.vk .lms-stat-card {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01)),
        rgba(8, 22, 32, 0.78) !important;
    border: 1px solid rgba(245, 200, 66, 0.22) !important;
    color: #F5F1E6 !important;
    border-radius: 12px;
    padding: 14px 18px;
    backdrop-filter: blur(8px);
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
body.vk .lms-stat-card:hover {
    transform: translateY(-3px);
    border-color: rgba(245, 200, 66, 0.55) !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45), 0 0 24px rgba(245, 200, 66, 0.18);
}
body.vk .lms-stat-live {
    border-color: rgba(63, 179, 120, 0.45) !important;
}
body.vk .lms-stat-live:hover {
    border-color: rgba(63, 179, 120, 0.70) !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45), 0 0 24px rgba(63, 179, 120, 0.30);
}
body.vk .lms-stat-upcoming {
    border-color: rgba(79, 189, 239, 0.45) !important;
}
body.vk .lms-stat-upcoming:hover {
    border-color: rgba(79, 189, 239, 0.70) !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45), 0 0 24px rgba(79, 189, 239, 0.30);
}
body.vk .lms-stat-closed {
    border-color: rgba(230, 57, 70, 0.32) !important;
    opacity: 0.85;
}
body.vk .lms-stat-eyebrow {
    color: rgba(232, 220, 180, 0.55) !important;
    font-size: 9.5px !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase;
}
body.vk .lms-stat-num {
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #B57E1A 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent !important;
    font-weight: 800 !important;
}
body.vk .lms-stat-live .lms-stat-num {
    background: linear-gradient(135deg, #6EE7AE 0%, #3FB378 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent !important;
}
body.vk .lms-stat-upcoming .lms-stat-num {
    background: linear-gradient(135deg, #4FBDEF 0%, #2A6FAA 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent !important;
}
body.vk .lms-stat-closed .lms-stat-num {
    background: linear-gradient(135deg, #FF8FA3 0%, #C8102E 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent !important;
}
body.vk .lms-stat-lbl {
    color: rgba(232, 220, 180, 0.78) !important;
}
body.vk .lms-stat-sep {
    background: rgba(245, 200, 66, 0.18);
}

/* ---- Filter bar ---- */
body.vk .lms-filter-bar {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01)),
        rgba(8, 22, 32, 0.65) !important;
    border: 1px solid rgba(245, 200, 66, 0.22) !important;
    border-radius: 14px !important;
    padding: 8px;
}
body.vk .lms-filter-pill {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(245, 200, 66, 0.18) !important;
    color: rgba(232, 220, 180, 0.65) !important;
    transition: background .22s ease, border-color .22s ease, color .22s ease;
}
body.vk .lms-filter-pill:hover {
    background: rgba(245, 200, 66, 0.10) !important;
    border-color: rgba(245, 200, 66, 0.45) !important;
    color: #FFE89F !important;
}
body.vk .lms-filter-pill.is-active {
    background: linear-gradient(135deg, #FFE89F 0%, #F5C842 50%, #B57E1A 100%) !important;
    border-color: rgba(245, 200, 66, 0.85) !important;
    color: #08160E !important;
    box-shadow: 0 6px 18px rgba(245, 200, 66, 0.40) !important;
}
body.vk .lms-pill-icon {
    color: inherit !important;
}
body.vk .lms-pill-dot-live {
    background: #6EE7AE !important;
    box-shadow: 0 0 8px rgba(110, 231, 174, 0.85) !important;
}
body.vk .lms-pill-count {
    background: rgba(245, 200, 66, 0.16) !important;
    color: #FFE89F !important;
    border: 1px solid rgba(245, 200, 66, 0.32) !important;
}
body.vk .lms-filter-pill.is-active .lms-pill-count {
    background: rgba(8, 22, 32, 0.40) !important;
    color: #08160E !important;
    border-color: rgba(8, 22, 32, 0.55) !important;
}
body.vk .lms-filter-empty {
    color: rgba(232, 220, 180, 0.55) !important;
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px dashed rgba(245, 200, 66, 0.20) !important;
}

/* ---- Container ---- */
body.vk .lms-archive-container {
    color: #F5F1E6;
}
body.vk .lms-archive-grid {
    background: transparent !important;
}

/* ---- Empty state ---- */
body.vk .lms-empty-state {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01)),
        rgba(8, 22, 32, 0.65) !important;
    border: 1px solid rgba(245, 200, 66, 0.22) !important;
    color: #F5F1E6 !important;
}
body.vk .lms-empty-glyph {
    background: rgba(245, 200, 66, 0.14) !important;
    border: 1px solid rgba(245, 200, 66, 0.40) !important;
    color: #F5C842 !important;
}

/* ---- Pagination ---- */
body.vk .lms-archive-pagination {
    border-color: rgba(245, 200, 66, 0.22) !important;
}
body.vk .lms-pg-item {
    background: rgba(255, 255, 255, 0.04) !important;
    border: 1px solid rgba(245, 200, 66, 0.22) !important;
    color: rgba(232, 220, 180, 0.78) !important;
    transition: all .22s ease;
}
body.vk .lms-pg-item:hover {
    background: rgba(245, 200, 66, 0.10) !important;
    border-color: rgba(245, 200, 66, 0.55) !important;
    color: #FFE89F !important;
}
body.vk .lms-pg-item.is-active,
body.vk .lms-pg-item.current {
    background: linear-gradient(135deg, #FFE89F 0%, #F5C842 50%, #B57E1A 100%) !important;
    border-color: rgba(245, 200, 66, 0.85) !important;
    color: #08160E !important;
    box-shadow: 0 6px 18px rgba(245, 200, 66, 0.40) !important;
}

/* ---- Archive cards (the qms-arc-card already styled, but archive uses its own .lms- variants) ---- */
body.vk .lms-archive-shell .qms-arc-card,
body.vk .lms-archive-shell [class*="lottery-card"],
body.vk .lms-archive-shell [class*="-card"]:not([class*="stat-card"]):not([class*="info-card"]) {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.01)),
        rgba(8, 22, 32, 0.78) !important;
    border-color: rgba(245, 200, 66, 0.22) !important;
    color: #F5F1E6 !important;
}

/* ---- Archive ornaments ---- */
body.vk .lms-archive-shell .lms-ornament-line {
    background: linear-gradient(90deg, transparent, rgba(245, 200, 66, 0.55), transparent) !important;
}
body.vk .lms-archive-shell .lms-ornament-diamond {
    background: linear-gradient(135deg, #F5C842, #FFFAEC) !important;
    box-shadow: 0 0 14px rgba(245, 200, 66, 0.85) !important;
}

/* ---- Brand mark / brand footer inside archive ---- */
body.vk .lms-archive-shell .lms-brand-mark {
    background: linear-gradient(180deg, rgba(245, 200, 66, 0.08), rgba(8, 22, 32, 0.85)) !important;
    border: 1px solid rgba(245, 200, 66, 0.32) !important;
    color: #F5F1E6 !important;
}
body.vk .lms-archive-shell .lms-brand-tag { color: #FFE89F !important; }
body.vk .lms-archive-shell .lms-brand-divider { background: rgba(245, 200, 66, 0.25) !important; }

/* ---- Generic readability inside archive ---- */
body.vk .lms-archive-shell h1,
body.vk .lms-archive-shell h2,
body.vk .lms-archive-shell h3,
body.vk .lms-archive-shell h4 { color: #FFFAEC; }
body.vk .lms-archive-shell p { color: rgba(232, 220, 180, 0.85); }
body.vk .lms-archive-shell strong { color: #FFFAEC; }
body.vk .lms-archive-shell em { color: #FFE89F; }
body.vk .lms-archive-shell a:not([class*="btn"]):not(.lms-tab):not(.lms-pg-item):not(.lms-filter-pill) {
    color: #FFE89F;
    transition: color .22s ease;
}
body.vk .lms-archive-shell a:not([class*="btn"]):not(.lms-tab):not(.lms-pg-item):not(.lms-filter-pill):hover {
    color: #6EE7AE;
}

/* ============================================================
   41. LOTTERY BRAND FOOTER — replace the Velki Pro "Presented By"
   strip with a site-themed Baji 71 footer that matches dark luxe.
   ============================================================ */
body.vk .lms-brand-footer {
    background:
        linear-gradient(180deg, rgba(245, 200, 66, 0.06) 0%, rgba(8, 22, 32, 0.85) 100%) !important;
    border: 1px solid rgba(245, 200, 66, 0.32) !important;
    border-radius: 14px !important;
    padding: 18px !important;
    margin: 28px auto 8px !important;
    box-shadow:
        0 16px 40px rgba(0, 0, 0, 0.45),
        inset 0 1px 0 rgba(255, 250, 236, 0.06) !important;
}

/* Top gold accent line — preserved but recolored to brand champagne */
body.vk .lms-brand-footer::before {
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(245, 200, 66, 0.55) 30%,
        #FFFAEC 50%,
        rgba(245, 200, 66, 0.55) 70%,
        transparent 100%) !important;
    background-size: 200% 100% !important;
    animation: v-strip-sweep 4s linear infinite !important;
    height: 1px !important;
}

/* Horizontal divider lines — gold-on-dark */
body.vk .lms-brand-footer-line {
    background: linear-gradient(90deg,
        transparent,
        rgba(245, 200, 66, 0.55),
        transparent) !important;
    opacity: 0.7 !important;
}

/* "Presented By" label — gold uppercase */
body.vk .lms-brand-footer-text {
    color: #FFE89F !important;
    letter-spacing: 0.20em !important;
    font-size: 10px !important;
    font-weight: 800 !important;
}

/* Hide the legacy Velki Pro logo image entirely */
body.vk .lms-brand-footer .lms-brand-footer-logo {
    display: none !important;
}

/* Inject a Baji 71 wordmark in the logo's place */
body.vk .lms-brand-footer::after {
    content: 'বাজি ৭১';
    font-family: var(--vk-font-bn-display, 'Hind Siliguri', system-ui, sans-serif);
    font-weight: 800;
    font-size: 22px;
    line-height: 1;
    letter-spacing: -0.01em;
    background: linear-gradient(135deg, #FFFAEC 0%, #F5C842 50%, #B57E1A 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 2px 12px rgba(245, 200, 66, 0.30);
    padding: 2px 0;
    /* Position INSIDE the flex row so it sits between the two divider lines.
       The hidden img leaves a gap; ::after fills it as a flex child. */
    order: 0;
    flex-shrink: 0;
}

@media (max-width: 480px) {
    body.vk .lms-brand-footer { padding: 14px 12px !important; gap: 8px !important; }
    body.vk .lms-brand-footer::after { font-size: 18px; }
    body.vk .lms-brand-footer-text { font-size: 9px !important; letter-spacing: 0.16em !important; }
}

/* ============================================================
   42. SITE FOOTER — premium redesign
   Multi-layer ambient bg, animated gold sheen, refined typography,
   brand-colored social, gold-bordered link cols, decorative trims.
   ============================================================ */

/* ---- Container — richer gradient bg + ambient glow ---- */
body.vk .vk-footer {
    background:
        radial-gradient(60% 40% at 12% 0%, rgba(245, 200, 66, 0.10) 0%, transparent 55%),
        radial-gradient(50% 50% at 88% 100%, rgba(63, 179, 120, 0.08) 0%, transparent 55%),
        radial-gradient(45% 50% at 50% 50%, rgba(230, 57, 70, 0.05) 0%, transparent 60%),
        linear-gradient(180deg, #050D08 0%, #03070F 100%);
    border-top: 1px solid rgba(245, 200, 66, 0.28);
    padding: 64px var(--vk-pad) 28px;
    position: relative;
    overflow: hidden;
}

/* Top animated gold sheen line — replaces the static 1px glow */
body.vk .vk-footer__glow {
    height: 1px;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(245, 200, 66, 0.55) 20%,
        #FFFAEC 45%,
        #4FBDEF 55%,
        rgba(245, 200, 66, 0.55) 80%,
        transparent 100%);
    background-size: 200% 100%;
    animation: v-strip-sweep 6s linear infinite;
    opacity: 0.85;
}

/* (Decorative gold corner brackets removed — were too visually noisy) */
body.vk .vk-footer::before,
body.vk .vk-footer::after { content: none !important; display: none !important; }

/* ---- Top grid — refined columns ---- */
body.vk .vk-footer__top {
    margin-bottom: 36px;
    gap: clamp(28px, 4vw, 48px);
    position: relative;
    z-index: 2;
}

/* Brand column */
body.vk .vk-footer__brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
body.vk .vk-footer .vk-brand {
    --vk-logo-scale: 1;            /* remove the inflated 1.7x scale used in header */
    display: inline-flex;
    align-items: center;
    overflow: visible;
    padding: 0;
    margin: 0 0 6px;
}
body.vk .vk-footer .vk-brand img {
    --vk-logo-scale: 1;
    height: 64px;
    transform: none;               /* clear the left-anchored scale */
    transform-origin: center center;
    filter: drop-shadow(0 6px 18px rgba(245, 200, 66, 0.25));
    animation: none;               /* don't replay header logo animation here */
}
body.vk .vk-footer .vk-brand:hover img {
    transform: scale(1.03);
    filter: drop-shadow(0 8px 24px rgba(245, 200, 66, 0.40));
}
/* Halo behind footer logo — recenter to the smaller logo */
body.vk .vk-footer .vk-brand__halo {
    width: 220px;
    height: 130px;
    opacity: 0.4;
}
body.vk .vk-footer__brand p {
    color: rgba(232, 220, 180, 0.78);
    font-size: 13.5px;
    line-height: 1.75;
    max-width: 360px;
    margin: 18px 0 22px;
}

/* Social icons — brand-colored with smooth hover */
body.vk .vk-footer__social {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
body.vk .vk-footer__social a {
    width: 40px; height: 40px;
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.01) 100%);
    border: 1px solid rgba(245, 200, 66, 0.25);
    color: rgba(232, 220, 180, 0.65);
    transition: transform .25s ease,
                background .25s ease,
                border-color .25s ease,
                color .25s ease,
                box-shadow .25s ease;
}
body.vk .vk-footer__social a:hover {
    transform: translateY(-3px);
    background: linear-gradient(135deg, rgba(245, 200, 66, 0.18) 0%, rgba(245, 200, 66, 0.04) 100%);
    border-color: rgba(245, 200, 66, 0.55);
    color: #FFE89F;
    box-shadow: 0 8px 22px rgba(245, 200, 66, 0.25);
}
/* Brand-colored social hover variants — order: FB · IG · TT · YT · TG */
body.vk .vk-footer__social a:nth-child(1):hover {  /* Facebook */
    background: rgba(24, 119, 242, 0.18);
    border-color: rgba(24, 119, 242, 0.55);
    color: #4D94FF;
    box-shadow: 0 8px 22px rgba(24, 119, 242, 0.30);
}
body.vk .vk-footer__social a:nth-child(2):hover {  /* Instagram */
    background: linear-gradient(135deg, rgba(245, 133, 41, 0.18), rgba(221, 42, 123, 0.18), rgba(81, 91, 212, 0.16));
    border-color: rgba(221, 42, 123, 0.55);
    color: #E84E94;
    box-shadow: 0 8px 22px rgba(221, 42, 123, 0.30);
}
body.vk .vk-footer__social a:nth-child(3):hover {  /* TikTok */
    background: linear-gradient(135deg, rgba(255, 0, 80, 0.18), rgba(0, 242, 234, 0.14));
    border-color: rgba(255, 255, 255, 0.55);
    color: #FFFFFF;
    box-shadow: 0 8px 22px rgba(255, 0, 80, 0.28);
}
body.vk .vk-footer__social a:nth-child(4):hover {  /* YouTube */
    background: rgba(255, 0, 0, 0.16);
    border-color: rgba(255, 0, 0, 0.50);
    color: #FF4D4D;
    box-shadow: 0 8px 22px rgba(255, 0, 0, 0.30);
}
body.vk .vk-footer__social a:nth-child(5):hover {  /* Telegram */
    background: rgba(34, 158, 217, 0.18);
    border-color: rgba(34, 158, 217, 0.55);
    color: #4FBDEF;
    box-shadow: 0 8px 22px rgba(34, 158, 217, 0.30);
}

/* Link columns */
body.vk .vk-footer__col h4 {
    color: #FFFAEC;
    font-size: 11.5px;
    letter-spacing: 0.20em;
    margin: 0 0 18px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
body.vk .vk-footer__col h4::before {
    content: '';
    width: 6px; height: 6px;
    border-radius: 50%;
    background: linear-gradient(135deg, #F5C842, #B57E1A);
    box-shadow: 0 0 8px rgba(245, 200, 66, 0.7);
    flex-shrink: 0;
}
body.vk .vk-footer__col h4::after {
    width: 32px;
    background: linear-gradient(90deg, #F5C842, transparent);
    margin-top: 0;
    margin-left: 4px;
}
body.vk .vk-footer__col ul { gap: 10px; }
body.vk .vk-footer__col a {
    color: rgba(232, 220, 180, 0.72);
    font-size: 13.5px;
    font-weight: 500;
    line-height: 1.4;
    position: relative;
    padding-left: 12px;
    transition: color .22s ease, transform .22s ease, padding-left .22s ease;
}
body.vk .vk-footer__col a::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    width: 0;
    height: 1px;
    background: linear-gradient(90deg, #F5C842, transparent);
    transform: translateY(-50%);
    transition: width .22s ease;
}
body.vk .vk-footer__col a:hover {
    color: #FFE89F;
    padding-left: 18px;
    transform: none;
}
body.vk .vk-footer__col a:hover::before {
    width: 12px;
}

/* ---- Trust strip — added between top + bot via CSS pseudo-element ---- */
body.vk .vk-footer__top + .vk-footer__bot {
    margin-top: 0;
}

/* Bottom row — give Bengali matras (top + bottom diacritics) full vertical room */
body.vk .vk-footer__bot {
    max-width: var(--vk-max);
    padding-top: 24px;
    padding-bottom: 24px;
    margin: 0 auto;
    border-top: 1px dashed rgba(245, 200, 66, 0.22);
    color: rgba(232, 220, 180, 0.55);
    font-size: 12.5px;
    line-height: 1.85;
    align-items: center;
    z-index: 2;
    overflow: visible;
    box-sizing: border-box;
}
body.vk .vk-footer__bot p {
    color: rgba(232, 220, 180, 0.55);
    font-size: 12.5px;
    line-height: 1.85;
    padding: 6px 0 10px;
    margin: 0;
    overflow: visible;
    min-width: 0;
    flex: 0 1 auto;
    word-break: normal;
    overflow-wrap: anywhere;
    text-overflow: clip;
    white-space: normal;
}
body.vk .vk-footer__bot p:first-child {
    color: rgba(232, 220, 180, 0.78);
    font-weight: 500;
    flex: 1 1 auto;
    max-width: 100%;
}

/* Footer container itself — allow descenders/glow to render rather than clip them */
body.vk .vk-footer {
    overflow: visible;
    padding-bottom: 32px;
}

/* Premium age tag — red accent (matches hero CTA) */
body.vk .vk-footer__age {
    background: linear-gradient(135deg, rgba(230, 57, 70, 0.16) 0%, rgba(230, 57, 70, 0.04) 100%);
    border: 1px solid rgba(230, 57, 70, 0.45);
    border-radius: 999px;
    padding: 6px 14px;
    color: #FF8FA3;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 4px 14px rgba(200, 16, 46, 0.18);
}

/* ---- Mobile ---- */
@media (max-width: 920px) {
    body.vk .vk-footer { padding: 48px var(--vk-pad) 24px; }
    body.vk .vk-footer__top { grid-template-columns: 1fr 1fr; gap: 32px; }
    body.vk .vk-footer__brand { grid-column: 1 / -1; }
    body.vk .vk-footer::before,
    body.vk .vk-footer::after { width: 28px; height: 28px; top: 8px; }
    body.vk .vk-footer::before { left: 8px; }
    body.vk .vk-footer::after { right: 8px; }
}
@media (max-width: 600px) {
    body.vk .vk-footer { padding: 40px 16px 36px; text-align: center; }
    body.vk .vk-footer__top { grid-template-columns: 1fr; gap: 28px; margin-bottom: 28px; }
    body.vk .vk-footer__brand { text-align: center; align-items: center; display: flex; flex-direction: column; }
    body.vk .vk-footer__brand p { margin: 16px auto 18px; max-width: 100%; }
    body.vk .vk-footer__social { justify-content: center; }
    body.vk .vk-footer__col { text-align: center; }
    body.vk .vk-footer__col h4 { justify-content: center; display: flex; }
    body.vk .vk-footer__col ul { align-items: center; }
    body.vk .vk-footer__col a { padding-left: 0; }
    body.vk .vk-footer__col a:hover { padding-left: 0; }
    body.vk .vk-footer__col a::before { display: none; }
    body.vk .vk-footer__bot {
        flex-direction: column;
        text-align: center;
        gap: 12px;
        padding-top: 20px;
    }
}