/*=============================================
                   Root Start
=============================================*/

:root {
    --page-background: #07101b;

    --surface-dark: #081321;
    --surface-deep: #050b14;

    --text-main: #ffffff;
    --text-secondary: #edf0f5;
    --text-muted: #abb5c3;

    --gold-main: #ffc63b;
    --gold-light: #ffe681;
    --gold-deep: #d98d08;

    --orange-main: #ff842e;

    --blue-main: #2992ff;
    --cyan-main: #31e5e5;

    --green-main: #3be2a4;
    --pink-main: #ff4cac;
    --violet-main: #775cff;

    --container-width: 1680px;
    --header-height: 82px;

    --transition-fast: 0.2s ease;
    --transition-main: 0.35s ease;
}

/*=============================================
                    Root End
=============================================*/


/*=============================================
                   Base Start
=============================================*/

*,
*::before,
*::after {
    box-sizing: border-box;
}


html {
    scroll-behavior: smooth;
}


body {
    margin: 0;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    color:
        var(--text-main);

    background:
        radial-gradient(
            circle at 80% 10%,
            rgba(255, 192, 48, 0.055),
            transparent 30%
        ),
        radial-gradient(
            circle at 15% 16%,
            rgba(47, 129, 255, 0.08),
            transparent 32%
        ),
        var(--page-background);

    line-height: 1.6;
}


body.nav-open {
    overflow: hidden;
}


a {
    color: inherit;
    text-decoration: none;
}


button {
    font: inherit;
}


img,
svg {
    display: block;
    max-width: 100%;
}


main {
    overflow: hidden;
}


section {
    scroll-margin-top:
        calc(
            var(--header-height) + 18px
        );
}

/*=============================================
                    Base End
=============================================*/


/*=============================================
                  Header Start
=============================================*/

.site-header {
    position: fixed;

    top: 0;
    left: 0;

    width: 100%;
    height: var(--header-height);

    z-index: 1000;

    background:
        rgba(5, 14, 26, 0.94);

    border-bottom:
        1px solid
        rgba(255, 198, 59, 0.15);

    backdrop-filter:
        blur(19px);

    -webkit-backdrop-filter:
        blur(19px);

    transition:
        background var(--transition-main),
        border-color var(--transition-main),
        box-shadow var(--transition-main);
}


.site-header.is-scrolled {
    background:
        rgba(5, 14, 26, 0.985);

    border-color:
        rgba(255, 198, 59, 0.29);

    box-shadow:
        0 15px 38px
        rgba(0, 0, 0, 0.38);
}


.site-header-inner {
    width:
        min(
            calc(100% - 48px),
            var(--container-width)
        );

    height: 100%;

    margin:
        0 auto;

    display:
        flex;

    align-items:
        center;

    gap:
        22px;
}


/*=============================================
                    Logo Start
=============================================*/

.site-logo {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        10px;

    flex-shrink:
        0;
}


.site-logo-symbol {
    width: 38px;
    height: 38px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        2px solid
        rgba(255, 218, 86, 0.92);

    border-radius:
        50%;

    background:
        radial-gradient(
            circle at 38% 32%,
            #4aa2ff 0%,
            #0b497e 47%,
            #041b31 100%
        );

    color:
        #ffffff;

    font-size:
        19px;

    font-weight:
        900;

    box-shadow:
        0 0 17px
        rgba(42, 145, 255, 0.28),
        0 0 14px
        rgba(255, 197, 57, 0.21);
}


.site-logo-text {
    display:
        flex;

    flex-direction:
        column;

    line-height:
        1;
}


.site-logo-text strong {
    background:
        linear-gradient(
            180deg,
            #fff4a0 0%,
            #ffca39 47%,
            #e99512 100%
        );

    -webkit-background-clip:
        text;

    background-clip:
        text;

    color:
        transparent;

    font-size:
        27px;

    font-weight:
        900;

    font-style:
        italic;

    letter-spacing:
        -0.045em;
}


.site-logo-text small {
    margin-top:
        5px;

    color:
        #68cdfc;

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        0.25em;
}

/*=============================================
                     Logo End
=============================================*/


/*=============================================
                Navigation Start
=============================================*/

.main-navigation {
    margin-left:
        auto;

    display:
        flex;

    align-items:
        center;

    gap:
        2px;
}


.main-navigation a {
    position:
        relative;

    padding:
        11px 11px;

    border-radius:
        9px;

    color:
        #e7ebf2;

    font-size:
        14px;

    font-weight:
        800;

    white-space:
        nowrap;

    transition:
        color var(--transition-fast),
        background var(--transition-fast);
}


.main-navigation a:hover,
.main-navigation a:focus-visible {
    color:
        #ffffff;

    background:
        rgba(255, 255, 255, 0.055);

    outline:
        none;
}


.main-navigation a.is-active {
    color:
        var(--gold-light);
}


.main-navigation a.is-active::after {
    content:
        "";

    position:
        absolute;

    left: 11px;
    right: 11px;

    bottom:
        2px;

    height:
        2px;

    border-radius:
        100px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--gold-main),
            var(--orange-main),
            transparent
        );

    box-shadow:
        0 0 13px
        rgba(255, 194, 47, 0.47);
}

/*=============================================
                 Navigation End
=============================================*/


/*=============================================
                Header Play Start
=============================================*/

.header-play {
    min-height:
        47px;

    padding:
        0 27px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    flex-shrink:
        0;

    border:
        1px solid
        rgba(255, 230, 126, 0.96);

    border-radius:
        11px;

    background:
        linear-gradient(
            180deg,
            #fff08a 0%,
            #ffd044 47%,
            #f5a719 100%
        );

    color:
        #07111e;

    font-size:
        14px;

    font-weight:
        900;

    box-shadow:
        0 11px 28px
        rgba(0, 0, 0, 0.28),
        0 0 22px
        rgba(255, 193, 44, 0.18);

    transition:
        transform var(--transition-fast),
        filter var(--transition-fast),
        box-shadow var(--transition-fast);
}


.header-play:hover,
.header-play:focus-visible {
    transform:
        translateY(-2px);

    filter:
        brightness(1.06);

    box-shadow:
        0 16px 34px
        rgba(0, 0, 0, 0.34),
        0 0 30px
        rgba(255, 195, 48, 0.30);

    outline:
        none;
}

/*=============================================
                 Header Play End
=============================================*/


/*=============================================
                 Mobile Menu Start
=============================================*/

.nav-toggle {
    display:
        none;

    width:
        44px;

    height:
        44px;

    margin-left:
        auto;

    padding:
        10px;

    border:
        1px solid
        rgba(255, 255, 255, 0.14);

    border-radius:
        11px;

    background:
        rgba(255, 255, 255, 0.05);

    cursor:
        pointer;
}


.nav-toggle span {
    display:
        block;

    width:
        100%;

    height:
        2px;

    margin:
        5px 0;

    border-radius:
        10px;

    background:
        #ffffff;

    transition:
        transform var(--transition-main),
        opacity var(--transition-main);
}


.nav-toggle.is-active span:nth-child(1) {
    transform:
        translateY(7px)
        rotate(45deg);
}


.nav-toggle.is-active span:nth-child(2) {
    opacity:
        0;
}


.nav-toggle.is-active span:nth-child(3) {
    transform:
        translateY(-7px)
        rotate(-45deg);
}

/*=============================================
                  Mobile Menu End
=============================================*/

/*=============================================
                   Header End
=============================================*/


/*=============================================
                    Hero Start
=============================================*/

.casino-hero {
    position:
        relative;

    margin-top:
        var(--header-height);

    min-height:
        calc(100vh - var(--header-height));

    min-height:
        calc(100svh - var(--header-height));

    overflow:
        hidden;

    isolation:
        isolate;

    background:
        #07101b;
}


/*=============================================
              Hero Background Start
=============================================*/

.hero-background {
    position:
        absolute;

    inset:
        0;

    z-index:
        -5;

    background:
        url("../images/hero.webp")
        center center / cover
        no-repeat;
}


.hero-background::after {
    content:
        "";

    position:
        absolute;

    inset:
        0;

    pointer-events:
        none;

    background:
        radial-gradient(
            ellipse at 60% 67%,
            rgba(255, 178, 39, 0.10) 0%,
            transparent 38%
        );
}


.hero-shade {
    position:
        absolute;

    inset:
        0;

    z-index:
        -4;

    pointer-events:
        none;

    background:
        linear-gradient(
            90deg,
            rgba(3, 10, 19, 0.98) 0%,
            rgba(3, 10, 19, 0.93) 17%,
            rgba(3, 10, 19, 0.72) 27%,
            rgba(3, 10, 19, 0.39) 37%,
            rgba(3, 10, 19, 0.08) 49%,
            rgba(3, 10, 19, 0.00) 62%,
            rgba(3, 10, 19, 0.08) 100%
        ),
        linear-gradient(
            180deg,
            rgba(4, 10, 18, 0.05) 0%,
            transparent 55%,
            rgba(4, 10, 18, 0.28) 100%
        );
}

/*=============================================
               Hero Background End
=============================================*/


/*=============================================
                 Hero Layout Start
=============================================*/

.hero-layout {
    position:
        relative;

    width:
        min(
            calc(100% - 56px),
            var(--container-width)
        );

    min-height:
        calc(100vh - var(--header-height));

    min-height:
        calc(100svh - var(--header-height));

    margin:
        0 auto;

    padding:
        clamp(38px, 5vh, 62px)
        0
        38px;

    display:
        grid;

    grid-template-columns:
        minmax(390px, 0.72fr)
        minmax(820px, 1.28fr);

    align-items:
        center;

    gap:
        12px;
}

/*=============================================
                  Hero Layout End
=============================================*/


/*=============================================
                  Hero Copy Start
=============================================*/

.hero-copy {
    position:
        relative;

    z-index:
        40;

    max-width:
        565px;
}


.hero-kicker {
    display:
        inline-block;

    margin-bottom:
        13px;

    color:
        var(--gold-main);

    font-size:
        13px;

    font-weight:
        900;

    letter-spacing:
        0.17em;

    text-transform:
        uppercase;

    text-shadow:
        0 0 18px
        rgba(255, 190, 40, 0.24);
}


.hero-copy h1 {
    margin:
        0;

    color:
        #ffffff;

    font-size:
        clamp(
            57px,
            4.8vw,
            82px
        );

    font-weight:
        900;

    line-height:
        0.92;

    letter-spacing:
        -0.055em;

    text-shadow:
        0 14px 35px
        rgba(0, 0, 0, 0.38);
}


.hero-copy h1 span {
    display:
        block;

    margin-top:
        6px;

    background:
        linear-gradient(
            180deg,
            #fff59e 0%,
            #ffcb38 46%,
            #f29b16 100%
        );

    -webkit-background-clip:
        text;

    background-clip:
        text;

    color:
        transparent;
}


.hero-tagline {
    max-width:
        520px;

    margin:
        21px 0 0;

    color:
        #ffffff;

    font-size:
        clamp(
            20px,
            1.4vw,
            25px
        );

    font-weight:
        900;

    line-height:
        1.27;
}


.hero-description {
    max-width:
        535px;

    margin:
        14px 0 0;

    color:
        var(--text-secondary);

    font-size:
        15px;

    font-weight:
        500;

    line-height:
        1.67;
}

/*=============================================
                   Hero Copy End
=============================================*/


/*=============================================
                 Hero Action Start
=============================================*/

.hero-action {
    width:
        fit-content;

    margin-top:
        24px;
}


.hero-play {
    min-width:
        218px;

    min-height:
        57px;

    padding:
        0 29px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        17px;

    border:
        1px solid
        rgba(255, 231, 129, 0.97);

    border-radius:
        15px;

    background:
        linear-gradient(
            180deg,
            #fff08a 0%,
            #ffcf43 49%,
            #f3a214 100%
        );

    color:
        #07111e;

    font-size:
        18px;

    font-weight:
        900;

    box-shadow:
        0 15px 33px
        rgba(0, 0, 0, 0.30),
        0 0 29px
        rgba(255, 191, 37, 0.22);

    transition:
        transform var(--transition-fast),
        filter var(--transition-fast),
        box-shadow var(--transition-fast);
}


.hero-play svg {
    width:
        20px;

    height:
        20px;

    fill:
        none;

    stroke:
        currentColor;

    stroke-width:
        2.5;

    stroke-linecap:
        round;

    stroke-linejoin:
        round;
}


.hero-play:hover,
.hero-play:focus-visible {
    transform:
        translateY(-3px);

    filter:
        brightness(1.06);

    box-shadow:
        0 19px 40px
        rgba(0, 0, 0, 0.36),
        0 0 38px
        rgba(255, 193, 39, 0.34);

    outline:
        none;
}

/*=============================================
                  Hero Action End
=============================================*/


/*=============================================
               Hero Highlights Start
=============================================*/

.hero-highlights {
    max-width:
        550px;

    margin-top:
        27px;

    display:
        grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap:
        12px;
}


.hero-highlight {
    min-width:
        0;

    display:
        flex;

    align-items:
        center;

    gap:
        9px;
}


.hero-highlight-icon {
    width:
        38px;

    height:
        38px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex-shrink:
        0;

    border:
        1px solid
        rgba(255, 199, 58, 0.55);

    border-radius:
        50%;

    background:
        rgba(255, 192, 39, 0.08);

    color:
        var(--gold-light);

    font-size:
        15px;

    font-weight:
        900;
}


.hero-highlight div {
    min-width:
        0;

    display:
        flex;

    flex-direction:
        column;
}


.hero-highlight strong {
    color:
        #ffffff;

    font-size:
        12px;

    font-weight:
        900;
}


.hero-highlight div span {
    margin-top:
        2px;

    color:
        var(--text-muted);

    font-size:
        10px;

    font-weight:
        600;

    line-height:
        1.3;
}

/*=============================================
                Hero Highlights End
=============================================*/


/*=============================================
                   Hero Stage Start
=============================================*/

.hero-stage {
    position:
        relative;

    width:
        100%;

    min-height:
        705px;
}


.hero-categories {
    position:
        absolute;

    inset:
        0;

    z-index:
        30;

    pointer-events:
        none;
}

/*=============================================
                    Hero Stage End
=============================================*/


/*=============================================
                   Hero Cards Start
=============================================*/

.hero-category-card {
    --card-color: 255, 197, 55;

    position:
        absolute;

    width:
        clamp(
            112px,
            8.5vw,
            145px
        );

    aspect-ratio:
        760 / 1350;

    overflow:
        hidden;

    border:
        2px solid
        rgba(
            var(--card-color),
            0.92
        );

    border-radius:
        16px;

    background:
        #08101b;

    pointer-events:
        auto;

    isolation:
        isolate;

    transform-origin:
        center bottom;

    box-shadow:
        0 18px 34px
        rgba(0, 0, 0, 0.46),
        0 0 16px
        rgba(
            var(--card-color),
            0.42
        );

    transition:
        transform 0.32s ease,
        border-color 0.32s ease,
        box-shadow 0.32s ease;
}


.hero-category-card img {
    position:
        absolute;

    inset:
        0;

    width:
        100%;

    height:
        100%;

    max-width:
        none;

    object-fit:
        cover;

    transform:
        scale(1.015);

    transition:
        transform 0.4s ease,
        filter 0.4s ease;
}


.hero-category-card::after {
    content:
        "";

    position:
        absolute;

    inset:
        0;

    z-index:
        2;

    pointer-events:
        none;

    background:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.01) 0%,
            transparent 57%,
            rgba(3, 8, 15, 0.52) 100%
        );
}


.hero-card-title {
    position:
        absolute;

    left:
        10px;

    right:
        10px;

    bottom:
        11px;

    z-index:
        4;

    color:
        #ffffff;

    font-size:
        clamp(
            11px,
            0.8vw,
            14px
        );

    font-weight:
        900;

    line-height:
        1.12;

    text-align:
        center;

    text-shadow:
        0 3px 11px
        rgba(0, 0, 0, 0.88);
}


/* Pokies */

.hero-card-pokies {
    --card-color: 255, 168, 41;

    left:
        14%;

    top:
        6%;

    transform:
        rotate(-12deg);
}


/* Live Casino */

.hero-card-live {
    --card-color: 48, 234, 191;

    left:
        27%;

    top:
        1%;

    transform:
        rotate(-7deg);
}


/* Table Games */

.hero-card-tables {
    --card-color: 63, 160, 255;

    left:
        40%;

    top:
        0;

    transform:
        rotate(-2deg);
}


/* Promotions */

.hero-card-promotions {
    --card-color: 255, 67, 179;

    left:
        53%;

    top:
        4%;

    transform:
        rotate(5deg);
}


/* Tournaments */

.hero-card-tournaments {
    --card-color: 95, 98, 255;

    left:
        66%;

    top:
        11%;

    transform:
        rotate(10deg);
}


/* Banking */

.hero-card-banking {
    --card-color: 53, 229, 160;

    left:
        79%;

    top:
        21%;

    transform:
        rotate(15deg);
}


/*=============================================
                  Hero Card Hover Start
=============================================*/

.hero-category-card:hover,
.hero-category-card:focus-visible,
.hero-category-card.is-active {
    z-index:
        60;

    border-color:
        rgba(
            var(--card-color),
            1
        );

    box-shadow:
        0 26px 48px
        rgba(0, 0, 0, 0.55),
        0 0 22px
        rgba(
            var(--card-color),
            0.72
        );

    outline:
        none;
}


.hero-card-pokies:hover,
.hero-card-pokies:focus-visible,
.hero-card-pokies.is-active {
    transform:
        rotate(-12deg)
        translateY(-8px)
        scale(1.055);
}


.hero-card-live:hover,
.hero-card-live:focus-visible,
.hero-card-live.is-active {
    transform:
        rotate(-7deg)
        translateY(-8px)
        scale(1.055);
}


.hero-card-tables:hover,
.hero-card-tables:focus-visible,
.hero-card-tables.is-active {
    transform:
        rotate(-2deg)
        translateY(-8px)
        scale(1.055);
}


.hero-card-promotions:hover,
.hero-card-promotions:focus-visible,
.hero-card-promotions.is-active {
    transform:
        rotate(5deg)
        translateY(-8px)
        scale(1.055);
}


.hero-card-tournaments:hover,
.hero-card-tournaments:focus-visible,
.hero-card-tournaments.is-active {
    transform:
        rotate(10deg)
        translateY(-8px)
        scale(1.055);
}


.hero-card-banking:hover,
.hero-card-banking:focus-visible,
.hero-card-banking.is-active {
    transform:
        rotate(15deg)
        translateY(-8px)
        scale(1.055);
}


.hero-category-card:hover img,
.hero-category-card:focus-visible img,
.hero-category-card.is-active img {
    transform:
        scale(1.065);

    filter:
        brightness(1.07)
        saturate(1.08);
}

/*=============================================
                   Hero Card Hover End
=============================================*/

/*=============================================
                    Hero Cards End
=============================================*/


/*=============================================
                Header Responsive Start
=============================================*/

@media (max-width: 1160px) {

    .nav-toggle {
        display:
            block;
    }


    .main-navigation {
        position:
            fixed;

        top:
            var(--header-height);

        left:
            18px;

        right:
            18px;

        display:
            none;

        flex-direction:
            column;

        align-items:
            stretch;

        gap:
            4px;

        padding:
            14px;

        border:
            1px solid
            rgba(255, 203, 63, 0.18);

        border-radius:
            15px;

        background:
            rgba(5, 14, 26, 0.985);

        box-shadow:
            0 20px 50px
            rgba(0, 0, 0, 0.42);
    }


    .main-navigation.is-open {
        display:
            flex;
    }


    .main-navigation a {
        padding:
            13px 14px;
    }

}

/*=============================================
                 Header Responsive End
=============================================*/


/*=============================================
                 Hero Responsive Start
=============================================*/

@media (max-width: 1360px) {

    .hero-layout {
        grid-template-columns:
            minmax(350px, 0.78fr)
            minmax(620px, 1.22fr);
    }


    .hero-stage {
        min-height:
            610px;
    }


    .hero-category-card {
        width:
            clamp(
                100px,
                8.3vw,
                126px
            );
    }

}


@media (max-width: 1120px) {

    .casino-hero {
        min-height:
            auto;
    }


    .hero-layout {
        min-height:
            auto;

        grid-template-columns:
            1fr;

        padding:
            48px
            0
            42px;

        gap:
            40px;
    }


    .hero-copy {
        max-width:
            680px;
    }


    .hero-stage {
        min-height:
            auto;
    }


    .hero-categories {
        position:
            relative;

        inset:
            auto;

        display:
            grid;

        grid-template-columns:
            repeat(
                6,
                minmax(0, 1fr)
            );

        gap:
            10px;
    }


    .hero-category-card,
    .hero-card-pokies,
    .hero-card-live,
    .hero-card-tables,
    .hero-card-promotions,
    .hero-card-tournaments,
    .hero-card-banking {
        position:
            relative;

        top:
            auto;

        left:
            auto;

        right:
            auto;

        bottom:
            auto;

        width:
            100%;

        transform:
            none;
    }


    .hero-category-card:hover,
    .hero-category-card:focus-visible,
    .hero-category-card.is-active {
        transform:
            translateY(-6px)
            scale(1.025);
    }


    .hero-background {
        background-position:
            58% center;
    }

}


@media (max-width: 820px) {

    .site-header-inner {
        width:
            calc(100% - 28px);
    }


    .header-play {
        display:
            none;
    }


    .hero-layout {
        width:
            calc(100% - 30px);
    }


    .hero-copy h1 {
        font-size:
            clamp(
                50px,
                13vw,
                70px
            );
    }


    .hero-categories {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }


    .hero-highlights {
        grid-template-columns:
            1fr;

        gap:
            10px;
    }

}


@media (max-width: 520px) {

    .site-logo-text strong {
        font-size:
            23px;
    }


    .hero-kicker {
        font-size:
            11px;

        letter-spacing:
            0.12em;
    }


    .hero-tagline {
        font-size:
            20px;
    }


    .hero-description {
        font-size:
            14px;
    }


    .hero-play {
        width:
            100%;

        max-width:
            290px;
    }


    .hero-categories {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}

/*=============================================
                  Hero Responsive End
=============================================*/

/*=============================================
                     Hero End
=============================================*/
/*=============================================
                    Pokies Start
=============================================*/

.games-section {
    position: relative;

    padding:
        46px
        22px
        74px;

    overflow: visible;

    isolation: isolate;

    color: #ffffff;
}


.games-section[hidden] {
    display: none !important;
}


/*=============================================
                Pokies Theme Start
=============================================*/

.pokies-section {
    --section-accent-rgb: 255, 190, 42;
    --section-accent: #ffbe2a;
    --section-accent-light: #ffe27b;
    --section-secondary-rgb: 255, 112, 29;
    --section-ink: #2c1902;

    background:
        radial-gradient(
            ellipse at 10% 4%,
            rgba(255, 179, 38, 0.22) 0%,
            rgba(255, 179, 38, 0.07) 27%,
            transparent 47%
        ),
        radial-gradient(
            ellipse at 88% 8%,
            rgba(255, 100, 21, 0.16) 0%,
            rgba(255, 100, 21, 0.04) 30%,
            transparent 50%
        ),
        linear-gradient(
            145deg,
            #160f08 0%,
            #16151c 44%,
            #0c1420 100%
        );

    border-top:
        1px solid
        rgba(255, 195, 54, 0.16);
}


.games-shell {
    position: relative;

    width:
        min(
            calc(100% - 10px),
            1360px
        );

    margin:
        0 auto;
}


.games-main {
    min-width: 0;
}

/*=============================================
                 Pokies Theme End
=============================================*/


/*=============================================
                Site Navigation Start
=============================================*/

.games-site-navigation {
    position: absolute;

    top: 0;

    left: -188px;

    width: 164px;

    z-index: 80;
}


.games-site-switcher {
    width: 164px;

    padding: 9px;

    display: flex;

    flex-direction: column;

    gap: 8px;

    border:
        1px solid
        rgba(255, 198, 56, 0.19);

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            rgba(22, 19, 18, 0.92),
            rgba(8, 15, 24, 0.96)
        );

    backdrop-filter:
        blur(22px)
        saturate(140%);

    -webkit-backdrop-filter:
        blur(22px)
        saturate(140%);

    box-shadow:
        0 22px 48px
        rgba(0, 0, 0, 0.38),
        inset 0 1px 0
        rgba(255, 255, 255, 0.06);
}


.games-site-navigation.is-floating {
    position: fixed;

    top: 50%;

    left:
        max(
            12px,
            calc(50% - 680px - 188px)
        );

    transform:
        translateY(-50%);
}


.games-site-navigation.is-at-bottom {
    position: absolute;

    top: auto;

    bottom: 0;

    left: -188px;

    transform: none;
}


.games-site-switcher-button {
    --site-accent-rgb: 255, 190, 42;
    --site-ink: #2b1902;

    min-height: 62px;

    padding: 8px;

    display: grid;

    grid-template-columns:
        38px
        minmax(0, 1fr);

    gap: 9px;

    align-items: center;

    border:
        1px solid
        rgba(
            var(--site-accent-rgb),
            0.42
        );

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            rgba(
                var(--site-accent-rgb),
                0.11
            ),
            rgba(255, 255, 255, 0.02)
        );

    color: #ffffff;

    font: inherit;

    text-align: left;

    cursor: pointer;

    box-shadow:
        inset 0 1px 0
        rgba(255, 255, 255, 0.05),
        0 7px 17px
        rgba(0, 0, 0, 0.20);

    transition:
        transform 0.2s ease,
        border-color 0.2s ease,
        background 0.2s ease,
        color 0.2s ease,
        box-shadow 0.2s ease;
}


