
/* ============================================================
   BOXXHEAD GAMING — SHARED PUBLIC THEME
   Muted crimson + charcoal + white
   Desktop + mobile
   Banner intentionally untouched.
   ============================================================ */

:root {
    --bx-crimson-1: #76272e;
    --bx-crimson-2: #651f26;
    --bx-crimson-3: #50181e;

    --bx-dark: #111317;
    --bx-card: #1b1e23;
    --bx-card-hi: #24282e;
    --bx-card-soft: #202329;

    --bx-white: #ffffff;
    --bx-text: #f4f5f6;
    --bx-muted: #b9bdc4;

    --bx-accent: #cf3d48;
    --bx-accent-hi: #e34a55;

    --bx-line: rgba(255,255,255,.12);
    --bx-line-hi: rgba(255,255,255,.19);

    --bx-radius: 15px;
    --bx-radius-small: 11px;

    --bx-shadow:
        0 10px 26px rgba(22,5,8,.16);
}


/* ============================================================
   GLOBAL PUBLIC BACKGROUND
   ============================================================ */

html {
    background: var(--bx-crimson-3);
}

body:not(.admin-page) {
    color: var(--bx-text);

    background:
        radial-gradient(
            circle at 15% 8%,
            rgba(185,75,84,.14),
            transparent 28%
        ),
        linear-gradient(
            155deg,
            var(--bx-crimson-1) 0%,
            var(--bx-crimson-2) 46%,
            var(--bx-crimson-3) 100%
        ) fixed !important;
}


/* ============================================================
   PUBLIC HEADER
   ============================================================ */

body:not(.admin-page) header {
    background:
        linear-gradient(
            180deg,
            #121418,
            #090a0c
        ) !important;

    border-bottom:
        2px solid var(--bx-accent) !important;

    box-shadow:
        0 5px 18px rgba(0,0,0,.22) !important;
}

body:not(.admin-page) header a {
    color: rgba(255,255,255,.86) !important;
}

body:not(.admin-page) header a:hover {
    color: #fff !important;
}


/* ============================================================
   COMMON CONTENT SURFACES
   ============================================================ */

body:not(.admin-page) main {
    color: var(--bx-text);
}

body:not(.admin-page) main h1,
body:not(.admin-page) main h2,
body:not(.admin-page) main h3,
body:not(.admin-page) main h4 {
    color: #fff;
}

body:not(.admin-page) main p {
    color: var(--bx-muted);
}


/* ============================================================
   CARDS — REMOVE BLOCKY LOOK
   ============================================================ */

body:not(.admin-page) article,
body:not(.admin-page) .card,
body:not(.admin-page) [class*="-card"]:not(.bxhome-lead),
body:not(.admin-page) [class*="-panel"],
body:not(.admin-page) [class*="-column"] {
    border-radius: var(--bx-radius-small);
}


/* Homepage cards */

body.bx-homepage .v7-video-story,
body.bx-homepage .v7-game-card,
body.bx-homepage .v7-news-card,
body.bx-homepage .v7-story-card,
body.bx-homepage .bxtrend-card,
body.bx-homepage .bxhome-secondary-card {
    overflow: hidden !important;

    background:
        linear-gradient(
            145deg,
            var(--bx-card-hi),
            var(--bx-card) 72%
        ) !important;

    border:
        1px solid var(--bx-line) !important;

    border-radius:
        var(--bx-radius) !important;

    box-shadow:
        var(--bx-shadow) !important;

    transition:
        transform .18s ease,
        border-color .18s ease,
        box-shadow .18s ease !important;
}


body.bx-homepage .v7-video-story:hover,
body.bx-homepage .v7-game-card:hover,
body.bx-homepage .v7-news-card:hover,
body.bx-homepage .v7-story-card:hover,
body.bx-homepage .bxtrend-card:hover,
body.bx-homepage .bxhome-secondary-card:hover {
    transform: translateY(-3px) !important;

    border-color:
        rgba(227,74,85,.55) !important;

    box-shadow:
        0 15px 30px rgba(25,4,8,.22) !important;
}


/* ============================================================
   HOMEPAGE MAJOR SECTIONS
   Softer than giant black rectangles.
   ============================================================ */

body.bx-homepage .v7-main > .v7-section,
body.bx-homepage .v7-lead-layout {
    background:
        linear-gradient(
            145deg,
            rgba(39,43,49,.97),
            rgba(25,28,33,.97)
        ) !important;

    border:
        1px solid var(--bx-line-hi) !important;

    border-radius:
        18px !important;

    box-shadow:
        0 12px 30px rgba(30,5,8,.17) !important;
}


