@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');

/* Phoenix365 Icon Font */
@font-face {
    font-family: 'phoenix365';
    src: url('../fonts/phoenix365.eot?j5oj4t');
    src: url('../fonts/phoenix365.eot?j5oj4t#iefix') format('embedded-opentype'),
         url('../fonts/phoenix365.ttf?j5oj4t') format('truetype'),
         url('../fonts/phoenix365.woff?j5oj4t') format('woff'),
         url('../fonts/phoenix365.svg?j5oj4t#phoenix365') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

:root {
    --default-color: #fec838;
    --default-lighten-color: #2fb669;
    --default-catifsh-color: #04182f;
    --default-header-color: #04182f;
    --default-footer-color: #04182f;
    --surface-1: #242832;
    --cta-yellow-1: #ffe06d;
    --cta-yellow-2: #f7b733;
    --btn-text: #ffffff;
}

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

li, ol, ol[class], ul, ul[class] {
    margin: 0;
    padding: 0
}

blockquote, body, dd, dl, figcaption, figure, h1, h2, h3, h4, li, ol[class], p, ul[class] {
    margin: 0
}

body {
    line-height: 1.5;
    min-height: 100vh;
    scroll-behavior: smooth;
    text-rendering: optimizeSpeed
}

/* Стили блокировки скролла удалены */

li, ol[class], ul[class] {
    list-style: none
}

a {
    text-decoration: none
}

a:not([class]) {
    -webkit-text-decoration-skip: ink;
    text-decoration-skip-ink: auto
}

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

button, input, select, textarea {
    border: none;
    font: inherit
}

[role=button], button {
    cursor: pointer
}

@media (prefers-reduced-motion:reduce) {
    * {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important
    }
}

body {
    background: var(--default-catifsh-color);
    color: #ffffff;
    font-family: "Ubuntu", sans-serif;
    font-size: 16px;
    letter-spacing: .5px;
    line-height: 1.4
}

@media (max-width:768px) {
    body {
        font-size: 14px;
        overflow-x: hidden
    }
}

.container {
    margin-left: auto;
    margin-right: auto;
    max-width: 1220px;
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
}

.header > .container {
    max-width: 100%;
}

.header {
    background: var(--default-header-color);
    padding: 14px 0;
    min-height: 76px;
    display: flex;
    align-items: center;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.05);
    position: sticky;
    top: 0;
    z-index: 9999;
    width: 100%;
}

.header-wrap {
    display: flex;
    align-items: center;
    gap: 28px;
    width: 100%;
}

.header-logo__img {
    height: 44px;
    width: auto;
}

.menu-wrap {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 28px;
}

.main-nav {
    flex: 1;
    display: flex;    
}

.main-nav__list {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 26px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.nav-item {
    display: flex;
    align-items: center;
}

.nav-item__link {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #f3f4f6;
    padding: 8px 12px;
    border-radius: 10px;
    text-decoration: none;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 0.2px;
    transition: color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

/* Уплотняем меню хедера при ширине < 1052px (без перевода в мобильное) */
@media (max-width: 1052px) {
    .header-logo__img {
        height: 38px;
    }
    .main-nav__list {
        gap: 18px;
    }
    .nav-item__link {
        font-size: 13px;
        padding: 6px 8px;
    }
}

.main-nav__list li:hover > .nav-item__link,
.main-nav__list li:focus-within > .nav-item__link {
    color: #fff;
    background: linear-gradient(180deg, #1e6c38 0%, #11532c 100%);
    box-shadow: inset 0 -2px 0 #2fb735;
}

.main-nav__list .current-menu-item > .nav-item__link,
.main-nav__list .menu-item-highlight > .nav-item__link {
    background: linear-gradient(90deg, #1f5c3b 0%, #1d7c47 100%);
    box-shadow: inset 0 0 0 1px rgba(77, 200, 133, 0.5);
    color: #ffffff;
    padding-right: 18px;
    padding-left: 18px;
    border-radius: 10px;
}

.nav-item__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(254, 200, 56, 0.12);
    color: #fec838;
    font-size: 0;
    overflow: hidden;
}

/*.nav-item__icon::before {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-color: currentColor;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: contain;
            mask-repeat: no-repeat;
            mask-position: center;
            mask-size: contain;
}
*/
.main-nav__list li:hover > .nav-item__link .nav-item__icon,
.main-nav__list li:focus-within > .nav-item__link .nav-item__icon {
    background: rgba(254, 212, 95, 0.2);
    color: #ffe076;
}

.nav-item__label {
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    font-weight: 400;
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-left: auto;
}

.header .btn {
    display: flex;
    align-items: center;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0;
    line-height: 1;
}

.header .btn a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 14px;
    color: #34cc67 !important;
    padding: 10px 0;
    text-decoration: none;
    transition: color 0.2s ease, background-color 0.2s ease;
}

.header .btn-login a {
    color: #34cc67 !important;
    font-weight: 700;
}

.header .btn-login a:hover,
.header .btn-login a:focus {
    color: #ffe89a !important;
}

.header .btn-register {
    border-radius: 999px;
}

.header .btn-register a {
    background: linear-gradient(90deg, #34cc67 0%, #4fc954 100%) !important;
    color: #1b1306 !important;
    border-radius: 999px;
    padding: 10px 30px;
    font-weight: 700;
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.35);
}

.header .btn-register a:hover,
.header .btn-register a:focus {
    background: linear-gradient(90deg, #34cc67 0%, #17891c 100%) !important;
    color: #1b1306 !important;
}

.bonuslar-item {
    background: linear-gradient(90deg, #5c2bd6 0%, #2B1EBC 100%);
    border-radius: 999px;
    padding: 6px 16px 6px 42px;
    position: relative;
    display: inline-flex;
    align-items: center;
    box-shadow: 0 6px 18px rgba(46, 113, 255, 0.35);
}

.bonuslar-item a {
    color: #fff !important;
    font-weight: 700;
    letter-spacing: .5px;
}

.bonuslar-item::before {
    content: "";
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background-image: url('../assets/img/gift-color.svg');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* Mobile: show only gift icon for BONUS button */
@media (max-width: 768px) {
    .bonuslar-item {
        padding: 0;
        width: 36px;
        height: 36px;
        border-radius: 50%;
        position: relative;
    }
    .bonuslar-item a {
        display: block;
        width: 100%;
        height: 100%;
        padding: 0;
        font-size: 0; /* hide label visually on mobile */
        text-indent: -9999px;
        overflow: hidden;
    }
    .bonuslar-item::before {
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 20px;
        height: 20px;
    }
}

.header-bonus-icon {
    display: flex;
    align-items: center;
}

.header-bonus-icon img {
    width: 24px;
    height: 24px;
}

.header-time {
    color: #fff;
    font-size: 14px;
    font-weight: bold;
}

.header-lang {
    background-color: #2a3441;
    border-radius: 5px;
    padding: 5px 10px;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
}

.nav-item__icon.icon-deportes::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a10 10 0 014.3 1l-1.1 3.4L12 8l-3.2-1.6-1.1-3.4A10 10 0 0112 2zm-8.7 6.3l3.3-.2L9 9.7l-.8 3.4-2.9 2.1a10 10 0 01-2-6zm17.4 0a10 10 0 01-2 6l-2.9-2.1L15 9.7l2.4-1.6 3.3.2zM8.5 14.6l3.5 1.2 3.5-1.2.2 3.5-3.7 2-3.7-2 .2-3.5z' fill='%23000'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a10 10 0 014.3 1l-1.1 3.4L12 8l-3.2-1.6-1.1-3.4A10 10 0 0112 2zm-8.7 6.3l3.3-.2L9 9.7l-.8 3.4-2.9 2.1a10 10 0 01-2-6zm17.4 0a10 10 0 01-2 6l-2.9-2.1L15 9.7l2.4-1.6 3.3.2zM8.5 14.6l3.5 1.2 3.5-1.2.2 3.5-3.7 2-3.7-2 .2-3.5z' fill='%23000'/%3E%3C/svg%3E");
}

.nav-item__icon.icon-en-vivo::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='6' width='18' height='12' rx='2' ry='2'/%3E%3Cpath d='M8 18l-2 4h12l-2-4'/%3E%3Cpath d='M11 9l4 3-4 3z'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='6' width='18' height='12' rx='2' ry='2'/%3E%3Cpath d='M8 18l-2 4h12l-2-4'/%3E%3Cpath d='M11 9l4 3-4 3z'/%3E%3C/svg%3E");
}

.nav-item__icon.icon-promos::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='9' width='16' height='11' rx='2'/%3E%3Cpath d='M4 12h16'/%3E%3Cpath d='M12 9v11'/%3E%3Cpath d='M12 9s-1.5-4-4-4-3 1.5-3 3 1 3 3 3h4z'/%3E%3Cpath d='M12 9s1.5-4 4-4 3 1.5 3 3-1 3-3 3h-4z'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='9' width='16' height='11' rx='2'/%3E%3Cpath d='M4 12h16'/%3E%3Cpath d='M12 9v11'/%3E%3Cpath d='M12 9s-1.5-4-4-4-3 1.5-3 3 1 3 3 3h4z'/%3E%3Cpath d='M12 9s1.5-4 4-4 3 1.5 3 3-1 3-3 3h-4z'/%3E%3C/svg%3E");
}

.nav-item__icon.icon-casino::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5h12l-4 14H4z'/%3E%3Cpath d='M10 9h6'/%3E%3Cpath d='M9 13h6'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5h12l-4 14H4z'/%3E%3Cpath d='M10 9h6'/%3E%3Cpath d='M9 13h6'/%3E%3C/svg%3E");
}

.nav-item__icon.icon-slots::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'/%3E%3Ccircle cx='8' cy='12' r='2'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Ccircle cx='16' cy='12' r='2'/%3E%3Crect x='9' y='3' width='6' height='3'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='6' width='18' height='12' rx='2'/%3E%3Ccircle cx='8' cy='12' r='2'/%3E%3Ccircle cx='12' cy='12' r='2'/%3E%3Ccircle cx='16' cy='12' r='2'/%3E%3Crect x='9' y='3' width='6' height='3'/%3E%3C/svg%3E");
}

.nav-item__icon.icon-chicken::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 11a4 4 0 118 0v1h2a3 3 0 11-6 0V9l-2-2-1 4H7a3 3 0 012-2z'/%3E%3Ccircle cx='15' cy='6' r='2'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 11a4 4 0 118 0v1h2a3 3 0 11-6 0V9l-2-2-1 4H7a3 3 0 012-2z'/%3E%3Ccircle cx='15' cy='6' r='2'/%3E%3C/svg%3E");
}