.games-site-switcher-button[data-section-target="pokies"] {
    --site-accent-rgb: 255, 194, 47;
    --site-ink: #2c1b02;
}


.games-site-switcher-button[data-section-target="live-casino"] {
    --site-accent-rgb: 48, 208, 255;
    --site-ink: #061e2a;
}


.games-site-switcher-button[data-section-target="table-games"] {
    --site-accent-rgb: 44, 221, 158;
    --site-ink: #05251a;
}


.games-site-switcher-button[data-section-target="promotions"] {
    --site-accent-rgb: 255, 66, 168;
    --site-ink: #2c081d;
}


.games-site-switcher-button[data-section-target="tournaments"] {
    --site-accent-rgb: 111, 111, 255;
    --site-ink: #0e0c2b;
}


.games-site-switcher-button[data-section-target="banking"] {
    --site-accent-rgb: 62, 224, 180;
    --site-ink: #06241b;
}


.games-site-switcher-icon {
    width: 38px;
    height: 38px;

    display: grid;

    place-items: center;

    border:
        1px solid
        rgba(
            var(--site-accent-rgb),
            0.72
        );

    border-radius: 11px;

    background:
        rgba(
            var(--site-accent-rgb),
            0.12
        );

    color:
        rgba(
            var(--site-accent-rgb),
            1
        );

    font-size: 10px;

    font-weight: 900;
}


.games-site-switcher-copy strong {
    display: block;

    font-size: 12px;

    font-weight: 900;

    line-height: 1.08;
}


.games-site-switcher-copy small {
    display: block;

    margin-top: 3px;

    color:
        rgba(
            229,
            232,
            239,
            0.66
        );

    font-size: 10px;

    font-weight: 650;

    line-height: 1.18;
}


.games-site-switcher-button:hover,
.games-site-switcher-button:focus-visible {
    transform:
        translateX(5px);

    border-color:
        rgba(
            var(--site-accent-rgb),
            0.86
        );

    box-shadow:
        0 11px 23px
        rgba(0, 0, 0, 0.27),
        0 0 19px
        rgba(
            var(--site-accent-rgb),
            0.16
        );

    outline: none;
}


.games-site-switcher-button.is-active {
    transform:
        translateX(7px);

    color:
        var(--site-ink);

    border-color:
        rgba(
            255,
            255,
            255,
            0.72
        );

    background:
        linear-gradient(
            135deg,
            rgba(
                var(--site-accent-rgb),
                1
            ),
            rgba(
                var(--site-accent-rgb),
                0.72
            )
        );

    box-shadow:
        0 12px 25px
        rgba(0, 0, 0, 0.31),
        0 0 25px
        rgba(
            var(--site-accent-rgb),
            0.24
        );
}


.games-site-switcher-button.is-active
.games-site-switcher-icon {
    color:
        var(--site-ink);

    border-color:
        rgba(0, 0, 0, 0.15);

    background:
        rgba(0, 0, 0, 0.10);
}


.games-site-switcher-button.is-active
.games-site-switcher-copy small {
    color:
        rgba(0, 0, 0, 0.62);
}

/*=============================================
                 Site Navigation End
=============================================*/


/*=============================================
                    Intro Start
=============================================*/

.games-intro {
    margin-bottom: 15px;

    padding:
        29px
        31px;

    display: grid;

    grid-template-columns:
        minmax(0, 0.90fr)
        minmax(0, 1.10fr);

    gap: 40px;

    align-items: center;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.23
        );

    border-radius: 22px;

    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(
                var(--section-secondary-rgb),
                0.13
            ),
            transparent 38%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(
                var(--section-accent-rgb),
                0.08
            ),
            transparent 42%
        ),
        linear-gradient(
            145deg,
            rgba(30, 22, 18, 0.97),
            rgba(9, 17, 28, 0.98)
        );

    box-shadow:
        0 22px 50px
        rgba(0, 0, 0, 0.30),
        inset 0 1px 0
        rgba(255, 255, 255, 0.05);
}


.games-kicker,
.games-panel-kicker {
    margin:
        0
        0
        7px;

    color:
        var(--section-accent-light);

    font-size: 12px;

    font-weight: 900;

    line-height: 1.3;

    letter-spacing: 0.14em;

    text-transform: uppercase;
}


.games-intro h2 {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            35px,
            3.2vw,
            51px
        );

    font-weight: 900;

    line-height: 0.99;

    letter-spacing: -0.043em;
}


.games-intro-lead {
    margin:
        16px
        0
        0;

    color: #ffffff;

    font-size: 15px;

    font-weight: 700;

    line-height: 1.56;
}


.games-intro-secondary > p {
    margin: 0;

    color: #d1c8be;

    font-size: 14px;

    line-height: 1.62;
}


.games-intro-secondary > p + p {
    margin-top: 10px;
}


/*=============================================
                Intro Details Start
=============================================*/

.games-intro-more {
    margin-top: 14px;
}


.games-intro-more summary {
    width: fit-content;

    min-height: 43px;

    padding:
        0
        15px;

    display: inline-flex;

    align-items: center;

    gap: 10px;

    list-style: none;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.40
        );

    border-radius: 11px;

    background:
        linear-gradient(
            135deg,
            rgba(
                var(--section-accent-rgb),
                0.14
            ),
            rgba(
                var(--section-secondary-rgb),
                0.08
            )
        );

    color: #ffffff;

    font-size: 12px;

    font-weight: 900;

    cursor: pointer;
}


.games-intro-more summary::-webkit-details-marker {
    display: none;
}


.games-intro-more summary::after {
    content: "+";

    width: 25px;
    height: 25px;

    display: grid;

    place-items: center;

    border-radius: 50%;

    background:
        linear-gradient(
            135deg,
            var(--section-accent),
            #ff812c
        );

    color: var(--section-ink);

    font-size: 17px;

    font-weight: 900;

    line-height: 1;
}


.games-intro-more[open]
summary::after {
    transform:
        rotate(45deg);
}


.games-intro-more-content {
    margin-top: 9px;

    padding:
        15px
        17px;

    max-height: 300px;

    overflow-y: auto;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.15
        );

    border-radius: 12px;

    background:
        rgba(5, 8, 13, 0.44);
}


.games-intro-more-content p {
    margin: 0;

    color: #cbc4bc;

    font-size: 12.5px;

    line-height: 1.6;
}


.games-intro-more-content p + p {
    margin-top: 10px;
}

/*=============================================
                 Intro Details End
=============================================*/

/*=============================================
                     Intro End
=============================================*/


/*=============================================
             Experience Cards Start
=============================================*/

.pokies-experience {
    margin-bottom: 15px;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.pokies-experience article {
    min-width: 0;

    padding:
        16px
        17px;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.20
        );

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--section-accent-rgb),
                0.08
            ),
            rgba(255, 255, 255, 0.018)
        );

    box-shadow:
        0 10px 23px
        rgba(0, 0, 0, 0.19);
}


.pokies-experience article > span {
    display: block;

    margin-bottom: 5px;

    color:
        var(--section-accent);

    font-size: 9px;

    font-weight: 900;

    letter-spacing: 0.13em;
}


.pokies-experience strong {
    display: block;

    color: #ffffff;

    font-size: 14px;

    font-weight: 900;

    line-height: 1.12;
}


.pokies-experience p {
    margin:
        7px
        0
        0;

    color: #bab5b0;

    font-size: 11px;

    line-height: 1.46;
}

/*=============================================
              Experience Cards End
=============================================*/


/*=============================================
               Game Navigation Start
=============================================*/

.games-navigation {
    margin-bottom: 15px;

    display: grid;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.games-navigation-button {
    --nav-accent-rgb: 255, 190, 42;
    --nav-ink: #2c1902;

    min-width: 0;

    min-height: 70px;

    padding:
        9px
        10px;

    display: grid;

    grid-template-columns:
        39px
        minmax(0, 1fr);

    gap: 9px;

    align-items: center;

    border:
        1px solid
        rgba(
            var(--nav-accent-rgb),
            0.38
        );

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--nav-accent-rgb),
                0.10
            ),
            rgba(255, 255, 255, 0.018)
        );

    color: #ffffff;

    font: inherit;

    text-align: left;

    cursor: pointer;

    box-shadow:
        0 9px 21px
        rgba(0, 0, 0, 0.20);

    transition:
        transform 0.18s ease,
        border-color 0.18s ease,
        background 0.18s ease,
        color 0.18s ease,
        box-shadow 0.18s ease;
}


.games-navigation-button[data-games-target="signature"] {
    --nav-accent-rgb: 255, 190, 42;
}


.games-navigation-button[data-games-target="feature"] {
    --nav-accent-rgb: 255, 119, 29;
}


.games-navigation-button[data-games-target="quick"] {
    --nav-accent-rgb: 81, 180, 255;
}


.games-navigation-button[data-games-target="board"] {
    --nav-accent-rgb: 83, 222, 190;
}


.games-navigation-button[data-games-target="famous"] {
    --nav-accent-rgb: 255, 75, 157;
}


.games-nav-icon {
    width: 39px;
    height: 39px;

    display: grid;

    place-items: center;

    border:
        1px solid
        rgba(
            var(--nav-accent-rgb),
            0.70
        );

    border-radius: 11px;

    background:
        rgba(
            var(--nav-accent-rgb),
            0.10
        );

    color:
        rgba(
            var(--nav-accent-rgb),
            1
        );

    font-size: 10px;

    font-weight: 900;
}


.games-navigation-button strong {
    display: block;

    font-size: 13px;

    font-weight: 900;

    line-height: 1.1;
}


.games-navigation-button small {
    display: block;

    margin-top: 3px;

    color:
        rgba(
            230,
            232,
            240,
            0.66
        );

    font-size: 10px;

    font-weight: 700;

    line-height: 1.15;
}


.games-navigation-button:hover,
.games-navigation-button:focus-visible {
    transform:
        translateY(-3px);

    border-color:
        rgba(
            var(--nav-accent-rgb),
            0.90
        );

    outline: none;
}


.games-navigation-button.is-active {
    transform:
        translateY(-3px);

    color: #241703;

    border-color:
        rgba(255, 255, 255, 0.69);

    background:
        linear-gradient(
            135deg,
            rgba(
                var(--nav-accent-rgb),
                1
            ),
            rgba(
                var(--nav-accent-rgb),
                0.72
            )
        );

    box-shadow:
        0 13px 28px
        rgba(0, 0, 0, 0.30),
        0 0 24px
        rgba(
            var(--nav-accent-rgb),
            0.23
        );
}


.games-navigation-button.is-active
.games-nav-icon {
    color: #241703;

    border-color:
        rgba(0, 0, 0, 0.15);

    background:
        rgba(0, 0, 0, 0.10);
}


.games-navigation-button.is-active small {
    color:
        rgba(0, 0, 0, 0.60);
}

/*=============================================
                Game Navigation End
=============================================*/


/*=============================================
                   Games Stage Start
=============================================*/

.games-stage {
    --games-accent-rgb: 255, 190, 42;
    --games-accent: #ffbe2a;
    --games-ink: #281902;

    padding: 22px;

    border:
        1px solid
        rgba(
            var(--games-accent-rgb),
            0.23
        );

    border-radius: 21px;

    background:
        radial-gradient(
            circle at 96% 4%,
            rgba(
                var(--games-accent-rgb),
                0.10
            ),
            transparent 29%
        ),
        linear-gradient(
            145deg,
            rgba(23, 19, 21, 0.99),
            rgba(8, 14, 24, 0.99)
        );

    box-shadow:
        0 22px 50px
        rgba(0, 0, 0, 0.30),
        inset 0 1px 0
        rgba(255, 255, 255, 0.04);

    transition:
        border-color 0.25s ease,
        background 0.25s ease;
}


.games-stage[data-games-theme="signature"] {
    --games-accent-rgb: 255, 190, 42;
    --games-accent: #ffbe2a;
    --games-ink: #281902;
}


.games-stage[data-games-theme="feature"] {
    --games-accent-rgb: 255, 119, 29;
    --games-accent: #ff771d;
    --games-ink: #2b1102;
}


.games-stage[data-games-theme="quick"] {
    --games-accent-rgb: 81, 180, 255;
    --games-accent: #51b4ff;
    --games-ink: #061d30;
}


.games-stage[data-games-theme="board"] {
    --games-accent-rgb: 83, 222, 190;
    --games-accent: #53debe;
    --games-ink: #06231b;
}


.games-stage[data-games-theme="famous"] {
    --games-accent-rgb: 255, 75, 157;
    --games-accent: #ff4b9d;
    --games-ink: #2b091b;
}


.games-panel[hidden],
.games-subpanel[hidden],
.game-detail[hidden] {
    display: none !important;
}

/*=============================================
                    Games Stage End
=============================================*/


/*=============================================
                 Panel Heading Start
=============================================*/

.games-panel-heading {
    padding-bottom: 17px;

    display: grid;

    grid-template-columns:
        minmax(0, 0.78fr)
        minmax(0, 1.22fr);

    gap: 35px;

    align-items: center;

    border-bottom:
        1px solid
        rgba(
            var(--games-accent-rgb),
            0.20
        );
}


.games-panel-kicker {
    color:
        var(--games-accent);
}


.games-panel-heading h3 {
    max-width: 660px;

    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            28px,
            2.25vw,
            38px
        );

    font-weight: 900;

    line-height: 1.03;

    letter-spacing: -0.034em;
}


.games-panel-copy p {
    margin: 0;

    color: #c7c3c0;

    font-size: 13px;

    line-height: 1.59;
}


.games-panel-copy p + p {
    margin-top: 8px;
}


.games-panel-copy
.games-panel-lead {
    color: #ffffff;

    font-size: 14px;

    font-weight: 700;
}

/*=============================================
                  Panel Heading End
=============================================*/


/*=============================================
                  Category Layout Start
=============================================*/

.games-category-layout {
    margin-top: 16px;

    display: grid;

    grid-template-columns:
        174px
        minmax(0, 1fr);

    gap: 15px;

    align-items: start;
}


.games-subnav {
    display: grid;

    gap: 8px;
}


.games-subnav-button {
    min-height: 47px;

    padding:
        9px
        12px
        9px
        15px;

    border:
        1px solid
        rgba(
            var(--games-accent-rgb),
            0.39
        );

    border-radius: 11px;

    background:
        linear-gradient(
            135deg,
            rgba(
                var(--games-accent-rgb),
                0.10
            ),
            rgba(255, 255, 255, 0.015)
        );

    color: #e8e9ef;

    font: inherit;

    font-size: 12px;

    font-weight: 850;

    text-align: left;

    cursor: pointer;

    transition:
        transform 0.18s ease,
        border-color 0.18s ease,
        background 0.18s ease,
        color 0.18s ease;
}


.games-subnav-button:hover,
.games-subnav-button:focus-visible {
    transform:
        translateX(4px);

    border-color:
        var(--games-accent);

    outline: none;
}


.games-subnav-button.is-active {
    transform:
        translateX(5px);

    color:
        var(--games-ink);

    border-color:
        rgba(255, 255, 255, 0.65);

    background:
        linear-gradient(
            135deg,
            var(--games-accent),
            rgba(
                var(--games-accent-rgb),
                0.72
            )
        );
}


.games-subpanels {
    min-width: 0;
}


.games-subpanel-head {
    padding-bottom: 9px;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        auto;

    gap: 20px;

    align-items: end;

    border-bottom:
        1px solid
        rgba(
            var(--games-accent-rgb),
            0.17
        );
}


.games-subpanel-head strong {
    display: block;

    color:
        var(--games-accent);

    font-size: 19px;

    font-weight: 900;
}


.games-subpanel-head p {
    margin:
        4px
        0
        0;

    color: #c0c1c4;

    font-size: 12px;

    line-height: 1.44;
}


.games-subpanel-head > span {
    color: #97999f;

    font-size: 11px;

    font-weight: 700;
}

/*=============================================
                  Category Layout End
=============================================*/


/*=============================================
                    Game Grid Start
=============================================*/

.games-grid {
    margin-top: 10px;

    display: grid;

    grid-template-columns:
        repeat(
            6,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.game-card {
    min-width: 0;

    padding: 0;

    overflow: hidden;

    border:
        1px solid
        rgba(
            var(--games-accent-rgb),
            0.24
        );

    border-radius: 11px;

    background: #080b12;

    color: #ffffff;

    text-align: left;

    cursor: pointer;

    box-shadow:
        0 8px 18px
        rgba(0, 0, 0, 0.27);

    transition:
        transform 0.18s ease,
        border-color 0.18s ease,
        box-shadow 0.18s ease;
}


.game-card:hover,
.game-card:focus-visible {
    transform:
        translateY(-3px);

    border-color:
        var(--games-accent);

    box-shadow:
        0 12px 24px
        rgba(0, 0, 0, 0.33),
        0 0 16px
        rgba(
            var(--games-accent-rgb),
            0.13
        );

    outline: none;
}


.game-card.is-active {
    transform:
        translateY(-3px);

    border-color:
        var(--games-accent);

    box-shadow:
        0 0 0 1px
        rgba(
            var(--games-accent-rgb),
            0.18
        ),
        0 13px 25px
        rgba(0, 0, 0, 0.34),
        0 0 19px
        rgba(
            var(--games-accent-rgb),
            0.17
        );
}


.game-card img {
    display: block;

    width: 100%;

    aspect-ratio:
        760 / 500;

    object-fit: cover;

    object-position: center;

    background: #070910;
}


.game-card-copy {
    min-height: 57px;

    padding:
        7px
        8px
        8px;

    display: block;

    border-top:
        3px solid
        var(--games-accent);

    background:
        linear-gradient(
            180deg,
            #171821,
            #090c13
        );
}


.game-card-copy strong {
    display: block;

    color: #ffffff;

    font-size: 10.8px;

    font-weight: 900;

    line-height: 1.17;
}


.game-card-copy small {
    display: block;

    margin-top: 4px;

    color:
        var(--games-accent);

    font-size: 9.8px;

    font-weight: 750;

    line-height: 1.14;
}

/*=============================================
                     Game Grid End
=============================================*/


/*=============================================
                   Game Detail Start
=============================================*/

.game-details {
    margin-top: 10px;
}


.game-detail {
    padding:
        16px
        18px;

    display: grid;

    grid-template-columns:
        minmax(205px, 0.30fr)
        minmax(0, 1.70fr);

    gap: 25px;

    border:
        1px solid
        rgba(
            var(--games-accent-rgb),
            0.26
        );

    border-radius: 13px;

    background:
        radial-gradient(
            circle at 0% 50%,
            rgba(
                var(--games-accent-rgb),
                0.10
            ),
            transparent 36%
        ),
        rgba(255, 255, 255, 0.017);
}


.game-detail-title span {
    display: block;

    margin-bottom: 5px;

    color:
        var(--games-accent);

    font-size: 10px;

    font-weight: 900;

    letter-spacing: 0.08em;

    text-transform: uppercase;
}


.game-detail-title h4 {
    margin: 0;

    color: #ffffff;

    font-size: 20px;

    font-weight: 900;

    line-height: 1.08;
}


.game-detail-copy p {
    margin: 0;

    color: #c8c4bf;

    font-size: 12.5px;

    line-height: 1.58;
}


.game-detail-copy p + p {
    margin-top: 8px;
}


.game-detail-compare {
    padding:
        8px
        10px;

    border-left:
        3px solid
        var(--games-accent);

    border-radius:
        0
        7px
        7px
        0;

    background:
        rgba(
            var(--games-accent-rgb),
            0.06
        );
}


.game-detail-compare strong {
    color:
        var(--games-accent);
}

/*=============================================
                    Game Detail End
=============================================*/


/*=============================================
                       Guide Start
=============================================*/

.games-guide {
    margin-top: 14px;
}


.games-guide summary {
    min-height: 50px;

    padding:
        0
        15px
        0
        17px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 18px;

    list-style: none;

    border:
        1px solid
        rgba(
            var(--games-accent-rgb),
            0.42
        );

    border-radius: 12px;

    background:
        linear-gradient(
            135deg,
            rgba(
                var(--games-accent-rgb),
                0.14
            ),
            rgba(
                var(--games-accent-rgb),
                0.04
            )
        );

    color: #ffffff;

    font-size: 12.5px;

    font-weight: 900;

    cursor: pointer;
}


.games-guide summary::-webkit-details-marker {
    display: none;
}


.games-guide summary::after {
    content: "+";

    width: 29px;
    height: 29px;

    display: grid;

    place-items: center;

    flex-shrink: 0;

    border-radius: 50%;

    background:
        var(--games-accent);

    color:
        var(--games-ink);

    font-size: 18px;

    font-weight: 900;
}


.games-guide[open]
summary::after {
    transform:
        rotate(45deg);
}


.games-guide-content {
    margin-top: 8px;

    padding:
        17px
        19px;

    max-height: 290px;

    overflow-y: auto;

    border:
        1px solid
        rgba(
            var(--games-accent-rgb),
            0.17
        );

    border-radius: 12px;

    background:
        rgba(255, 255, 255, 0.015);
}


.games-guide-content h4 {
    margin:
        0
        0
        9px;

    color:
        var(--games-accent);

    font-size: 19px;

    font-weight: 900;
}


.games-guide-content p {
    margin: 0;

    color: #c8c4be;

    font-size: 12.5px;

    line-height: 1.6;
}


.games-guide-content p + p {
    margin-top: 9px;
}

/*=============================================
                        Guide End
=============================================*/


/*=============================================
                Knowledge Base Start
=============================================*/

.pokies-knowledge {
    margin-top: 18px;

    padding:
        23px;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.16
        );

    border-radius: 17px;

    background:
        linear-gradient(
            145deg,
            rgba(24, 20, 20, 0.91),
            rgba(8, 16, 27, 0.95)
        );
}


.pokies-knowledge-head {
    display: grid;

    grid-template-columns:
        minmax(0, 0.80fr)
        minmax(0, 1.20fr);

    gap: 30px;

    align-items: end;

    margin-bottom: 14px;
}


.pokies-knowledge-head h3 {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            25px,
            2vw,
            34px
        );

    font-weight: 900;

    line-height: 1.04;
}


.pokies-knowledge-head > p:last-child {
    margin: 0;

    color: #bdb7b0;

    font-size: 12px;

    text-align: right;
}


.pokies-knowledge-grid {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.pokies-knowledge-item {
    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.17
        );

    border-radius: 12px;

    background:
        rgba(
            var(--section-accent-rgb),
            0.035
        );
}


.pokies-knowledge-item summary {
    min-height: 52px;

    padding:
        0
        15px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 14px;

    list-style: none;

    color: #ffffff;

    font-size: 12px;

    font-weight: 900;

    cursor: pointer;
}


.pokies-knowledge-item summary::-webkit-details-marker {
    display: none;
}


.pokies-knowledge-item summary::after {
    content: "+";

    color:
        var(--section-accent);

    font-size: 21px;

    line-height: 1;
}


.pokies-knowledge-item[open]
summary::after {
    transform:
        rotate(45deg);
}


.pokies-knowledge-item > div {
    padding:
        0
        15px
        15px;
}


.pokies-knowledge-item p {
    margin: 0;

    color: #bbb7b2;

    font-size: 11.5px;

    line-height: 1.58;
}


.pokies-knowledge-item p + p {
    margin-top: 8px;
}

/*=============================================
                 Knowledge Base End
=============================================*/


/*=============================================
                    Closing Start
=============================================*/

.games-closing {
    margin-top: 18px;

    padding:
        22px
        24px;

    display: grid;

    grid-template-columns:
        minmax(0, 0.72fr)
        minmax(0, 1.28fr);

    gap: 34px;

    align-items: center;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.17
        );

    border-radius: 16px;

    background:
        linear-gradient(
            145deg,
            rgba(28, 21, 18, 0.92),
            rgba(9, 17, 28, 0.95)
        );
}


.games-closing h3 {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            26px,
            2.2vw,
            36px
        );

    font-weight: 900;

    line-height: 1.04;
}


.games-closing > div:last-child p {
    margin: 0;

    color: #c3bdb7;

    font-size: 12.5px;

    line-height: 1.59;
}


.games-closing > div:last-child p + p {
    margin-top: 8px;
}

/*=============================================
                     Closing End
=============================================*/


/*=============================================
                  Responsive Start
=============================================*/

@media (max-width: 1500px) {

    .games-shell {
        width:
            min(
                calc(100% - 20px),
                1240px
            );
    }


    .games-site-navigation {
        left: -160px;

        width: 143px;
    }


    .games-site-switcher {
        width: 143px;
    }


    .games-site-navigation.is-at-bottom {
        left: -160px;
    }


    .games-site-navigation.is-floating {
        left:
            max(
                10px,
                calc(50% - 620px - 160px)
            );
    }

}