/* Feature section */

body.bx-homepage .v7-lead-story {
    overflow: hidden !important;

    background:
        linear-gradient(
            145deg,
            #20242a,
            #15171b
        ) !important;

    border:
        1px solid var(--bx-line) !important;

    border-radius:
        var(--bx-radius) !important;
}


/* Latest */

body.bx-homepage .v7-latest-column {
    background:
        rgba(31,35,41,.88) !important;

    border:
        1px solid var(--bx-line) !important;

    border-radius:
        var(--bx-radius) !important;
}


/* ============================================================
   TOP STORIES
   ============================================================ */

body.bx-homepage .bxhome-lead {
    overflow: hidden !important;

    border-radius:
        var(--bx-radius) !important;

    border:
        1px solid rgba(255,255,255,.17) !important;

    box-shadow:
        0 14px 30px rgba(25,4,8,.22) !important;
}

body.bx-homepage .bxhome-secondary {
    gap: 13px !important;
}

body.bx-homepage .bxhome-secondary-card {
    min-height: 0 !important;
}


/* ============================================================
   SECTION SPACING
   ============================================================ */

body.bx-homepage .v7-main > .v7-section {
    margin-top: 26px !important;
    margin-bottom: 26px !important;
}

body.bx-homepage .v7-video-grid,
body.bx-homepage .v7-game-grid,
body.bx-homepage .v7-games-grid {
    gap: 18px !important;
}


/* ============================================================
   CARD IMAGES
   ============================================================ */

body.bx-homepage .v7-video-story img,
body.bx-homepage .v7-game-card img,
body.bx-homepage .v7-news-card img,
body.bx-homepage .v7-story-card img,
body.bx-homepage .bxtrend-card img {
    display: block;

    width: 100%;

    object-fit: cover;

    transition:
        transform .25s ease !important;
}

body.bx-homepage .v7-video-story:hover img,
body.bx-homepage .v7-game-card:hover img,
body.bx-homepage .bxtrend-card:hover img {
    transform: scale(1.025);
}


/* ============================================================
   ACCENTS
   ============================================================ */

body:not(.admin-page) .v7-label,
body:not(.admin-page) .v7-category,
body:not(.admin-page) .v7-kicker,
body:not(.admin-page) .bxhome-eyebrow,
body:not(.admin-page) .bxhome-story-category {
    color: #ef6972 !important;
}

body.bx-homepage .v7-section > h2::after,
body.bx-homepage .v7-section-title::after {
    background:
        var(--bx-accent-hi) !important;
}


/* ============================================================
   COMMUNITY
   ============================================================ */

body.bx-homepage .v7-bottom-grid {
    background: transparent !important;

    border: 0 !important;

    box-shadow: none !important;

    gap: 18px !important;
}

body.bx-homepage .v7-bottom-grid > * {
    background:
        linear-gradient(
            145deg,
            var(--bx-card-hi),
            var(--bx-card)
        ) !important;

    border:
        1px solid var(--bx-line) !important;

    border-top:
        3px solid var(--bx-accent) !important;

    border-radius:
        var(--bx-radius) !important;

    box-shadow:
        var(--bx-shadow) !important;
}


/* ============================================================
   ARTICLE / NEWS / CATEGORY / GAME PUBLIC PAGES
   ============================================================ */

body:not(.bx-homepage):not(.admin-page) main,
body:not(.bx-homepage):not(.admin-page) .bx-article-page,
body:not(.bx-homepage):not(.admin-page) .bx-page,
body:not(.bx-homepage):not(.admin-page) .page-shell,
body:not(.bx-homepage):not(.admin-page) .container {
    color: var(--bx-text);
}


body:not(.bx-homepage):not(.admin-page) article {
    background:
        linear-gradient(
            145deg,
            rgba(32,36,42,.97),
            rgba(19,21,25,.98)
        );

    border:
        1px solid var(--bx-line);

    box-shadow:
        0 12px 32px rgba(25,4,8,.17);
}


/* Article reading area should not feel like one hard block */

body:not(.bx-homepage):not(.admin-page)
.bx-article-body {
    color: #e8e9eb !important;
}

body:not(.bx-homepage):not(.admin-page)
.bx-article-body p {
    color: #d0d3d7 !important;
}


/* ============================================================
   FOOTER
   ============================================================ */

body:not(.admin-page) footer {
    background:
        linear-gradient(
            180deg,
            #111317,
            #08090b
        ) !important;

    border-top:
        3px solid var(--bx-accent) !important;

    color:
        rgba(255,255,255,.70) !important;
}