.nav-item__icon.icon-missions::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='6' y='3' width='12' height='18' rx='2'/%3E%3Cpath d='M9 7h6M9 11h6M9 15h4'/%3E%3Cpath d='M10 3V1h4v2'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='6' y='3' width='12' height='18' rx='2'/%3E%3Cpath d='M9 7h6M9 11h6M9 15h4'/%3E%3Cpath d='M10 3V1h4v2'/%3E%3C/svg%3E");
}

.nav-item__icon.icon-spin::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 3l14 4-3 2 3 2-14 4z'/%3E%3C/svg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 3l14 4-3 2 3 2-14 4z'/%3E%3C/svg%3E");
}

.header-lang {
    display: flex;
    align-items: center;
    color: #fff;
}

.btn {
    border-radius: 5px;
    font-size: 14px;
    font-weight: 500;
    line-height: 36px;    
	width: fit-content;
}


/* Register and Login buttons styling as screenshot */
.btn-register {
    background: linear-gradient(90deg, var(--cta-yellow-1) 0%, var(--cta-yellow-2) 100%);
    border-radius: 999px;
    box-shadow: 0 8px 20px rgba(255, 194, 51, 0.35);
    border: 2px solid #3b2c0e;
}

.btn-login {
    background: linear-gradient(90deg, #232A66 0%, #1A1F4F 100%);
    border-radius: 999px;
    border: 1px solid var(--default-lighten-color);
    box-shadow: 0 0 0 3px rgba(46, 113, 255, 0.15) inset;
}

.btn a {
    color: var(--btn-text);
    display: block;
    padding: 0 22px;
    font-weight: bold;
}

/* Ensure Register button label is black like in screenshot */
.btn.btn-register > a {
    color: #000 !important;
}

.btn:hover {
    opacity: .86
}

.menu-mob-btn {
    background: var(--default-color) url(../assets/img/mob-menu-icon.svg) no-repeat 50%;
    background-size: 15px;
    border: 1px solid var(--default-color);
    border-radius: 4px;
    display: none;
    height: 42px;
    justify-self: flex-end;
    width: 42px;
    cursor: pointer;
    position: relative;
    z-index: 9999;
}

.menu-mob-btn.-toggle {
    background: var(--default-color) url(../assets/img/mob-menu-close-icon.svg) no-repeat 50%;
    background-size: 15px
}

/* На десктопе (шире 900px) принудительно скрываем бургер и крестик */
@media (min-width: 901px) {
    .menu-mob-btn,
    .menu-close-btn {
        display: none !important;
    }
}

.main {
    background-color: var(--default-header-color);
    color: #e5e6ec;
	margin-top: 25px;
}

/*POST*/
.post-entry p:not(:last-child) {
    margin-bottom: 24px;
}

.post-entry h1,
.post-entry h2,
.post-entry h3,
.post-entry h4,
.post-entry h5,
.post-entry h6 {
    line-height: 1.2;
    margin-bottom: 14px
}

.post-entry h1 {
    font-size: 32px
}

.post-entry h2 {
    font-size: 28px
}

.post-entry h3 {
    font-size: 24px
}

.post-entry h4 {
    font-size: 20px
}


.post-entry table {
    width: 100%;
    margin-bottom: 20px;
    border-collapse: collapse;
    border-spacing: 0;
    border: 1px solid #333;
    border-radius: 6px;
    overflow: hidden;
    background: #1a1a1a;
}

.post-entry table th {
    background: #222;    
    font-weight: 700;
    padding: 12px 16px;
    text-align: center;
    border-bottom: 1px solid #34cc67;
    font-size: 14px;
}

.post-entry table td {
    padding: 10px 16px;
    border-bottom: 1px solid #333;
    color: #fff;
    font-size: 14px;
    transition: all 0.2s ease;
}

.post-entry table tr:nth-child(even) {
    background-color: #222;
}

.post-entry table tr:hover td {
    background-color: #2a2a2a;
}

.post-entry table tr:last-child td {
    border-bottom: none;
}

@media (max-width: 768px) {
    .post-entry table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        border-radius: 4px;
    }
    
    .post-entry table th,
    .post-entry table td {
        padding: 8px 12px;
        font-size: 13px;
    }
}

.post-entry table tr:first-child {
    background: #222 !important;
}

.post-entry table tr:first-child td {    
    font-weight: 600;
    border: none;
}

.post-entry table tr:nth-child(odd) {
    background: linear-gradient(135deg, rgba(183, 190, 207, 0.08) 0%, rgba(183, 190, 207, 0.03) 100%);
}

.post-entry table tr td {
    padding: 16px 20px
}

.post-entry .wp-block-image {
    margin-bottom: 24px
}

.post-entry .wp-block-image img {
	border-radius:15px;
    margin: 0 auto;
}

.post-entry img {
    height: auto !important;
}

.post-entry ol {
    counter-reset: num;
    list-style-type: none;
    margin-bottom: 24px;
    margin-left: 32px
}

.post-entry ol li {
    margin: 0 0 16px;
    padding: 0;
    position: relative
}

.post-entry ol li:before {
    background: var(--default-color);
    border-radius: 50%;
    color: #fff;
    content: counter(num);
    counter-increment: num;
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    height: 24px;
    left: -32px;
    line-height: 24px;
    position: absolute;
    text-align: center;
    top: 0;
    width: 24px
}

.post-entry ul {
    list-style-type: none;
    margin-bottom: 24px;
    margin-left: 32px;
    padding: 0;
}

.post-entry ul li {
    margin: 0 0 16px;
    padding: 0;
    position: relative;
}

.post-entry ul li:before {
    background: var(--default-color);
    border-radius: 50%;
    content: "";
    display: inline-block;
    height: 8px;
    left: -20px;
    position: absolute;
    top: 8px;
    width: 8px;
    box-shadow: 0 0 0 2px var(--default-lighten-color);
}

/* WPFront Scroll Top Styles */
#wpfront-scroll-top-container {
    border-radius: 8px !important;
    transition: all 0.3s ease !important;
}



#wpfront-scroll-top-container div.text-holder {
    
    color: #fff !important;
    border: 1px solid var(--default-header-color) !important;
    box-shadow: none !important;
}


#wpfront-scroll-top-container i {
    color: #fff !important;
}

#wpfront-scroll-top-container i:hover {
    color: var(--default-lighten-color) !important;
}

.wp-block-quote{
    margin-bottom:1.2rem;
    background-color: var(--default-color);
    color: #FFFFFF;
    padding:40px;
    padding-left:80px;
    position: relative;
        border-radius: 8px;
}
.wp-block-quote::before{
    position: absolute;
    left:20px;
    top:20px;
    width:40px;
    height:40px;
content: url("data:image/svg+xml,%3Csvg fill='%23FFFFFF' width='40px' height='40px' viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M464 256h-80v-64c0-35.3 28.7-64 64-64h8c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24h-8c-88.4 0-160 71.6-160 160v240c0 26.5 21.5 48 48 48h128c26.5 0 48-21.5 48-48V304c0-26.5-21.5-48-48-48zm-288 0H96v-64c0-35.3 28.7-64 64-64h8c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24h-8C71.6 32 0 103.6 0 192v240c0 26.5 21.5 48 48 48h128c26.5 0 48-21.5 48-48V304c0-26.5-21.5-48-48-48z'/%3E%3C/svg%3E");
}

@media(max-width:580px){
    .wp-block-quote{
        padding:24px;
        padding-left:56px;
    }
    .wp-block-quote::before{
        top:16px;
        left:16px;
        width:24px;
        height:24px;
content: url("data:image/svg+xml,%3Csvg fill='%23FFFFFF' width='24px' height='24px' viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M464 256h-80v-64c0-35.3 28.7-64 64-64h8c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24h-8c-88.4 0-160 71.6-160 160v240c0 26.5 21.5 48 48 48h128c26.5 0 48-21.5 48-48V304c0-26.5-21.5-48-48-48zm-288 0H96v-64c0-35.3 28.7-64 64-64h8c13.3 0 24-10.7 24-24V56c0-13.3-10.7-24-24-24h-8C71.6 32 0 103.6 0 192v240c0 26.5 21.5 48 48 48h128c26.5 0 48-21.5 48-48V304c0-26.5-21.5-48-48-48z'/%3E%3C/svg%3E");
    }
}

/*AUTHOR*/
.author-block {
    grid-gap: 30px;
    background: #fff;
    border: 1px solid #d8d8d8;
    border-radius: 20px;
    box-shadow: 0 0 16px 0 rgba(0, 0, 0, .078);
    display: grid;
    grid-template-columns: max-content 1fr;
    margin-bottom: 32px;
    padding: 32px
}

@media (max-width:768px) {
    .author-block {
        grid-gap: 20px;
        grid-template-columns: 1fr;
        padding: 20px 16px
    }
}

.author-block .author-block__photo img {
    border-radius: 50%;
    height: 168px;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    width: 168px
}

.author-block .author-block__top-grid {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: 1fr max-content;
    margin-bottom: 20px
}

@media (max-width:768px) {
    .author-block .author-block__top-grid {
        grid-gap: 20px;
        grid-template-columns: 1fr
    }
}

.author-block .author-block__line {
    color: #828282;
    font-size: 18px
}

.author-block .author-block__name {
    color: #2d2d2c;
    font-size: 24px;
    font-weight: 700
}

.author-block .author-block__socials {
    display: flex;
    gap: 10px
}

.author-block .author-block__socials .author-block__socials__item {
    background: #f2f2f2;
    border-radius: 4px;
    display: inline-block;
    height: 32px;
    overflow: hidden;
    width: 32px
}

.author-block .author-block__socials .author-block__socials__item:hover {
    opacity: .86
}

.author-block .author-block__socials .author-block__socials__item i {
    display: inline-block;
    height: 32px;
    width: 32px
}

.author-block .author-block__socials .author-block__socials__item i.icon-fb {
    background: url(../assets/img/icon-fb.svg) no-repeat 50%;
    background-size: 22px
}

.author-block .author-block__socials .author-block__socials__item i.icon-tw {
    background: url(../assets/img/icon-tw.svg) no-repeat 50%;
    background-size: 22px
}