@media (max-width: 1240px) {

    .games-site-navigation,
    .games-site-navigation.is-floating,
    .games-site-navigation.is-at-bottom {
        position: static;

        width: 100%;

        margin-bottom: 15px;

        transform: none;
    }


    .games-site-switcher {
        width: 100%;

        display: grid;

        grid-template-columns:
            repeat(
                6,
                minmax(0, 1fr)
            );
    }


    .games-site-switcher-button {
        min-height: 56px;
    }


    .games-site-switcher-button:hover,
    .games-site-switcher-button:focus-visible,
    .games-site-switcher-button.is-active {
        transform:
            translateY(-2px);
    }


    .games-grid {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }


    .pokies-experience {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


@media (max-width: 980px) {

    .games-intro,
    .games-panel-heading,
    .games-closing,
    .pokies-knowledge-head {
        grid-template-columns:
            1fr;

        gap: 16px;
    }


    .pokies-knowledge-head > p:last-child {
        text-align: left;
    }


    .games-navigation {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }


    .games-category-layout {
        grid-template-columns:
            1fr;
    }


    .games-subnav {
        display: flex;

        overflow-x: auto;

        padding-bottom: 4px;

        scrollbar-width: none;
    }


    .games-subnav::-webkit-scrollbar {
        display: none;
    }


    .games-subnav-button {
        min-width: 165px;

        flex:
            0
            0
            165px;
    }


    .game-detail {
        grid-template-columns:
            1fr;

        gap: 11px;
    }

}


@media (max-width: 760px) {

    .games-section {
        padding:
            31px
            11px
            54px;
    }


    .games-shell {
        width: 100%;
    }


    .games-site-switcher {
        display: flex;

        overflow-x: auto;

        scrollbar-width: none;
    }


    .games-site-switcher::-webkit-scrollbar {
        display: none;
    }


    .games-site-switcher-button {
        min-width: 154px;

        flex:
            0
            0
            154px;
    }


    .games-intro {
        padding:
            22px
            19px;
    }


    .games-intro h2 {
        font-size:
            clamp(
                32px,
                9vw,
                44px
            );
    }


    .pokies-experience {
        grid-template-columns: 1fr;
    }


    .games-navigation {
        display: flex;

        overflow-x: auto;

        padding-bottom: 5px;

        scrollbar-width: none;
    }


    .games-navigation::-webkit-scrollbar {
        display: none;
    }


    .games-navigation-button {
        min-width: 205px;

        flex:
            0
            0
            205px;
    }


    .games-stage {
        padding:
            16px
            12px;
    }


    .games-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .pokies-knowledge-grid {
        grid-template-columns: 1fr;
    }

}


@media (max-width: 480px) {

    .game-card-copy strong {
        font-size: 10.3px;
    }


    .game-card-copy small {
        font-size: 9.3px;
    }

}

/*=============================================
                   Responsive End
=============================================*/

/*=============================================
                     Pokies End
=============================================*/
/*=============================================
               Table Games Start
=============================================*/

.table-games-section {
    --section-accent-rgb: 54, 224, 151;
    --section-accent: #36e097;
    --section-accent-light: #8affc7;
    --section-secondary-rgb: 14, 143, 114;
    --section-ink: #04251a;

    background:
        radial-gradient(
            ellipse at 8% 5%,
            rgba(50, 220, 148, 0.18) 0%,
            rgba(50, 220, 148, 0.05) 28%,
            transparent 48%
        ),
        radial-gradient(
            ellipse at 91% 9%,
            rgba(8, 117, 105, 0.20) 0%,
            rgba(8, 117, 105, 0.05) 29%,
            transparent 49%
        ),
        linear-gradient(
            145deg,
            #071710 0%,
            #0b1b18 45%,
            #08131c 100%
        );

    border-top:
        1px solid
        rgba(54, 224, 151, 0.16);
}


/*=============================================
             Table Intro Start
=============================================*/

.table-games-section
.games-intro {
    border-color:
        rgba(
            var(--section-accent-rgb),
            0.23
        );

    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(32, 188, 133, 0.13),
            transparent 38%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(10, 117, 109, 0.10),
            transparent 40%
        ),
        linear-gradient(
            145deg,
            rgba(9, 31, 23, 0.98),
            rgba(7, 19, 27, 0.99)
        );
}


.table-games-section
.games-intro-secondary > p {
    color: #c1d0ca;
}

/*=============================================
              Table Intro End
=============================================*/


/*=============================================
          Table Experience Start
=============================================*/

.table-experience {
    margin-bottom: 15px;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.table-experience article {
    position: relative;

    min-width: 0;

    padding:
        17px
        18px;

    overflow: hidden;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.20
        );

    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(
                var(--section-accent-rgb),
                0.11
            ),
            transparent 44%
        ),
        linear-gradient(
            145deg,
            rgba(29, 93, 67, 0.10),
            rgba(255, 255, 255, 0.015)
        );

    box-shadow:
        0 10px 23px
        rgba(0, 0, 0, 0.20);
}


.table-experience article::after {
    content: "";

    position: absolute;

    right: -22px;

    bottom: -32px;

    width: 82px;

    height: 82px;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.12
        );

    border-radius: 50%;
}


.table-experience article > span {
    display: block;

    margin-bottom: 5px;

    color:
        var(--section-accent);

    font-size: 9px;

    font-weight: 900;

    letter-spacing: 0.13em;
}


.table-experience strong {
    display: block;

    color: #ffffff;

    font-size: 14px;

    font-weight: 900;

    line-height: 1.12;
}


.table-experience p {
    margin:
        7px
        0
        0;

    color: #b8c6c0;

    font-size: 11px;

    line-height: 1.46;
}

/*=============================================
           Table Experience End
=============================================*/


/*=============================================
           Table Navigation Start
=============================================*/

.table-games-navigation {
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );
}


.table-games-navigation
.games-navigation-button[data-games-target="poker"] {
    --nav-accent-rgb: 54, 224, 151;
    --nav-ink: #04251a;
}


.table-games-navigation
.games-navigation-button[data-games-target="classic"] {
    --nav-accent-rgb: 55, 210, 198;
    --nav-ink: #052522;
}

/*=============================================
            Table Navigation End
=============================================*/


/*=============================================
              Table Stage Start
=============================================*/

.table-games-stage {
    --games-accent-rgb: 54, 224, 151;
    --games-accent: #36e097;
    --games-ink: #04251a;

    background:
        radial-gradient(
            circle at 96% 4%,
            rgba(
                var(--games-accent-rgb),
                0.11
            ),
            transparent 29%
        ),
        radial-gradient(
            circle at 4% 100%,
            rgba(16, 116, 93, 0.09),
            transparent 35%
        ),
        linear-gradient(
            145deg,
            rgba(8, 27, 21, 0.99),
            rgba(6, 17, 24, 0.99)
        );
}


.table-games-stage[data-games-theme="poker"] {
    --games-accent-rgb: 54, 224, 151;
    --games-accent: #36e097;
    --games-ink: #04251a;
}


.table-games-stage[data-games-theme="classic"] {
    --games-accent-rgb: 55, 210, 198;
    --games-accent: #37d2c6;
    --games-ink: #052522;
}

/*=============================================
               Table Stage End
=============================================*/


/*=============================================
           Table Game Cards Start
=============================================*/

.table-games-section
.game-card {
    background:
        #07110e;

    box-shadow:
        0 9px 20px
        rgba(0, 0, 0, 0.30);
}


.table-games-section
.game-card-copy {
    background:
        linear-gradient(
            180deg,
            #10241d,
            #07100e
        );
}


.table-games-section
.game-detail {
    background:
        radial-gradient(
            circle at 0% 50%,
            rgba(
                var(--games-accent-rgb),
                0.10
            ),
            transparent 36%
        ),
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.018),
            rgba(5, 17, 14, 0.55)
        );
}


.table-games-section
.game-detail-copy p {
    color:
        #c2cec9;
}

/*=============================================
            Table Game Cards End
=============================================*/


/*=============================================
            Table Knowledge Start
=============================================*/

.table-knowledge {
    margin-top: 18px;

    padding:
        24px;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.17
        );

    border-radius: 17px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(
                var(--section-accent-rgb),
                0.07
            ),
            transparent 34%
        ),
        linear-gradient(
            145deg,
            rgba(7, 30, 22, 0.93),
            rgba(7, 17, 25, 0.96)
        );
}


.table-knowledge-head {
    display: grid;

    grid-template-columns:
        minmax(0, 0.8fr)
        minmax(0, 1.2fr);

    gap: 32px;

    align-items: end;

    margin-bottom: 15px;
}


.table-knowledge-head h3 {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            25px,
            2vw,
            35px
        );

    font-weight: 900;

    line-height: 1.04;
}


.table-knowledge-head > p {
    margin: 0;

    color: #afc0b9;

    font-size: 12px;

    line-height: 1.52;

    text-align: right;
}


.table-knowledge-grid {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.table-knowledge-item {
    overflow: hidden;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.18
        );

    border-radius: 12px;

    background:
        rgba(
            var(--section-accent-rgb),
            0.035
        );
}


.table-knowledge-item summary {
    min-height: 54px;

    padding:
        0
        15px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 14px;

    list-style: none;

    color: #ffffff;

    font-size: 12px;

    font-weight: 900;

    cursor: pointer;

    transition:
        background 0.18s ease,
        color 0.18s ease;
}


.table-knowledge-item summary:hover {
    background:
        rgba(
            var(--section-accent-rgb),
            0.07
        );
}


.table-knowledge-item summary::-webkit-details-marker {
    display: none;
}


.table-knowledge-item summary::after {
    content: "+";

    color:
        var(--section-accent);

    font-size: 21px;

    font-weight: 700;

    line-height: 1;

    transition:
        transform 0.2s ease;
}


.table-knowledge-item[open]
summary::after {
    transform:
        rotate(45deg);
}


.table-knowledge-item > div {
    padding:
        0
        15px
        16px;
}


.table-knowledge-item p {
    margin: 0;

    color: #b6c5bf;

    font-size: 11.5px;

    line-height: 1.6;
}


.table-knowledge-item p + p {
    margin-top: 9px;
}

/*=============================================
             Table Knowledge End
=============================================*/


/*=============================================
           Table Closing Start
=============================================*/

.table-games-closing {
    border-color:
        rgba(
            var(--section-accent-rgb),
            0.18
        );

    background:
        radial-gradient(
            circle at 0% 50%,
            rgba(
                var(--section-accent-rgb),
                0.06
            ),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            rgba(8, 30, 22, 0.93),
            rgba(7, 17, 25, 0.96)
        );
}


.table-games-closing
.games-kicker {
    color:
        var(--section-accent-light);
}


.table-games-closing
> div:last-child p {
    color:
        #bdc9c4;
}

/*=============================================
            Table Closing End
=============================================*/


/*=============================================
          Table Responsive Start
=============================================*/

@media (max-width: 1240px) {

    .table-experience {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


@media (max-width: 980px) {

    .table-knowledge-head {
        grid-template-columns:
            1fr;

        gap: 14px;
    }


    .table-knowledge-head > p {
        text-align: left;
    }

}


@media (max-width: 760px) {

    .table-experience {
        grid-template-columns:
            1fr;
    }


    .table-games-navigation {
        display: flex;
    }


    .table-knowledge-grid {
        grid-template-columns:
            1fr;
    }

}

/*=============================================
           Table Responsive End
=============================================*/

/*=============================================
                Table Games End
=============================================*/
/*=============================================
                Live Casino Start
=============================================*/

.live-casino-section {
    --section-accent-rgb: 52, 202, 255;
    --section-accent: #34caff;
    --section-accent-light: #8cecff;
    --section-secondary-rgb: 111, 78, 255;
    --section-ink: #041f2e;

    background:
        radial-gradient(
            ellipse at 8% 5%,
            rgba(42, 191, 255, 0.20) 0%,
            rgba(42, 191, 255, 0.05) 28%,
            transparent 48%
        ),
        radial-gradient(
            ellipse at 91% 8%,
            rgba(104, 71, 255, 0.18) 0%,
            rgba(104, 71, 255, 0.05) 29%,
            transparent 49%
        ),
        linear-gradient(
            145deg,
            #06111e 0%,
            #0a1427 45%,
            #0a0d1c 100%
        );

    border-top:
        1px solid
        rgba(52, 202, 255, 0.17);
}


/*=============================================
                 Live Intro Start
=============================================*/

.live-casino-section
.games-intro {
    border-color:
        rgba(
            var(--section-accent-rgb),
            0.23
        );

    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(48, 197, 255, 0.13),
            transparent 38%
        ),
        radial-gradient(
            circle at 100% 100%,
            rgba(111, 78, 255, 0.11),
            transparent 41%
        ),
        linear-gradient(
            145deg,
            rgba(8, 26, 43, 0.98),
            rgba(10, 14, 31, 0.99)
        );
}


.live-casino-section
.games-intro-secondary > p {
    color: #c3d0dc;
}

/*=============================================
                  Live Intro End
=============================================*/


/*=============================================
              Live Experience Start
=============================================*/

.live-experience {
    margin-bottom: 15px;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.live-experience article {
    position: relative;

    min-width: 0;

    padding:
        17px
        18px;

    overflow: hidden;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.20
        );

    border-radius: 14px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(
                var(--section-accent-rgb),
                0.12
            ),
            transparent 45%
        ),
        linear-gradient(
            145deg,
            rgba(40, 142, 196, 0.09),
            rgba(255, 255, 255, 0.014)
        );

    box-shadow:
        0 10px 23px
        rgba(0, 0, 0, 0.21);
}


.live-experience article::after {
    content: "";

    position: absolute;

    right: -22px;
    bottom: -34px;

    width: 85px;
    height: 85px;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.13
        );

    border-radius: 50%;
}


.live-experience article > span {
    display: block;

    margin-bottom: 5px;

    color:
        var(--section-accent);

    font-size: 9px;

    font-weight: 900;

    letter-spacing: 0.13em;
}


.live-experience strong {
    display: block;

    color: #ffffff;

    font-size: 14px;

    font-weight: 900;

    line-height: 1.12;
}


.live-experience p {
    margin:
        7px
        0
        0;

    color: #b8c5d0;

    font-size: 11px;

    line-height: 1.46;
}

/*=============================================
               Live Experience End
=============================================*/


/*=============================================
               Live Navigation Start
=============================================*/

.live-games-navigation {
    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );
}


.live-games-navigation
.games-navigation-button[data-games-target="roulette-blackjack"] {
    --nav-accent-rgb: 52, 202, 255;
    --nav-ink: #041f2e;
}


.live-games-navigation
.games-navigation-button[data-games-target="baccarat-shows"] {
    --nav-accent-rgb: 124, 94, 255;
    --nav-ink: #130a32;
}

/*=============================================
                Live Navigation End
=============================================*/


/*=============================================
                   Live Stage Start
=============================================*/

.live-casino-stage {
    --games-accent-rgb: 52, 202, 255;
    --games-accent: #34caff;
    --games-ink: #041f2e;

    background:
        radial-gradient(
            circle at 96% 4%,
            rgba(
                var(--games-accent-rgb),
                0.12
            ),
            transparent 29%
        ),
        radial-gradient(
            circle at 2% 100%,
            rgba(92, 66, 215, 0.08),
            transparent 36%
        ),
        linear-gradient(
            145deg,
            rgba(7, 24, 40, 0.99),
            rgba(8, 13, 29, 0.99)
        );
}


.live-casino-stage[data-games-theme="roulette-blackjack"] {
    --games-accent-rgb: 52, 202, 255;
    --games-accent: #34caff;
    --games-ink: #041f2e;
}


.live-casino-stage[data-games-theme="baccarat-shows"] {
    --games-accent-rgb: 124, 94, 255;
    --games-accent: #7c5eff;
    --games-ink: #130a32;
}

/*=============================================
                    Live Stage End
=============================================*/


/*=============================================
                 Live Cards Start
=============================================*/

.live-casino-section
.game-card {
    background: #07101b;

    box-shadow:
        0 9px 20px
        rgba(0, 0, 0, 0.31);
}


.live-casino-section
.game-card-copy {
    background:
        linear-gradient(
            180deg,
            #101d2b,
            #070d17
        );
}


.live-casino-section
.game-detail {
    background:
        radial-gradient(
            circle at 0% 50%,
            rgba(
                var(--games-accent-rgb),
                0.11
            ),
            transparent 36%
        ),
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.018),
            rgba(5, 14, 27, 0.58)
        );
}


.live-casino-section
.game-detail-copy p {
    color: #c1ccd5;
}

/*=============================================
                  Live Cards End
=============================================*/


/*=============================================
                Live Context Start
=============================================*/

.live-context-grid {
    margin-top: 14px;

    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.live-context-grid article {
    padding:
        18px
        19px;

    border:
        1px solid
        rgba(
            var(--games-accent-rgb),
            0.18
        );

    border-radius: 13px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(
                var(--games-accent-rgb),
                0.08
            ),
            transparent 39%
        ),
        rgba(255, 255, 255, 0.017);
}


.live-context-grid article > span {
    display: block;

    margin-bottom: 6px;

    color:
        var(--games-accent);

    font-size: 9px;

    font-weight: 900;

    letter-spacing: 0.14em;
}


.live-context-grid h4 {
    margin: 0;

    color: #ffffff;

    font-size: 18px;

    font-weight: 900;
}


.live-context-grid p {
    margin:
        8px
        0
        0;

    color: #c0c9d2;

    font-size: 11.8px;

    line-height: 1.56;
}

/*=============================================
                 Live Context End
=============================================*/


/*=============================================
              Live Knowledge Start
=============================================*/

.live-knowledge {
    margin-top: 18px;

    padding: 24px;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.17
        );

    border-radius: 17px;

    background:
        radial-gradient(
            circle at 100% 0%,
            rgba(
                var(--section-accent-rgb),
                0.08
            ),
            transparent 34%
        ),
        radial-gradient(
            circle at 0% 100%,
            rgba(
                var(--section-secondary-rgb),
                0.06
            ),
            transparent 36%
        ),
        linear-gradient(
            145deg,
            rgba(7, 24, 40, 0.95),
            rgba(8, 13, 29, 0.97)
        );
}


.live-knowledge-head {
    display: grid;

    grid-template-columns:
        minmax(0, 0.8fr)
        minmax(0, 1.2fr);

    gap: 32px;

    align-items: end;

    margin-bottom: 15px;
}


.live-knowledge-head h3 {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            25px,
            2vw,
            35px
        );

    font-weight: 900;

    line-height: 1.04;
}


.live-knowledge-head > p {
    margin: 0;

    color: #afbdca;

    font-size: 12px;

    line-height: 1.52;

    text-align: right;
}


.live-knowledge-grid {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.live-knowledge-item {
    overflow: hidden;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.18
        );

    border-radius: 12px;

    background:
        rgba(
            var(--section-accent-rgb),
            0.034
        );
}


.live-knowledge-item summary {
    min-height: 54px;

    padding:
        0
        15px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 14px;

    list-style: none;

    color: #ffffff;

    font-size: 12px;

    font-weight: 900;

    cursor: pointer;

    transition:
        background 0.18s ease;
}


.live-knowledge-item summary:hover {
    background:
        rgba(
            var(--section-accent-rgb),
            0.07
        );
}


.live-knowledge-item summary::-webkit-details-marker {
    display: none;
}


.live-knowledge-item summary::after {
    content: "+";

    color:
        var(--section-accent);

    font-size: 21px;

    font-weight: 700;

    line-height: 1;

    transition:
        transform 0.2s ease;
}


.live-knowledge-item[open]
summary::after {
    transform:
        rotate(45deg);
}


.live-knowledge-item > div {
    padding:
        0
        15px
        16px;
}


.live-knowledge-item p {
    margin: 0;

    color: #b6c1cc;

    font-size: 11.5px;

    line-height: 1.6;
}


.live-knowledge-item p + p {
    margin-top: 9px;
}

/*=============================================
               Live Knowledge End
=============================================*/


/*=============================================
               Live Closing Start
=============================================*/

.live-casino-closing {
    border-color:
        rgba(
            var(--section-accent-rgb),
            0.18
        );

    background:
        radial-gradient(
            circle at 0% 50%,
            rgba(
                var(--section-accent-rgb),
                0.07
            ),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            rgba(7, 25, 41, 0.94),
            rgba(8, 13, 29, 0.97)
        );
}


.live-casino-closing
.games-kicker {
    color:
        var(--section-accent-light);
}


.live-casino-closing
> div:last-child p {
    color:
        #bdc7d1;
}

/*=============================================
                Live Closing End
=============================================*/


/*=============================================
             Live Responsive Start
=============================================*/

@media (max-width: 1240px) {

    .live-experience {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


@media (max-width: 980px) {

    .live-knowledge-head {
        grid-template-columns:
            1fr;

        gap: 14px;
    }


    .live-knowledge-head > p {
        text-align: left;
    }


    .live-context-grid {
        grid-template-columns: 1fr;
    }

}


@media (max-width: 760px) {

    .live-experience {
        grid-template-columns: 1fr;
    }


    .live-games-navigation {
        display: flex;
    }


    .live-knowledge-grid {
        grid-template-columns: 1fr;
    }

}

/*=============================================
              Live Responsive End
=============================================*/

/*=============================================
                 Live Casino End
=============================================*/
/*=============================================
          Game Card Image Height Fix Start
=============================================*/

.games-section .game-card img {
    aspect-ratio: 1.05 / 1 !important;
    object-fit: cover !important;
    object-position: center !important;
}

/*=============================================
           Game Card Image Height Fix End
=============================================*/
/*=============================================
                Tournaments Start
=============================================*/

.tournaments-section {
    --tournament-gold: #ffd34f;
    --tournament-gold-rgb: 255, 211, 79;

    --tournament-blue: #4bbcff;
    --tournament-blue-rgb: 75, 188, 255;

    --tournament-violet: #8469ff;
    --tournament-violet-rgb: 132, 105, 255;

    position: relative;

    padding:
        56px
        22px
        82px;

    overflow: visible;

    isolation: isolate;

    color: #f8f9ff;

    background:
        radial-gradient(
            ellipse at 6% 3%,
            rgba(78, 103, 255, 0.22) 0%,
            rgba(78, 103, 255, 0.055) 28%,
            transparent 48%
        ),
        radial-gradient(
            ellipse at 90% 7%,
            rgba(255, 190, 40, 0.15) 0%,
            rgba(255, 190, 40, 0.035) 31%,
            transparent 50%
        ),
        radial-gradient(
            ellipse at 87% 60%,
            rgba(59, 194, 255, 0.10) 0%,
            transparent 39%
        ),
        linear-gradient(
            145deg,
            #0b1128 0%,
            #151732 43%,
            #0c1831 100%
        );

    border-top:
        1px solid
        rgba(255, 211, 79, 0.19);
}


.tournaments-section::before {
    content: "";

    position: absolute;

    top: 0;
    left: 50%;

    width:
        min(
            94%,
            1540px
        );

    height: 3px;

    transform:
        translateX(-50%);

    background:
        linear-gradient(
            90deg,
            transparent,
            #4bbcff,
            #8469ff,
            #ffd34f,
            #ff8f45,
            #48ddce,
            transparent
        );

    box-shadow:
        0 0 29px
        rgba(94, 111, 255, 0.44);
}


.tournaments-section[hidden] {
    display: none !important;
}


.tournaments-container {
    position: relative;

    z-index: 2;

    width:
        min(
            calc(100% - 12px),
            1360px
        );

    margin:
        0 auto;
}


.tournaments-main {
    min-width: 0;
}


/*=============================================
             Site Navigation Start
=============================================*/

.tournaments-site-navigation {
    position: absolute;

    top: 0;
    left: -188px;

    width: 162px;

    z-index: 90;

    pointer-events: none;
}


.tournaments-site-switcher {
    width: 162px;

    padding: 9px;

    display: flex;

    flex-direction: column;

    gap: 8px;

    border:
        1px solid
        rgba(114, 132, 255, 0.24);

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            rgba(20, 26, 60, 0.95),
            rgba(10, 17, 38, 0.97)
        );

    box-shadow:
        0 24px 58px
        rgba(2, 6, 20, 0.47),
        inset 0 1px 0
        rgba(255, 255, 255, 0.07);

    backdrop-filter:
        blur(24px)
        saturate(145%);

    -webkit-backdrop-filter:
        blur(24px)
        saturate(145%);

    pointer-events: auto;
}


.tournaments-site-navigation.is-floating {
    position: fixed;

    top: 50%;

    left:
        max(
            12px,
            calc(50% - 680px - 188px)
        );

    transform:
        translateY(-50%);
}


.tournaments-site-navigation.is-at-bottom {
    position: absolute;

    top: auto;

    bottom: 0;

    left: -188px;

    transform: none;
}


.tournaments-site-switcher-button {
    --section-accent: #7b83ff;
    --section-accent-rgb: 123, 131, 255;
    --section-ink: #10152d;

    width: 100%;

    min-height: 62px;

    padding:
        8px
        7px;

    display: grid;

    grid-template-columns:
        36px
        minmax(0, 1fr);

    align-items: center;

    gap: 7px;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.44
        );

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            rgba(
                var(--section-accent-rgb),
                0.15
            ),
            rgba(
                var(--section-accent-rgb),
                0.04
            )
        );

    color: #ffffff;

    font: inherit;

    text-align: left;

    cursor: pointer;

    transition:
        transform 0.2s ease,
        border-color 0.2s ease,
        background 0.2s ease,
        box-shadow 0.2s ease;
}


.tournaments-site-switcher-button[data-section-target="pokies"] {
    --section-accent: #ffc83e;
    --section-accent-rgb: 255, 200, 62;
    --section-ink: #2d1d03;
}