body:not(.admin-page) footer a {
    color:
        rgba(255,255,255,.76) !important;
}

body:not(.admin-page) footer a:hover {
    color: #fff !important;
}


/* ============================================================
   TABLET
   ============================================================ */

@media (max-width: 1000px) {

    body.bx-homepage .v7-main > .v7-section,
    body.bx-homepage .v7-lead-layout {
        border-radius:
            15px !important;
    }

    body.bx-homepage .v7-video-grid {
        gap: 14px !important;
    }
}


/* ============================================================
   PHONE
   Same theme — not a separate design.
   ============================================================ */

@media (max-width: 700px) {

    html,
    body:not(.admin-page) {
        background:
            linear-gradient(
                160deg,
                #74262d 0%,
                #611d24 52%,
                #4c171c 100%
            ) fixed !important;
    }


    body.bx-homepage .v7-main > .v7-section,
    body.bx-homepage .v7-lead-layout {
        background:
            linear-gradient(
                145deg,
                #25292f,
                #181b1f
            ) !important;

        border-radius:
            14px !important;
    }


    body.bx-homepage .v7-video-story,
    body.bx-homepage .v7-game-card,
    body.bx-homepage .v7-news-card,
    body.bx-homepage .v7-story-card,
    body.bx-homepage .bxtrend-card,
    body.bx-homepage .bxhome-secondary-card {
        border-radius:
            13px !important;
    }


    body.bx-homepage .v7-bottom-grid > * {
        border-radius:
            13px !important;
    }


    body:not(.bx-homepage):not(.admin-page) article {
        border-radius:
            13px !important;
    }
}


/* ============================================================
   SMALL PHONE
   ============================================================ */

@media (max-width: 430px) {

    body.bx-homepage .v7-main > .v7-section {
        border-radius:
            12px !important;
    }

    body.bx-homepage .v7-video-story,
    body.bx-homepage .v7-game-card,
    body.bx-homepage .bxtrend-card {
        border-radius:
            11px !important;
    }
}


/* ============================================================
   BOXXHEAD — BLACK BACKGROUND FINAL OVERRIDE
   Keep charcoal cards + muted red accents.
   Banner intentionally untouched.
   ============================================================ */

html {
    background: #070809 !important;
}

body:not(.admin-page) {
    background:
        radial-gradient(
            circle at 15% 8%,
            rgba(165,35,45,.09),
            transparent 27%
        ),
        radial-gradient(
            circle at 85% 38%,
            rgba(120,25,34,.055),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #0c0d0f 0%,
            #08090b 48%,
            #050607 100%
        ) fixed !important;

    color: #f4f5f6 !important;
}


/* HOMEPAGE */

body.bx-homepage {
    background:
        radial-gradient(
            circle at 14% 9%,
            rgba(175,38,48,.10),
            transparent 27%
        ),
        linear-gradient(
            180deg,
            #0c0d0f,
            #070809 55%,
            #050607
        ) fixed !important;
}

body.bx-homepage .v7-main {
    background: transparent !important;
}


/* TOP STORIES */

body.bx-homepage .bxhome-top-heading h1 {
    color: #fff !important;
}

body.bx-homepage .bxhome-top-heading {
    border-bottom-color: #c83c47 !important;
}


/* MAIN SECTION CARDS */

body.bx-homepage .v7-main > .v7-section,
body.bx-homepage .v7-lead-layout {
    background:
        linear-gradient(
            145deg,
            #23262c,
            #17191d 72%
        ) !important;

    border:
        1px solid rgba(255,255,255,.12) !important;

    box-shadow:
        0 12px 30px rgba(0,0,0,.28) !important;
}


/* INDIVIDUAL CARDS */

body.bx-homepage .v7-video-story,
body.bx-homepage .v7-game-card,
body.bx-homepage .v7-news-card,
body.bx-homepage .v7-story-card,
body.bx-homepage .bxtrend-card,
body.bx-homepage .bxhome-secondary-card {
    background:
        linear-gradient(
            145deg,
            #24272d,
            #15171b
        ) !important;

    border:
        1px solid rgba(255,255,255,.12) !important;

    box-shadow:
        0 9px 24px rgba(0,0,0,.25) !important;
}


/* LATEST */

body.bx-homepage .v7-latest-column {
    background:
        linear-gradient(
            145deg,
            #25282e,
            #181a1e
        ) !important;

    border:
        1px solid rgba(255,255,255,.12) !important;
}


/* COMMUNITY */