.author-block .author-block__socials .author-block__socials__item i.icon-email {
    background: url(../assets/img/icon-email.svg) no-repeat 50%;
    background-size: 22px
}

.author-block .author-block__text {
    color: #2d2d2c;
    font-size: 18px
}

.author-block .author-block__text p:not(:last-child) {
    margin-bottom: 20px
}

/*FAQ*/
.faq-block {
    padding: 40px 0;
    margin-top: 40px;    
}

.faq-block .faq-block--title {
    color: #fff;
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 24px;
    text-align: left;
}

.faq-block .faq-block--items .faq-block--items__item {
    margin-bottom: 12px;
}

.faq-block .faq-block--items .faq-block--items__item .faq-block--items__item--header {
    background: #0b1310;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 500;
    padding: 18px 24px;
    position: relative;
    color: #fff;
    transition: all 0.2s ease;
    cursor: pointer;
    border: 1px solid rgb(250 219 92) !important;
}

.faq-block .faq-block--items .faq-block--items__item .faq-block--items__item--header::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
    background: transparent;
    transition: background 0.2s ease;
}

.faq-block .faq-block--items .faq-block--items__item .faq-block--items__item--header::after {
    content: "+";
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #fadb5c;
    transition: all 0.2s ease;
}

.faq-block .faq-block--items .faq-block--items__item .faq-block--items__item--content {
    display: none;
}

.faq-block .faq-block--items .faq-block--items__item.-toggle .faq-block--items__item--header {
    background: #1c5a3c;
    border-color: #f5c032;
    color: #fff;
}

.faq-block .faq-block--items .faq-block--items__item.-toggle .faq-block--items__item--header::before {
    background: linear-gradient(180deg, #f5c032, #fadb5c);
}

.faq-block .faq-block--items .faq-block--items__item.-toggle .faq-block--items__item--header::after {
    content: "−";
    border-color: rgba(0, 0, 0, 0.25);
    background: rgba(0, 0, 0, 0.25);
}

.faq-block .faq-block--items .faq-block--items__item.-toggle .faq-block--items__item--content {
    display: block;
    padding: 16px 24px;
    margin-top: 8px;
    background: #0b1310;
    border-radius: 12px;
    color: #dbe5f2;
    font-size: 14px;
    line-height: 1.5;
    border: 1px solid rgba(255, 255, 255, 0.04);
}

.faq-block .faq-block--items .faq-block--items__item.-toggle .faq-block--items__item--content p:not(:last-child) {
    margin-bottom: 12px;
}

.faq-block .faq-block--items .faq-block--items__item.-toggle .faq-block--items__item--content a {
    color: #fadb5c;
    transition: color 0.2s ease;
    text-decoration: none;
}

.faq-block .faq-block--items .faq-block--items__item.-toggle .faq-block--items__item--content a:hover {
    color: #fff;
    text-decoration: underline;
}

/*WP STYLE*/
#wpfront-scroll-top-container {
    width: 56px !important;
    height: 56px !important;
    border-radius: 50% !important;
    background: #34cc67 !important;
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.35) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    position: fixed !important;
    right: 24px !important;
    bottom: 24px !important;
    z-index: 9990 !important;
}
#wpfront-scroll-top-container:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 32px rgba(0, 0, 0, 0.4) !important;
}
#wpfront-scroll-top-container::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 14px;
    height: 14px;
    border-left: 3px solid #1d1e20;
    border-top: 3px solid #1d1e20;
    transform: translate(-50%, -40%) rotate(45deg);
}
#wpfront-scroll-top-container div.text-holder {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
#wpfront-scroll-top-container i {
    display: none !important;
}
#wpfront-scroll-top-container img {
    display: none !important;
}

.wp-block-media-text .wp-block-media-text__media {
    float: right;
    max-width: 50%;
    margin-left: 20px;
    margin-bottom: 20px;
}

.alignright{
    float: right;
    margin-left: 20px;
    margin-bottom: 20px;
}

@media (max-width: 900px) {
    .menu-mob-btn {
        display: block !important;
        position: absolute;
        right: 5px;        
    }
    
    .header-wrap {
        position: relative;
    }
}

.alignright {
    max-width: 100%;
    margin: 16px auto 24px auto;
    float: none;
    order: 2;
}