.tournaments-site-switcher-button[data-section-target="live-casino"] {
    --section-accent: #34caff;
    --section-accent-rgb: 52, 202, 255;
    --section-ink: #041f2e;
}


.tournaments-site-switcher-button[data-section-target="table-games"] {
    --section-accent: #39dda0;
    --section-accent-rgb: 57, 221, 160;
    --section-ink: #052419;
}


.tournaments-site-switcher-button[data-section-target="promotions"] {
    --section-accent: #ff69ad;
    --section-accent-rgb: 255, 105, 173;
    --section-ink: #30091e;
}


.tournaments-site-switcher-button[data-section-target="tournaments"] {
    --section-accent: #ffd34f;
    --section-accent-rgb: 255, 211, 79;
    --section-ink: #302405;
}


.tournaments-site-switcher-button[data-section-target="banking"] {
    --section-accent: #4ddbb9;
    --section-accent-rgb: 77, 219, 185;
    --section-ink: #06251c;
}


.tournaments-site-switcher-icon {
    width: 36px;
    height: 36px;

    display: grid;

    place-items: center;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.73
        );

    border-radius: 11px;

    background:
        rgba(
            var(--section-accent-rgb),
            0.13
        );

    color:
        var(--section-accent);

    font-size: 9px;

    font-weight: 900;
}


.tournaments-site-switcher-copy strong {
    display: block;

    font-size: 12px;

    font-weight: 900;

    line-height: 1.08;
}


.tournaments-site-switcher-copy small {
    display: block;

    margin-top: 3px;

    color:
        rgba(230, 232, 250, 0.69);

    font-size: 9.5px;

    font-weight: 700;

    line-height: 1.17;
}


.tournaments-site-switcher-button:hover,
.tournaments-site-switcher-button:focus-visible {
    transform:
        translateX(5px);

    border-color:
        var(--section-accent);

    box-shadow:
        0 12px 26px
        rgba(3, 7, 24, 0.31),
        0 0 23px
        rgba(
            var(--section-accent-rgb),
            0.18
        );

    outline: none;
}


.tournaments-site-switcher-button.is-active {
    transform:
        translateX(6px);

    border-color:
        rgba(255, 255, 255, 0.72);

    background:
        linear-gradient(
            135deg,
            var(--section-accent),
            rgba(
                var(--section-accent-rgb),
                0.82
            )
        );

    color:
        var(--section-ink);

    box-shadow:
        0 14px 30px
        rgba(3, 7, 24, 0.36),
        0 0 29px
        rgba(
            var(--section-accent-rgb),
            0.30
        );
}


.tournaments-site-switcher-button.is-active
.tournaments-site-switcher-icon {
    color:
        var(--section-ink);

    border-color:
        rgba(0, 0, 0, 0.14);

    background:
        rgba(0, 0, 0, 0.10);
}


.tournaments-site-switcher-button.is-active
.tournaments-site-switcher-copy small {
    color:
        rgba(20, 18, 10, 0.66);
}

/*=============================================
              Site Navigation End
=============================================*/


/*=============================================
                  Intro Start
=============================================*/

.tournaments-intro {
    position: relative;

    margin-bottom: 18px;

    padding:
        34px
        36px;

    display: grid;

    grid-template-columns:
        minmax(0, 1.08fr)
        minmax(330px, 0.56fr);

    gap: 38px;

    align-items: center;

    overflow: hidden;

    border:
        1px solid
        rgba(115, 131, 255, 0.30);

    border-radius: 24px;

    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(96, 90, 255, 0.17),
            transparent 38%
        ),
        radial-gradient(
            circle at 100% 0%,
            rgba(255, 196, 52, 0.10),
            transparent 37%
        ),
        linear-gradient(
            145deg,
            rgba(22, 29, 65, 0.98),
            rgba(12, 19, 43, 0.98)
        );

    box-shadow:
        0 24px 55px
        rgba(3, 7, 24, 0.35),
        inset 0 1px 0
        rgba(255, 255, 255, 0.07);
}


.tournaments-intro::before {
    content: "";

    position: absolute;

    left: 0;
    top: 22px;
    bottom: 22px;

    width: 4px;

    border-radius:
        0
        6px
        6px
        0;

    background:
        linear-gradient(
            180deg,
            #4bbcff,
            #826aff,
            #ffd34f
        );

    box-shadow:
        0 0 20px
        rgba(94, 116, 255, 0.45);
}


.tournaments-eyebrow,
.tournaments-panel-kicker,
.tournaments-feature-label {
    margin:
        0
        0
        8px;

    color: #9cb7ff;

    font-size: 12px;

    font-weight: 900;

    line-height: 1.28;

    letter-spacing: 0.12em;

    text-transform: uppercase;
}


.tournaments-intro h2 {
    max-width: 790px;

    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            39px,
            3.7vw,
            57px
        );

    font-weight: 900;

    line-height: 0.98;

    letter-spacing: -0.045em;
}


.tournaments-intro-copy > p {
    margin:
        13px
        0
        0;

    color: #cfd3e6;

    font-size: 15px;

    line-height: 1.58;
}


.tournaments-intro-copy
.tournaments-intro-lead {
    color: #ffffff;

    font-size: 17px;

    font-weight: 750;
}


/*=============================================
               Intro Details Start
=============================================*/

.tournaments-intro-more {
    margin-top: 15px;
}


.tournaments-intro-more summary,
.tournaments-deep-guide summary {
    min-height: 43px;

    padding:
        0
        15px;

    display: inline-flex;

    align-items: center;

    gap: 11px;

    list-style: none;

    border:
        1px solid
        rgba(108, 167, 255, 0.42);

    border-radius: 11px;

    background:
        linear-gradient(
            135deg,
            rgba(103, 168, 255, 0.12),
            rgba(255, 208, 91, 0.07)
        );

    color: #ffffff;

    font-size: 12px;

    font-weight: 900;

    cursor: pointer;
}


.tournaments-intro-more summary::-webkit-details-marker,
.tournaments-deep-guide summary::-webkit-details-marker {
    display: none;
}


.tournaments-intro-more summary::after,
.tournaments-deep-guide summary::after {
    content: "+";

    width: 27px;
    height: 27px;

    display: grid;

    place-items: center;

    border-radius: 50%;

    background:
        linear-gradient(
            135deg,
            #639fff,
            #a66fff
        );

    font-size: 18px;

    font-weight: 900;
}


.tournaments-intro-more[open]
summary::after,
.tournaments-deep-guide[open]
summary::after {
    transform:
        rotate(45deg);
}


.tournaments-intro-more > div,
.tournaments-deep-guide > div {
    margin-top: 9px;

    padding:
        15px
        17px;

    max-height: 310px;

    overflow-y: auto;

    border:
        1px solid
        rgba(122, 139, 255, 0.16);

    border-radius: 11px;

    background:
        rgba(5, 10, 29, 0.38);
}


.tournaments-intro-more > div p,
.tournaments-deep-guide > div p {
    margin: 0;

    color: #cbd0e3;

    font-size: 12.5px;

    line-height: 1.6;
}


.tournaments-intro-more > div p + p,
.tournaments-deep-guide > div p + p {
    margin-top: 9px;
}

/*=============================================
                Intro Details End
=============================================*/


.tournaments-intro-media {
    position: relative;

    min-height: 350px;

    margin: 0;

    overflow: hidden;

    border:
        1px solid
        rgba(255, 204, 84, 0.48);

    border-radius: 20px;

    background: #10152e;

    box-shadow:
        0 22px 50px
        rgba(3, 7, 24, 0.38);
}


.tournaments-intro-media img {
    width: 100%;

    height: 350px;

    object-fit: cover;

    object-position: center;
}


.tournaments-intro-media::after {
    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(7, 10, 28, 0.02) 20%,
            rgba(7, 10, 28, 0.88) 100%
        );
}


.tournaments-intro-media figcaption {
    position: absolute;

    z-index: 2;

    left: 20px;
    right: 20px;
    bottom: 18px;
}


.tournaments-intro-media figcaption span,
.tournaments-intro-media figcaption strong,
.tournaments-intro-media figcaption small {
    display: block;
}


.tournaments-intro-media figcaption span {
    color: #9fb4ff;

    font-size: 11px;

    font-weight: 900;

    text-transform: uppercase;
}


.tournaments-intro-media figcaption strong {
    margin-top: 4px;

    color: #ffffff;

    font-size: 26px;

    font-weight: 900;
}


.tournaments-intro-media figcaption small {
    margin-top: 6px;

    color: #d4d8e8;

    font-size: 12px;

    line-height: 1.4;
}

/*=============================================
                    Intro End
=============================================*/


/*=============================================
                 Snapshot Start
=============================================*/

.tournaments-snapshot {
    margin-bottom: 17px;

    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.tournaments-snapshot article {
    --snap-accent: #7f8cff;
    --snap-accent-rgb: 127, 140, 255;

    padding: 15px;

    border:
        1px solid
        rgba(
            var(--snap-accent-rgb),
            0.29
        );

    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--snap-accent-rgb),
                0.10
            ),
            rgba(255, 255, 255, 0.018)
        );
}


.tournaments-snapshot article[data-snapshot-theme="slots"] {
    --snap-accent: #ffd04f;
    --snap-accent-rgb: 255, 208, 79;
}


.tournaments-snapshot article[data-snapshot-theme="blackjack"] {
    --snap-accent: #53d8ab;
    --snap-accent-rgb: 83, 216, 171;
}


.tournaments-snapshot article[data-snapshot-theme="poker"] {
    --snap-accent: #63a8ff;
    --snap-accent-rgb: 99, 168, 255;
}


.tournaments-snapshot article[data-snapshot-theme="live"] {
    --snap-accent: #45d8f8;
    --snap-accent-rgb: 69, 216, 248;
}


.tournaments-snapshot article[data-snapshot-theme="entry"] {
    --snap-accent: #a37dff;
    --snap-accent-rgb: 163, 125, 255;
}


.tournaments-snapshot article[data-snapshot-theme="vip"] {
    --snap-accent: #ff8e56;
    --snap-accent-rgb: 255, 142, 86;
}


.tournaments-snapshot span,
.tournaments-snapshot strong,
.tournaments-snapshot small {
    display: block;
}


.tournaments-snapshot span {
    color:
        var(--snap-accent);

    font-size: 11px;

    font-weight: 900;
}


.tournaments-snapshot strong {
    margin-top: 4px;

    color: #ffffff;

    font-size: 20px;

    font-weight: 900;
}


.tournaments-snapshot small {
    margin-top: 4px;

    color: #c6cada;

    font-size: 11px;

    line-height: 1.35;
}

/*=============================================
                  Snapshot End
=============================================*/


/*=============================================
                     Tabs Start
=============================================*/

.tournaments-tabs {
    margin-bottom: 17px;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.tournaments-tab {
    --tab-accent: #8190ff;
    --tab-accent-rgb: 129, 144, 255;
    --tab-ink: #11182f;

    min-height: 70px;

    padding:
        9px
        10px;

    display: flex;

    align-items: center;

    gap: 9px;

    border:
        1px solid
        rgba(
            var(--tab-accent-rgb),
            0.40
        );

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--tab-accent-rgb),
                0.13
            ),
            rgba(255, 255, 255, 0.02)
        );

    color: #ffffff;

    font: inherit;

    text-align: left;

    cursor: pointer;

    transition:
        transform 0.2s ease,
        border-color 0.2s ease,
        background 0.2s ease,
        box-shadow 0.2s ease;
}


.tournaments-tab[data-tournaments-target="overview"] {
    --tab-accent: #69d4f0;
    --tab-accent-rgb: 105, 212, 240;
    --tab-ink: #08262d;
}


.tournaments-tab[data-tournaments-target="slots"] {
    --tab-accent: #ffd04f;
    --tab-accent-rgb: 255, 208, 79;
    --tab-ink: #302205;
}


.tournaments-tab[data-tournaments-target="blackjack"] {
    --tab-accent: #52d9a9;
    --tab-accent-rgb: 82, 217, 169;
    --tab-ink: #06261b;
}


.tournaments-tab[data-tournaments-target="poker"] {
    --tab-accent: #63a8ff;
    --tab-accent-rgb: 99, 168, 255;
    --tab-ink: #071d32;
}


.tournaments-tab[data-tournaments-target="live"] {
    --tab-accent: #46d9f8;
    --tab-accent-rgb: 70, 217, 248;
    --tab-ink: #05242b;
}


.tournaments-tab[data-tournaments-target="vip"] {
    --tab-accent: #ff9560;
    --tab-accent-rgb: 255, 149, 96;
    --tab-ink: #321707;
}


.tournaments-tab[data-tournaments-target="schedule"] {
    --tab-accent: #aa81ff;
    --tab-accent-rgb: 170, 129, 255;
    --tab-ink: #211138;
}


.tournaments-tab-icon {
    width: 37px;
    height: 37px;

    display: grid;

    place-items: center;

    flex:
        0
        0
        37px;

    border:
        1px solid
        var(--tab-accent);

    border-radius: 11px;

    background:
        rgba(
            var(--tab-accent-rgb),
            0.13
        );

    color:
        var(--tab-accent);

    font-size: 9px;

    font-weight: 900;
}


.tournaments-tab strong {
    display: block;

    font-size: 13px;

    font-weight: 900;

    line-height: 1.08;
}


.tournaments-tab small {
    display: block;

    margin-top: 3px;

    color:
        rgba(225, 228, 245, 0.70);

    font-size: 10px;

    font-weight: 700;
}


.tournaments-tab:hover,
.tournaments-tab:focus-visible {
    transform:
        translateY(-3px);

    border-color:
        var(--tab-accent);

    box-shadow:
        0 13px 27px
        rgba(3, 7, 24, 0.29),
        0 0 21px
        rgba(
            var(--tab-accent-rgb),
            0.17
        );

    outline: none;
}


.tournaments-tab.is-active {
    transform:
        translateY(-3px);

    border-color:
        rgba(255, 255, 255, 0.68);

    background:
        linear-gradient(
            135deg,
            var(--tab-accent),
            rgba(
                var(--tab-accent-rgb),
                0.82
            )
        );

    color:
        var(--tab-ink);

    box-shadow:
        0 15px 30px
        rgba(3, 7, 24, 0.34),
        0 0 27px
        rgba(
            var(--tab-accent-rgb),
            0.27
        );
}


.tournaments-tab.is-active
.tournaments-tab-icon {
    color:
        var(--tab-ink);

    border-color:
        rgba(0, 0, 0, 0.14);

    background:
        rgba(0, 0, 0, 0.10);
}


.tournaments-tab.is-active small {
    color:
        rgba(20, 20, 25, 0.66);
}

/*=============================================
                      Tabs End
=============================================*/


/*=============================================
                    Stage Start
=============================================*/

.tournaments-stage {
    padding: 26px;

    border:
        1px solid
        rgba(127, 136, 255, 0.22);

    border-radius: 22px;

    background:
        radial-gradient(
            circle at 96% 4%,
            rgba(105, 113, 255, 0.09),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            rgba(18, 24, 56, 0.99),
            rgba(10, 16, 39, 0.99)
        );

    box-shadow:
        0 24px 55px
        rgba(3, 7, 24, 0.34),
        inset 0 1px 0
        rgba(255, 255, 255, 0.05);
}


.tournaments-panel[hidden] {
    display: none !important;
}


.tournaments-panel-heading {
    padding-bottom: 19px;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        220px;

    gap: 30px;

    align-items: center;

    border-bottom:
        1px solid
        rgba(141, 149, 255, 0.22);
}


.tournaments-panel-heading-wide {
    grid-template-columns:
        minmax(0, 1fr)
        190px;
}


.tournaments-panel h3,
.tournaments-guide h3,
.tournaments-closing h3,
.tournaments-knowledge h3 {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            30px,
            2.6vw,
            41px
        );

    font-weight: 900;

    line-height: 1.05;

    letter-spacing: -0.035em;
}


.tournaments-panel-heading p {
    margin:
        10px
        0
        0;

    color: #cbd0e3;

    font-size: 14px;

    line-height: 1.57;
}


.tournaments-panel-mark {
    padding:
        15px
        13px;

    border:
        1px solid
        rgba(255, 208, 93, 0.46);

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(255, 208, 93, 0.14),
            rgba(128, 112, 255, 0.07)
        );

    text-align: center;
}


.tournaments-panel-mark span,
.tournaments-panel-mark strong,
.tournaments-panel-mark small {
    display: block;
}


.tournaments-panel-mark span {
    color: #d5d8e7;

    font-size: 11px;
}


.tournaments-panel-mark strong {
    margin-top: 5px;

    color: #ffd15e;

    font-size: 25px;

    font-weight: 900;

    line-height: 1.05;
}


.tournaments-panel-mark small {
    margin-top: 5px;

    color: #ffffff;

    font-size: 11px;

    line-height: 1.3;
}

/*=============================================
                     Stage End
=============================================*/


/*=============================================
                  Format Grid Start
=============================================*/

.tournaments-format-grid {
    margin-top: 19px;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.tournaments-format-grid article {
    --format-accent: #78a4ff;
    --format-accent-rgb: 120, 164, 255;

    padding: 15px;

    border:
        1px solid
        rgba(
            var(--format-accent-rgb),
            0.24
        );

    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--format-accent-rgb),
                0.08
            ),
            rgba(255, 255, 255, 0.02)
        );
}


.tournaments-format-grid article[data-tournament-format="battle"] {
    --format-accent: #53d9a9;
    --format-accent-rgb: 83, 217, 169;
}


.tournaments-format-grid article[data-tournament-format="blitz"] {
    --format-accent: #7f8fff;
    --format-accent-rgb: 127, 143, 255;
}


.tournaments-format-grid article[data-tournament-format="leaderboard"] {
    --format-accent: #4ed8f4;
    --format-accent-rgb: 78, 216, 244;
}


.tournaments-format-icon {
    width: 38px;
    height: 38px;

    margin-bottom: 9px;

    display: grid;

    place-items: center;

    border:
        1px solid
        var(--format-accent);

    border-radius: 11px;

    background:
        rgba(
            var(--format-accent-rgb),
            0.12
        );

    color:
        var(--format-accent);

    font-size: 9px;

    font-weight: 900;
}


.tournaments-format-grid strong {
    color: #ffffff;

    font-size: 14px;

    font-weight: 900;
}


.tournaments-format-grid p {
    margin:
        6px
        0
        0;

    color: #c6cbe0;

    font-size: 12px;

    line-height: 1.48;
}

/*=============================================
                   Format Grid End
=============================================*/


/*=============================================
               Prize Showcase Start
=============================================*/

.tournaments-prize-showcase {
    margin-top: 14px;

    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.tournaments-prize-showcase article {
    padding:
        13px
        14px;

    border:
        1px solid
        rgba(255, 209, 94, 0.18);

    border-radius: 11px;

    background:
        rgba(255, 209, 94, 0.04);
}


.tournaments-prize-showcase span,
.tournaments-prize-showcase strong,
.tournaments-prize-showcase small {
    display: block;
}


.tournaments-prize-showcase span {
    color: #aeb5d7;

    font-size: 11px;
}


.tournaments-prize-showcase strong {
    margin-top: 4px;

    color: #ffd15e;

    font-size: 17px;

    font-weight: 900;
}


.tournaments-prize-showcase small {
    margin-top: 4px;

    color: #d2d5e3;

    font-size: 10.5px;
}

/*=============================================
                Prize Showcase End
=============================================*/


/*=============================================
              Win Examples Start
=============================================*/

.tournaments-win-examples {
    margin-top: 15px;

    padding:
        17px
        18px;

    display: grid;

    grid-template-columns:
        minmax(0, 0.8fr)
        minmax(0, 1.2fr);

    gap: 25px;

    align-items: center;

    border:
        1px solid
        rgba(255, 211, 79, 0.20);

    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            rgba(255, 211, 79, 0.055),
            rgba(75, 188, 255, 0.025)
        );
}


.tournaments-win-examples h4 {
    margin: 0;

    color: #ffffff;

    font-size: 20px;

    font-weight: 900;

    line-height: 1.12;
}