body.bx-homepage .v7-bottom-grid {
    background: transparent !important;
}

body.bx-homepage .v7-bottom-grid > * {
    background:
        linear-gradient(
            145deg,
            #24272d,
            #15171b
        ) !important;

    border:
        1px solid rgba(255,255,255,.12) !important;

    border-top:
        3px solid #c83c47 !important;
}


/* TRENDING AREA */

body.bx-homepage .bxtrend {
    background: transparent !important;
}


/* OTHER PUBLIC PAGES */

body:not(.bx-homepage):not(.admin-page) main {
    background: transparent !important;
}

body:not(.bx-homepage):not(.admin-page) article {
    background:
        linear-gradient(
            145deg,
            #22252a,
            #14161a
        ) !important;

    border:
        1px solid rgba(255,255,255,.12) !important;

    box-shadow:
        0 12px 30px rgba(0,0,0,.26) !important;
}


/* MUTED RED ACCENTS */

body:not(.admin-page) .v7-label,
body:not(.admin-page) .v7-category,
body:not(.admin-page) .v7-kicker,
body:not(.admin-page) .bxhome-eyebrow,
body:not(.admin-page) .bxhome-story-category {
    color: #dd5963 !important;
}

body.bx-homepage .v7-section > h2::after,
body.bx-homepage .v7-section-title::after {
    background: #c83c47 !important;
}


/* ============================================================
   PHONE
   ============================================================ */

@media (max-width: 700px) {

    html,
    body:not(.admin-page),
    body.bx-homepage {
        background:
            radial-gradient(
                circle at 50% 0%,
                rgba(165,35,45,.08),
                transparent 25%
            ),
            linear-gradient(
                180deg,
                #0b0c0e,
                #070809 55%,
                #050607
            ) fixed !important;
    }

    body.bx-homepage .v7-main {
        background: transparent !important;
    }

    body.bx-homepage .v7-main > .v7-section,
    body.bx-homepage .v7-lead-layout {
        background:
            linear-gradient(
                145deg,
                #22252a,
                #15171b
            ) !important;
    }

    body.bx-homepage .v7-video-story,
    body.bx-homepage .v7-game-card,
    body.bx-homepage .v7-news-card,
    body.bx-homepage .v7-story-card,
    body.bx-homepage .bxtrend-card,
    body.bx-homepage .bxhome-secondary-card,
    body.bx-homepage .v7-bottom-grid > * {
        background:
            linear-gradient(
                145deg,
                #23262b,
                #141619
            ) !important;
    }
}


/* ============================================================
   BOXXHEAD — FEATURED / POPPY ALIGNMENT LOCK
   Match homepage publication grid.
   Banner intentionally untouched.
   ============================================================ */

/* Main Featured + Latest shell */
body.bx-homepage .v7-lead-layout {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    box-sizing: border-box !important;

    display: grid !important;
    grid-template-columns:
        minmax(0, 2fr)
        minmax(260px, .72fr) !important;

    align-items: stretch !important;
    gap: 22px !important;
}


/* Poppy / featured story */
body.bx-homepage .v7-lead-story {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    justify-self: stretch !important;

    box-sizing: border-box !important;
}


/* Featured image */
body.bx-homepage .v7-lead-story img,
body.bx-homepage .v7-lead-story .v7-story-image {
    display: block !important;

    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    object-fit: cover !important;
}


/* Latest column */
body.bx-homepage .v7-latest-column {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    justify-self: stretch !important;

    box-sizing: border-box !important;
}


/* Make all main homepage sections share the same edge */
body.bx-homepage .v7-main {
    box-sizing: border-box !important;
}

body.bx-homepage .v7-main > .v7-lead-layout,
body.bx-homepage .v7-main > .v7-section,
body.bx-homepage .v7-main > .v7-bottom-grid {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    box-sizing: border-box !important;
}


/* ============================================================
   TABLET
   ============================================================ */

@media (max-width: 900px) {

    body.bx-homepage .v7-lead-layout {
        grid-template-columns:
            minmax(0, 1.7fr)
            minmax(220px, .8fr) !important;

        gap: 16px !important;
    }
}


/* ============================================================
   PHONE
   Poppy first, Latest directly underneath.
   ============================================================ */