.alignleft{
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
}
/*footer*/
footer {
    background: #1A0A00;
    color: #fff;
	padding: 0 20px;
}
.footer-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Providers section */
.footer-providers {
    padding: 30px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-title {
    color: #fff;
    font-size: 24px;
    font-weight: 600;
    margin: 0 0 20px 0;
    text-align: left;
}

.providers-slider {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}

.provider-item {
    background: #3A1A00;
    border-radius: 8px;
    padding: 15px;
    width: 18%;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.provider-item img {
    max-width: 100%;
    max-height: 60px;
}

.payment-methods {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin-top: 20px;
}

.payment-item {
    height: 60px;
}

.payment-item img {
    height: 100%;
    width: auto;
}

/* Menu section */
.footer-menu-section {
    padding: 40px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-logo-social {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin-bottom: 30px;
}

.footer-logo {
    margin-bottom: 0;
}

.footer-logo-img {
    height: 23px;
    width: auto;
}

.footer-title {
    margin-bottom: 20px;
}

.footer-title h3 {
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    margin: 0;
}

.footer-menu-columns {
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
}

.footer-menu-column {
    width: 23%;
}

.footer-menu-title {
    color: #fff;
    font-size: 13px;
    line-height: 1.4;
    margin-bottom: 10px;
}

.footer-menu-column ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer-menu-column li {
    margin-bottom: 10px;
}

.footer-menu-column a {
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    line-height: 1.4;
    transition: color 0.3s ease;
}

.footer-menu-column a:hover {
    color: #FF6B00;
}

/* Social section */
.footer-social-section {
    padding: 30px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-social h3 {
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 15px 0;
}

.social-icons {
    display: flex;
    gap: 15px;
}

.social-icon {
    background: #2A1A0A;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.3s ease;
}

.social-icon:hover {
    background: #FF6B00;
}

.social-icon img {
    width: 20px;
    height: 20px;
}

/* Copyright section */
.footer-copyright-section {
    padding: 15px 0;
    background-color: #1A0F05;
    border-top: 1px solid #2A1A0A;
}

.footer-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

.footer-copyright-text {
    font-size: 14px;
    color: #9A8C7E;
}

.footer-copyright-right {
    display: flex;
    align-items: center;
    gap: 15px;
}

.license-link {
    font-size: 14px;
    color: #0ac5cb;
    display: flex;
    align-items: center;
}


.app-link img, .age-restriction img, .ssl-icon img {
    height: 30px;
    width: auto;
}

.language-selector {
    background: #2A1A0A;
    padding: 8px 15px;
    border-radius: 5px;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.language-selector span {
    font-size: 14px;
    color: #fff;
    display: flex;
    align-items: center;
}

.language-selector span:after {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
    background-size: contain;
    margin-left: 5px;
}

.footer-copyright-text {
    text-align: center;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.7);
    padding: 10px 0;
}

.footer-copyright-text p {
    margin: 0;
}

/* Responsive styles */
@media (max-width: 991px) {
    .providers-slider {
        flex-wrap: wrap;
        gap: 10px;
    }
    
    .provider-item {
        width: 48%;
        margin-bottom: 10px;
    }
    
    .payment-methods {
        flex-wrap: wrap;
    }
    
    .footer-menu-columns {
        flex-wrap: wrap;
    }
    
    .footer-menu-column {
        width: 48%;
        margin-bottom: 20px;
    }
    
    .footer-copyright {
        flex-direction: column;
        gap: 15px;
    }
}

@media (max-width: 576px) {
    .provider-item {
        width: 100%;
    }
    
    .footer-menu-column {
        width: 100%;
    }
}



/*MOBILE*/
@media (max-width:900px) {
    .menu-mob-btn {
        display: block;
    }

    .header-logo__img {
        max-height: 42px;
        max-width: 180px;
        width: auto;
    }

    .header-wrap {
        gap: 16px;
    }

    .menu-wrap {
        position: fixed;
        top: 72px;
        left: 0;
        width: 100%;
        height: calc(90vh - 72px);
        background: #1d1e20;
        display: none;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        padding: 28px 24px;
        z-index: 9998;
        overflow-y: auto;
    }

    .menu-wrap.-toggle,
    .menu-wrap.show {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .main-nav {
        width: 100%;
        margin: 0;
        padding: 0;
    }

    .main-nav__list {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        width: 100%;
    }

    .main-nav__list li {
        width: 100%;
    }

    .main-nav__list a {
        width: 100%;
        padding: 12px 0;
    }

    .header-actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
    }

    .header-actions .btn,
    .header-actions .btn-register,
    .header-actions .btn-login {
        width: 100%;
        justify-content: center;
    }

    .header-actions .btn a,
    .header-actions .btn-register a,
    .header-actions .btn-login a {
        width: 100%;
        padding: 12px 0;
    }

    /* Close button styles and visibility */
    .menu-close-btn {
        position: absolute !important;        
        right: 5px !important;
        width: 40px !important;
        height: 40px !important;
        z-index: 10060 !important;
        background: #1b5b3b !important;
        color: #fff !important;
        border: none !important;
        border-radius: 4px !important;
        font-size: 28px !important;
        line-height: 40px !important;
        text-align: center !important;
        cursor: pointer !important;
        display: none !important; /* hidden by default */
    }

    body.menu-open .menu-close-btn {
        display: block !important;
    }

    /* Toggle burger visibility when menu is open */
    .menu-mob-btn.-toggle {
        display: none !important;
        pointer-events: none !important;
    }

    /* Fix header position when menu is open */
    html.menu-open header,
    body.menu-open header {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        z-index: 10000 !important;        
    }
}

/* Desktop overrides */
@media (min-width: 1051px) {
    .menu-mob-btn { display: none !important; }
    .menu-close-btn { display: none !important; }
}

/* Уменьшение текста в хедере при разрешении < 1350px */
@media (max-width: 1350px) {
    .header {
        font-size: 10px;
    }
    .nav-item__link, 
    .header-time, 
    .header-lang, 
    .btn {
        font-size: 10px;
    }
}

/* Hero banner slider */
.banner-container {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding: 0 clamp(12px, 4vw, 60px);
    margin-bottom: clamp(24px, 4vw, 56px);
    box-sizing: border-box;
}

.banner-shell {
    position: relative;
    width: 100%;
    border-radius: clamp(18px, 3vw, 30px);
    overflow: hidden;
    background: #132c1d;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
}

.banner-track {
    display: flex;
    width: 100%;
    min-height: clamp(220px, 22vw, 360px);
    transition: transform 0.8s cubic-bezier(.4,.15,.1,1);
}

.banner-slide {
    position: relative;
    flex: 0 0 100%;
    background: #0a120d;
}

.banner-slide a {
    display: block;
    width: 100%;
    height: 100%;
}

.banner-slide img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.banner-arrow {
    position: absolute;
    top: 50%;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.4);
    background: rgba(0, 0, 0, 0.45);
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.banner-arrow::before {
    content: '';
    width: 12px;
    height: 12px;
    border: solid #37cc65;
    border-width: 0 2px 2px 0;
    transform: rotate(135deg);
}

.banner-arrow--prev {
    left: clamp(12px, 2vw, 32px);
    transform: translate(-50%, -50%);
}

.banner-arrow--next {
    right: clamp(12px, 2vw, 32px);
    transform: translate(50%, -50%);
}

.banner-arrow--next::before {
    transform: rotate(-45deg);
}

.banner-arrow:hover {
    background: rgba(0, 0, 0, 0.7);
    border-color: rgba(255, 255, 255, 0.65);
}

.banner-dots {
    position: absolute;
    bottom: clamp(12px, 2vw, 24px);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 2;
}

.banner-dot {
    width: 18px;
    height: 6px;
    border-radius: 999px;
    border: none;
    background: rgba(255, 255, 255, 0.35);
    cursor: pointer;
    transition: width 0.25s ease, background 0.25s ease;
}

.banner-dot.is-active {
    width: 34px;
    background: #34cc67;
}

/* Feature cards under hero */
.home-feature-grid {
    background: #1d1e20;
    padding: 30px 0;
}

.home-feature-wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: clamp(12px, 2vw, 22px);
    width: 100%;
    padding: 0 20px 10px;
}

.home-feature-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 18px;
    border-radius: 18px;
    background: linear-gradient(135deg, #194a32, #10261c);
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.35);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    min-height: 180px;
}

.home-feature-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 28px 60px rgba(0, 0, 0, 0.45);
}

.home-feature-icon {
    width: 84px;
    height: 84px;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.25s ease;
    transform-origin: center;
}

.home-feature-icon img {
    max-width: 100%;
    height: auto;
}

.home-feature-card:hover .home-feature-icon {
    transform: scale(1.3) rotate(-4deg);
}

.home-feature-title {
    font-size: 16px;
    font-weight: 600;
    color: #ffffff;
}

@media (max-width: 1024px) {
    .home-feature-wrapper {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .home-feature-wrapper {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .home-feature-card {
        min-height: 150px;
    }
}

@media (min-width: 1200px) {
    .home-feature-card {
        min-height: 210px;
        padding: 26px;
        border-radius: 22px;
    }
    .home-feature-icon {
        width: 96px;
        height: 96px;
    }
    .home-feature-title {
        font-size: 18px;
    }
}

@media (max-width: 1024px) {
    .banner-container {
        padding: 0 16px;
    }
    .banner-shell {
        border-radius: 18px;
    }
    .banner-arrow {
        width: 38px;
        height: 38px;
    }
}

@media (max-width: 640px) {
    .banner-track {
        min-height: 200px;
    }
    .banner-arrow {
        display: none;
    }
    .banner-dot {
        width: 14px;
    }
}


/* Секция с играми */
.games-section {    
    padding: 30px 0;
    margin: 0;
    background: var(--default-header-color);
}

.games-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px 20px;
}

.section-title {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    margin: 0;    
}

.games-header-left {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.games-header-icon {
    width: 20px;
    height: 20px;
    border-radius: 6px;    
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.games-header-icon::before {
    content: "";
    width: 14px;
    height: 14px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.games-header-icon--popular::before {
    background-image: url("../../../../icons/popular.png");
}

.games-header-icon--nuevo::before {
    background-image: url("../../../../icons/nuevo.png");
}

.games-view-all {
    color: #ffd858;
    font-weight: 600;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
}

.games-container {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 1px;
    padding: 0 20px 10px;
    justify-items: center;
}

.game-item {    
    border-radius: 22px;
    padding: 2px;
    display: flex;
    flex-direction: column;
    gap: 8px;    
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.game-item a {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.game-item:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 32px rgba(0,0,0,0.55);
}

.game-thumb {
    position: relative;
    aspect-ratio: 1 / 1; /* квадратная плитка */
    border-radius: 18px;
    overflow: hidden;
}

.game-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.game-badge {
    position: absolute;
    bottom: 14px;
    left: 14px;
    background: rgba(0,0,0,0.7);
    color: #ffd75c;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 4px;
}

.game-badge-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #31ff7b;
}

.game-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.game-title {
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    white-space: normal;
}

.game-stats {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: rgba(0,0,0,0.75);
    color: #30ff6d;
    border-radius: 999px;
    padding: 2px 8px;
    font-size: 11px;
}

.game-favorite {
    position: absolute;
    right: 0;
    bottom: 8px;
    width: 20px;
    height: 20px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23aaa' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2L15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2z'/%3E%3C/svg%3E") no-repeat center;
    background-size: contain;
    cursor: pointer;
}

/* Адаптивные стили для мобильных устройств */
@media (max-width: 768px) {    
    .game-image {
        height: 100px;
    }
    
    .game-badge {
        font-size: 9px;
        padding: 2px 6px;
    }
    
    .section-title {
        font-size: 20px;
        margin-left: 15px;
    }
}

.game-image {
    max-width: 100%;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    transition: box-shadow 0.2s ease;
}

.game-item:hover .game-image {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
}

.game-title {
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    margin-top: 8px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    line-height: 1.2;
    height: 1.2em; /* фиксированная высота в одну строку */
    display: block;
    max-width: 100%;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 768px) {
    .games-container {
        padding: 0 15px;
        gap: 1px;
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    
    .game-image {
        max-width: 100%;
        border-radius: 8px;
    }
    
    .game-title {
        font-size: 10px;
        margin-top: 6px;
        height: 1.2em;
        white-space: normal;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

/* Оглавление как выпадающий список */
.table-of-contents {    
    border: 1px solid rgba(254, 200, 56, 0.25);
    border-radius: 16px;
    padding: 10px 14px;
    margin: 24px 0;
    display: none;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
    background: #1d1e20;
}

.table-of-contents .toc-title {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: #fec838;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
}

.table-of-contents .toc-title-text {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.table-of-contents .toc-title-text::before {
    content: '';
    width: 16px;
    height: 16px;
    border-radius: 4px;
    background: linear-gradient(135deg, #2fb669, #194a32);
    display: inline-block;
}

.table-of-contents .toc-title::after {
    content: '';
    width: 8px;
    height: 8px;
    border-right: 2px solid #fec838;
    border-bottom: 2px solid #fec838;
    transform: rotate(45deg);
    transition: transform 0.2s ease;
}

.table-of-contents.is-open .toc-title::after {
    transform: rotate(-135deg);
}

.toc-horizontal-wrapper {
    display: none;
    margin-top: 0;
}

.table-of-contents.is-open .toc-horizontal-wrapper {
    display: block;
    margin-top: 10px;
}

.toc-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.toc-link {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    color: #dfe7ff;
    text-decoration: none;
    font-size: 0.9em;
    line-height: 1.2;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease;
}

.toc-link::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #2fb669;
}

.toc-link:hover {
    color: #1d1e20;
    background: #fec838;
    border-color: #fec838;
}

.toc-level-h3,
.toc-level-h4,
.toc-level-h5,
.toc-level-h6 {
    opacity: 0.85;
}

@media (max-width: 768px) {
    .table-of-contents {
        margin: 20px 0;
        border-radius: 12px;
        padding: 10px 12px;
    }
    .table-of-contents .toc-title {
        font-size: 14px;
    }
    .toc-link {
        font-size: 0.85em;
        padding: 5px 9px;
    }
}

.banner-button {
	text-decoration: none;
	font-weight: 600;
	box-shadow: 0 4px 12px rgba(5, 242, 107, 0.3);
    width: auto;
    display: inline-block;
    transition: all 0.3s ease;
}

.banner-button:hover {
    background: #04d95f;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(5, 242, 107, 0.4);
}

/* Стили для banner-wrapper при разрешении < 1350px */
@media (max-width: 1350px) {
    .banner-content {
        font-size: 10px;
    }
    .banner-badge {
        font-size: 10px;
    }
    .banner-button {
        font-size: 10px;
    }
}

/* Мобильные стили для banner-item */
@media (max-width: 768px) {
    .banner-item {
        background-position: right !important;
        position: relative;
    }
    
    .banner-wrapper {
        grid-template-columns: 1fr;
    }
    
    .banner-image {
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    
    .banner-item::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.3);
        z-index: 1;
    }
    
    .banner-content {
        position: relative;
        z-index: 2;
    }
}



.banner-header {
			color: #fff;
			box-sizing: inherit;
			font-family: -apple-system,SF Pro Display,-apple-system,SF Pro Text,sans-serif;
			font-weight: 800;
			letter-spacing: .33px;
			text-shadow: 0 2px 4px rgba(0,0,0,0.5), 0 4px 8px rgba(0,0,0,0.5);
			max-width: 100%;
			width: 100%;
			font-size: 30px;
			line-height: 106%;
			white-space: pre-line;
		}

        @media (max-width: 768px) {
    .banner-container {
        height: auto;
    }
    
    .banner-item {
        height: 200px;
    }
}

/*grid*/

        .grid-container {
            display: flex;
            gap: 15px;
            width: 100%;
            max-width: 1200px;
            margin: 0 auto;
            flex-wrap: wrap;
			justify-content: space-between;
			margin: 15px 0 15px 0;
        }

        .grid-item {
            display: flex;
            align-items: center;
            background-image: linear-gradient(110deg,#1e283f,rgba(20,27,46,.6) 100%);
            padding: 15px;
            border-radius: 8px;
            text-decoration: none;
            color: #fff;
            width: 30%;
            min-width: 200px;
			justify-content: space-between;
        }
		
		.grid-item:hover {
			scale: 1.1;
}

        .grid-icon {
            width: 50px;
            height: 50px;
            margin-right: 15px;
            display: flex;
            align-items: center;
            justify-content: center;
			font-size: 35px;
        }

        .grid-text {
            display: flex;
            flex-direction: column;
        }

        .grid-title {
            font-size: 18px;
            font-weight: bold;
        }

        .grid-subtitle {
            font-size: 14px;
        }

        @media (max-width: 768px) {
            .grid-container {
                flex-direction: column;
                align-items: center;
            }
            .grid-item {
                width: 100%;
            }
        }

body > header > div {
    max-width: 100%;
}

#wpfront-scroll-top-container img {
    margin-bottom: 60px;
}
/* =============================================================
   Color overhaul to match screenshot (dark indigo + vivid accents)
   ============================================================= */
:root {
    --default-color: #082a54;              /* accent yellow */
    --default-lighten-color: #33cc66;      /* accent green */
    --default-catifsh-color: #04182f;      /* base background */
    --default-header-color: #062241;       /* header background */
    --default-footer-color: #062241;       /* footer/surfaces */
    --surface-1: #242832;                  /* cards/surfaces */
    --cta-yellow-1: #ffe06d;               /* CTA start */
    --cta-yellow-2: #f7b733;               /* CTA end */
    --btn-text: #ffffff;
}

body { background: var(--default-catifsh-color); }
.header { background: var(--default-header-color); }
.main { background-color: var(--default-catifsh-color); }


.btn-register {
    background: linear-gradient(90deg, var(--cta-yellow-1) 0%, var(--cta-yellow-2) 100%);
    border-radius: 999px;
    box-shadow: 0 8px 20px rgba(255, 194, 51, 0.35);
    border: 2px solid #3b2c0e;
}

.btn-login {
    background: var(--default-header-color);
    border-radius: 999px;
    border: 1px solid var(--default-lighten-color);
    box-shadow: 0 0 0 3px rgba(46, 113, 255, 0.3);
}

.btn-login:hover,
.btn-login:focus {
    background: var(--default-lighten-color);
    border-color: var(--default-lighten-color);
    box-shadow: none;
    opacity: 1;
}

.banner-item {
    background: linear-gradient(110deg, #1A1F4F, var(--default-lighten-color) 100%);
}
/* ==========================
   FAQ: palette overrides
   ========================== */
.faq-block .faq-block--items .faq-block--items__item .faq-block--items__item--header:hover {    
    border-color:#1b583a !important;
}

/* ==========================
   Footer: palette overrides
   ========================== */
footer { background: var(--default-footer-color) !important; color: #fff !important; }
.provider-item { background: var(--surface-1) !important; }
.footer-menu-section { border-color: rgba(46, 113, 255, 0.15) !important; }
.footer-menu-column a:hover { color: var(--default-lighten-color) !important; }
.social-icon { background: var(--surface-1) !important; }
.social-icon:hover { background: var(--default-lighten-color) !important; }
.footer-copyright-section { background-color: var(--default-header-color) !important; border-top: 1px solid rgba(46, 113, 255, 0.25) !important; }
.license-link { color: var(--default-lighten-color) !important; }
.language-selector { background: var(--surface-1) !important; border: 1px solid rgba(46, 113, 255, 0.3) !important; }
.language-selector span { color: #fff !important; }

/* ==========================
   Footer menu-section: palette overrides
   ========================== */
.footer-menu-section { background: var(--default-footer-color) !important; border-top: 1px solid rgba(46, 113, 255, 0.15) !important; border-bottom: 1px solid rgba(46, 113, 255, 0.15) !important; }
.footer-menu-title { color: var(--default-lighten-color) !important; }
.footer-menu-column a { color: #c7ccf8 !important; }
.footer-menu-column a:hover { color: var(--default-lighten-color) !important; }

/* ==========================
   Table of contents: palette overrides
   ========================== */
.table-of-contents {border: 1px solid rgba(46, 113, 255, 0.25) !important; border-radius: 12px !important; padding: 16px !important; }
.table-of-contents .toc-title { color: #fff !important; border-bottom: 2px solid var(--default-lighten-color) !important; }
.toc-horizontal-wrapper::-webkit-scrollbar-track { background: rgba(46, 113, 255, 0.15) !important; }
.toc-horizontal-wrapper::-webkit-scrollbar-thumb { background: var(--default-lighten-color) !important; }
.toc-horizontal-wrapper::-webkit-scrollbar-thumb:hover { background: #6B4CFF !important; }
.toc-link { background: var(--surface-1) !important; color: #fff !important; border: 1px solid rgba(46, 113, 255, 0.35) !important; border-radius: 8px !important; }
.toc-link:hover { background: #232A66 !important; color: #fff !important; border-color: rgba(46, 113, 255, 0.60) !important; transform: translateY(-1px); box-shadow: 0 2px 8px rgba(46, 113, 255, 0.35) !important; }

/* ==========================
   Banner: palette and layout adjustments
   ========================== */
/* Badge: solid blue */
.banner-item .banner-badge {
    background: #3425DF !important;
    box-shadow: 0 6px 18px rgba(52, 37, 223, 0.35) !important;
}

/* Button: solid yellow */
.banner-item .banner-button {
    background: #FEC838 !important;
    color: #000 !important;
    box-shadow: 0 8px 20px rgba(254, 200, 56, 0.35) !important;
    border: 2px solid #3b2c0e !important;
}
.banner-item .banner-button:hover {
    background: #FFD34C !important;
    filter: none !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(254, 200, 56, 0.50) !important;
}

/* Register button: solid yellow too */
.btn-register {
    background: #FEC838 !important;
    border-radius: 999px !important;
    box-shadow: 0 8px 20px rgba(254, 200, 56, 0.35) !important;
    border: 2px solid #3b2c0e !important;
}
.btn.btn-register > a { color: #000 !important; }

/* Make banner-content consistent across cards (align from top, fixed min-height) */
.banner-content {
    align-content: start !important;
    min-height: 160px; /* keeps visual consistency even with less text */
}

/* ==========================
   Footer redesign
   ========================== */
.site-footer {
    background: #1d1e20;
    color: #dbe5f2;
}
.site-footer__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.footer-columns {
    display: flex;
    justify-content: space-between;
    gap: 60px;
}
.footer-column {
    min-width: 0;
}
.footer-column__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.footer-column__title {
    color: rgba(255, 255, 255, 0.75);
    font-size: 14px;
    font-weight: 600;
}
.footer-column__chevron {
    width: 10px;
    height: 10px;
    border-right: 2px solid rgba(255, 255, 255, 0.75);
    border-bottom: 2px solid rgba(255, 255, 255, 0.75);
    transform: rotate(45deg);
    transition: transform 0.2s ease;
    display: none;
}
.footer-column.is-open .footer-column__chevron {
    transform: rotate(-135deg);
}
.footer-column__list {
    margin: 0;
    padding: 0;
    list-style: none;
}
.footer-column li {
    margin-bottom: 12px;
}
.footer-column a {
    color: #f5f6fb;
    text-decoration: none;
    font-size: 14px;
    line-height: 1.4;
    transition: color 0.2s ease;
}
.footer-column a:hover {
    color: #fec838;
}
.footer-brand {
    margin-top: 40px;
    display: flex;
    justify-content: space-between;
    gap: 32px;
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding-top: 32px;
}
.footer-brand__title {
    font-size: 16px;
    font-weight: 600;
    color: #f5f6fb;
    margin-bottom: 8px;
}
.footer-brand__text {
    font-size: 14px;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.85);
}
.footer-brand__badges {
    display: flex;
    align-items: center;
    gap: 16px;
}
.footer-license {
    width: 72px;
}
.footer-age-badge {
    background: #1d1e20;
    border: 2px solid #fec838;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    color: #fec838;
}
.footer-disclaimer-wrapper {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-top: 24px;
    align-items: center;
}
.footer-disclaimer-badge {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    color: rgba(255, 255, 255, 0.7);
}
.footer-disclaimer-badge svg {
    width: 100%;
    height: 100%;
}
.footer-disclaimer {
    margin: 0;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.5;
}
.footer-controls {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-bottom: 8px;
}
.footer-control {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    text-decoration: none;
    color: #f5f6fb;
    font-size: 14px;
    transition: border-color 0.2s ease, color 0.2s ease;
}

/* Языковой селектор в футере скрываем на десктопе */
.footer-control--select {
    display: none;
}
.footer-control--toggle {
    padding: 8px 12px;
    gap: 6px;
    background: rgba(255, 255, 255, 0.08);
    border-color: transparent;
}
.footer-toggle__sun,
.footer-toggle__moon {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
}
.footer-toggle__sun {
    background: rgba(255, 255, 255, 0.1);
    color: #a0a0a0;
}
.footer-toggle__sun svg {
    width: 18px;
    height: 18px;
}
.footer-toggle__moon {
    background: #000;
    color: #ffb366;
}
.footer-toggle__moon svg {
    width: 18px;
    height: 18px;
}
.footer-control--toggle:hover .footer-toggle__sun {
    background: rgba(255, 255, 255, 0.15);
}
.footer-control--toggle:hover .footer-toggle__moon {
    background: rgba(255, 200, 100, 0.25);
}
.footer-column summary,
.footer-column__chevron {
    display: none;
}
.footer-control__arrow {
    width: 8px;
    height: 8px;
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    transform: rotate(45deg);
    margin-left: 2px;
}
.footer-control:hover {
    border-color: #fec838;
    color: #fec838;
}

/* На десктопе смещаем футер, чтобы он не уходил под левый сайдбар */
@media (min-width: 1025px) {
    .site-footer__inner {
        max-width: none;
        margin: 0;
        padding: 24px 24px 24px 304px; /* 280px ширина сайдбара + небольшой отступ */
    }
}

@media (max-width: 1023px) {
    .footer-columns {
        flex-direction: column;
        gap: 0;
    }
    .footer-control--select {
        display: inline-flex;
    }
    .footer-column {
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        padding: 20px 0;
    }
    .footer-column:last-child {
        border-bottom: none;
    }
    .footer-column__header {
        cursor: pointer;
        margin-bottom: 0;
    }
    .footer-column__chevron {
        display: block;
    }
    .footer-column__list {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.3s ease;
    }
    .footer-column.is-open .footer-column__list {
        max-height: 500px;
        margin-top: 16px;
    }
    .footer-brand {
        flex-direction: column;
        align-items: flex-start;
    }
    .footer-controls {
        justify-content: center;
    }
}
/* ===== Mobile header layout overrides ===== */
@media (max-width: 900px) {
  .menu-mob-btn {
    position: static !important;
    right: auto !important;
    justify-self: end;
  }
}

@media (max-width: 900px) {
  .header { height: auto; }

  .header-wrap {
    justify-content: space-between;
    width: 100%;
  }
}

/* ===================================================
   MEJORES CUOTAS СЕКЦИЯ
   =================================================== */

.mejores-cuotas {    
    padding: 24px 30px;
    margin-bottom: 0;
}

.mejores-cuotas-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
}

.mejores-cuotas-icon {
    width: 28px;
    height: 28px;
    display: inline-flex;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fec838'%3E%3Cpath d='M23 10c0-1.1-.9-2-2-2h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-2zM1 21h4V9H1v12z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    flex-shrink: 0;
}

.mejores-cuotas-title {
    font-size: 18px;
    font-weight: 600;
    color: #ffffff;
    margin: 0;
}

.mejores-cuotas-list {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.mejores-cuotas-list::-webkit-scrollbar {
    height: 4px;
}

.mejores-cuotas-list::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.05);
    border-radius: 2px;
}

.mejores-cuotas-list::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15);
    border-radius: 2px;
}

.cuota-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 16px 24px;
    border-radius: 16px;    
    text-decoration: none;
    transition: all 0.25s ease;
    cursor: pointer;
    min-width: 140px;
}

.cuota-item:hover {
    background: rgba(0, 0, 0, 0.4);
    transform: translateY(-3px);
}

.cuota-item-active {
    background: #2d6144;
}

.cuota-item-active:hover {
    background: #327350;
}

.cuota-icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;    
    display: flex;
    align-items: center;
    justify-content: center;
}


.cuota-sport-icon {
    display: inline-flex;
    width: 32px;
    height: 32px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.cuota-label {
    font-size: 14px;
    font-weight: 500;
    color: #e0e4ed;
    text-align: center;
    line-height: 1.2;
}

.cuota-item-active .cuota-label {
    color: #ffffff;
    font-weight: 600;
}

/* Иконки для Mejores cuotas */
.icon-futbol-cuota {
    -webkit-mask-image: url("../../../../icons/football.svg");
            mask-image: url("../../../../icons/football.svg");
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: contain;
            mask-size: contain;
    background-color: #ffc938;
}

.cuota-item-active .icon-futbol-cuota {
    background-color: #ffc938;
}

.icon-baloncesto-cuota {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2v20M2 12h20M6 4Q12 12 6 20M18 4Q12 12 18 20' stroke-linecap='round'/%3E%3C/svg%3E");
}

.cuota-item-active .icon-baloncesto-cuota {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fec838' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2v20M2 12h20M6 4Q12 12 6 20M18 4Q12 12 18 20' stroke-linecap='round'/%3E%3C/svg%3E");
}

.icon-voleibol-cuota {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M4 10c2-3 5-5 8-5s6 2 8 5' stroke-linecap='round'/%3E%3Cpath d='M4 14c2 3 5 5 8 5s6-2 8-5' stroke-linecap='round'/%3E%3Cpath d='M9 4c2 2.5 3 5.2 3 8s-1 5.5-3 8' stroke-linecap='round'/%3E%3C/svg%3E");
}

.cuota-item-active .icon-voleibol-cuota {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fec838' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M4 10c2-3 5-5 8-5s6 2 8 5' stroke-linecap='round'/%3E%3Cpath d='M4 14c2 3 5 5 8 5s6-2 8-5' stroke-linecap='round'/%3E%3Cpath d='M9 4c2 2.5 3 5.2 3 8s-1 5.5-3 8' stroke-linecap='round'/%3E%3C/svg%3E");
}

.icon-futbol-americano-cuota {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.5'%3E%3Cellipse cx='12' cy='12' rx='10' ry='7'/%3E%3Cpath d='M12 5v14M9 10h6M9 12h6M9 14h6' stroke-linecap='round'/%3E%3C/svg%3E");
}

.cuota-item-active .icon-futbol-americano-cuota {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fec838' stroke-width='1.5'%3E%3Cellipse cx='12' cy='12' rx='10' ry='7'/%3E%3Cpath d='M12 5v14M9 10h6M9 12h6M9 14h6' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* Адаптивность для мобильных */
@media (max-width: 768px) {
    .mejores-cuotas {
        padding: 20px;
    }
    
    .mejores-cuotas-list {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 10px;
        gap: 16px;
    }
    
    .cuota-item {
        flex-shrink: 0;
        min-width: 110px;
        padding: 14px 18px;
    }
    
    .cuota-icon {
        width: 48px;
        height: 48px;
    }
    
    .cuota-sport-icon {
        width: 28px;
        height: 28px;
    }
}

/* ===================================================
   YA EN DIRECTO СЕКЦИЯ
   =================================================== */

.ya-en-directo {
    background: #ffffff;
    padding: 24px 30px;
    margin-bottom: 0;
    border-radius: 16px 16px 0 0;
}

.directo-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 24px;
}

.directo-header-left {
    display: flex;
    align-items: center;
    gap: 12px;
}

.directo-icon {
    width: 24px;
    height: 24px;
    display: inline-flex;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fec838' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='1' fill='%23fec838'/%3E%3Cpath d='M8.5 8.5c-1.9 1.9-1.9 5.1 0 7M15.5 8.5c1.9 1.9 1.9 5.1 0 7M5 5c-4 4-4 10 0 14M19 5c4 4 4 10 0 14'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    flex-shrink: 0;
}

.directo-title {
    font-size: 18px;
    font-weight: 600;
    color: #1a1a1a;
    margin: 0;
}

.directo-view-all {
    font-size: 14px;
    font-weight: 600;
    color: #fec838;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 6px;
    transition: color 0.2s ease;
}

.directo-view-all:hover {
    color: #f9b634;
}

.arrow-icon {
    font-size: 16px;
}

.directo-list {
    display: flex;
    gap: 12px;
    align-items: center;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
}

.directo-list::-webkit-scrollbar {
    height: 4px;
}

.directo-list::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.05);
    border-radius: 2px;
}

.directo-list::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15);
    border-radius: 2px;
}

.directo-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 14px 18px;
    border-radius: 12px;
    background: #f5f5f5;
    text-decoration: none;
    transition: all 0.2s ease;
    cursor: pointer;
    flex-shrink: 0;
    min-width: 100px;
}

.directo-item:hover {
    background: #ebebeb;
    transform: translateY(-2px);
}

.directo-item-active {
    background: #fff7e0;
}

.directo-item-active:hover {
    background: #fff7e0;
}

.directo-sport-icon {
    width: 36px;
    height: 36px;
    display: inline-flex;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* ===================================================
   MOBILE BOTTOM NAV (липкое нижнее меню)
   =================================================== */

.mobile-bottom-nav {
    display: none;
}

@media (max-width: 768px) {
    .mobile-bottom-nav {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        height: 64px;
        background: #1d1e20;
        border-top: 1px solid rgba(255, 255, 255, 0.08);
        display: flex;
        align-items: center;
        justify-content: space-around;
        padding: 8px 10px;
        z-index: 10000;
    }

    body {
        padding-bottom: 80px;
    }

    .mobile-bottom-nav__item {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        text-decoration: none;
        color: #f3f4f6;
        font-size: 12px;
        font-weight: 400;
    }

    .mobile-bottom-nav__item--active {
        background: #145436;
        border-radius: 0 10px 10px 0;
        height: 48px;
        border-bottom: 3px solid #f9c904;
    }

    .mobile-bottom-nav__item--active .mobile-bottom-nav__label {
        color: #f9c904;
    }

    .mobile-bottom-nav__icon.nav-item__icon {
        width: 22px;
        height: 22px;
    }

    .mobile-bottom-nav__label {
        line-height: 1.1;
        text-align: center;
    }

    /* Иконки нижнего меню – используем PNG из /icons */
    .mobile-bottom-nav__icon.icon-deportes {
        -webkit-mask-image: none;
                mask-image: none;
        background-image: url("../../../../icons/deportes.png");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        background-color: transparent;
    }

    .mobile-bottom-nav__icon.icon-en-vivo {
        -webkit-mask-image: none;
                mask-image: none;
        background-image: url("../../../../icons/en%20vivo.png");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        background-color: transparent;
    }

    .mobile-bottom-nav__icon.icon-casino {
        -webkit-mask-image: none;
                mask-image: none;
        background-image: url("../../../../icons/casino%20en%20vivo.png");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        background-color: transparent;
    }

    .mobile-bottom-nav__icon.icon-slots {
        -webkit-mask-image: none;
                mask-image: none;
        background-image: url("../../../../icons/slots.png");
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
        background-color: transparent;
    }

    /* Поднимаем кнопку scroll-top над нижним меню */
    #wpfront-scroll-top-container {
        bottom: 90px !important;
    }
}

.directo-label {
    font-size: 13px;
    font-weight: 500;
    color: #1a1a1a;
    text-align: center;
    line-height: 1.2;
}

/* Иконки для Ya en directo - черные заливкой как на скриншоте */

/* 1. Fútbol - общий SVG из /icons/football.svg, заливка #dbac1a */
.icon-directo-futbol {
    -webkit-mask-image: url("../../../../icons/football.svg");
            mask-image: url("../../../../icons/football.svg");
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: contain;
            mask-size: contain;
    background-color: #dbac1a;
}

/* 2. Baloncesto - баскетбольный мяч */
.icon-directo-baloncesto {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.8'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2v20M2 12h20' stroke-linecap='round'/%3E%3Cpath d='M6 4Q12 12 6 20M18 4Q12 12 18 20' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 3. Tenis - теннисный мяч с волнистыми линиями */
.icon-directo-tenis {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.8'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M4 8Q12 12 4 16M20 8Q12 12 20 16' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 4. E-Deportes - геймпад */
.icon-directo-esports {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%23000000' stroke-width='2'%3E%3Cpath d='M6 18c0 3.3 2.7 6 6 6h2l2-3 2 3h2c3.3 0 6-2.7 6-6 0-4.4-3.6-8-8-8h-4c-4.4 0-8 3.6-8 8z'/%3E%3Cline x1='12' y1='17' x2='12' y2='21' stroke-linecap='round'/%3E%3Cline x1='10' y1='19' x2='14' y2='19' stroke-linecap='round'/%3E%3Ccircle cx='20' cy='18' r='1.2'/%3E%3Ccircle cx='23' cy='16' r='1.2'/%3E%3C/svg%3E");
}

/* 5. Béisbol - бейсбольный мяч со швами */
.icon-directo-beisbol {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.8'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M8 6L9 8L8 10L7 12L8 14L9 16L8 18M16 6L15 8L16 10L17 12L16 14L15 16L16 18' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 6. Voleibol - волейбольный мяч (другой узор, не как футбол) */
.icon-directo-voleibol {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.8'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M4 10c2-3 5-5 8-5s6 2 8 5' stroke-linecap='round'/%3E%3Cpath d='M4 14c2 3 5 5 8 5s6-2 8-5' stroke-linecap='round'/%3E%3Cpath d='M9 4c2 2.5 3 5.2 3 8s-1 5.5-3 8' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 7. Balonmano - рука с мячом (handball) */
.icon-directo-balonmano {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.8'%3E%3Ccircle cx='17' cy='7' r='3' fill='none'/%3E%3Cpath d='M5 20v-5a1 1 0 0 1 2 0v3h1v-4a1 1 0 0 1 2 0v4h1v-3a1 1 0 0 1 2 0v5h3a2 2 0 0 1 0 4H9a4 4 0 0 1-4-4z' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* 8. Fútbol americano - овальный мяч */
.icon-directo-futbol-americano {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.8'%3E%3Cellipse cx='12' cy='12' rx='10' ry='7'/%3E%3Cpath d='M12 5v14M9 10h6M9 12h6M9 14h6' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 9. Reglas australianas - овальный мяч регби */
.icon-directo-rugby {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.8'%3E%3Cellipse cx='12' cy='12' rx='10' ry='7' transform='rotate(-15 12 12)'/%3E%3Cpath d='M8 12h8M10 9l4 6M14 9l-4 6' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* 10. Hockey con pelota - клюшка и шайба */
.icon-directo-hockey {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000000' stroke-width='1.8'%3E%3Cpath d='M6 4l7 12c.6 1 1.4 1.5 2.5 1.5H19' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M17 19c0 .8-.9 1.5-2 1.5s-2-.7-2-1.5 1-1.5 2-1.5 2 .7 2 1.5z' fill='%23000000'/%3E%3C/svg%3E");
}

/* Адаптивность */
@media (max-width: 768px) {
    .ya-en-directo {
        padding: 20px;
        border-radius: 12px 12px 0 0;
    }
    
    .directo-header {
        margin-bottom: 20px;
    }
    
    .directo-item {
        min-width: 90px;
        padding: 12px 14px;
    }
    
    .directo-sport-icon {
        width: 32px;
        height: 32px;
    }
}

/* ===================================================
   SIDEBAR DEPORTIVO (как на скриншоте Pampas)
   =================================================== */

/* Sports Sidebar - левая колонка */
.sports-sidebar {
    position: fixed;
    left: 0;
    top: 76px; /* высота header */
    width: 280px;
    height: calc(100vh - 76px);
    background: #1d1e20;
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 1000;
    box-shadow: 2px 0 12px rgba(0, 0, 0, 0.25);
}

/* Скроллбар для сайдбара */
.sports-sidebar::-webkit-scrollbar {
    width: 6px;
}

.sports-sidebar::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
}

.sports-sidebar::-webkit-scrollbar-thumb {
    background: rgba(254, 200, 56, 0.3);
    border-radius: 3px;
}

.sports-sidebar::-webkit-scrollbar-thumb:hover {
    background: rgba(254, 200, 56, 0.5);
}

.sports-sidebar-inner {
    padding: 45px 0;
}

/* Секция сайдбара */
.sidebar-section {
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.sidebar-section:last-child {
    border-bottom: none;
}

/* Заголовок секции */
.sidebar-section-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 20px;
    margin-bottom: 8px;
}

.sidebar-icon {
    font-size: 18px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
}

/* Иконка для Torneos principales - SVG */
.sidebar-icon-home {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 2C12 2 7 7.5 7 12C7 14.7614 9.23858 17 12 17C14.7614 17 17 14.7614 17 12C17 7.5 12 2 12 2Z' stroke='%23fec838' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3Cpath d='M12 9C12 9 10 10.5 10 12C10 13.1046 10.8954 14 12 14C13.1046 14 14 13.1046 14 12C14 10.5 12 9 12 9Z' stroke='%23fec838' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.sidebar-icon-home::before {
    content: '';
}

/* Иконка для Deportes - футбольный мяч */
.sidebar-icon-deportes {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    -webkit-mask-image: url("../../../../icons/football.svg");
            mask-image: url("../../../../icons/football.svg");
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: contain;
            mask-size: contain;
    background-color: #ffc938;
}

.sidebar-section-title {
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
    margin: 0;
    letter-spacing: 0.3px;
    text-transform: none;
}

/* Меню сайдбара */
.sidebar-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.sidebar-menu-item {
    margin: 0;
}

/* Ссылки сайдбара */
.sidebar-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    color: #e0e4ed;
    text-decoration: none;
    font-size: 13px;
    line-height: 1.3;
    transition: all 0.2s ease;
    border-left: 3px solid transparent;
}

.sidebar-link:hover {
    background: rgba(254, 200, 56, 0.08);
    border-left-color: #fec838;
    color: #ffffff;
}

.sidebar-flag {
    font-size: 16px;
    line-height: 1;
    flex-shrink: 0;
}

.sidebar-sport-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* Fútbol - футбольный мяч */
.icon-futbol {
    -webkit-mask-image: url("../../../../icons/football.svg");
            mask-image: url("../../../../icons/football.svg");
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-size: contain;
            mask-size: contain;
    background-color: #ffc938;
}

/* Baloncesto - баскетбольный мяч */
.icon-baloncesto {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fec838' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2v20M2 12h20M6 4Q12 12 6 20M18 4Q12 12 18 20' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* Tenis - теннисный мяч */
.icon-tenis {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fec838' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M4 8Q12 12 4 16M20 8Q12 12 20 16' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* E-Deportes - геймпад */
.icon-esports {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none' stroke='%23fec838' stroke-width='2'%3E%3Cpath d='M6 18c0 3.3 2.7 6 6 6h2l2-3 2 3h2c3.3 0 6-2.7 6-6 0-4.4-3.6-8-8-8h-4c-4.4 0-8 3.6-8 8z'/%3E%3Cline x1='12' y1='17' x2='12' y2='21' stroke-linecap='round'/%3E%3Cline x1='10' y1='19' x2='14' y2='19' stroke-linecap='round'/%3E%3Ccircle cx='20' cy='18' r='1.2'/%3E%3Ccircle cx='23' cy='16' r='1.2'/%3E%3C/svg%3E");
}

/* Béisbol - бейсбольный мяч */
.icon-beisbol {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fec838' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M8 6L9 8L8 10L7 12L8 14L9 16L8 18M16 6L15 8L16 10L17 12L16 14L15 16L16 18' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* Voleibol - волейбольный мяч */
.icon-voleibol {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fec838' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M4 10c2-3 5-5 8-5s6 2 8 5' stroke-linecap='round'/%3E%3Cpath d='M4 14c2 3 5 5 8 5s6-2 8-5' stroke-linecap='round'/%3E%3Cpath d='M9 4c2 2.5 3 5.2 3 8s-1 5.5-3 8' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* Balonmano - гандбольный мяч */
.icon-balonmano {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fec838' stroke-width='1.8'%3E%3Ccircle cx='17' cy='7' r='3' fill='none'/%3E%3Cpath d='M5 20v-5a1 1 0 0 1 2 0v3h1v-4a1 1 0 0 1 2 0v4h1v-3a1 1 0 0 1 2 0v5h3a2 2 0 0 1 0 4H9a4 4 0 0 1-4-4z' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* Fútbol americano - американский футбольный мяч */
.icon-futbol-americano {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fec838' stroke-width='1.5'%3E%3Cellipse cx='12' cy='12' rx='10' ry='7'/%3E%3Cpath d='M12 5v14M9 10h6M9 12h6M9 14h6' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* Rugby - мяч для австралийского футбола */
.icon-rugby {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fec838' stroke-width='1.5'%3E%3Cellipse cx='12' cy='12' rx='10' ry='7' transform='rotate(-15 12 12)'/%3E%3Cpath d='M8 12h8M10 9l4 6M14 9l-4 6' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* Bádminton - воланчик */
.icon-badminton {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fec838' stroke-width='1.5'%3E%3Ccircle cx='12' cy='8' r='3'/%3E%3Cpath d='M9 10L8 16L10 20h4l2-4-1-6M12 11v9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.sidebar-text {
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ===================================================
   LAYOUT: Сдвиг контента под сайдбар
   =================================================== */

/* Main content wrapper - сдвигаем только основной контент */
.main {
    margin-left: 280px;
}

/* Banner - адаптируем под новый layout */
.banner-container {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}

/* Feature grid и games section - полная ширина в пределах main */
.home-feature-grid,
.games-section {
    width: 100%;
}

/* Container для текстового контента */
.main > .container {
    max-width: 1220px;
    margin-left: auto;
    margin-right: auto;
}

/* ===================================================
   АДАПТИВНОСТЬ: СКРЫВАЕМ САЙДБАР НА МОБИЛЬНЫХ
   =================================================== */

@media (max-width: 1024px) {
    .sports-sidebar,
    .casino-sidebar {
        display: none;
    }
    
    .main {
        margin-left: 0;
    }
    
    .banner-container {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
    }
}

/* Новый казино-сайдбар: используем ту же раскладку, старый скрываем */
.sports-sidebar {
    display: none !important;
}

.casino-sidebar {
    position: fixed;
    left: 0;
    top: 76px;
    width: 280px;
    height: calc(100vh - 76px);
    background: var(--default-catifsh-color);
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    overflow-y: auto;
    overflow-x: hidden;
    z-index: 1000;
    box-shadow: 2px 0 12px rgba(0, 0, 0, 0.25);
}

.casino-sidebar::-webkit-scrollbar {
    width: 6px;
}

.casino-sidebar::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
}

.casino-sidebar::-webkit-scrollbar-thumb {
    background: rgba(254, 200, 56, 0.3);
    border-radius: 3px;
}

.casino-sidebar::-webkit-scrollbar-thumb:hover {
    background: rgba(254, 200, 56, 0.5);
}

/* Поисковая строка и горизонтальное меню категорий под баннером */
.casino-search-row {
    padding: 10px 0 6px;
    background: var(--default-header-color);
}

.casino-search-wrapper {
    width: 100%;
    margin: 0 auto;
    padding: 0 30px;
}

.casino-search-form {
    display: flex;
    align-items: center;
    background: #16181f;
    border-radius: 12px;
    padding: 8px 12px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    margin-bottom: 10px;
}

.casino-search-icon {
    width: 18px;
    height: 18px;
    margin-right: 8px;
    background-image: url("../assets/img/search-icon.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px;
    opacity: 0.9;
}

.casino-search-input {
    flex: 1;
    background: transparent;
    border: none;
    outline: none;
    color: #ffffff;
    font-size: 14px;
}

.casino-search-input::placeholder {
    color: rgba(255, 255, 255, 0.6);
}

.casino-category-strip {
    display: flex;
    align-items: center;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 6px;
}

.casino-category-strip::-webkit-scrollbar {
    height: 4px;
}

.casino-category-strip::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.25);
}

.casino-category-strip::-webkit-scrollbar-thumb {
    background: rgba(248, 201, 5, 0.7);
    border-radius: 999px;
}

.casino-category-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    background: #101217;
    border: 1px solid rgba(255, 255, 255, 0.08);
    text-decoration: none;
    color: #ffffff;
    white-space: nowrap;
    flex-shrink: 0;
    font-size: 13px;
}

.casino-category-chip:hover {
    border-color: #f8c905;
}

.casino-category-icon {
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.casino-category-icon img {
    max-width: 100%;
    max-height: 100%;
}

.casino-category-label {
    font-size: 13px;
    font-weight: 500;
}

/* Кнопка "Juego afortunado" */
.sidebar-lucky-btn {
    width: 100%;
    margin: 0 0 16px;
    padding: 14px 18px;
    border-radius: 15px;
    border: none;
    background: #fec838;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 700;
    color: #1a1305;
    box-shadow: 0 8px 20px rgba(254, 200, 56, 0.35);
}

.sidebar-lucky-icon {
    width: 20px;
    height: 20px;
    position: relative;
}

.sidebar-lucky-icon::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("../../../../icons/shuffle.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* Карточка с джокером */
.sidebar-bonus-card {
    margin: 0 0 18px;
    padding: 14px 14px 12px;
    border-radius: 16px;
    border: 2px solid #f8c905;
    background: #111111;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.sidebar-bonus-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.sidebar-bonus-title-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sidebar-bonus-icon {
    width: 20px;
    height: 20px;
    border-radius: 6px;   
    position: relative;
}

.sidebar-bonus-icon::before {
    content: "";
    position: absolute;
    inset: 2px;
    border-radius: 4px;
    background-image: url("../../../../icons/gift.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.sidebar-bonus-title-block {
    display: flex;
    flex-direction: column;
}

.sidebar-bonus-title {
    font-size: 10px;
    font-weight: 700;
}

.sidebar-bonus-subtitle {
    font-size: 11px;
    color: #ffdd7a;
}

.sidebar-bonus-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    font-weight: 600;
    color: #fec838;
    text-decoration: none;
}

.sidebar-bonus-link-icon {
    width: 10px;
    height: 10px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(-45deg);
}

.sidebar-bonus-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.sidebar-bonus-image-wrap {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
}

.sidebar-bonus-image {
    width: 100%;
    display: block;
}

.sidebar-bonus-game-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    padding: 3px 8px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.75);
    font-size: 10px;
    font-weight: 600;
}

.sidebar-bonus-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    padding: 10px 12px;
    margin: 0 -14px -12px;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    border-radius: 0 0 14px 14px;
    background: linear-gradient(90deg, #084623 0%, #03311c 100%);
}

.sidebar-bonus-footer-text {
    font-size: 13px;
    line-height: 1.3;
    color: #f3f4f6;
    font-weight: 600;
}

.sidebar-bonus-info-icon {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.85);
    position: relative;
    flex-shrink: 0;
}

.sidebar-bonus-info-icon::before {
    content: "!";
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

.sidebar-section-flag img {
    width: 24px;
    height: 24px;
    border-radius: 4px;
    object-fit: cover;
}

.sidebar-section--themes {
    margin-top: 4px;
}

.sidebar-menu-item--active {
    background: linear-gradient(90deg, #0f5130, #0a3b22);
}

.sidebar-menu-item--active .sidebar-link {
    border-left-color: #fec838;
    color: #ffffff;
}

.sidebar-menu-item--theme-active .sidebar-link {
    border-left-color: #fec838;
}

.sidebar-category-icon,
.sidebar-theme-icon {
    width: 22px;
    height: 22px;
    border-radius: 6px;
    flex-shrink: 0;
    background: #262830;
    position: relative;
}

.sidebar-category-icon--popular::before,
.sidebar-category-icon--new::before,
.sidebar-category-icon--crash::before,
.sidebar-category-icon--instant::before,
.sidebar-category-icon--cashback::before,
.sidebar-category-icon--missions::before,
.sidebar-category-icon--wheel::before,
.sidebar-category-icon--bonus-games::before,
.sidebar-category-icon--top10::before,
.sidebar-category-icon--table-games::before,
.sidebar-category-icon--lottery::before,
.sidebar-category-icon--all::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 6px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* Конкретные иконки категорий */
.sidebar-category-icon--popular::before {
    background-image: url("../../../../icons/popular.png");
}
.sidebar-category-icon--new::before {
    background-image: url("../../../../icons/nuevo.png");
}
.sidebar-category-icon--crash::before {
    background-image: url("../../../../icons/juegos%20crash.png");
}
.sidebar-category-icon--instant::before {
    background-image: url("../../../../icons/Ganancia-instantnea.png");
}
.sidebar-category-icon--cashback::before {
    background-image: url("../../../../icons/Reembolso%2010%20%25.png");
}
.sidebar-category-icon--missions::before {
    background-image: url("../../../../icons/Misiones%20diarias.png");
}
.sidebar-category-icon--wheel::before {
    background-image: url("../../../../icons/Ruedas-de-bonificacion.png");
}
.sidebar-category-icon--bonus-games::before {
    background-image: url("../../../../icons/Juegos-de-bonificacion.png");
}
.sidebar-category-icon--top10::before {
    background-image: url("../../../../icons/TOP%2010%20Juegos.png");
}
.sidebar-category-icon--table-games::before {
    background-image: url("../../../../icons/Juegos%20de%20mesa.png");
}
.sidebar-category-icon--lottery::before {
    background-image: url("../../../../icons/Loteriias.png");
}
.sidebar-category-icon--all::before {
    background-image: url("../../../../icons/TODO.png");
}

/* Темы: подключаем PNG-иконки */
.sidebar-theme-icon--777::before,
.sidebar-theme-icon--todo::before,
.sidebar-theme-icon--asia::before,
.sidebar-theme-icon--azteca::before,
.sidebar-theme-icon--beach::before,
.sidebar-theme-icon--egypt::before,
.sidebar-theme-icon--farm::before,
.sidebar-theme-icon--football::before,
.sidebar-theme-icon--fruits::before,
.sidebar-theme-icon--gems::before,
.sidebar-theme-icon--gods::before,
.sidebar-theme-icon--latam::before,
.sidebar-theme-icon--luck::before,
.sidebar-theme-icon--magic::before,
.sidebar-theme-icon--mystic::before,
.sidebar-theme-icon--nature::before,
.sidebar-theme-icon--ocean::before,
.sidebar-theme-icon--pirates::before,
.sidebar-theme-icon--sweets::before,
.sidebar-theme-icon--vikings::before,
.sidebar-theme-icon--wildwest::before,
.sidebar-theme-icon--arabic::before,
.sidebar-theme-icon--india::before,
.sidebar-theme-icon--navidad::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 6px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.sidebar-theme-icon--777::before {
    background-image: url("../../../../icons/777.png");
}
.sidebar-theme-icon--todo::before {
    background-image: url("../../../../icons/TODO.png");
}
.sidebar-theme-icon--asia::before {
    background-image: url("../../../../icons/Asia.png");
}
.sidebar-theme-icon--azteca::before {
    background-image: url("../../../../icons/azteca.png");
}
.sidebar-theme-icon--beach::before {
    background-image: url("../../../../icons/playa.png");
}
.sidebar-theme-icon--egypt::before {
    background-image: url("../../../../icons/egypto.png");
}
.sidebar-theme-icon--farm::before {
    background-image: url("../../../../icons/granja.png");
}
.sidebar-theme-icon--football::before {
    background-image: url("../../../../icons/Futbol.png");
}
.sidebar-theme-icon--fruits::before {
    background-image: url("../../../../icons/Frutas.png");
}
.sidebar-theme-icon--gems::before {
    background-image: url("../../../../icons/gemas.png");
}
.sidebar-theme-icon--gods::before {
    background-image: url("../../../../icons/Dioses%20griegos.png");
}
.sidebar-theme-icon--latam::before {
    background-image: url("../../../../icons/Latinoamerica.png");
}
.sidebar-theme-icon--luck::before {
    background-image: url("../../../../icons/Suerte.png");
}
.sidebar-theme-icon--magic::before {
    background-image: url("../../../../icons/Magia.png");
}
.sidebar-theme-icon--mystic::before {
    background-image: url("../../../../icons/Misticos.png");
}
.sidebar-theme-icon--nature::before {
    background-image: url("../../../../icons/Naturaleza.png");
}
.sidebar-theme-icon--ocean::before {
    background-image: url("../../../../icons/Oceano.png");
}
.sidebar-theme-icon--pirates::before {
    background-image: url("../../../../icons/piratas.png");
}
.sidebar-theme-icon--sweets::before {
    background-image: url("../../../../icons/Dulces.png");
}
.sidebar-theme-icon--vikings::before {
    background-image: url("../../../../icons/Vikingos.png");
}
.sidebar-theme-icon--wildwest::before {
    background-image: url("../../../../icons/Lejano%20Oeste.png");
}
.sidebar-theme-icon--arabic::before {
    background-image: url("../../../../icons/Arabe.png");
}
.sidebar-theme-icon--india::before {
    background-image: url("../../../../icons/India.png");
}
.sidebar-theme-icon--navidad::before {
    background-image: url("../../../../icons/Navidad.png");
}

.sidebar-collapse-btn {
    margin: 8px auto 0;
    width: 28px;
    height: 16px;
    border-radius: 999px 999px 0 0;
    border: none;
    background: #0f5130;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sidebar-collapse-icon {
    width: 10px;
    height: 10px;
    border-right: 2px solid #fec838;
    border-bottom: 2px solid #fec838;
    transform: rotate(45deg);
}