.tournaments-win-values {
    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.tournaments-win-values article {
    padding:
        11px
        10px;

    border:
        1px solid
        rgba(255, 211, 79, 0.20);

    border-radius: 10px;

    background:
        rgba(255, 211, 79, 0.04);

    text-align: center;
}


.tournaments-win-values span,
.tournaments-win-values strong {
    display: block;
}


.tournaments-win-values span {
    color: #adb4ce;

    font-size: 9.5px;
}


.tournaments-win-values strong {
    margin-top: 4px;

    color: #ffd15e;

    font-size: 17px;

    font-weight: 900;
}

/*=============================================
               Win Examples End
=============================================*/


/*=============================================
                How It Works Start
=============================================*/

.tournaments-how-it-works {
    margin-top: 20px;

    padding-top: 18px;

    display: grid;

    grid-template-columns:
        minmax(250px, 0.40fr)
        minmax(0, 1.60fr);

    gap: 27px;

    border-top:
        1px solid
        rgba(129, 139, 255, 0.20);
}


.tournaments-how-it-works h4,
.tournaments-primary-copy h4 {
    margin:
        6px
        0
        0;

    color: #ffffff;

    font-size: 22px;

    font-weight: 900;

    line-height: 1.12;
}


.tournaments-how-flow {
    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.tournaments-how-flow article {
    padding: 13px;

    border:
        1px solid
        rgba(129, 139, 255, 0.17);

    border-radius: 11px;

    background:
        rgba(255, 255, 255, 0.022);
}


.tournaments-how-flow strong {
    color: #ffffff;

    font-size: 13px;

    font-weight: 900;
}


.tournaments-how-flow p {
    margin:
        5px
        0
        0;

    color: #c7cce0;

    font-size: 11px;

    line-height: 1.45;
}

/*=============================================
                 How It Works End
=============================================*/


/*=============================================
              Primary Layout Start
=============================================*/

.tournaments-primary-layout {
    margin-top: 20px;

    display: grid;

    grid-template-columns:
        minmax(0, 1.2fr)
        minmax(330px, 0.8fr);

    gap: 26px;

    align-items: center;
}


.tournaments-primary-copy p {
    margin:
        8px
        0
        0;

    color: #ccd0e3;

    font-size: 13px;

    line-height: 1.56;
}


.tournaments-stat-board {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.tournaments-stat-board article {
    padding:
        13px
        11px;

    border:
        1px solid
        rgba(255, 208, 93, 0.18);

    border-radius: 11px;

    background:
        rgba(255, 208, 93, 0.045);

    text-align: center;
}


.tournaments-stat-board span,
.tournaments-stat-board strong {
    display: block;
}


.tournaments-stat-board span {
    color: #aeb4cc;

    font-size: 10px;
}


.tournaments-stat-board strong {
    margin-top: 4px;

    color: #ffd15d;

    font-size: 16px;

    font-weight: 900;
}

/*=============================================
               Primary Layout End
=============================================*/


/*=============================================
                 Rule Cards Start
=============================================*/

.tournaments-rule-cards {
    margin-top: 15px;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.tournaments-rule-cards article {
    padding: 14px;

    border:
        1px solid
        rgba(104, 180, 255, 0.18);

    border-radius: 11px;

    background:
        rgba(104, 180, 255, 0.035);
}


.tournaments-rule-cards strong {
    color: #ffffff;

    font-size: 13px;

    font-weight: 900;
}


.tournaments-rule-cards p {
    margin:
        5px
        0
        0;

    color: #c7ccdf;

    font-size: 11px;

    line-height: 1.47;
}

/*=============================================
                  Rule Cards End
=============================================*/


/*=============================================
               Cycle Grid Start
=============================================*/

.tournaments-cycle-grid {
    margin-top: 20px;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.tournaments-cycle-grid article {
    padding:
        17px
        16px;

    border:
        1px solid
        rgba(160, 126, 255, 0.20);

    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            rgba(146, 105, 255, 0.07),
            rgba(255, 255, 255, 0.018)
        );
}


.tournaments-cycle-grid span {
    display: block;

    margin-bottom: 5px;

    color: #af86ff;

    font-size: 9px;

    font-weight: 900;

    letter-spacing: 0.13em;
}


.tournaments-cycle-grid strong {
    display: block;

    color: #ffffff;

    font-size: 15px;

    font-weight: 900;
}


.tournaments-cycle-grid p {
    margin:
        7px
        0
        0;

    color: #c4c6d7;

    font-size: 11px;

    line-height: 1.48;
}

/*=============================================
                Cycle Grid End
=============================================*/


/*=============================================
                    Guide Start
=============================================*/

.tournaments-guide {
    margin-top: 21px;

    padding:
        22px
        24px;

    border:
        1px solid
        rgba(124, 135, 255, 0.19);

    border-radius: 17px;

    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(113, 104, 255, 0.08),
            transparent 30%
        ),
        rgba(255, 255, 255, 0.017);
}


.tournaments-guide-heading {
    max-width: 850px;
}


.tournaments-guide-heading > p:last-child {
    margin:
        8px
        0
        0;

    color: #c4c9db;

    font-size: 12px;

    line-height: 1.5;
}


.tournaments-guide-grid {
    margin-top: 16px;

    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.tournaments-guide-grid article {
    padding: 14px;

    border:
        1px solid
        rgba(130, 140, 255, 0.15);

    border-radius: 11px;

    background:
        rgba(255, 255, 255, 0.021);
}


.tournaments-guide-grid strong {
    color: #ffffff;

    font-size: 13px;

    font-weight: 900;
}


.tournaments-guide-grid p {
    margin:
        5px
        0
        0;

    color: #c8cde0;

    font-size: 11px;

    line-height: 1.45;
}

/*=============================================
                     Guide End
=============================================*/


/*=============================================
               Knowledge Start
=============================================*/

.tournaments-knowledge {
    margin-top: 18px;

    padding:
        22px
        24px;

    border:
        1px solid
        rgba(115, 130, 255, 0.18);

    border-radius: 17px;

    background:
        linear-gradient(
            145deg,
            rgba(18, 24, 55, 0.93),
            rgba(9, 16, 37, 0.96)
        );
}


.tournaments-knowledge-heading {
    margin-bottom: 14px;
}


.tournaments-knowledge-grid {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.tournaments-knowledge-grid details {
    border:
        1px solid
        rgba(117, 137, 255, 0.17);

    border-radius: 11px;

    background:
        rgba(255, 255, 255, 0.018);
}


.tournaments-knowledge-grid summary {
    min-height: 51px;

    padding:
        0
        14px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 12px;

    list-style: none;

    color: #ffffff;

    font-size: 11px;

    font-weight: 900;

    cursor: pointer;
}


.tournaments-knowledge-grid summary::-webkit-details-marker {
    display: none;
}


.tournaments-knowledge-grid summary::after {
    content: "+";

    color: #ffd15e;

    font-size: 20px;

    line-height: 1;
}


.tournaments-knowledge-grid details[open]
summary::after {
    transform:
        rotate(45deg);
}


.tournaments-knowledge-grid details > div {
    padding:
        0
        14px
        14px;
}


.tournaments-knowledge-grid p {
    margin: 0;

    color: #bec4d8;

    font-size: 11px;

    line-height: 1.57;
}


.tournaments-knowledge-grid p + p {
    margin-top: 8px;
}

/*=============================================
                Knowledge End
=============================================*/


/*=============================================
                   Closing Start
=============================================*/

.tournaments-closing {
    margin-top: 21px;

    padding:
        24px
        26px;

    display: grid;

    grid-template-columns:
        minmax(0, 0.75fr)
        minmax(0, 1.25fr);

    gap: 36px;

    align-items: center;

    border:
        1px solid
        rgba(125, 137, 255, 0.18);

    border-radius: 17px;

    background:
        radial-gradient(
            circle at 0% 50%,
            rgba(110, 104, 255, 0.07),
            transparent 34%
        ),
        radial-gradient(
            circle at 100% 0%,
            rgba(255, 207, 88, 0.05),
            transparent 30%
        ),
        rgba(255, 255, 255, 0.017);
}


.tournaments-closing > div:last-child p {
    margin: 0;

    color: #cbd0e2;

    font-size: 12.5px;

    line-height: 1.57;
}


.tournaments-closing > div:last-child p + p {
    margin-top: 8px;
}

/*=============================================
                    Closing End
=============================================*/


/*=============================================
                 Responsive Start
=============================================*/

@media (max-width: 1500px) {

    .tournaments-container {
        width:
            min(
                calc(100% - 18px),
                1260px
            );
    }


    .tournaments-site-navigation {
        left: -160px;

        width: 140px;
    }


    .tournaments-site-switcher {
        width: 140px;
    }


    .tournaments-site-navigation.is-at-bottom {
        left: -160px;
    }

}


@media (max-width: 1240px) {

    .tournaments-site-navigation,
    .tournaments-site-navigation.is-floating,
    .tournaments-site-navigation.is-at-bottom {
        position: static;

        width: 100%;

        margin-bottom: 16px;

        transform: none;

        pointer-events: auto;
    }


    .tournaments-site-switcher {
        width: 100%;

        flex-direction: row;

        overflow-x: auto;

        scrollbar-width: none;
    }


    .tournaments-site-switcher::-webkit-scrollbar {
        display: none;
    }


    .tournaments-site-switcher-button {
        min-width: 155px;

        flex:
            0
            0
            155px;
    }


    .tournaments-intro {
        grid-template-columns:
            1fr;
    }


    .tournaments-snapshot {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .tournaments-tabs {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }


    .tournaments-format-grid,
    .tournaments-rule-cards,
    .tournaments-cycle-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .tournaments-how-it-works,
    .tournaments-primary-layout,
    .tournaments-win-examples {
        grid-template-columns:
            1fr;
    }


    .tournaments-guide-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


@media (max-width: 920px) {

    .tournaments-panel-heading,
    .tournaments-panel-heading-wide {
        grid-template-columns:
            1fr;
    }


    .tournaments-panel-mark {
        max-width: 290px;
    }


    .tournaments-how-flow {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .tournaments-prize-showcase,
    .tournaments-win-values {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


@media (max-width: 760px) {

    .tournaments-section {
        padding:
            34px
            12px
            58px;
    }


    .tournaments-container {
        width: 100%;
    }


    .tournaments-intro {
        padding:
            24px
            19px;
    }


    .tournaments-intro h2 {
        font-size:
            clamp(
                34px,
                9vw,
                48px
            );
    }


    .tournaments-tabs {
        display: flex;

        gap: 8px;

        overflow-x: auto;

        padding-bottom: 4px;

        scrollbar-width: none;

        scroll-snap-type:
            x mandatory;
    }


    .tournaments-tabs::-webkit-scrollbar {
        display: none;
    }


    .tournaments-tab {
        min-width: 190px;

        flex:
            0
            0
            190px;

        scroll-snap-align: start;
    }


    .tournaments-stage {
        padding:
            18px
            13px;
    }


    .tournaments-snapshot,
    .tournaments-format-grid,
    .tournaments-prize-showcase,
    .tournaments-how-flow,
    .tournaments-rule-cards,
    .tournaments-guide-grid,
    .tournaments-stat-board,
    .tournaments-cycle-grid,
    .tournaments-win-values,
    .tournaments-knowledge-grid {
        grid-template-columns: 1fr;
    }


    .tournaments-closing {
        grid-template-columns: 1fr;
    }

}

/*=============================================
                  Responsive End
=============================================*/

/*=============================================
                 Tournaments End
=============================================*/
/*=============================================
                 Promotions Start
=============================================*/

.promotion-section {
    --promotion-pink: #ff6fae;
    --promotion-pink-rgb: 255, 111, 174;

    --promotion-gold: #ffd05d;
    --promotion-gold-rgb: 255, 208, 93;

    --promotion-blue: #63b7ff;
    --promotion-blue-rgb: 99, 183, 255;

    --promotion-violet: #a681ff;
    --promotion-violet-rgb: 166, 129, 255;

    --promotion-green: #55d9b0;
    --promotion-green-rgb: 85, 217, 176;

    position: relative;

    padding:
        56px
        22px
        82px;

    overflow: visible;

    isolation: isolate;

    color: #fffafb;

    background:
        radial-gradient(
            ellipse at 8% 4%,
            rgba(255, 93, 158, 0.18) 0%,
            rgba(255, 93, 158, 0.045) 28%,
            transparent 48%
        ),
        radial-gradient(
            ellipse at 86% 5%,
            rgba(255, 196, 69, 0.14) 0%,
            rgba(255, 196, 69, 0.035) 28%,
            transparent 50%
        ),
        radial-gradient(
            ellipse at 95% 56%,
            rgba(77, 201, 241, 0.08) 0%,
            transparent 38%
        ),
        linear-gradient(
            145deg,
            #1a0f1b 0%,
            #251421 38%,
            #1d1420 68%,
            #13101a 100%
        );

    border-top:
        1px solid
        rgba(255, 143, 185, 0.18);
}


.promotion-section::before {
    content: "";

    position: absolute;

    top: 0;
    left: 50%;

    width:
        min(
            94%,
            1540px
        );

    height: 3px;

    transform:
        translateX(-50%);

    background:
        linear-gradient(
            90deg,
            transparent,
            #ff5d9f 17%,
            #ffb94a 37%,
            #ffe071 51%,
            #ce78ff 69%,
            #56cceb 84%,
            transparent
        );

    box-shadow:
        0 0 27px
        rgba(255, 103, 165, 0.36);
}


.promotion-section[hidden] {
    display: none !important;
}


.promotion-container {
    position: relative;

    z-index: 2;

    width:
        min(
            calc(100% - 12px),
            1360px
        );

    margin:
        0 auto;
}


.promotion-main {
    min-width: 0;
}


/*=============================================
              Site Navigation Start
=============================================*/

.promotion-site-navigation {
    position: absolute;

    top: 0;
    left: -188px;

    width: 162px;

    z-index: 90;

    pointer-events: none;
}


.promotion-site-switcher {
    width: 162px;

    padding: 9px;

    display: flex;

    flex-direction: column;

    gap: 8px;

    border:
        1px solid
        rgba(255, 155, 196, 0.20);

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            rgba(46, 20, 40, 0.94),
            rgba(23, 12, 27, 0.97)
        );

    box-shadow:
        0 24px 56px
        rgba(8, 2, 8, 0.43),
        inset 0 1px 0
        rgba(255, 255, 255, 0.06);

    backdrop-filter:
        blur(22px)
        saturate(145%);

    -webkit-backdrop-filter:
        blur(22px)
        saturate(145%);

    pointer-events: auto;
}


.promotion-site-navigation.is-floating {
    position: fixed;

    top: 50%;

    left:
        max(
            12px,
            calc(50% - 680px - 188px)
        );

    transform:
        translateY(-50%);
}


.promotion-site-navigation.is-at-bottom {
    position: absolute;

    top: auto;

    bottom: 0;

    left: -188px;

    transform: none;
}


.promotion-site-switcher-button {
    --section-accent-rgb: 255, 113, 171;
    --section-accent: #ff71ab;
    --section-ink: #31101e;

    width: 100%;

    min-height: 62px;

    padding:
        8px
        7px;

    display: grid;

    grid-template-columns:
        36px
        minmax(0, 1fr);

    align-items: center;

    gap: 7px;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.42
        );

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            rgba(
                var(--section-accent-rgb),
                0.13
            ),
            rgba(255, 255, 255, 0.02)
        );

    color: #ffffff;

    font: inherit;

    text-align: left;

    cursor: pointer;

    box-shadow:
        inset 0 1px 0
        rgba(255, 255, 255, 0.05),
        0 8px 18px
        rgba(8, 2, 8, 0.22);

    transition:
        transform 0.2s ease,
        border-color 0.2s ease,
        background 0.2s ease,
        box-shadow 0.2s ease,
        color 0.2s ease;
}


.promotion-site-switcher-button[data-section-target="pokies"] {
    --section-accent-rgb: 255, 198, 55;
    --section-accent: #ffc637;
    --section-ink: #2e1d03;
}


.promotion-site-switcher-button[data-section-target="live-casino"] {
    --section-accent-rgb: 52, 202, 255;
    --section-accent: #34caff;
    --section-ink: #041f2e;
}


.promotion-site-switcher-button[data-section-target="table-games"] {
    --section-accent-rgb: 54, 224, 151;
    --section-accent: #36e097;
    --section-ink: #04251a;
}


.promotion-site-switcher-button[data-section-target="promotions"] {
    --section-accent-rgb: 255, 117, 174;
    --section-accent: #ff75ae;
    --section-ink: #33101f;
}


.promotion-site-switcher-button[data-section-target="tournaments"] {
    --section-accent-rgb: 255, 205, 90;
    --section-accent: #ffcd5a;
    --section-ink: #302306;
}


.promotion-site-switcher-button[data-section-target="banking"] {
    --section-accent-rgb: 102, 223, 194;
    --section-accent: #66dfc2;
    --section-ink: #07271f;
}


.promotion-site-switcher-icon {
    width: 36px;
    height: 36px;

    display: grid;

    place-items: center;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.77
        );

    border-radius: 11px;

    background:
        rgba(
            var(--section-accent-rgb),
            0.12
        );

    color:
        var(--section-accent);

    font-size: 9px;

    font-weight: 900;
}


.promotion-site-switcher-copy strong {
    display: block;

    font-size: 12px;

    font-weight: 900;

    line-height: 1.08;
}


.promotion-site-switcher-copy small {
    display: block;

    margin-top: 3px;

    color:
        rgba(242, 228, 236, 0.72);

    font-size: 9.5px;

    font-weight: 700;

    line-height: 1.17;
}


.promotion-site-switcher-button:hover,
.promotion-site-switcher-button:focus-visible {
    transform:
        translateX(5px);

    border-color:
        var(--section-accent);

    box-shadow:
        0 12px 26px
        rgba(8, 2, 8, 0.29),
        0 0 24px
        rgba(
            var(--section-accent-rgb),
            0.18
        );

    outline: none;
}


.promotion-site-switcher-button.is-active {
    transform:
        translateX(6px);

    border-color:
        rgba(255, 255, 255, 0.70);

    color:
        var(--section-ink);

    background:
        linear-gradient(
            135deg,
            var(--section-accent),
            rgba(
                var(--section-accent-rgb),
                0.83
            )
        );

    box-shadow:
        0 14px 29px
        rgba(8, 2, 8, 0.33),
        0 0 30px
        rgba(
            var(--section-accent-rgb),
            0.30
        );
}


.promotion-site-switcher-button.is-active
.promotion-site-switcher-icon {
    color:
        var(--section-ink);

    border-color:
        rgba(0, 0, 0, 0.14);

    background:
        rgba(0, 0, 0, 0.10);
}


.promotion-site-switcher-button.is-active
.promotion-site-switcher-copy small {
    color:
        rgba(35, 7, 20, 0.68);
}

/*=============================================
               Site Navigation End
=============================================*/


/*=============================================
                   Intro Start
=============================================*/

.promotion-intro {
    margin-bottom: 19px;

    padding:
        34px
        36px;

    display: grid;

    grid-template-columns:
        minmax(0, 1.08fr)
        minmax(330px, 0.58fr);

    gap: 38px;

    align-items: center;

    overflow: hidden;

    border:
        1px solid
        rgba(255, 132, 182, 0.29);

    border-radius: 24px;

    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(255, 89, 158, 0.14),
            transparent 38%
        ),
        radial-gradient(
            circle at 100% 0%,
            rgba(255, 188, 69, 0.09),
            transparent 36%
        ),
        linear-gradient(
            145deg,
            rgba(49, 21, 43, 0.97),
            rgba(28, 14, 31, 0.98)
        );

    box-shadow:
        0 23px 53px
        rgba(9, 2, 9, 0.32),
        inset 0 1px 0
        rgba(255, 255, 255, 0.06);
}


.promotion-eyebrow,
.promotion-panel-kicker,
.promotion-offer-type,
.promotion-feature-label {
    margin:
        0
        0
        8px;

    color: #ff8cba;

    font-size: 12px;

    font-weight: 900;

    letter-spacing: 0.12em;

    line-height: 1.3;

    text-transform: uppercase;
}


.promotion-intro h2 {
    max-width: 760px;

    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            39px,
            3.7vw,
            56px
        );

    font-weight: 900;

    line-height: 0.99;

    letter-spacing: -0.045em;
}


.promotion-intro-copy p {
    max-width: 800px;

    margin:
        13px
        0
        0;

    color: #decdd6;

    font-size: 15px;

    line-height: 1.6;
}


.promotion-intro-copy
.promotion-intro-lead {
    color: #fff9fb;

    font-size: 17px;

    font-weight: 750;

    line-height: 1.54;
}


.promotion-intro-more {
    margin-top: 15px;
}


.promotion-intro-more summary,
.promotion-deep-guide summary {
    width: fit-content;

    min-height: 42px;

    padding:
        0
        15px;

    display: inline-flex;

    align-items: center;

    gap: 10px;

    list-style: none;

    border:
        1px solid
        rgba(255, 136, 184, 0.34);

    border-radius: 10px;

    background:
        linear-gradient(
            135deg,
            rgba(255, 110, 171, 0.09),
            rgba(255, 203, 89, 0.05)
        );

    color: #ffffff;

    font-size: 12px;

    font-weight: 900;

    cursor: pointer;
}


.promotion-intro-more summary::-webkit-details-marker,
.promotion-deep-guide summary::-webkit-details-marker {
    display: none;
}


.promotion-intro-more summary::after,
.promotion-deep-guide summary::after {
    content: "+";

    color: #ff9bc2;

    font-size: 19px;

    font-weight: 900;
}


.promotion-intro-more[open]
summary::after,
.promotion-deep-guide[open]
summary::after {
    transform:
        rotate(45deg);
}


.promotion-intro-more > div,
.promotion-deep-guide > div {
    margin-top: 9px;

    padding:
        14px
        16px;

    max-height: 300px;

    overflow-y: auto;

    border:
        1px solid
        rgba(255, 131, 181, 0.14);

    border-radius: 10px;

    background:
        rgba(10, 4, 11, 0.22);
}


.promotion-intro-more > div p,
.promotion-deep-guide > div p {
    margin: 0;

    color: #d3c6cd;

    font-size: 12px;

    line-height: 1.6;
}


.promotion-intro-more > div p + p,
.promotion-deep-guide > div p + p {
    margin-top: 9px;
}


.promotion-intro-media {
    min-height: 350px;

    margin: 0;

    overflow: hidden;

    border:
        1px solid
        rgba(255, 190, 69, 0.48);

    border-radius: 20px;

    background: #140c14;

    box-shadow:
        0 20px 44px
        rgba(8, 2, 8, 0.36),
        0 0 23px
        rgba(255, 177, 62, 0.08);
}


.promotion-intro-media img {
    width: 100%;

    height: 350px;

    object-fit: cover;

    object-position: center;
}

/*=============================================
                    Intro End
=============================================*/


/*=============================================
               Snapshot Start
=============================================*/

.promotion-snapshot {
    margin-bottom: 16px;

    display: grid;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.promotion-snapshot article {
    --snapshot-accent-rgb: 255, 117, 174;
    --snapshot-accent: #ff75ae;

    padding:
        15px
        14px;

    border:
        1px solid
        rgba(
            var(--snapshot-accent-rgb),
            0.25
        );

    border-radius: 12px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--snapshot-accent-rgb),
                0.08
            ),
            rgba(255, 255, 255, 0.015)
        );
}


.promotion-snapshot article[data-promotion-snapshot="welcome"] {
    --snapshot-accent-rgb: 255, 205, 91;
    --snapshot-accent: #ffcd5b;
}


.promotion-snapshot article[data-promotion-snapshot="live"] {
    --snapshot-accent-rgb: 91, 210, 244;
    --snapshot-accent: #5bd2f4;
}


.promotion-snapshot article[data-promotion-snapshot="spins"] {
    --snapshot-accent-rgb: 255, 105, 174;
    --snapshot-accent: #ff69ae;
}


.promotion-snapshot article[data-promotion-snapshot="reload"] {
    --snapshot-accent-rgb: 102, 223, 194;
    --snapshot-accent: #66dfc2;
}


.promotion-snapshot article[data-promotion-snapshot="cashback"] {
    --snapshot-accent-rgb: 184, 137, 255;
    --snapshot-accent: #b889ff;
}


.promotion-snapshot span,
.promotion-snapshot strong,
.promotion-snapshot small {
    display: block;
}


.promotion-snapshot span {
    color:
        var(--snapshot-accent);

    font-size: 10px;

    font-weight: 900;
}


.promotion-snapshot strong {
    margin-top: 4px;

    color: #ffffff;

    font-size: 21px;

    font-weight: 900;
}


.promotion-snapshot small {
    margin-top: 4px;

    color: #cfc2c9;

    font-size: 10px;

    line-height: 1.34;
}

/*=============================================
                Snapshot End
=============================================*/


/*=============================================
                     Tabs Start
=============================================*/

.promotion-tabs {
    margin-bottom: 16px;

    display: grid;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.promotion-tab {
    --tab-accent-rgb: 255, 120, 174;
    --tab-accent: #ff78ae;
    --tab-ink: #33101f;

    min-width: 0;

    min-height: 74px;

    padding:
        10px
        11px;

    display: flex;

    align-items: center;

    gap: 9px;

    border:
        1px solid
        rgba(
            var(--tab-accent-rgb),
            0.40
        );

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--tab-accent-rgb),
                0.12
            ),
            rgba(255, 255, 255, 0.02)
        );

    color: #ffffff;

    font: inherit;

    text-align: left;

    cursor: pointer;

    box-shadow:
        inset 0 1px 0
        rgba(255, 255, 255, 0.05),
        0 9px 20px
        rgba(8, 2, 8, 0.21);

    transition:
        transform 0.2s ease,
        border-color 0.2s ease,
        background 0.2s ease,
        color 0.2s ease,
        box-shadow 0.2s ease;
}


.promotion-tab[data-promotion-target="overview"] {
    --tab-accent-rgb: 92, 215, 239;
    --tab-accent: #5cd7ef;
    --tab-ink: #06252c;
}


.promotion-tab[data-promotion-target="welcome"] {
    --tab-accent-rgb: 255, 205, 91;
    --tab-accent: #ffcd5b;
    --tab-ink: #302206;
}


.promotion-tab[data-promotion-target="live"] {
    --tab-accent-rgb: 92, 206, 244;
    --tab-accent: #5ccef4;
    --tab-ink: #06242d;
}


.promotion-tab[data-promotion-target="spins"] {
    --tab-accent-rgb: 255, 105, 174;
    --tab-accent: #ff69ae;
    --tab-ink: #32101f;
}


.promotion-tab[data-promotion-target="reload"] {
    --tab-accent-rgb: 102, 223, 194;
    --tab-accent: #66dfc2;
    --tab-ink: #07271f;
}


.promotion-tab-icon {
    width: 38px;
    height: 38px;

    display: grid;

    place-items: center;

    flex:
        0
        0
        38px;

    border:
        1px solid
        var(--tab-accent);

    border-radius: 11px;

    background:
        rgba(
            var(--tab-accent-rgb),
            0.13
        );

    color:
        var(--tab-accent);

    font-size: 9px;

    font-weight: 900;
}


.promotion-tab-copy strong {
    display: block;

    font-size: 13px;

    font-weight: 900;

    line-height: 1.08;
}


.promotion-tab-copy small {
    display: block;

    margin-top: 3px;

    color:
        rgba(239, 226, 233, 0.72);

    font-size: 10px;

    font-weight: 700;

    line-height: 1.18;
}


.promotion-tab:hover,
.promotion-tab:focus-visible {
    transform:
        translateY(-3px);

    border-color:
        var(--tab-accent);

    box-shadow:
        0 14px 27px
        rgba(8, 2, 8, 0.29),
        0 0 22px
        rgba(
            var(--tab-accent-rgb),
            0.17
        );

    outline: none;
}


.promotion-tab.is-active {
    transform:
        translateY(-3px);

    border-color:
        rgba(255, 255, 255, 0.68);

    color:
        var(--tab-ink);

    background:
        linear-gradient(
            135deg,
            var(--tab-accent),
            rgba(
                var(--tab-accent-rgb),
                0.82
            )
        );

    box-shadow:
        0 15px 29px
        rgba(8, 2, 8, 0.33),
        0 0 27px
        rgba(
            var(--tab-accent-rgb),
            0.27
        );
}


.promotion-tab.is-active
.promotion-tab-icon {
    color:
        var(--tab-ink);

    border-color:
        rgba(0, 0, 0, 0.14);

    background:
        rgba(0, 0, 0, 0.10);
}


.promotion-tab.is-active
.promotion-tab-copy small {
    color:
        rgba(30, 7, 18, 0.66);
}

/*=============================================
                      Tabs End
=============================================*/


/*=============================================
                 Main Panels Start
=============================================*/

.promotion-panel {
    --promo-accent-rgb: 255, 124, 176;
    --promo-accent: #ff7cb0;

    padding: 26px;

    border:
        1px solid
        rgba(
            var(--promo-accent-rgb),
            0.22
        );

    border-radius: 21px;

    background:
        radial-gradient(
            circle at 96% 4%,
            rgba(
                var(--promo-accent-rgb),
                0.08
            ),
            transparent 29%
        ),
        linear-gradient(
            145deg,
            rgba(40, 18, 35, 0.98),
            rgba(23, 12, 27, 0.99)
        );

    box-shadow:
        0 23px 52px
        rgba(9, 2, 9, 0.32),
        inset 0 1px 0
        rgba(255, 255, 255, 0.04);
}


.promotion-panel[data-promotion-panel="overview"] {
    --promo-accent-rgb: 95, 216, 238;
    --promo-accent: #5fd8ee;
}


.promotion-panel[data-promotion-panel="welcome"] {
    --promo-accent-rgb: 255, 205, 91;
    --promo-accent: #ffcd5b;
}


.promotion-panel[data-promotion-panel="live"] {
    --promo-accent-rgb: 92, 206, 244;
    --promo-accent: #5ccef4;
}


.promotion-panel[data-promotion-panel="spins"] {
    --promo-accent-rgb: 255, 105, 174;
    --promo-accent: #ff69ae;
}


.promotion-panel[data-promotion-panel="reload"] {
    --promo-accent-rgb: 102, 223, 194;
    --promo-accent: #66dfc2;
}


.promotion-panel[hidden] {
    display: none !important;
}


.promotion-panel-heading {
    padding-bottom: 19px;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        215px;

    gap: 30px;

    align-items: center;

    border-bottom:
        1px solid
        rgba(
            var(--promo-accent-rgb),
            0.22
        );
}


