/* ==========================================================================
   9wickets — "গেমিং প্ল্যাটফর্ম" (Gaming Platform / official links) section
   REDESIGN "Full Navy Panel" (2026-07, loads LAST)
   --------------------------------------------------------------------------
   Pattern-only change (content/links untouched): the two-column split
   (copy left, pill list right, both sitting on a bare cream background
   with a faint gold aura) is replaced with the same "cream head above a
   full-bleed navy panel" convention now used by #how/#why/#quotes/
   #platform-story/#about. The eyebrow/H2/lead move into a standard
   .vk-section__head (centered, on cream); the trust-assurance badges +
   all four verified-access pills (unchanged URLs/copy — this is the
   anti-phishing warning + official/mirror links, functional content) move
   into a new full-bleed .vpp-panel. The pills themselves (platform-pills.
   css, .vk-pp-*) keep their existing light glass-card look unmodified —
   they read fine sitting on navy, same as the cream testimonial cards in
   #quotes. Scoped additions here: .vpp-panel / .vpp-assure.
   Old split-layout base rules (.vk-platforms__inner grid etc., wickets-
   home.css §14) are simply not used by the new markup, so they stay inert
   — same "old layer harmless on disk" pattern as every other superseded
   version in this codebase.
   Markup: post 11, widget vp0009.
   ========================================================================== */

body.vk .vk-platforms--pills.vk-section {
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    background: none;
    border-block: 0;
}
body.vk .vk-platforms--pills .vk-section__head {
    position: relative;
    z-index: 1;
    padding: 0 var(--vk-pad);
    margin-bottom: 16px !important;
}
/* the anti-phishing warning is long — keep every word, just tighten the
   type so it takes noticeably less vertical room */
body.vk .vk-platforms--pills .vk-lead {
    font-size: 13px !important;
    line-height: 1.55 !important;
    max-width: 74ch !important;
}

body.vk .vpp-panel {
    position: relative;
    max-width: none;
    margin: 0;
    padding: clamp(16px, 2vw, 24px) var(--vk-pad);
    background: linear-gradient(180deg, var(--vk-bg-dark) 0%, var(--vk-bg-dark-2) 100%);
}

body.vk .vpp-assure {
    list-style: none;
    margin: 0 0 14px;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}
body.vk .vpp-assure li {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: var(--vk-r-pill, 999px);
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.18);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    font-size: 11px;
    font-weight: 600;
    color: #FFFFFF !important;
    letter-spacing: 0.01em;
}
body.vk .vpp-assure li svg { color: #F9E900; flex: none; }

/* ---- compact 2x2 pill grid instead of a tall vertical stack — the
   single biggest space saver here ---- */
body.vk .vk-platforms--pills .vk-pp-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    max-width: 900px;
    margin: 0 auto;
}
body.vk .vk-platforms--pills .vk-pp-pill,
body.vk .vk-platforms--pills .vk-pp-pill--primary {
    padding: 12px 16px 12px 10px !important;
    gap: 12px !important;
}
body.vk .vk-platforms--pills .vk-pp-pill__icon { width: 36px !important; height: 36px !important; }
body.vk .vk-platforms--pills .vk-pp-pill__icon svg { width: 16px !important; height: 16px !important; }
body.vk .vk-platforms--pills .vk-pp-pill--primary .vk-pp-pill__icon { width: 40px !important; height: 40px !important; }
body.vk .vk-platforms--pills .vk-pp-pill--primary .vk-pp-pill__icon svg { width: 18px !important; height: 18px !important; }
body.vk .vk-platforms--pills .vk-pp-pill__title { font-size: 14px !important; }
body.vk .vk-platforms--pills .vk-pp-pill--primary .vk-pp-pill__title { font-size: 15px !important; }
body.vk .vk-platforms--pills .vk-pp-pill__desc { font-size: 11.5px !important; }
/* the HTTPS/অফিসিয়াল/ফাস্ট mini-chip row is the least essential line —
   drop it here to keep every pill to two compact lines */
body.vk .vk-platforms--pills .vk-pp-pill__chips { display: none !important; }
body.vk .vk-platforms--pills .vk-pp-pill__go {
    padding: 0 !important;
    width: 32px !important;
    height: 32px !important;
    justify-content: center !important;
}
body.vk .vk-platforms--pills .vk-pp-pill--primary .vk-pp-pill__go { width: 36px !important; height: 36px !important; }
body.vk .vk-platforms--pills .vk-pp-pill__go-label { display: none !important; }
body.vk .vk-platforms--pills .vk-pp-pill__num { display: none !important; }
body.vk .vk-platforms--pills .vk-pp-pill__badge { font-size: 9px !important; padding: 2px 8px 2px 6px !important; }

@media (max-width: 720px) {
    body.vk .vk-platforms--pills .vk-pp-grid { grid-template-columns: 1fr; max-width: 520px; }
}