@media (max-width: 700px) {

    body.bx-homepage .v7-lead-layout {
        display: grid !important;

        grid-template-columns: 1fr !important;

        width: 100% !important;

        gap: 12px !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body.bx-homepage .v7-lead-story,
    body.bx-homepage .v7-latest-column {
        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
    }

    body.bx-homepage .v7-lead-story {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    body.bx-homepage .v7-latest-column {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }

    body.bx-homepage .v7-lead-story img,
    body.bx-homepage .v7-lead-story .v7-story-image {
        width: 100% !important;
        height: auto !important;

        margin: 0 !important;
    }
}


/* ============================================================
   BOXXHEAD — FEATURED / POPPY ALIGNMENT LOCK
   Match homepage publication grid.
   Banner intentionally untouched.
   ============================================================ */

/* Main Featured + Latest shell */
body.bx-homepage .v7-lead-layout {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    box-sizing: border-box !important;

    display: grid !important;
    grid-template-columns:
        minmax(0, 2fr)
        minmax(260px, .72fr) !important;

    align-items: stretch !important;
    gap: 22px !important;
}


/* Poppy / featured story */
body.bx-homepage .v7-lead-story {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    justify-self: stretch !important;

    box-sizing: border-box !important;
}


/* Featured image */
body.bx-homepage .v7-lead-story img,
body.bx-homepage .v7-lead-story .v7-story-image {
    display: block !important;

    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    object-fit: cover !important;
}


/* Latest column */
body.bx-homepage .v7-latest-column {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    justify-self: stretch !important;

    box-sizing: border-box !important;
}


/* Make all main homepage sections share the same edge */
body.bx-homepage .v7-main {
    box-sizing: border-box !important;
}

body.bx-homepage .v7-main > .v7-lead-layout,
body.bx-homepage .v7-main > .v7-section,
body.bx-homepage .v7-main > .v7-bottom-grid {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    box-sizing: border-box !important;
}


/* ============================================================
   TABLET
   ============================================================ */

@media (max-width: 900px) {

    body.bx-homepage .v7-lead-layout {
        grid-template-columns:
            minmax(0, 1.7fr)
            minmax(220px, .8fr) !important;

        gap: 16px !important;
    }
}


/* ============================================================
   PHONE
   Poppy first, Latest directly underneath.
   ============================================================ */

@media (max-width: 700px) {

    body.bx-homepage .v7-lead-layout {
        display: grid !important;

        grid-template-columns: 1fr !important;

        width: 100% !important;

        gap: 12px !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body.bx-homepage .v7-lead-story,
    body.bx-homepage .v7-latest-column {
        width: 100% !important;
        max-width: none !important;

        margin: 0 !important;
    }

    body.bx-homepage .v7-lead-story {
        grid-column: 1 !important;
        grid-row: 1 !important;
    }

    body.bx-homepage .v7-latest-column {
        grid-column: 1 !important;
        grid-row: 2 !important;
    }

    body.bx-homepage .v7-lead-story img,
    body.bx-homepage .v7-lead-story .v7-story-image {
        width: 100% !important;
        height: auto !important;

        margin: 0 !important;
    }
}


/* ============================================================
   BOXXHEAD — EDITORIAL PUBLICATION POLISH
   Less generic "HTML cards"
   More gaming magazine / publication
   ============================================================ */


/* ------------------------------------------------------------
   PAGE
   ------------------------------------------------------------ */

body:not(.admin-page) {
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(170,35,45,.055),
            transparent 26%
        ),
        #070809 !important;
}


/* ------------------------------------------------------------
   HOMEPAGE SECTIONS
   Remove giant bordered boxes around every section.
   ------------------------------------------------------------ */

body.bx-homepage .v7-main > .v7-section {
    background: transparent !important;

    border: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    margin-top: 52px !important;
    margin-bottom: 52px !important;
}


/* No fake decorative box line */

body.bx-homepage .v7-main > .v7-section::before {
    display: none !important;
}


/* ------------------------------------------------------------
   SECTION TITLES
   Editorial divider instead of boxed section.
   ------------------------------------------------------------ */

body.bx-homepage .v7-section > h2 {
    position: relative !important;

    padding-bottom: 14px !important;
    margin-bottom: 22px !important;

    border-bottom:
        1px solid rgba(255,255,255,.13) !important;
}

body.bx-homepage .v7-section > h2::after {
    position: absolute !important;

    left: 0 !important;
    bottom: -1px !important;

    width: 74px !important;
    height: 3px !important;

    margin: 0 !important;

    background: #c83c47 !important;

    border-radius: 0 !important;
}


/* ------------------------------------------------------------
   FEATURED / POPPY AREA
   Keep alignment, remove giant container appearance.
   ------------------------------------------------------------ */

body.bx-homepage .v7-lead-layout {
    background: transparent !important;

    border: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;

    padding: 0 !important;

    margin-top: 46px !important;
    margin-bottom: 54px !important;
}


/* Poppy feature becomes image-led */

body.bx-homepage .v7-lead-story {
    overflow: hidden !important;

    background: #101114 !important;

    border: 0 !important;

    border-radius: 5px !important;

    box-shadow:
        0 16px 38px rgba(0,0,0,.25) !important;
}


/* Latest becomes editorial rail rather than a card */

body.bx-homepage .v7-latest-column {
    background: transparent !important;

    border: 0 !important;

    border-left:
        1px solid rgba(255,255,255,.13) !important;

    border-radius: 0 !important;

    box-shadow: none !important;

    padding:
        4px 0
        4px 24px !important;
}


/* ------------------------------------------------------------
   TOP STORIES
   Lead should feel cinematic.
   ------------------------------------------------------------ */

body.bx-homepage .bxhome-lead {
    border: 0 !important;

    border-radius: 5px !important;

    box-shadow:
        0 16px 38px rgba(0,0,0,.28) !important;
}


/* Secondary stories stop looking like boxed widgets */

body.bx-homepage .bxhome-secondary-card {
    background: transparent !important;

    border: 0 !important;

    border-bottom:
        1px solid rgba(255,255,255,.12) !important;

    border-radius: 0 !important;

    box-shadow: none !important;

    padding-bottom: 12px !important;
}

body.bx-homepage .bxhome-secondary-card:last-child {
    border-bottom: 0 !important;
}


/* Images get subtle shape, not giant pill corners */

body.bx-homepage .bxhome-secondary-image,
body.bx-homepage .bxhome-secondary-image img {
    border-radius: 4px !important;
}


/* ------------------------------------------------------------
   VIDEO GRID
   Poster / publication treatment.
   ------------------------------------------------------------ */

body.bx-homepage .v7-video-story {
    background: transparent !important;

    border: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;

    overflow: visible !important;
}

body.bx-homepage .v7-video-story img,
body.bx-homepage .v7-video-story .v7-story-image {
    overflow: hidden !important;

    border-radius: 5px !important;

    box-shadow:
        0 10px 24px rgba(0,0,0,.25) !important;
}

body.bx-homepage .v7-video-story:hover {
    transform: none !important;

    border: 0 !important;

    box-shadow: none !important;
}

body.bx-homepage .v7-video-story:hover img {
    transform: scale(1.018) !important;
}


/* ------------------------------------------------------------
   GAME CARDS
   More like visual game tiles.
   ------------------------------------------------------------ */

body.bx-homepage .v7-game-card {
    position: relative !important;

    overflow: hidden !important;

    background:
        linear-gradient(
            180deg,
            #17191d,
            #0b0c0e
        ) !important;

    border: 0 !important;

    border-radius: 5px !important;

    box-shadow:
        0 12px 28px rgba(0,0,0,.26) !important;
}

body.bx-homepage .v7-game-card:hover {
    transform: translateY(-2px) !important;

    border: 0 !important;
}


/* Thin red editorial marker */

body.bx-homepage .v7-game-card::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 42px;
    height: 3px;

    background: #c83c47;
}


/* ------------------------------------------------------------
   GAMING NEWS
   Rows rather than a pile of boxes.
   ------------------------------------------------------------ */

body.bx-homepage .v7-news-card,
body.bx-homepage .v7-story-card {
    background: transparent !important;

    border: 0 !important;

    border-bottom:
        1px solid rgba(255,255,255,.12) !important;

    border-radius: 0 !important;

    box-shadow: none !important;
}

body.bx-homepage .v7-news-card:hover,
body.bx-homepage .v7-story-card:hover {
    transform: none !important;

    border-bottom-color:
        rgba(200,60,71,.72) !important;

    box-shadow: none !important;
}


/* ------------------------------------------------------------
   COMMUNITY
   ------------------------------------------------------------ */

body.bx-homepage .v7-bottom-grid {
    padding: 0 !important;

    background: transparent !important;

    border: 0 !important;

    box-shadow: none !important;
}

body.bx-homepage .v7-bottom-grid > * {
    background:
        linear-gradient(
            145deg,
            #1b1e23,
            #101114
        ) !important;

    border: 0 !important;

    border-top:
        3px solid #b93640 !important;

    border-radius: 5px !important;

    box-shadow:
        0 10px 24px rgba(0,0,0,.20) !important;
}


/* ------------------------------------------------------------
   TRENDING
   ------------------------------------------------------------ */

body.bx-homepage .bxtrend-card {
    background: transparent !important;

    border: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
}

body.bx-homepage .bxtrend-card img {
    border-radius: 5px !important;

    box-shadow:
        0 9px 22px rgba(0,0,0,.22) !important;
}

body.bx-homepage .bxtrend-card:hover {
    transform: none !important;

    border: 0 !important;

    box-shadow: none !important;
}


/* ------------------------------------------------------------
   RED ACCENT — CONTROLLED
   ------------------------------------------------------------ */

body:not(.admin-page) .v7-label,
body:not(.admin-page) .v7-category,
body:not(.admin-page) .v7-kicker,
body:not(.admin-page) .bxhome-eyebrow,
body:not(.admin-page) .bxhome-story-category {
    color: #d8545e !important;
}


/* ------------------------------------------------------------
   OTHER PUBLIC PAGES
   Remove giant article-card appearance.
   ------------------------------------------------------------ */

body:not(.bx-homepage):not(.admin-page) article {
    background: transparent !important;

    border: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
}


/* Article content remains readable */

body:not(.bx-homepage):not(.admin-page)
.bx-article-body {
    color: #e6e7e9 !important;
}


/* Article images feel editorial */

body:not(.bx-homepage):not(.admin-page)
.bx-article-body img {
    border-radius: 4px !important;

    box-shadow:
        0 12px 30px rgba(0,0,0,.25) !important;
}


/* ------------------------------------------------------------
   LINKS
   ------------------------------------------------------------ */

body:not(.admin-page) main a {
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}


/* ============================================================
   PHONE
   ============================================================ */

@media (max-width: 700px) {

    body.bx-homepage .v7-main > .v7-section {
        margin-top: 34px !important;
        margin-bottom: 34px !important;

        padding-left: 0 !important;
        padding-right: 0 !important;

        background: transparent !important;

        border: 0 !important;

        box-shadow: none !important;
    }


    /* Poppy + Latest */

    body.bx-homepage .v7-lead-layout {
        background: transparent !important;

        border: 0 !important;

        box-shadow: none !important;

        padding: 0 !important;
    }

    body.bx-homepage .v7-latest-column {
        margin-top: 8px !important;

        padding:
            18px 0 0 !important;

        border-left: 0 !important;

        border-top:
            1px solid rgba(255,255,255,.13) !important;
    }


    /* Cards become clean stacked stories */

    body.bx-homepage .bxhome-secondary-card,
    body.bx-homepage .v7-video-story,
    body.bx-homepage .v7-news-card,
    body.bx-homepage .v7-story-card,
    body.bx-homepage .bxtrend-card {
        background: transparent !important;

        border-radius: 0 !important;

        box-shadow: none !important;
    }


    /* Keep visual media subtly shaped */

    body.bx-homepage .v7-video-story img,
    body.bx-homepage .v7-game-card,
    body.bx-homepage .bxtrend-card img,
    body.bx-homepage .bxhome-lead,
    body.bx-homepage .v7-lead-story {
        border-radius: 4px !important;
    }


    /* Community can remain a designed feature */

    body.bx-homepage .v7-bottom-grid > * {
        border-radius: 5px !important;
    }


    /* Articles edge-to-edge publication feel */

    body:not(.bx-homepage):not(.admin-page) article {
        background: transparent !important;

        border: 0 !important;

        box-shadow: none !important;
    }
}


/* ============================================================
   BOXXHEAD — FLAT EDITORIAL PASS
   Kill remaining gray parent boxes.
   DO NOT target banner or Poppy lead layout.
   ============================================================ */


/* ------------------------------------------------------------
   HOMEPAGE SECTION SHELLS
   ------------------------------------------------------------ */

body.bx-homepage .v7-section,
body.bx-homepage section.v7-section,
body.bx-homepage .v7-section-inner,
body.bx-homepage .v7-section-content,
body.bx-homepage .v7-content-section,
body.bx-homepage .v7-news-section,
body.bx-homepage .v7-games-section,
body.bx-homepage .v7-videos-section,
body.bx-homepage .v7-hubs-section {
    background: transparent !important;
    background-color: transparent !important;

    border: 0 !important;
    outline: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
}


/* ------------------------------------------------------------
   LATEST VIDEOS
   Remove big gray wrapper.
   ------------------------------------------------------------ */

body.bx-homepage .v7-video-section,
body.bx-homepage .v7-videos,
body.bx-homepage .v7-video-grid {
    background: transparent !important;

    border: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
}


/* ------------------------------------------------------------
   FEATURED GAMES
   ------------------------------------------------------------ */

body.bx-homepage .v7-games,
body.bx-homepage .v7-game-grid,
body.bx-homepage .v7-games-grid {
    background: transparent !important;

    border: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
}


/* Game tiles can still have their own visual identity */

body.bx-homepage .v7-game-card {
    background:
        linear-gradient(
            180deg,
            #121820,
            #090c10
        ) !important;

    border: 0 !important;

    border-radius: 3px !important;

    box-shadow: none !important;
}


/* ------------------------------------------------------------
   GAME HUBS
   ------------------------------------------------------------ */

body.bx-homepage .v7-hubs,
body.bx-homepage .v7-hub-grid,
body.bx-homepage .v7-game-hubs {
    background: transparent !important;

    border: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
}


/* ------------------------------------------------------------
   GAMING NEWS
   Kill the large gray box visible in screenshot.
   ------------------------------------------------------------ */

body.bx-homepage .v7-news-layout,
body.bx-homepage .v7-news-grid,
body.bx-homepage .v7-news-list,
body.bx-homepage .v7-news-column,
body.bx-homepage .v7-reviews-column {
    background: transparent !important;

    border: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
}


/* News stories become clean publication rows */

body.bx-homepage .v7-news-card,
body.bx-homepage .v7-story-card {
    background: transparent !important;

    border: 0 !important;

    border-bottom:
        1px solid rgba(255,255,255,.10) !important;

    border-radius: 0 !important;

    box-shadow: none !important;
}


/* Reviews divider only */

body.bx-homepage .v7-reviews-column {
    border-left:
        1px solid rgba(255,255,255,.12) !important;

    padding-left: 22px !important;
}


/* ------------------------------------------------------------
   COMMUNITY / WHAT'S NEXT
   Stop looking like HTML form boxes.
   ------------------------------------------------------------ */

body.bx-homepage .v7-bottom-grid {
    background: transparent !important;

    border: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;

    padding: 0 !important;
}

body.bx-homepage .v7-bottom-grid > * {
    background: transparent !important;

    border: 0 !important;

    border-top:
        2px solid #b93640 !important;

    border-radius: 0 !important;

    box-shadow: none !important;

    padding:
        20px 10px 18px 0 !important;
}


/* ------------------------------------------------------------
   SECTION HEADERS
   Magazine divider instead of card header.
   ------------------------------------------------------------ */

body.bx-homepage .v7-section-header {
    background: transparent !important;

    border: 0 !important;

    border-bottom:
        1px solid rgba(255,255,255,.15) !important;

    border-radius: 0 !important;

    box-shadow: none !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 10px !important;
}


/* ------------------------------------------------------------
   TRENDING
   ------------------------------------------------------------ */

body.bx-homepage .bxtrend,
body.bx-homepage .bxtrend-section,
body.bx-homepage .bxtrend-grid,
body.bx-homepage .bxpopular,
body.bx-homepage .bxpopular-list {
    background: transparent !important;

    border: 0 !important;

    border-radius: 0 !important;

    box-shadow: none !important;
}


/* ------------------------------------------------------------
   PHONE
   Same publication treatment.
   ------------------------------------------------------------ */

@media (max-width: 700px) {

    body.bx-homepage .v7-section,
    body.bx-homepage .v7-section-inner,
    body.bx-homepage .v7-section-content,
    body.bx-homepage .v7-video-section,
    body.bx-homepage .v7-video-grid,
    body.bx-homepage .v7-games,
    body.bx-homepage .v7-game-grid,
    body.bx-homepage .v7-games-grid,
    body.bx-homepage .v7-hubs,
    body.bx-homepage .v7-hub-grid,
    body.bx-homepage .v7-news-layout,
    body.bx-homepage .v7-news-grid,
    body.bx-homepage .v7-news-list,
    body.bx-homepage .v7-news-column,
    body.bx-homepage .v7-reviews-column,
    body.bx-homepage .v7-bottom-grid,
    body.bx-homepage .bxtrend,
    body.bx-homepage .bxtrend-grid {

        background: transparent !important;

        border-radius: 0 !important;

        box-shadow: none !important;
    }


    body.bx-homepage .v7-reviews-column {
        border-left: 0 !important;

        border-top:
            1px solid rgba(255,255,255,.13) !important;

        padding:
            20px 0 0 !important;

        margin-top: 20px !important;
    }


    body.bx-homepage .v7-bottom-grid > * {
        background: transparent !important;

        border-left: 0 !important;
        border-right: 0 !important;
        border-bottom: 0 !important;

        border-radius: 0 !important;

        box-shadow: none !important;
    }
}