.promotion-panel-heading-wide {
    grid-template-columns:
        minmax(0, 1fr)
        185px;
}


.promotion-panel h3,
.promotion-guide h3,
.promotion-closing h3 {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            30px,
            2.6vw,
            41px
        );

    font-weight: 900;

    line-height: 1.05;

    letter-spacing: -0.035em;
}


.promotion-panel-heading p {
    max-width: 900px;

    margin:
        10px
        0
        0;

    color: #d5c7ce;

    font-size: 14px;

    line-height: 1.58;
}


.promotion-panel-mark,
.promotion-overview-mark {
    padding: 15px;

    border:
        1px solid
        rgba(
            var(--promo-accent-rgb),
            0.43
        );

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--promo-accent-rgb),
                0.15
            ),
            rgba(
                var(--promo-accent-rgb),
                0.035
            )
        );

    text-align: center;
}


.promotion-panel-mark span,
.promotion-panel-mark strong,
.promotion-panel-mark small,
.promotion-overview-mark span,
.promotion-overview-mark strong,
.promotion-overview-mark small {
    display: block;
}


.promotion-panel-mark span,
.promotion-overview-mark span {
    color: #dfd1d8;

    font-size: 11px;

    font-weight: 800;
}


.promotion-panel-mark strong,
.promotion-overview-mark strong {
    margin-top: 5px;

    color:
        var(--promo-accent);

    font-size: 28px;

    font-weight: 900;

    line-height: 1;
}


.promotion-panel-mark small,
.promotion-overview-mark small {
    margin-top: 6px;

    color: #ffffff;

    font-size: 11px;

    font-weight: 700;

    line-height: 1.25;
}

/*=============================================
                  Main Panels End
=============================================*/


/*=============================================
                  Overview Start
=============================================*/

.promotion-overview-grid {
    margin-top: 19px;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.promotion-overview-card {
    --overview-accent-rgb: 255, 120, 174;
    --overview-accent: #ff78ae;

    padding: 16px;

    display: grid;

    grid-template-columns:
        42px
        minmax(0, 1fr);

    gap: 12px;

    border:
        1px solid
        rgba(
            var(--overview-accent-rgb),
            0.24
        );

    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--overview-accent-rgb),
                0.07
            ),
            rgba(255, 255, 255, 0.018)
        );
}


.promotion-overview-card[data-promo-theme="welcome"] {
    --overview-accent-rgb: 255, 205, 91;
    --overview-accent: #ffcd5b;
}


.promotion-overview-card[data-promo-theme="live"] {
    --overview-accent-rgb: 92, 206, 244;
    --overview-accent: #5ccef4;
}


.promotion-overview-card[data-promo-theme="spins"] {
    --overview-accent-rgb: 255, 105, 174;
    --overview-accent: #ff69ae;
}


.promotion-overview-card[data-promo-theme="reload"] {
    --overview-accent-rgb: 102, 223, 194;
    --overview-accent: #66dfc2;
}


.promotion-overview-icon {
    width: 42px;
    height: 42px;

    display: grid;

    place-items: center;

    border:
        1px solid
        rgba(
            var(--overview-accent-rgb),
            0.68
        );

    border-radius: 11px;

    background:
        rgba(
            var(--overview-accent-rgb),
            0.12
        );

    color:
        var(--overview-accent);

    font-size: 9px;

    font-weight: 900;
}


.promotion-overview-card strong {
    color: #ffffff;

    font-size: 14px;

    font-weight: 900;

    line-height: 1.18;
}


.promotion-overview-card p {
    margin:
        6px
        0
        0;

    color: #d0c3ca;

    font-size: 11px;

    line-height: 1.46;
}

/*=============================================
                   Overview End
=============================================*/


/*=============================================
                 Reward Path Start
=============================================*/

.promotion-path {
    margin-top: 22px;

    padding-top: 19px;

    border-top:
        1px solid
        rgba(
            var(--promo-accent-rgb),
            0.18
        );
}


.promotion-path-flow {
    margin-top: 14px;

    display: grid;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.promotion-path-flow article {
    padding: 14px;

    border:
        1px solid
        rgba(
            var(--promo-accent-rgb),
            0.18
        );

    border-radius: 11px;

    background:
        rgba(255, 255, 255, 0.022);
}


.promotion-path-icon {
    width: 35px;
    height: 35px;

    margin-bottom: 9px;

    display: grid;

    place-items: center;

    border-radius: 10px;

    background:
        rgba(
            var(--promo-accent-rgb),
            0.14
        );

    color:
        var(--promo-accent);

    font-size: 9px;

    font-weight: 900;
}


.promotion-path-flow strong {
    display: block;

    color: #ffffff;

    font-size: 13px;

    font-weight: 900;

    line-height: 1.18;
}


.promotion-path-flow p {
    margin:
        6px
        0
        0;

    color: #d0c3ca;

    font-size: 11px;

    line-height: 1.45;
}

/*=============================================
                  Reward Path End
=============================================*/


/*=============================================
                Hero Offer Start
=============================================*/

.promotion-hero-offer {
    margin-top: 20px;

    display: grid;

    grid-template-columns:
        260px
        minmax(0, 1fr);

    gap: 25px;

    align-items: center;

    padding: 19px;

    border:
        1px solid
        rgba(
            var(--promo-accent-rgb),
            0.22
        );

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--promo-accent-rgb),
                0.08
            ),
            rgba(255, 255, 255, 0.018)
        );
}


.promotion-hero-value {
    padding:
        17px
        16px;

    border:
        1px solid
        rgba(
            var(--promo-accent-rgb),
            0.34
        );

    border-radius: 12px;

    text-align: center;

    background:
        rgba(
            var(--promo-accent-rgb),
            0.06
        );
}


.promotion-hero-value span,
.promotion-hero-value strong,
.promotion-hero-value small {
    display: block;
}


.promotion-hero-value span {
    color: #d8cbd1;

    font-size: 11px;
}


.promotion-hero-value strong {
    margin-top: 5px;

    color:
        var(--promo-accent);

    font-size: 32px;

    font-weight: 900;
}


.promotion-hero-value small {
    margin-top: 5px;

    color: #ffffff;

    font-size: 11px;
}


.promotion-hero-copy h4 {
    margin: 0;

    color: #ffffff;

    font-size: 23px;

    font-weight: 900;
}


.promotion-hero-copy p {
    margin:
        8px
        0
        0;

    color: #d0c4ca;

    font-size: 12px;

    line-height: 1.56;
}

/*=============================================
                 Hero Offer End
=============================================*/


/*=============================================
              Condition Grid Start
=============================================*/

.promotion-condition-grid {
    margin-top: 14px;

    display: grid;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.promotion-condition-grid article {
    padding:
        13px
        12px;

    border:
        1px solid
        rgba(
            var(--promo-accent-rgb),
            0.18
        );

    border-radius: 10px;

    background:
        rgba(255, 255, 255, 0.019);
}


.promotion-condition-grid span,
.promotion-condition-grid strong {
    display: block;
}


.promotion-condition-grid span {
    color: #bfaeb7;

    font-size: 9px;
}


.promotion-condition-grid strong {
    margin-top: 4px;

    color:
        var(--promo-accent);

    font-size: 16px;

    font-weight: 900;
}


.promotion-condition-grid p {
    margin:
        5px
        0
        0;

    color: #cfc4c9;

    font-size: 10px;

    line-height: 1.4;
}

/*=============================================
               Condition Grid End
=============================================*/


/*=============================================
                Live Bonus Start
=============================================*/

.promotion-live-layout {
    margin-top: 20px;

    display: grid;

    grid-template-columns:
        minmax(0, 1.2fr)
        minmax(330px, 0.8fr);

    gap: 22px;

    align-items: center;
}


.promotion-live-feature {
    padding: 18px;

    border:
        1px solid
        rgba(
            var(--promo-accent-rgb),
            0.20
        );

    border-radius: 13px;

    background:
        rgba(
            var(--promo-accent-rgb),
            0.045
        );
}


.promotion-live-feature h4 {
    margin:
        5px
        0
        0;

    color: #ffffff;

    font-size: 23px;

    font-weight: 900;
}


.promotion-live-feature p {
    margin:
        8px
        0
        0;

    color: #c8d0d5;

    font-size: 12px;

    line-height: 1.56;
}


.promotion-live-stats {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.promotion-live-stats article {
    padding:
        14px
        12px;

    border:
        1px solid
        rgba(
            var(--promo-accent-rgb),
            0.20
        );

    border-radius: 10px;

    background:
        rgba(
            var(--promo-accent-rgb),
            0.04
        );

    text-align: center;
}


.promotion-live-stats span,
.promotion-live-stats strong {
    display: block;
}


.promotion-live-stats span {
    color: #b5c1c8;

    font-size: 10px;
}


.promotion-live-stats strong {
    margin-top: 4px;

    color:
        var(--promo-accent);

    font-size: 18px;

    font-weight: 900;
}

/*=============================================
                 Live Bonus End
=============================================*/


/*=============================================
               Claim Path Start
=============================================*/

.promotion-claim-path {
    margin-top: 15px;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.promotion-claim-path article {
    padding: 13px;

    border:
        1px solid
        rgba(
            var(--promo-accent-rgb),
            0.18
        );

    border-radius: 10px;

    background:
        rgba(255, 255, 255, 0.02);
}


.promotion-claim-path strong {
    display: block;

    color: #ffffff;

    font-size: 13px;

    font-weight: 900;
}


.promotion-claim-path p {
    margin:
        5px
        0
        0;

    color: #cfc2c9;

    font-size: 11px;

    line-height: 1.45;
}

/*=============================================
                Claim Path End
=============================================*/


/*=============================================
              Feature Cards Start
=============================================*/

.promotion-feature-grid {
    margin-top: 20px;

    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 10px;
}


.promotion-feature-card {
    --feature-accent-rgb: 255, 105, 174;
    --feature-accent: #ff69ae;

    padding: 19px;

    border:
        1px solid
        rgba(
            var(--feature-accent-rgb),
            0.25
        );

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--feature-accent-rgb),
                0.07
            ),
            rgba(255, 255, 255, 0.018)
        );
}


.promotion-feature-card[data-feature-theme="no-deposit"] {
    --feature-accent-rgb: 255, 104, 171;
    --feature-accent: #ff68ab;
}


.promotion-feature-card[data-feature-theme="twenty"] {
    --feature-accent-rgb: 255, 204, 88;
    --feature-accent: #ffcc58;
}


.promotion-feature-card[data-feature-theme="ten"] {
    --feature-accent-rgb: 95, 214, 240;
    --feature-accent: #5fd6f0;
}


.promotion-feature-card[data-feature-theme="muses"] {
    --feature-accent-rgb: 181, 135, 255;
    --feature-accent: #b587ff;
}


.promotion-feature-card
.promotion-feature-label {
    color:
        var(--feature-accent);
}


.promotion-feature-value {
    display: block;

    margin-top: 9px;

    color:
        var(--feature-accent);

    font-size: 30px;

    font-weight: 900;

    line-height: 1;
}


.promotion-feature-card h4 {
    margin:
        8px
        0
        0;

    color: #ffffff;

    font-size: 21px;

    font-weight: 900;
}


.promotion-feature-card > p {
    margin:
        9px
        0
        0;

    color: #d1c3ca;

    font-size: 12px;

    line-height: 1.52;
}


.promotion-feature-steps {
    margin:
        13px
        0
        0;

    padding-left: 20px;

    color: #e0d4da;

    font-size: 11px;

    line-height: 1.55;
}


.promotion-feature-steps li + li {
    margin-top: 4px;
}

/*=============================================
               Feature Cards End
=============================================*/


/*=============================================
             Recurring Rewards Start
=============================================*/

.promotion-recurring-grid {
    margin-top: 20px;

    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 10px;
}


.promotion-recurring-card {
    --recurring-accent-rgb: 102, 223, 194;
    --recurring-accent: #66dfc2;

    padding: 20px;

    border:
        1px solid
        rgba(
            var(--recurring-accent-rgb),
            0.24
        );

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--recurring-accent-rgb),
                0.07
            ),
            rgba(255, 255, 255, 0.018)
        );
}


.promotion-recurring-card[data-recurring-theme="cashback"] {
    --recurring-accent-rgb: 184, 137, 255;
    --recurring-accent: #b889ff;
}


.promotion-recurring-card
.promotion-offer-type {
    color:
        var(--recurring-accent);
}


.promotion-recurring-value {
    display: block;

    margin-top: 9px;

    color:
        var(--recurring-accent);

    font-size: 31px;

    font-weight: 900;
}


.promotion-recurring-card h4 {
    margin:
        8px
        0
        0;

    color: #ffffff;

    font-size: 21px;

    font-weight: 900;
}


.promotion-recurring-card > p {
    margin:
        9px
        0
        0;

    color: #d0c4ca;

    font-size: 12px;

    line-height: 1.53;
}


.promotion-recurring-stats {
    margin-top: 13px;

    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 7px;
}


.promotion-recurring-stats span {
    padding:
        10px
        8px;

    display: block;

    border:
        1px solid
        rgba(
            var(--recurring-accent-rgb),
            0.17
        );

    border-radius: 9px;

    background:
        rgba(
            var(--recurring-accent-rgb),
            0.035
        );

    text-align: center;
}


.promotion-recurring-stats small,
.promotion-recurring-stats strong {
    display: block;
}


.promotion-recurring-stats small {
    color: #b9adb3;

    font-size: 9px;
}


.promotion-recurring-stats strong {
    margin-top: 4px;

    color:
        var(--recurring-accent);

    font-size: 15px;

    font-weight: 900;
}

/*=============================================
              Recurring Rewards End
=============================================*/


/*=============================================
                    Guide Start
=============================================*/

.promotion-guide {
    margin-top: 21px;

    padding:
        22px
        24px;

    border:
        1px solid
        rgba(255, 131, 182, 0.18);

    border-radius: 17px;

    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(255, 98, 160, 0.07),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            rgba(43, 19, 37, 0.87),
            rgba(24, 13, 28, 0.92)
        );
}


.promotion-guide-heading {
    max-width: 850px;
}


.promotion-guide-grid {
    margin-top: 15px;

    display: grid;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.promotion-guide-grid article {
    padding: 14px;

    border:
        1px solid
        rgba(255, 132, 182, 0.14);

    border-radius: 11px;

    background:
        rgba(255, 255, 255, 0.019);
}


.promotion-guide-grid strong {
    display: block;

    color: #ffffff;

    font-size: 13px;

    font-weight: 900;
}


.promotion-guide-grid p {
    margin:
        5px
        0
        0;

    color: #cec2c8;

    font-size: 11px;

    line-height: 1.45;
}

/*=============================================
                      Guide End
=============================================*/


/*=============================================
                    Closing Start
=============================================*/

.promotion-closing {
    margin-top: 21px;

    padding:
        24px
        26px;

    display: grid;

    grid-template-columns:
        minmax(0, 0.76fr)
        minmax(0, 1.24fr);

    gap: 36px;

    align-items: center;

    border:
        1px solid
        rgba(255, 137, 184, 0.17);

    border-radius: 17px;

    background:
        radial-gradient(
            circle at 0% 50%,
            rgba(255, 93, 158, 0.07),
            transparent 34%
        ),
        rgba(255, 255, 255, 0.016);
}


.promotion-closing h3 {
    max-width: 610px;
}


.promotion-closing > div:last-child p {
    margin: 0;

    color: #d0c3ca;

    font-size: 12.5px;

    line-height: 1.57;
}


.promotion-closing > div:last-child p + p {
    margin-top: 8px;
}

/*=============================================
                     Closing End
=============================================*/


/*=============================================
                  Responsive Start
=============================================*/

@media (max-width: 1500px) {

    .promotion-container {
        width:
            min(
                calc(100% - 18px),
                1260px
            );
    }


    .promotion-site-navigation {
        left: -160px;

        width: 140px;
    }


    .promotion-site-switcher {
        width: 140px;
    }


    .promotion-site-navigation.is-at-bottom {
        left: -160px;
    }

}


@media (max-width: 1240px) {

    .promotion-site-navigation,
    .promotion-site-navigation.is-floating,
    .promotion-site-navigation.is-at-bottom {
        position: static;

        width: 100%;

        margin-bottom: 16px;

        transform: none;

        pointer-events: auto;
    }


    .promotion-site-switcher {
        width: 100%;

        flex-direction: row;

        overflow-x: auto;

        scrollbar-width: none;
    }


    .promotion-site-switcher::-webkit-scrollbar {
        display: none;
    }


    .promotion-site-switcher-button {
        min-width: 155px;

        flex:
            0
            0
            155px;
    }


    .promotion-intro {
        grid-template-columns: 1fr;
    }


    .promotion-snapshot {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }


    .promotion-overview-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .promotion-path-flow {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }


    .promotion-guide-grid {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }


    .promotion-live-layout,
    .promotion-hero-offer {
        grid-template-columns: 1fr;
    }

}


@media (max-width: 920px) {

    .promotion-tabs {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .promotion-panel-heading,
    .promotion-panel-heading-wide {
        grid-template-columns: 1fr;
    }


    .promotion-panel-mark,
    .promotion-overview-mark {
        max-width: 290px;
    }


    .promotion-claim-path,
    .promotion-feature-grid,
    .promotion-recurring-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .promotion-condition-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


@media (max-width: 760px) {

    .promotion-section {
        padding:
            34px
            12px
            58px;
    }


    .promotion-container {
        width: 100%;
    }


    .promotion-intro {
        padding:
            25px
            20px;
    }


    .promotion-intro h2 {
        font-size:
            clamp(
                33px,
                9vw,
                47px
            );
    }


    .promotion-intro-copy p {
        font-size: 14px;
    }


    .promotion-tabs {
        display: flex;

        gap: 8px;

        overflow-x: auto;

        padding-bottom: 4px;

        scrollbar-width: none;

        scroll-snap-type:
            x mandatory;
    }


    .promotion-tabs::-webkit-scrollbar {
        display: none;
    }


    .promotion-tab {
        min-width: 190px;

        flex:
            0
            0
            190px;

        scroll-snap-align: start;
    }


    .promotion-panel {
        padding:
            18px
            13px;
    }


    .promotion-snapshot,
    .promotion-overview-grid,
    .promotion-path-flow,
    .promotion-claim-path,
    .promotion-feature-grid,
    .promotion-recurring-grid,
    .promotion-condition-grid,
    .promotion-guide-grid,
    .promotion-live-stats,
    .promotion-recurring-stats {
        grid-template-columns: 1fr;
    }


    .promotion-closing {
        grid-template-columns: 1fr;

        gap: 16px;
    }

}

/*=============================================
                   Responsive End
=============================================*/

/*=============================================
                  Promotions End
=============================================*/
/*=============================================
                  Banking Start
=============================================*/

.banking-section {
    --bank-accent: #50dfbd;
    --bank-accent-rgb: 80, 223, 189;

    --bank-blue: #55c8ff;
    --bank-blue-rgb: 85, 200, 255;

    --bank-gold: #ffd15c;
    --bank-gold-rgb: 255, 209, 92;

    position: relative;

    padding:
        56px
        22px
        82px;

    overflow: visible;

    isolation: isolate;

    color: #f7fffc;

    background:
        radial-gradient(
            ellipse at 7% 4%,
            rgba(61, 221, 181, 0.19) 0%,
            rgba(61, 221, 181, 0.05) 28%,
            transparent 48%
        ),
        radial-gradient(
            ellipse at 90% 5%,
            rgba(67, 179, 255, 0.15) 0%,
            rgba(67, 179, 255, 0.04) 29%,
            transparent 49%
        ),
        radial-gradient(
            ellipse at 92% 58%,
            rgba(255, 209, 92, 0.08) 0%,
            transparent 38%
        ),
        linear-gradient(
            145deg,
            #081918 0%,
            #0b2224 40%,
            #0c1b27 72%,
            #08131d 100%
        );

    border-top:
        1px solid
        rgba(80, 223, 189, 0.20);
}


.banking-section::before {
    content: "";

    position: absolute;

    top: 0;
    left: 50%;

    width:
        min(
            94%,
            1540px
        );

    height: 3px;

    transform:
        translateX(-50%);

    background:
        linear-gradient(
            90deg,
            transparent,
            #49dcb7,
            #52c7ff,
            #ffd15c,
            #50dfbd,
            transparent
        );

    box-shadow:
        0 0 28px
        rgba(67, 210, 184, 0.38);
}


.banking-section[hidden] {
    display: none !important;
}


.banking-container {
    position: relative;

    z-index: 2;

    width:
        min(
            calc(100% - 12px),
            1360px
        );

    margin:
        0 auto;
}


.banking-main {
    min-width: 0;
}


/*=============================================
              Site Navigation Start
=============================================*/

.banking-site-navigation {
    position: absolute;

    top: 0;
    left: -188px;

    width: 162px;

    z-index: 90;

    pointer-events: none;
}


.banking-site-switcher {
    width: 162px;

    padding: 9px;

    display: flex;

    flex-direction: column;

    gap: 8px;

    border:
        1px solid
        rgba(80, 223, 189, 0.20);

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            rgba(11, 39, 38, 0.95),
            rgba(8, 21, 29, 0.97)
        );

    box-shadow:
        0 24px 56px
        rgba(2, 10, 12, 0.44),
        inset 0 1px 0
        rgba(255, 255, 255, 0.06);

    backdrop-filter:
        blur(22px)
        saturate(145%);

    -webkit-backdrop-filter:
        blur(22px)
        saturate(145%);

    pointer-events: auto;
}


.banking-site-navigation.is-floating {
    position: fixed;

    top: 50%;

    left:
        max(
            12px,
            calc(50% - 680px - 188px)
        );

    transform:
        translateY(-50%);
}


.banking-site-navigation.is-at-bottom {
    position: absolute;

    top: auto;
    bottom: 0;
    left: -188px;

    transform: none;
}


.banking-site-switcher-button {
    --section-accent: #50dfbd;
    --section-accent-rgb: 80, 223, 189;
    --section-ink: #06251c;

    width: 100%;

    min-height: 62px;

    padding:
        8px
        7px;

    display: grid;

    grid-template-columns:
        36px
        minmax(0, 1fr);

    align-items: center;

    gap: 7px;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.42
        );

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            rgba(
                var(--section-accent-rgb),
                0.13
            ),
            rgba(255, 255, 255, 0.02)
        );

    color: #ffffff;

    font: inherit;

    text-align: left;

    cursor: pointer;

    transition:
        transform 0.2s ease,
        border-color 0.2s ease,
        background 0.2s ease,
        box-shadow 0.2s ease;
}


.banking-site-switcher-button[data-section-target="pokies"] {
    --section-accent: #ffc83e;
    --section-accent-rgb: 255, 200, 62;
    --section-ink: #2e1d03;
}


.banking-site-switcher-button[data-section-target="live-casino"] {
    --section-accent: #34caff;
    --section-accent-rgb: 52, 202, 255;
    --section-ink: #041f2e;
}


.banking-site-switcher-button[data-section-target="table-games"] {
    --section-accent: #36e097;
    --section-accent-rgb: 54, 224, 151;
    --section-ink: #04251a;
}


.banking-site-switcher-button[data-section-target="promotions"] {
    --section-accent: #ff75ae;
    --section-accent-rgb: 255, 117, 174;
    --section-ink: #33101f;
}


.banking-site-switcher-button[data-section-target="tournaments"] {
    --section-accent: #ffd260;
    --section-accent-rgb: 255, 210, 96;
    --section-ink: #302306;
}


.banking-site-switcher-button[data-section-target="banking"] {
    --section-accent: #50dfbd;
    --section-accent-rgb: 80, 223, 189;
    --section-ink: #06251c;
}


.banking-site-switcher-icon {
    width: 36px;
    height: 36px;

    display: grid;

    place-items: center;

    border:
        1px solid
        rgba(
            var(--section-accent-rgb),
            0.75
        );

    border-radius: 11px;

    background:
        rgba(
            var(--section-accent-rgb),
            0.12
        );

    color:
        var(--section-accent);

    font-size: 9px;

    font-weight: 900;
}


.banking-site-switcher-copy strong {
    display: block;

    font-size: 12px;

    font-weight: 900;

    line-height: 1.08;
}


.banking-site-switcher-copy small {
    display: block;

    margin-top: 3px;

    color:
        rgba(221, 239, 235, 0.70);

    font-size: 9.5px;

    font-weight: 700;
}


.banking-site-switcher-button:hover,
.banking-site-switcher-button:focus-visible {
    transform:
        translateX(5px);

    border-color:
        var(--section-accent);

    box-shadow:
        0 12px 25px
        rgba(2, 10, 12, 0.30),
        0 0 22px
        rgba(
            var(--section-accent-rgb),
            0.18
        );

    outline: none;
}


.banking-site-switcher-button.is-active {
    transform:
        translateX(6px);

    border-color:
        rgba(255, 255, 255, 0.68);

    background:
        linear-gradient(
            135deg,
            var(--section-accent),
            rgba(
                var(--section-accent-rgb),
                0.82
            )
        );

    color:
        var(--section-ink);

    box-shadow:
        0 14px 29px
        rgba(2, 10, 12, 0.34),
        0 0 29px
        rgba(
            var(--section-accent-rgb),
            0.29
        );
}


.banking-site-switcher-button.is-active
.banking-site-switcher-icon {
    color:
        var(--section-ink);

    border-color:
        rgba(0, 0, 0, 0.14);

    background:
        rgba(0, 0, 0, 0.10);
}

/*=============================================
               Site Navigation End
=============================================*/


/*=============================================
                    Intro Start
=============================================*/

.banking-intro {
    margin-bottom: 19px;

    padding:
        34px
        36px;

    display: grid;

    grid-template-columns:
        minmax(0, 1.08fr)
        minmax(330px, 0.58fr);

    gap: 38px;

    align-items: center;

    overflow: hidden;

    border:
        1px solid
        rgba(80, 223, 189, 0.27);

    border-radius: 24px;

    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(66, 217, 181, 0.13),
            transparent 38%
        ),
        radial-gradient(
            circle at 100% 0%,
            rgba(74, 189, 255, 0.10),
            transparent 37%
        ),
        linear-gradient(
            145deg,
            rgba(10, 40, 38, 0.97),
            rgba(9, 22, 31, 0.98)
        );

    box-shadow:
        0 23px 53px
        rgba(2, 10, 12, 0.34),
        inset 0 1px 0
        rgba(255, 255, 255, 0.06);
}


.banking-eyebrow,
.banking-panel-kicker,
.banking-feature-label {
    margin:
        0
        0
        8px;

    color: #6fe7c8;

    font-size: 12px;

    font-weight: 900;

    letter-spacing: 0.12em;

    line-height: 1.3;

    text-transform: uppercase;
}


.banking-intro h2 {
    max-width: 790px;

    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            39px,
            3.7vw,
            56px
        );

    font-weight: 900;

    line-height: 0.99;

    letter-spacing: -0.045em;
}


.banking-intro-copy > p {
    margin:
        13px
        0
        0;

    color: #c9dad6;

    font-size: 15px;

    line-height: 1.60;
}


.banking-intro-copy
.banking-intro-lead {
    color: #ffffff;

    font-size: 17px;

    font-weight: 750;
}


.banking-intro-more,
.banking-deep-guide {
    margin-top: 15px;
}


.banking-intro-more summary,
.banking-deep-guide summary {
    width: fit-content;

    min-height: 42px;

    padding:
        0
        15px;

    display: inline-flex;

    align-items: center;

    gap: 10px;

    list-style: none;

    border:
        1px solid
        rgba(83, 220, 187, 0.33);

    border-radius: 10px;

    background:
        linear-gradient(
            135deg,
            rgba(80, 223, 189, 0.09),
            rgba(85, 200, 255, 0.05)
        );

    color: #ffffff;

    font-size: 12px;

    font-weight: 900;

    cursor: pointer;
}


.banking-intro-more summary::-webkit-details-marker,
.banking-deep-guide summary::-webkit-details-marker {
    display: none;
}


.banking-intro-more summary::after,
.banking-deep-guide summary::after {
    content: "+";

    color: #69e6c7;

    font-size: 19px;

    font-weight: 900;
}


.banking-intro-more[open]
summary::after,
.banking-deep-guide[open]
summary::after {
    transform:
        rotate(45deg);
}


.banking-intro-more > div,
.banking-deep-guide > div {
    margin-top: 9px;

    padding:
        14px
        16px;

    max-height: 310px;

    overflow-y: auto;

    border:
        1px solid
        rgba(83, 220, 187, 0.14);

    border-radius: 10px;

    background:
        rgba(2, 12, 13, 0.26);
}


.banking-intro-more p,
.banking-deep-guide p {
    margin: 0;

    color: #c4d6d2;

    font-size: 12px;

    line-height: 1.6;
}


.banking-intro-more p + p,
.banking-deep-guide p + p {
    margin-top: 9px;
}


.banking-intro-media {
    position: relative;

    min-height: 350px;

    margin: 0;

    overflow: hidden;

    border:
        1px solid
        rgba(79, 221, 187, 0.39);

    border-radius: 20px;

    background: #071918;

    box-shadow:
        0 20px 44px
        rgba(2, 10, 12, 0.36);
}


.banking-intro-media img {
    width: 100%;

    height: 350px;

    object-fit: cover;

    object-position: center;
}


.banking-intro-media::after {
    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(3, 15, 17, 0.02) 24%,
            rgba(3, 15, 17, 0.90) 100%
        );
}


.banking-intro-media figcaption {
    position: absolute;

    z-index: 2;

    left: 20px;
    right: 20px;
    bottom: 18px;
}


.banking-intro-media figcaption span,
.banking-intro-media figcaption strong,
.banking-intro-media figcaption small {
    display: block;
}


.banking-intro-media figcaption span {
    color: #75e7ca;

    font-size: 10px;

    font-weight: 900;

    text-transform: uppercase;
}


.banking-intro-media figcaption strong {
    margin-top: 4px;

    color: #ffffff;

    font-size: 25px;

    font-weight: 900;
}


.banking-intro-media figcaption small {
    margin-top: 6px;

    color: #cfddda;

    font-size: 11px;
}

/*=============================================
                     Intro End
=============================================*/


/*=============================================
                  Snapshot Start
=============================================*/

.banking-snapshot {
    margin-bottom: 16px;

    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.banking-snapshot article {
    --snap-rgb: 80, 223, 189;
    --snap-color: #50dfbd;

    padding:
        14px;

    border:
        1px solid
        rgba(
            var(--snap-rgb),
            0.24
        );

    border-radius: 12px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--snap-rgb),
                0.08
            ),
            rgba(255, 255, 255, 0.016)
        );
}


.banking-snapshot article[data-banking-snapshot="minimum"] {
    --snap-rgb: 255, 209, 92;
    --snap-color: #ffd15c;
}


.banking-snapshot article[data-banking-snapshot="deposit"] {
    --snap-rgb: 82, 204, 255;
    --snap-color: #52ccff;
}


.banking-snapshot article[data-banking-snapshot="wallet"] {
    --snap-rgb: 111, 213, 181;
    --snap-color: #6fd5b5;
}


.banking-snapshot article[data-banking-snapshot="card"] {
    --snap-rgb: 121, 164, 255;
    --snap-color: #79a4ff;
}


.banking-snapshot article[data-banking-snapshot="bank"] {
    --snap-rgb: 175, 136, 255;
    --snap-color: #af88ff;
}


.banking-snapshot span,
.banking-snapshot strong,
.banking-snapshot small {
    display: block;
}


.banking-snapshot span {
    color:
        var(--snap-color);

    font-size: 10px;

    font-weight: 900;
}


.banking-snapshot strong {
    margin-top: 4px;

    color: #ffffff;

    font-size: 21px;

    font-weight: 900;
}


.banking-snapshot small {
    margin-top: 4px;

    color: #bfd0cc;

    font-size: 10px;
}

/*=============================================
                   Snapshot End
=============================================*/


/*=============================================
                     Tabs Start
=============================================*/

.banking-tabs {
    margin-bottom: 16px;

    display: grid;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.banking-tab {
    --tab-rgb: 80, 223, 189;
    --tab-color: #50dfbd;
    --tab-ink: #06251c;

    min-height: 72px;

    padding:
        9px
        11px;

    display: flex;

    align-items: center;

    gap: 9px;

    border:
        1px solid
        rgba(
            var(--tab-rgb),
            0.38
        );

    border-radius: 14px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--tab-rgb),
                0.12
            ),
            rgba(255, 255, 255, 0.02)
        );

    color: #ffffff;

    font: inherit;

    text-align: left;

    cursor: pointer;
}


.banking-tab[data-banking-target="overview"] {
    --tab-rgb: 85, 200, 255;
    --tab-color: #55c8ff;
    --tab-ink: #062532;
}


.banking-tab[data-banking-target="deposits"] {
    --tab-rgb: 255, 209, 92;
    --tab-color: #ffd15c;
    --tab-ink: #302305;
}


.banking-tab[data-banking-target="withdrawals"] {
    --tab-rgb: 80, 223, 189;
    --tab-color: #50dfbd;
    --tab-ink: #06251c;
}


.banking-tab[data-banking-target="methods"] {
    --tab-rgb: 122, 163, 255;
    --tab-color: #7aa3ff;
    --tab-ink: #0a1933;
}


.banking-tab[data-banking-target="security"] {
    --tab-rgb: 185, 139, 255;
    --tab-color: #b98bff;
    --tab-ink: #211136;
}


.banking-tab-icon {
    width: 38px;
    height: 38px;

    display: grid;

    place-items: center;

    flex:
        0
        0
        38px;

    border:
        1px solid
        var(--tab-color);

    border-radius: 11px;

    background:
        rgba(
            var(--tab-rgb),
            0.13
        );

    color:
        var(--tab-color);

    font-size: 10px;

    font-weight: 900;
}


.banking-tab strong {
    display: block;

    font-size: 13px;

    font-weight: 900;
}


.banking-tab small {
    display: block;

    margin-top: 3px;

    color:
        rgba(221, 235, 232, 0.70);

    font-size: 10px;
}


.banking-tab:hover,
.banking-tab:focus-visible {
    transform:
        translateY(-3px);

    border-color:
        var(--tab-color);

    outline: none;
}


.banking-tab.is-active {
    transform:
        translateY(-3px);

    border-color:
        rgba(255, 255, 255, 0.66);

    background:
        linear-gradient(
            135deg,
            var(--tab-color),
            rgba(
                var(--tab-rgb),
                0.82
            )
        );

    color:
        var(--tab-ink);

    box-shadow:
        0 14px 28px
        rgba(2, 10, 12, 0.30),
        0 0 26px
        rgba(
            var(--tab-rgb),
            0.23
        );
}


.banking-tab.is-active
.banking-tab-icon {
    color:
        var(--tab-ink);

    border-color:
        rgba(0, 0, 0, 0.14);

    background:
        rgba(0, 0, 0, 0.10);
}

/*=============================================
                      Tabs End
=============================================*/


/*=============================================
                    Stage Start
=============================================*/

.banking-stage {
    padding: 26px;

    border:
        1px solid
        rgba(80, 223, 189, 0.20);

    border-radius: 21px;

    background:
        radial-gradient(
            circle at 96% 4%,
            rgba(80, 223, 189, 0.07),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            rgba(10, 35, 34, 0.98),
            rgba(8, 18, 28, 0.99)
        );

    box-shadow:
        0 23px 52px
        rgba(2, 10, 12, 0.33);
}


.banking-panel[hidden] {
    display: none !important;
}


.banking-panel-heading {
    padding-bottom: 19px;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        215px;

    gap: 30px;

    align-items: center;

    border-bottom:
        1px solid
        rgba(80, 223, 189, 0.19);
}


.banking-panel-heading-wide {
    grid-template-columns:
        minmax(0, 1fr)
        185px;
}


.banking-panel h3,
.banking-guide h3,
.banking-closing h3 {
    margin: 0;

    color: #ffffff;

    font-size:
        clamp(
            30px,
            2.6vw,
            41px
        );

    font-weight: 900;

    line-height: 1.05;

    letter-spacing: -0.035em;
}


.banking-panel-heading p {
    margin:
        10px
        0
        0;

    color: #c8d8d4;

    font-size: 14px;

    line-height: 1.58;
}


.banking-panel-mark {
    padding: 15px;

    border:
        1px solid
        rgba(80, 223, 189, 0.39);

    border-radius: 14px;

    background:
        rgba(80, 223, 189, 0.06);

    text-align: center;
}


.banking-panel-mark span,
.banking-panel-mark strong,
.banking-panel-mark small {
    display: block;
}


.banking-panel-mark span {
    color: #c3d5d0;

    font-size: 10px;
}


.banking-panel-mark strong {
    margin-top: 5px;

    color: #63e5c4;

    font-size: 27px;

    font-weight: 900;
}


.banking-panel-mark small {
    margin-top: 5px;

    color: #ffffff;

    font-size: 10px;
}

/*=============================================
                     Stage End
=============================================*/


/*=============================================
                 Common Grids Start
=============================================*/

.banking-benefit-grid,
.banking-security-grid {
    margin-top: 19px;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.banking-benefit-grid article,
.banking-security-grid article {
    padding: 15px;

    border:
        1px solid
        rgba(80, 223, 189, 0.17);

    border-radius: 11px;

    background:
        rgba(255, 255, 255, 0.019);
}


.banking-benefit-grid article > span,
.banking-security-grid article > span {
    display: block;

    margin-bottom: 5px;

    color: #64e4c3;

    font-size: 9px;

    font-weight: 900;
}


.banking-benefit-grid strong,
.banking-security-grid strong {
    color: #ffffff;

    font-size: 13px;

    font-weight: 900;
}


.banking-benefit-grid p,
.banking-security-grid p {
    margin:
        6px
        0
        0;

    color: #bed0cb;

    font-size: 11px;

    line-height: 1.47;
}


.banking-flow {
    margin-top: 20px;

    padding-top: 18px;

    display: grid;

    grid-template-columns:
        minmax(230px, 0.35fr)
        minmax(0, 1.65fr);

    gap: 25px;

    border-top:
        1px solid
        rgba(80, 223, 189, 0.16);
}


.banking-flow h4,
.banking-primary-copy h4,
.banking-verification h4 {
    margin:
        5px
        0
        0;

    color: #ffffff;

    font-size: 22px;

    font-weight: 900;
}


.banking-flow-grid,
.banking-instruction-grid,
.banking-withdrawal-process {
    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.banking-flow-grid article,
.banking-instruction-grid article,
.banking-withdrawal-process article {
    padding: 13px;

    border:
        1px solid
        rgba(80, 223, 189, 0.16);

    border-radius: 10px;

    background:
        rgba(255, 255, 255, 0.018);
}


.banking-flow-grid strong,
.banking-instruction-grid strong,
.banking-withdrawal-process strong {
    color: #ffffff;

    font-size: 12px;

    font-weight: 900;
}


.banking-flow-grid p,
.banking-instruction-grid p,
.banking-withdrawal-process p {
    margin:
        5px
        0
        0;

    color: #bed0cb;

    font-size: 10.5px;

    line-height: 1.44;
}


.banking-instruction-grid {
    margin-top: 15px;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 1fr)
        );
}


.banking-instruction-grid article > span {
    display: block;

    margin-bottom: 6px;

    color: #ffd15c;

    font-size: 11px;

    font-weight: 900;
}

/*=============================================
                  Common Grids End
=============================================*/


/*=============================================
                Primary Layout Start
=============================================*/

.banking-primary-layout {
    margin-top: 20px;

    display: grid;

    grid-template-columns:
        minmax(0, 1.2fr)
        minmax(320px, 0.8fr);

    gap: 25px;

    align-items: center;
}


.banking-primary-copy p {
    margin:
        8px
        0
        0;

    color: #c5d5d1;

    font-size: 12px;

    line-height: 1.56;
}


.banking-stat-board {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.banking-stat-board article {
    padding: 13px;

    border:
        1px solid
        rgba(255, 209, 92, 0.17);

    border-radius: 10px;

    background:
        rgba(255, 209, 92, 0.035);

    text-align: center;
}


.banking-stat-board span,
.banking-stat-board strong {
    display: block;
}


.banking-stat-board span {
    color: #b9c9c5;

    font-size: 9px;
}


.banking-stat-board strong {
    margin-top: 4px;

    color: #ffd15c;

    font-size: 17px;

    font-weight: 900;
}

/*=============================================
                 Primary Layout End
=============================================*/


/*=============================================
                Withdrawals Start
=============================================*/

.banking-withdrawal-grid {
    margin-top: 20px;

    display: grid;

    grid-template-columns:
        repeat(
            3,
            minmax(0, 1fr)
        );

    gap: 9px;
}


.banking-withdrawal-grid article {
    --withdraw-rgb: 80, 223, 189;
    --withdraw-color: #50dfbd;

    padding: 18px;

    border:
        1px solid
        rgba(
            var(--withdraw-rgb),
            0.22
        );

    border-radius: 13px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--withdraw-rgb),
                0.07
            ),
            rgba(255, 255, 255, 0.017)
        );
}


.banking-withdrawal-grid article[data-withdrawal-type="card"] {
    --withdraw-rgb: 121, 164, 255;
    --withdraw-color: #79a4ff;
}


.banking-withdrawal-grid article[data-withdrawal-type="bank"] {
    --withdraw-rgb: 181, 139, 255;
    --withdraw-color: #b58bff;
}


.banking-withdrawal-label {
    display: block;

    color:
        var(--withdraw-color);

    font-size: 10px;

    font-weight: 900;

    text-transform: uppercase;
}


.banking-withdrawal-time {
    display: block;

    margin-top: 8px;

    color:
        var(--withdraw-color);

    font-size: 25px;

    font-weight: 900;
}


.banking-withdrawal-grid h4 {
    margin:
        8px
        0
        0;

    color: #ffffff;

    font-size: 17px;

    font-weight: 900;
}


.banking-withdrawal-grid p {
    margin:
        7px
        0
        0;

    color: #c5d3d0;

    font-size: 11px;

    line-height: 1.5;
}


.banking-withdrawal-process {
    margin-top: 15px;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 1fr)
        );
}


.banking-withdrawal-note {
    margin-top: 15px;

    padding:
        14px
        16px;

    border-left:
        3px solid
        #50dfbd;

    background:
        rgba(80, 223, 189, 0.045);
}


.banking-withdrawal-note strong {
    color: #ffffff;

    font-size: 13px;

    font-weight: 900;
}


.banking-withdrawal-note p {
    margin:
        5px
        0
        0;

    color: #c4d4d0;

    font-size: 11px;

    line-height: 1.48;
}

/*=============================================
                 Withdrawals End
=============================================*/


/*=============================================
                   Methods Start
=============================================*/

.banking-method-groups {
    margin-top: 20px;

    display: grid;

    gap: 10px;
}


.banking-method-group {
    --method-rgb: 80, 223, 189;
    --method-color: #50dfbd;

    padding: 17px;

    display: grid;

    grid-template-columns:
        minmax(260px, 0.46fr)
        minmax(0, 1.54fr);

    gap: 22px;

    align-items: center;

    border:
        1px solid
        rgba(
            var(--method-rgb),
            0.18
        );

    border-radius: 12px;

    background:
        linear-gradient(
            145deg,
            rgba(
                var(--method-rgb),
                0.05
            ),
            rgba(255, 255, 255, 0.016)
        );
}


.banking-method-group[data-method-theme="cards"] {
    --method-rgb: 255, 209, 92;
    --method-color: #ffd15c;
}


.banking-method-group[data-method-theme="wallets"] {
    --method-rgb: 80, 223, 189;
    --method-color: #50dfbd;
}


.banking-method-group[data-method-theme="prepaid"] {
    --method-rgb: 255, 132, 181;
    --method-color: #ff84b5;
}


.banking-method-group[data-method-theme="crypto"] {
    --method-rgb: 255, 174, 67;
    --method-color: #ffae43;
}


.banking-method-group[data-method-theme="bank"] {
    --method-rgb: 116, 168, 255;
    --method-color: #74a8ff;
}


.banking-method-group-head > span {
    display: block;

    color:
        var(--method-color);

    font-size: 9px;

    font-weight: 900;
}


.banking-method-group h4 {
    margin:
        5px
        0
        0;

    color: #ffffff;

    font-size: 18px;

    font-weight: 900;
}


.banking-method-group p {
    margin:
        6px
        0
        0;

    color: #bdcdc9;

    font-size: 10.5px;

    line-height: 1.45;
}


.banking-method-list {
    display: flex;

    flex-wrap: wrap;

    gap: 7px;
}


.banking-method-list span {
    padding:
        8px
        11px;

    border:
        1px solid
        rgba(
            var(--method-rgb),
            0.25
        );

    border-radius: 8px;

    background:
        rgba(
            var(--method-rgb),
            0.055
        );

    color: #ffffff;

    font-size: 10.5px;

    font-weight: 800;
}

/*=============================================
                    Methods End
=============================================*/


/*=============================================
                  Security Start
=============================================*/

.banking-verification {
    margin-top: 20px;

    padding-top: 18px;

    border-top:
        1px solid
        rgba(80, 223, 189, 0.16);
}


.banking-verification-grid {
    margin-top: 13px;

    display: grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.banking-verification-grid article {
    padding: 13px;

    border:
        1px solid
        rgba(185, 139, 255, 0.16);

    border-radius: 10px;

    background:
        rgba(185, 139, 255, 0.025);
}


.banking-verification-grid strong {
    color: #ffffff;

    font-size: 12px;

    font-weight: 900;
}


.banking-verification-grid p {
    margin:
        5px
        0
        0;

    color: #c7d1cf;

    font-size: 10.5px;

    line-height: 1.45;
}

/*=============================================
                   Security End
=============================================*/


/*=============================================
                    Guide Start
=============================================*/

.banking-guide {
    margin-top: 21px;

    padding:
        22px
        24px;

    border:
        1px solid
        rgba(80, 223, 189, 0.17);

    border-radius: 17px;

    background:
        rgba(255, 255, 255, 0.016);
}


.banking-guide-grid {
    margin-top: 15px;

    display: grid;

    grid-template-columns:
        repeat(
            5,
            minmax(0, 1fr)
        );

    gap: 8px;
}


.banking-guide-grid article {
    padding: 14px;

    border:
        1px solid
        rgba(80, 223, 189, 0.14);

    border-radius: 10px;

    background:
        rgba(255, 255, 255, 0.018);
}


.banking-guide-grid strong {
    color: #ffffff;

    font-size: 12px;

    font-weight: 900;
}


.banking-guide-grid p {
    margin:
        5px
        0
        0;

    color: #becfcb;

    font-size: 10.5px;

    line-height: 1.45;
}

/*=============================================
                     Guide End
=============================================*/


/*=============================================
                   Closing Start
=============================================*/

.banking-closing {
    margin-top: 21px;

    padding:
        24px
        26px;

    display: grid;

    grid-template-columns:
        minmax(0, 0.76fr)
        minmax(0, 1.24fr);

    gap: 36px;

    align-items: center;

    border:
        1px solid
        rgba(80, 223, 189, 0.16);

    border-radius: 17px;

    background:
        radial-gradient(
            circle at 0% 50%,
            rgba(80, 223, 189, 0.06),
            transparent 34%
        ),
        rgba(255, 255, 255, 0.016);
}


.banking-closing > div:last-child p {
    margin: 0;

    color: #c4d4d0;

    font-size: 12px;

    line-height: 1.57;
}


.banking-closing > div:last-child p + p {
    margin-top: 8px;
}

/*=============================================
                    Closing End
=============================================*/


/*=============================================
                 Responsive Start
=============================================*/

@media (max-width: 1500px) {

    .banking-container {
        width:
            min(
                calc(100% - 18px),
                1260px
            );
    }


    .banking-site-navigation {
        left: -160px;

        width: 140px;
    }


    .banking-site-switcher {
        width: 140px;
    }


    .banking-site-navigation.is-at-bottom {
        left: -160px;
    }

}


@media (max-width: 1240px) {

    .banking-site-navigation,
    .banking-site-navigation.is-floating,
    .banking-site-navigation.is-at-bottom {
        position: static;

        width: 100%;

        margin-bottom: 16px;

        transform: none;

        pointer-events: auto;
    }


    .banking-site-switcher {
        width: 100%;

        flex-direction: row;

        overflow-x: auto;

        scrollbar-width: none;
    }


    .banking-site-switcher::-webkit-scrollbar {
        display: none;
    }


    .banking-site-switcher-button {
        min-width: 155px;

        flex:
            0
            0
            155px;
    }


    .banking-intro {
        grid-template-columns: 1fr;
    }


    .banking-tabs {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }


    .banking-flow,
    .banking-primary-layout,
    .banking-method-group {
        grid-template-columns: 1fr;
    }


    .banking-benefit-grid,
    .banking-security-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .banking-instruction-grid,
    .banking-withdrawal-process {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }


    .banking-guide-grid {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            );
    }

}


@media (max-width: 920px) {

    .banking-panel-heading,
    .banking-panel-heading-wide {
        grid-template-columns: 1fr;
    }


    .banking-panel-mark {
        max-width: 290px;
    }


    .banking-withdrawal-grid,
    .banking-snapshot {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }


    .banking-verification-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


@media (max-width: 760px) {

    .banking-section {
        padding:
            34px
            12px
            58px;
    }


    .banking-container {
        width: 100%;
    }


    .banking-intro {
        padding:
            25px
            20px;
    }


    .banking-intro h2 {
        font-size:
            clamp(
                33px,
                9vw,
                47px
            );
    }


    .banking-tabs {
        display: flex;

        gap: 8px;

        overflow-x: auto;

        padding-bottom: 4px;

        scrollbar-width: none;

        scroll-snap-type:
            x mandatory;
    }


    .banking-tabs::-webkit-scrollbar {
        display: none;
    }


    .banking-tab {
        min-width: 190px;

        flex:
            0
            0
            190px;

        scroll-snap-align: start;
    }


    .banking-stage {
        padding:
            18px
            13px;
    }


    .banking-snapshot,
    .banking-benefit-grid,
    .banking-flow-grid,
    .banking-instruction-grid,
    .banking-stat-board,
    .banking-withdrawal-grid,
    .banking-withdrawal-process,
    .banking-security-grid,
    .banking-verification-grid,
    .banking-guide-grid {
        grid-template-columns: 1fr;
    }


    .banking-closing {
        grid-template-columns: 1fr;

        gap: 16px;
    }

}

/*=============================================
                  Responsive End
=============================================*/

/*=============================================
                   Banking End
=============================================*/
/*=============================================
      Main Section Images Height Fix Start
=============================================*/

/* Promotions */
.promotion-intro-media {
    min-height: 440px !important;
}

.promotion-intro-media img {
    width: 100% !important;
    height: 440px !important;
    object-fit: cover !important;
    object-position: center !important;
}


/* Tournaments */
.tournaments-intro-media {
    min-height: 520px !important;
}

.tournaments-intro-media img {
    width: 100% !important;
    height: 520px !important;
    object-fit: cover !important;
    object-position: center !important;
}


/* Banking / Payments */
.banking-intro-media {
    min-height: 520px !important;
}

.banking-intro-media img {
    width: 100% !important;
    height: 520px !important;
    object-fit: cover !important;
    object-position: center !important;
}


/* Mobile */
@media (max-width: 760px) {

    .promotion-intro-media,
    .tournaments-intro-media,
    .banking-intro-media {
        min-height: 390px !important;
    }

    .promotion-intro-media img,
    .tournaments-intro-media img,
    .banking-intro-media img {
        height: 390px !important;
    }

}

/*=============================================
       Main Section Images Height Fix End
=============================================*/
/*=============================================
                    Footer Start
=============================================*/

.site-footer {
    position: relative;

    padding:
        54px
        22px
        21px;

    overflow: hidden;

    isolation: isolate;

    color: #dce8ea;

    border-top:
        1px solid
        rgba(255, 200, 59, 0.18);

    background:
        radial-gradient(
            ellipse at 6% 0%,
            rgba(255, 193, 51, 0.10),
            transparent 31%
        ),
        radial-gradient(
            ellipse at 72% 0%,
            rgba(47, 164, 255, 0.085),
            transparent 32%
        ),
        radial-gradient(
            ellipse at 94% 86%,
            rgba(63, 223, 177, 0.08),
            transparent 30%
        ),
        linear-gradient(
            150deg,
            #07111c 0%,
            #071722 43%,
            #061219 72%,
            #040a10 100%
        );
}


.site-footer::before {
    content: "";

    position: absolute;

    top: 0;
    left: 50%;

    width:
        min(
            94%,
            1540px
        );

    height: 3px;

    transform:
        translateX(-50%);

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            #ffc63b 15%,
            #ff8c2f 28%,
            #46cfff 43%,
            #ff58ad 58%,
            #866bff 72%,
            #4ae0b4 87%,
            transparent 100%
        );

    box-shadow:
        0 0 30px
        rgba(255, 193, 52, 0.20);
}


.footer-glow {
    position: absolute;

    width: 500px;
    height: 500px;

    right: -210px;
    top: -250px;

    border-radius: 50%;

    pointer-events: none;

    background:
        radial-gradient(
            circle,
            rgba(50, 184, 255, 0.08),
            transparent 67%
        );

    filter:
        blur(4px);
}


.footer-container {
    position: relative;

    z-index: 2;

    width:
        min(
            100%,
            1360px
        );

    margin:
        0 auto;
}


/*=============================================
               Footer Main Start
=============================================*/

.footer-main {
    display: grid;

    grid-template-columns:
        minmax(320px, 1.42fr)
        minmax(120px, 0.52fr)
        minmax(145px, 0.62fr)
        minmax(165px, 0.70fr)
        minmax(170px, 0.72fr);

    gap:
        30px;

    align-items:
        start;
}

/*=============================================
                Footer Main End
=============================================*/


/*=============================================
               Footer Brand Start
=============================================*/

.footer-brand {
    max-width:
        455px;
}


.footer-logo {
    width:
        fit-content;

    display:
        inline-flex;

    align-items:
        center;

    gap:
        10px;
}


.footer-logo-symbol {
    width:
        42px;

    height:
        42px;

    display:
        inline-grid;

    place-items:
        center;

    flex-shrink:
        0;

    border:
        2px solid
        rgba(255, 219, 88, 0.94);

    border-radius:
        50%;

    background:
        radial-gradient(
            circle at 36% 30%,
            #49a5ff 0%,
            #0d4a7b 45%,
            #041a2c 100%
        );

    color:
        #ffffff;

    font-size:
        20px;

    font-weight:
        900;

    box-shadow:
        0 0 17px
        rgba(57, 167, 255, 0.28),
        0 0 16px
        rgba(255, 198, 55, 0.22);

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease;
}


.footer-logo-text {
    display:
        flex;

    flex-direction:
        column;

    line-height:
        1;
}


.footer-logo-text strong {
    background:
        linear-gradient(
            180deg,
            #fff5a8 0%,
            #ffca39 48%,
            #e99512 100%
        );

    -webkit-background-clip:
        text;

    background-clip:
        text;

    color:
        transparent;

    font-size:
        27px;

    font-weight:
        900;

    font-style:
        italic;

    letter-spacing:
        -0.045em;
}


.footer-logo-text small {
    margin-top:
        5px;

    color:
        #66d2ff;

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        0.25em;
}


.footer-logo:hover
.footer-logo-symbol,
.footer-logo:focus-visible
.footer-logo-symbol {
    transform:
        translateY(-2px);

    border-color:
        #ffffff;

    box-shadow:
        0 0 24px
        rgba(57, 167, 255, 0.42),
        0 0 23px
        rgba(255, 198, 55, 0.34);
}


.footer-logo:focus-visible {
    outline:
        none;
}


.footer-brand-lead {
    margin:
        18px
        0
        0;

    color:
        #eff5f6;

    font-size:
        14px;

    font-weight:
        750;

    line-height:
        1.6;
}


.footer-brand-note {
    margin:
        10px
        0
        0;

    color:
        #a8b9bd;

    font-size:
        12px;

    line-height:
        1.58;
}

/*=============================================
                Footer Brand End
=============================================*/


/*=============================================
               Footer Badges Start
=============================================*/

.footer-badges {
    margin-top:
        15px;

    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        6px;
}


.footer-badges span {
    min-height:
        29px;

    padding:
        5px
        10px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid
        rgba(66, 218, 184, 0.23);

    border-radius:
        999px;

    background:
        rgba(66, 218, 184, 0.05);

    color:
        #84e7ce;

    font-size:
        10px;

    font-weight:
        900;

    line-height:
        1;
}


.footer-badges span:first-child {
    border-color:
        rgba(255, 206, 88, 0.41);

    background:
        rgba(255, 206, 88, 0.06);

    color:
        #ffe187;
}


.footer-badges span:nth-child(2) {
    border-color:
        rgba(74, 183, 255, 0.35);

    color:
        #80ceff;
}


.footer-badges span:nth-child(3) {
    border-color:
        rgba(80, 223, 189, 0.34);

    color:
        #72e9c9;
}

/*=============================================
                Footer Badges End
=============================================*/


/*=============================================
               Footer Links Start
=============================================*/

.footer-links h3 {
    margin:
        2px
        0
        15px;

    color:
        #ffffff;

    font-size:
        15px;

    font-weight:
        900;

    line-height:
        1.2;
}


.footer-links ul {
    margin:
        0;

    padding:
        0;

    list-style:
        none;
}


.footer-links li + li {
    margin-top:
        8px;
}


.footer-links a {
    position:
        relative;

    display:
        inline-block;

    color:
        #b6c6ca;

    font-size:
        12.5px;

    font-weight:
        700;

    line-height:
        1.4;

    transition:
        color 0.2s ease,
        transform 0.2s ease,
        text-shadow 0.2s ease;
}


.footer-links a::before {
    content:
        "";

    position:
        absolute;

    left:
        -10px;

    top:
        50%;

    width:
        5px;

    height:
        5px;

    border-radius:
        50%;

    background:
        #5edec1;

    opacity:
        0;

    transform:
        translateY(-50%)
        scale(0.5);

    transition:
        opacity 0.2s ease,
        transform 0.2s ease;
}


.footer-links a:hover,
.footer-links a:focus-visible {
    color:
        #7ce9d0;

    transform:
        translateX(4px);

    text-shadow:
        0 0 12px
        rgba(79, 222, 190, 0.20);

    outline:
        none;
}


.footer-links a:hover::before,
.footer-links a:focus-visible::before {
    opacity:
        1;

    transform:
        translateY(-50%)
        scale(1);
}


/*=============================================
             Footer Games Start
=============================================*/

.footer-games a:hover,
.footer-games a:focus-visible {
    color:
        #72caff;
}


.footer-games a:hover::before,
.footer-games a:focus-visible::before {
    background:
        #5dc5ff;
}

/*=============================================
              Footer Games End
=============================================*/


/*=============================================
             Footer Rewards Start
=============================================*/

.footer-rewards a:hover,
.footer-rewards a:focus-visible {
    color:
        #ffb3d1;
}


.footer-rewards a:hover::before,
.footer-rewards a:focus-visible::before {
    background:
        #ff75ae;
}

/*=============================================
              Footer Rewards End
=============================================*/


/*=============================================
              Footer Legal Start
=============================================*/

.footer-legal a {
    color:
        #c9c3d5;
}


.footer-legal a:hover,
.footer-legal a:focus-visible,
.footer-legal a[aria-current="page"] {
    color:
        #ffd577;

    text-shadow:
        0 0 12px
        rgba(255, 205, 83, 0.18);
}


.footer-legal a:hover::before,
.footer-legal a:focus-visible::before,
.footer-legal a[aria-current="page"]::before {
    background:
        #ffd05d;

    opacity:
        1;

    transform:
        translateY(-50%)
        scale(1);
}


.footer-legal-note {
    margin-top:
        18px;

    padding:
        11px
        12px;

    border:
        1px solid
        rgba(255, 206, 88, 0.14);

    border-radius:
        10px;

    background:
        rgba(255, 206, 88, 0.035);
}


.footer-legal-note span {
    display:
        block;

    color:
        #ffd66f;

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        0.10em;

    text-transform:
        uppercase;
}


.footer-legal-note p {
    margin:
        5px
        0
        0;

    color:
        #aeb9bd;

    font-size:
        10.5px;

    line-height:
        1.45;
}

/*=============================================
               Footer Legal End
=============================================*/

/*=============================================
                Footer Links End
=============================================*/


/*=============================================
           Footer Feature Strip Start
=============================================*/

.footer-feature-strip {
    margin-top:
        32px;

    padding:
        17px
        0;

    display:
        grid;

    grid-template-columns:
        repeat(
            4,
            minmax(0, 1fr)
        );

    gap:
        9px;

    border-top:
        1px solid
        rgba(133, 173, 185, 0.13);

    border-bottom:
        1px solid
        rgba(133, 173, 185, 0.13);
}


.footer-feature-strip article {
    min-width:
        0;

    padding:
        12px;

    display:
        grid;

    grid-template-columns:
        37px
        minmax(0, 1fr);

    gap:
        10px;

    align-items:
        center;

    border:
        1px solid
        rgba(68, 208, 182, 0.12);

    border-radius:
        11px;

    background:
        rgba(255, 255, 255, 0.016);
}


.footer-feature-icon {
    width:
        37px;

    height:
        37px;

    display:
        grid;

    place-items:
        center;

    border:
        1px solid
        rgba(255, 204, 73, 0.26);

    border-radius:
        10px;

    background:
        rgba(255, 204, 73, 0.045);

    color:
        #ffd568;

    font-size:
        9px;

    font-weight:
        900;
}


.footer-feature-strip strong {
    display:
        block;

    color:
        #ffffff;

    font-size:
        11.5px;

    font-weight:
        900;
}


.footer-feature-strip small {
    display:
        block;

    margin-top:
        3px;

    color:
        #9eafb3;

    font-size:
        9.5px;

    line-height:
        1.35;
}

/*=============================================
            Footer Feature Strip End
=============================================*/


/*=============================================
          Responsible Gambling Start
=============================================*/

.footer-responsible {
    padding:
        19px
        0;

    display:
        grid;

    grid-template-columns:
        55px
        minmax(0, 1fr);

    gap:
        18px;

    align-items:
        center;

    border-bottom:
        1px solid
        rgba(133, 173, 185, 0.13);
}


.footer-age {
    width:
        55px;

    height:
        55px;

    display:
        grid;

    place-items:
        center;

    border:
        2px solid
        #ffd05d;

    border-radius:
        50%;

    background:
        rgba(255, 208, 93, 0.055);

    color:
        #ffe18a;

    font-size:
        15px;

    font-weight:
        900;

    box-shadow:
        0 0 18px
        rgba(255, 205, 83, 0.12);
}


.footer-responsible-content {
    display:
        grid;

    grid-template-columns:
        260px
        minmax(0, 1fr);

    gap:
        24px;

    align-items:
        center;
}


.footer-responsible-kicker {
    display:
        block;

    margin-bottom:
        3px;

    color:
        #62dfbf;

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        0.12em;

    text-transform:
        uppercase;
}


.footer-responsible-content strong {
    display:
        block;

    color:
        #ffffff;

    font-size:
        15px;

    font-weight:
        900;

    line-height:
        1.28;
}


.footer-responsible-content p {
    margin:
        0;

    color:
        #b5c6c9;

    font-size:
        12px;

    line-height:
        1.58;
}


.footer-responsible-content a {
    color:
        #ffe08a;

    font-weight:
        900;

    text-decoration:
        underline;

    text-decoration-thickness:
        1px;

    text-underline-offset:
        3px;
}


.footer-responsible-content a:hover,
.footer-responsible-content a:focus-visible {
    color:
        #ffffff;

    outline:
        none;
}

/*=============================================
           Responsible Gambling End
=============================================*/


/*=============================================
               Footer Bottom Start
=============================================*/

.footer-bottom {
    padding-top:
        15px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        24px;
}


.footer-bottom p {
    margin:
        0;

    color:
        #7f969c;

    font-size:
        11px;

    line-height:
        1.45;
}


.footer-bottom-note {
    max-width:
        670px;

    text-align:
        right;
}

/*=============================================
                Footer Bottom End
=============================================*/


/*=============================================
             Footer Responsive Start
=============================================*/

@media (max-width: 1180px) {

    .footer-main {
        grid-template-columns:
            minmax(280px, 1.2fr)
            repeat(
                2,
                minmax(150px, 0.58fr)
            );

        gap:
            31px
            38px;
    }


    .footer-brand {
        grid-row:
            span 2;
    }


    .footer-feature-strip {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


@media (max-width: 900px) {

    .footer-main {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            29px
            38px;
    }


    .footer-brand {
        grid-column:
            1 / -1;

        grid-row:
            auto;

        max-width:
            720px;
    }


    .footer-responsible-content {
        grid-template-columns:
            1fr;

        gap:
            5px;
    }

}


@media (max-width: 620px) {

    .site-footer {
        padding:
            38px
            14px
            17px;
    }


    .footer-main {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        gap:
            27px
            20px;
    }


    .footer-brand {
        grid-column:
            1 / -1;
    }


    .footer-brand-lead {
        font-size:
            13px;
    }


    .footer-brand-note {
        font-size:
            12px;
    }


    .footer-feature-strip {
        grid-template-columns:
            1fr;
    }


    .footer-responsible {
        grid-template-columns:
            48px
            minmax(0, 1fr);

        gap:
            13px;
    }


    .footer-age {
        width:
            48px;

        height:
            48px;
    }


    .footer-responsible-content p {
        font-size:
            11px;
    }


    .footer-bottom {
        flex-direction:
            column;

        align-items:
            flex-start;

        gap:
            7px;
    }


    .footer-bottom-note {
        text-align:
            left;
    }

}


@media (max-width: 430px) {

    .footer-main {
        grid-template-columns:
            1fr;
    }


    .footer-brand {
        grid-column:
            auto;
    }

}

/*=============================================
              Footer Responsive End
=============================================*/

/*=============================================
                     Footer End
=============================================*/


/*=============================================
                 Legal Pages Start
=============================================*/

.legal-page {
    position:
        relative;

    min-height:
        calc(
            100vh -
            var(--header-height)
        );

    margin-top:
        var(--header-height);

    padding:
        72px
        20px
        88px;

    overflow:
        hidden;

    color:
        #dce7e9;

    background:
        radial-gradient(
            circle at 88% 5%,
            rgba(46, 157, 255, 0.09),
            transparent 27%
        ),
        radial-gradient(
            circle at 8% 92%,
            rgba(59, 226, 164, 0.07),
            transparent 30%
        ),
        radial-gradient(
            circle at 50% 30%,
            rgba(255, 198, 59, 0.035),
            transparent 32%
        ),
        linear-gradient(
            145deg,
            #07101b 0%,
            #09131f 48%,
            #071719 100%
        );
}


.legal-page::before {
    content:
        "";

    position:
        absolute;

    top:
        0;

    left:
        0;

    width:
        100%;

    height:
        2px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #ffc63b,
            #2f9eff,
            #3be2a4,
            transparent
        );

    box-shadow:
        0 0 20px
        rgba(255, 198, 59, 0.16);
}


.legal-page-container {
    position:
        relative;

    z-index:
        1;

    width:
        min(
            100%,
            1100px
        );

    margin:
        0 auto;
}


/*=============================================
                Legal Header Start
=============================================*/

.legal-page-head {
    max-width:
        940px;

    margin:
        0 auto
        42px;

    padding:
        31px
        33px
        34px;

    border:
        1px solid
        rgba(91, 191, 255, 0.15);

    border-radius:
        22px;

    background:
        radial-gradient(
            circle at 0% 0%,
            rgba(255, 198, 59, 0.07),
            transparent 36%
        ),
        radial-gradient(
            circle at 100% 0%,
            rgba(47, 158, 255, 0.07),
            transparent 36%
        ),
        rgba(10, 18, 31, 0.82);

    box-shadow:
        0 22px 52px
        rgba(0, 0, 0, 0.25),
        inset 0 1px 0
        rgba(255, 255, 255, 0.04);
}


.legal-page-kicker {
    display:
        block;

    margin:
        0
        0
        10px;

    color:
        #ffd05a;

    font-size:
        12px;

    font-weight:
        900;

    letter-spacing:
        0.16em;

    text-transform:
        uppercase;
}


.legal-page-head h1 {
    max-width:
        840px;

    margin:
        0;

    color:
        #ffffff;

    font-size:
        clamp(
            42px,
            5vw,
            68px
        );

    font-weight:
        900;

    line-height:
        0.99;

    letter-spacing:
        -0.045em;
}


.legal-page-intro {
    max-width:
        870px;

    margin:
        20px
        0
        0;

    color:
        #c3d1d5;

    font-size:
        15px;

    line-height:
        1.7;
}


.legal-last-updated {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        6px;

    margin:
        20px
        0
        0;

    padding:
        8px
        12px;

    border:
        1px solid
        rgba(255, 198, 59, 0.22);

    border-radius:
        999px;

    background:
        rgba(255, 198, 59, 0.055);

    color:
        #cbbd9d;

    font-size:
        11px;

    font-weight:
        800;
}


.legal-last-updated span {
    color:
        #ffe08a;

    font-weight:
        900;
}

/*=============================================
                 Legal Header End
=============================================*/


/*=============================================
               Legal Content Start
=============================================*/

.legal-content {
    width:
        min(
            100%,
            940px
        );

    margin:
        0 auto;
}


.legal-section {
    position:
        relative;

    padding:
        29px
        31px;

    border:
        1px solid
        rgba(117, 156, 173, 0.13);

    border-radius:
        17px;

    background:
        linear-gradient(
            145deg,
            rgba(14, 24, 37, 0.90),
            rgba(8, 18, 28, 0.93)
        );

    box-shadow:
        0 10px 28px
        rgba(0, 0, 0, 0.12),
        inset 0 1px 0
        rgba(255, 255, 255, 0.025);
}


.legal-section + .legal-section {
    margin-top:
        13px;
}


.legal-section::before {
    content:
        "";

    position:
        absolute;

    top:
        0;

    left:
        30px;

    width:
        55px;

    height:
        2px;

    border-radius:
        999px;

    background:
        linear-gradient(
            90deg,
            #ffc63b,
            #2f9eff,
            #3be2a4
        );
}


.legal-section h2 {
    max-width:
        800px;

    margin:
        0;

    color:
        #ffffff;

    font-size:
        clamp(
            23px,
            2.2vw,
            31px
        );

    font-weight:
        900;

    line-height:
        1.12;

    letter-spacing:
        -0.02em;
}


.legal-section h3 {
    margin:
        22px
        0
        0;

    color:
        #e0f7f2;

    font-size:
        18px;

    font-weight:
        900;
}


.legal-section p {
    margin:
        13px
        0
        0;

    color:
        #b8c9cd;

    font-size:
        14px;

    line-height:
        1.72;
}


.legal-section p + p {
    margin-top:
        11px;
}


.legal-section ul,
.legal-section ol {
    margin:
        14px
        0
        0;

    padding-left:
        22px;

    color:
        #b8c9cd;

    font-size:
        14px;

    line-height:
        1.72;
}


.legal-section li + li {
    margin-top:
        6px;
}


.legal-section strong {
    color:
        #ffffff;
}


.legal-section a {
    color:
        #71e4c8;

    font-weight:
        800;

    text-decoration:
        underline;

    text-decoration-thickness:
        1px;

    text-underline-offset:
        3px;

    transition:
        color 0.2s ease;
}


.legal-section a:hover,
.legal-section a:focus-visible {
    color:
        #ffe08a;

    outline:
        none;
}

/*=============================================
                Legal Content End
=============================================*/


/*=============================================
                 Legal Notice Start
=============================================*/

.legal-notice,
.legal-highlight,
.legal-warning {
    margin-top:
        15px;

    padding:
        15px
        17px;

    border-left:
        3px solid
        #3be2a4;

    border-radius:
        0
        10px
        10px
        0;

    background:
        rgba(59, 226, 164, 0.04);
}


.legal-warning {
    border-left-color:
        #ffd05e;

    background:
        rgba(255, 208, 94, 0.045);
}


.legal-highlight {
    border-left-color:
        #2992ff;

    background:
        rgba(41, 146, 255, 0.045);
}


.legal-notice p,
.legal-highlight p,
.legal-warning p {
    margin:
        0;
}

/*=============================================
                  Legal Notice End
=============================================*/


/*=============================================
           Current Legal Page Start
=============================================*/

.footer-links a[aria-current="page"] {
    color:
        #ffd577;

    font-weight:
        900;
}

/*=============================================
            Current Legal Page End
=============================================*/


/*=============================================
             Legal Responsive Start
=============================================*/

@media (max-width: 900px) {

    .legal-page {
        padding:
            62px
            18px
            76px;
    }

}


@media (max-width: 620px) {

    .legal-page {
        padding:
            48px
            14px
            64px;
    }


    .legal-page-head {
        margin-bottom:
            28px;

        padding:
            25px
            19px
            27px;

        border-radius:
            16px;
    }


    .legal-page-head h1 {
        font-size:
            clamp(
                36px,
                11vw,
                50px
            );
    }


    .legal-page-intro {
        margin-top:
            17px;

        font-size:
            14px;
    }


    .legal-section {
        padding:
            25px
            19px
            23px;

        border-radius:
            14px;
    }


    .legal-section::before {
        left:
            19px;
    }


    .legal-section h2 {
        font-size:
            23px;
    }


    .legal-section p,
    .legal-section ul,
    .legal-section ol {
        font-size:
            13px;
    }

}

/*=============================================
              Legal Responsive End
=============================================*/

/*=============================================
                  Legal Pages End
=============================================*/


/*=============================================
       Tournaments Left Switcher Fix Start
=============================================*/

.tournaments-site-navigation {
    left:
        -184px !important;

    width:
        156px !important;
}


.tournaments-site-switcher {
    width:
        156px !important;

    padding:
        8px !important;
}


.tournaments-site-switcher-button {
    padding:
        8px
        7px !important;

    grid-template-columns:
        36px
        minmax(0, 1fr) !important;

    gap:
        6px !important;
}


.tournaments-site-switcher-icon {
    width:
        36px !important;

    height:
        36px !important;
}


.tournaments-site-switcher-copy strong {
    font-size:
        13px !important;

    letter-spacing:
        -0.25px !important;
}


.tournaments-site-navigation.is-floating {
    left:
        max(
            10px,
            calc(50% - 680px - 184px)
        ) !important;
}


.tournaments-site-navigation.is-at-bottom {
    left:
        -184px !important;
}


@media (max-width: 1500px) and (min-width: 1241px) {

    .tournaments-site-navigation {
        left:
            -158px !important;

        width:
            136px !important;
    }


    .tournaments-site-switcher {
        width:
            136px !important;

        padding:
            7px !important;
    }


    .tournaments-site-switcher-button {
        padding:
            7px
            5px !important;

        grid-template-columns:
            32px
            minmax(0, 1fr) !important;

        gap:
            5px !important;
    }


    .tournaments-site-switcher-icon {
        width:
            32px !important;

        height:
            32px !important;
    }


    .tournaments-site-switcher-copy strong {
        font-size:
            12px !important;

        letter-spacing:
            -0.35px !important;
    }


    .tournaments-site-switcher-copy small {
        font-size:
            10px !important;
    }


    .tournaments-site-navigation.is-floating {
        left:
            max(
                10px,
                calc(50% - 630px - 158px)
            ) !important;
    }


    .tournaments-site-navigation.is-at-bottom {
        left:
            -158px !important;
    }

}

/*=============================================
        Tournaments Left Switcher Fix End
=============================================*/