/* ── RESET ── */
*,
*::before,
*::after {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
}

body {
   font-family:
      -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
   background: #eef1f6;
   color: #2d2d2d;
   font-size: 15px;
   line-height: 1.65;
}

/* ── HEADER ── */
header {
   position: sticky;
   top: 0;
   z-index: 100;
   background: #232f3e;
   border-bottom: 1px solid #e5e8ef;
   padding: 0 40px;
   height: fit-content;
   display: flex;
   align-items: center;
   justify-content: space-between;
}
.header_container {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
   max-width: 1260px;
   width: 100%;
   margin-left: auto;
   margin-right: auto;
}
.logo_img {
   height: 70px;
}
header ul li a {
   color: #fff;
}
ul li {
   list-style: none;
   position: relative;
   margin: 12px 0 12px 15px;
}
.hero-card ul li:before {
   content: "";
   display: block;
   position: absolute;
   top: 10px;
   left: -15px;
   width: 5px;
   height: 5px;
   border-radius: 50%;
   background: #fa0;
}
ul li {
   margin: 12px 0;
   color: #616366;
}
.hero-card ul li:before {
   display: inline-block;
   position: relative;
   top: -2px;
   left: auto;
   margin-right: 12px;
   width: 8px;
   height: 8px;
   background: 0 0;
   border: 2px solid #3aa552;
}
li {
   font-size: 16px !important;
}

.logo {
   display: flex;
   align-items: center;
   gap: 8px;
   text-decoration: none;
}
.logo-icon {
   width: 34px;
   height: 34px;
}
.logo-text {
   display: flex;
   flex-direction: column;
   line-height: 1.1;
}
.logo-text .main {
   font-weight: 700;
   font-size: 15px;
   color: #1a1a1a;
   letter-spacing: 0.3px;
}
.logo-text .sub {
   font-size: 9px;
   letter-spacing: 2px;
   color: #888;
   text-transform: uppercase;
}

nav {
   display: flex;
   align-items: center;
   gap: 6px;
}
nav ul {
   list-style: none;
   margin: 0;
   padding: 0;
   display: flex;
   align-items: center;
   gap: 6px;
}
nav ul li {
   margin: 0;
   padding: 0;
}
nav a {
   text-decoration: none;
   color: #2d2d2d;
   font-size: 13.5px;
   padding: 6px 10px;
   border-radius: 6px;
   transition: all 0.2s ease-in-out;
   white-space: nowrap;
   line-height: 20px;
   text-decoration: none;
   color: #0c0c0d;
   font-weight: 700;
}
nav a:hover {
   background: #1a2634;
}
nav a.active {
   color: #3cb96a;
}
nav .has-arrow::after {
   content: " ▾";
   font-size: 10px;
   color: #888;
}
.sub-menu {
   position: absolute;
   top: 100%;
   left: 0;
/*    width: 270px; */
	width: fit-content;
   display: block;
   right: -170px;
   opacity: 0;
   visibility: hidden;
   background: #232f3e;
   transition: all 0.2s ease-in-out;
   -webkit-transform: translateY(30px);
   transform: translateY(30px);
   z-index: 3;
}
.sub-menu li {
   display: block;
   padding: 0 15px;
   letter-spacing: 1px;
   font-size: 0.875rem;
}
.sub-menu li {
   display: block;
   padding: 0 15px;
   letter-spacing: 1px;
   font-size: 0.875rem;
}
.sub-menu .menu-item {
   text-decoration: none;
   transition: all 0.4s ease-in-out;
   color: #0c0c0d;
   padding: 15px 0;
   display: block;
   border-bottom: 1px solid rgba(12, 12, 13, 0.1);
   font-weight: 400;
}
.menu-item {
   list-style: none;
   position: relative;
}
.menu-item-has-children:hover .sub-menu {
   opacity: 1;
   visibility: visible;
   -webkit-transform: translateY(0);
   transform: translateY(0);
}

/* Mobile hamburger */
.hamburger {
   display: none;
   width: 40px;
   height: 40px;
   background: #3cb96a;
   border-radius: 50%;
   border: none;
   cursor: pointer;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   gap: 5px;
}
.hamburger span {
   display: block;
   width: 18px;
   height: 2px;
   background: #fff;
   border-radius: 2px;
}

/* Mobile menu drawer */
.mob-menu {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: #fff;
   z-index: 9999;
   transform: translateX(100%);
   transition: transform 0.3s ease;
   overflow: hidden;
}
.mob-menu.is-open {
   transform: translateX(0);
}
.mob-menu__top {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 14px 20px;
   border-bottom: 1px solid #eee;
}
.mob-menu__close {
   width: 40px;
   height: 40px;
   background: #3cb96a;
   border: none;
   border-radius: 50%;
   color: #fff;
   font-size: 18px;
   font-weight: 400;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
}
.mob-menu__label {
   padding: 18px 20px 6px;
   font-size: 12px;
   color: #aaa;
   margin: 0;
}
.mob-menu__inner {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   overflow-y: auto;
}
.mob-menu__list {
   list-style: none;
   margin: 0;
   padding: 0;
}
.mob-menu__list > li > a {
   display: block;
   padding: 18px 20px;
   font-size: 16px;
   font-weight: 500;
   color: #1a1a1a;
   text-decoration: none;
   flex: 1;
   min-width: 0;
}
.mob-menu__list > li > a:hover {
   color: #3cb96a;
}
/* row wrapper for items with children */
.mob-item-row {
   display: flex;
   align-items: stretch;
   border-bottom: 1px solid #eee;
}
.mob-item-row > a {
   border-bottom: none !important;
   padding-right: 0 !important;
   display: block;
   padding: 18px 20px;
   font-size: 16px;
   font-weight: 500;
   color: #1a1a1a;
   text-decoration: none;
   flex: 1;
   min-width: 0;
}
/* plain items keep their border */
.mob-menu__list > li:not(.menu-item-has-children) > a {
   border-bottom: 1px solid #eee;
}
.mob-arrow-btn {
   flex-shrink: 0;
   width: 56px;
   background: none;
   border: none;
   border-left: 1px solid #eee;
   font-size: 22px;
   color: #aaa;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 0;
}
.mob-arrow-btn:hover {
   color: #3cb96a;
}
/* Submenu panel */
.mob-submenu-panel {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: #fff;
   transform: translateX(100%);
   transition: transform 0.3s ease;
   overflow-y: scroll;
}
.mob-submenu-panel.is-open {
   transform: translateX(0);
}
.mob-submenu-panel__top {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 14px 20px;
   border-bottom: 1px solid #eee;
}
.mob-submenu-back {
   background: none;
   border: none;
   font-size: 14px;
   font-weight: 500;
   color: #cc3333;
   cursor: pointer;
   padding: 0;
   display: flex;
   align-items: center;
   gap: 4px;
}
.mob-submenu-back::before {
   content: "‹";
   font-size: 18px;
   line-height: 1;
}
.mob-submenu-panel__list {
   list-style: none;
   margin: 0;
   padding: 0;
}
.mob-submenu-panel__list li a {
   display: block;
   padding: 18px 20px;
   border-bottom: 1px solid #eee;
   font-size: 16px;
   font-weight: 500;
   color: #1a1a1a;
   text-decoration: none;
}
.mob-submenu-panel__list li a:hover {
   color: #3cb96a;
}

/* ── LAYOUT ── */
.page-wrap {
   max-width: 1300px;
   margin: 0 auto;
   padding: 40px 40px 80px;
   position: relative;
}

/* Decorative blurred circles */
.deco {
   position: fixed;
   border-radius: 50%;
   filter: blur(60px);
   pointer-events: none;
   z-index: 0;
}
.deco-1 {
   width: 260px;
   height: 260px;
   background: rgba(255, 100, 100, 0.18);
   top: 60px;
   right: 0;
}
.deco-2 {
   width: 200px;
   height: 200px;
   background: rgba(100, 200, 130, 0.22);
   top: 240px;
   right: 30px;
}
.deco-3 {
   width: 200px;
   height: 200px;
   background: rgba(220, 130, 200, 0.18);
   top: 360px;
   right: 80px;
}
.deco-4 {
   width: 280px;
   height: 280px;
   background: rgba(60, 185, 106, 0.3);
   bottom: 400px;
   left: -60px;
}
.deco-5 {
   width: 260px;
   height: 260px;
   background: rgba(60, 185, 106, 0.22);
   bottom: 200px;
   right: -40px;
}
.deco-6 {
   width: 200px;
   height: 200px;
   background: rgba(180, 240, 160, 0.25);
   bottom: 100px;
   right: 60px;
}


/* ── BREADCRUMB ── */
.breadcrumb {
   font-size: 13px;
   color: #888;
   margin-bottom: 18px;
}
.breadcrumb a {
   color: #3cb96a;
   text-decoration: none;
}
.breadcrumb a:hover {
   text-decoration: underline;
}
.breadcrumb span {
   color: #aaa;
   margin: 0 6px;
}

/* ── HERO CARD ── */
.hero-card {
   background: #fff;
   border-radius: 18px;
   padding: 48px 52px 52px;
   margin-bottom: 24px;
   position: relative;
   overflow: hidden;
}
.hero-card h1 {
   font-weight: 700;
   margin-bottom: 10px;
   color: #313233;
   text-align: left;
   font-size: 30px;
   line-height: 35px;
}
.hero-card h2 {
   font-size: 30px;
   line-height: 35px;
   font-weight: 700;
   color: #0c0c0d;
   text-align: left;
   margin-bottom: 10px;
}
.hero-card p {
   margin-bottom: 16px;
   color: #444;
   font-size: 0.9375rem;
}
.hero-card p:last-child {
   margin-bottom: 0;
}

.hero-card ol {
   counter-reset: num;
   list-style: none;
   padding-left: 0;
}

.hero-card ol li {
   color: #616366;
   font-size: 16px;
   font-weight: 400;
   line-height: 150%;
   margin: 0 0 15px;
}

.hero-card ol li:last-child {
   margin-bottom: 0;
}

.hero-card ol li::before {
   content: counter(num);
   counter-increment: num;
   display: inline-block;
   margin: 0 15px 5px 0;
   width: 25px;
   height: 25px;
   border: 1px solid #3aa552;
   border-radius: 50%;
   color: #3aa552;
   font-size: 12px;
   line-height: 25px;
   text-align: center;
   vertical-align: top;
}

.hero-card strong {
   font-weight: 700;
}

.hero-blob {
   position: absolute;
   bottom: -20px;
   right: -20px;
   width: 220px;
   height: 220px;
   border-radius: 50%;
   filter: blur(30px);
   background: radial-gradient(
      circle at 40% 40%,
      rgba(220, 130, 200, 0.35),
      rgba(60, 185, 106, 0.35)
   );
   pointer-events: none;
}
.hero-card a {
   color: #3aa552;
   text-decoration: none;
}
.hero-card a:hover {
   text-decoration: underline;
}
/* ── TOC ── */
.toc-card {
   background: #eef1f6;
   border-radius: 14px;
   margin-bottom: 24px;
   overflow: hidden;
}
.toc-header {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 18px 24px;
   cursor: pointer;
   user-select: none;
}
.toc-header h3 {
   font-size: 15px;
   font-weight: 600;
   color: #1a1a1a;
}
.toc-body ol li::before {
   content: none !important;
   display: none !important;
}
.toc-arrow {
   font-size: 18px;
   color: #555;
   transition: transform 0.25s;
}
.toc-card.open .toc-arrow {
   transform: rotate(180deg);
}
.toc-body {
   display: none;
   padding: 4px 24px 20px;
}
.toc-card.open .toc-body {
   display: block;
}
.toc-body ol {
   padding-left: 18px;
}
.toc-body li {
   margin: 6px 0;
}
.toc-body a {
   font-weight: 400;
   font-size: 16px;
   line-height: 25px;
   color: #3aa552;
   text-decoration: none;
   position: relative;
}
.toc-body a:hover {
   text-decoration: underline;
}

/* ── SECTION CARDS ── */
.section-card {
   background: #fff;
   border-radius: 18px;
   padding: 36px 40px;
   margin-bottom: 24px;
}
.section-card h2 {
   font-size: 22px;
   font-weight: 800;
   margin-bottom: 14px;
   color: #1a1a1a;
}
.section-card h3 {
   font-size: 18px;
   font-weight: 800;
   margin: 22px 0 10px;
   color: #1a1a1a;
}
.section-card p {
   color: #444;
   font-size: 14.5px;
   margin-bottom: 14px;
}
.section-card p:last-child {
   margin-bottom: 0;
}
.section-card a {
   color: #3cb96a;
}

/* Section with icon float-right */
.section-icon-wrap {
   display: flex;
   align-items: flex-start;
   gap: 0;
}
.section-text {
   flex: 1;
}
.section-icon {
   flex-shrink: 0;
   width: 90px;
   height: 90px;
   background: rgba(60, 185, 106, 0.12);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-left: 24px;
   margin-top: 4px;
}
.section-icon svg {
   width: 44px;
   height: 44px;
}

/* Icon left (small, inline) */
.icon-left-wrap {
   display: flex;
   gap: 20px;
   align-items: flex-start;
   margin-bottom: 14px;
}
.icon-left {
   flex-shrink: 0;
   width: 72px;
   height: 72px;
   background: rgba(60, 185, 106, 0.12);
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
}
.icon-left svg {
   width: 36px;
   height: 36px;
}
.icon-left-text {
   flex: 1;
}
.icon-left-text p {
   margin-bottom: 10px;
}

/* Numbered list */
.numbered-list {
   list-style: none;
   padding: 0;
}
.numbered-list li {
   display: flex;
   align-items: flex-start;
   gap: 14px;
   margin-bottom: 20px;
   font-size: 14.5px;
   color: #444;
}
.num-badge {
   flex-shrink: 0;
   width: 26px;
   height: 26px;
   border-radius: 50%;
   border: 2px solid #3cb96a;
   color: #3cb96a;
   font-weight: 700;
   font-size: 13px;
   display: flex;
   align-items: center;
   justify-content: center;
   margin-top: 1px;
}

/* Bullet list with green dots */
.green-list {
   list-style: none;
   padding: 0;
}
.green-list li {
   display: flex;
   align-items: flex-start;
   gap: 10px;
   margin-bottom: 14px;
   font-size: 14.5px;
   color: #444;
}
.green-list li::before {
   content: "";
   flex-shrink: 0;
   width: 8px;
   height: 8px;
   border-radius: 50%;
   background: #3cb96a;
   margin-top: 6px;
}
.green-list a {
   color: #3cb96a;
}

/* ── FAQ ── */
.faq-section {
   margin-bottom: 24px;
}
.faq-title {
   font-size: 26px;
   font-weight: 800;
   margin-bottom: 18px;
   color: #1a1a1a;
}
.faq-item {
   background: #eef1f6;
   border-radius: 14px;
   margin-bottom: 10px;
   overflow: hidden;
}
.faq-q {
   display: flex;
   align-items: center;
   justify-content: space-between;
   padding: 16px 20px;
   cursor: pointer;
   user-select: none;
   gap: 12px;
}
.faq-q-left {
   display: flex;
   align-items: center;
   gap: 10px;
   font-size: 14.5px;
   font-weight: 500;
   color: #1a1a1a;
}
.faq-q-left .emoji {
   font-size: 16px;
}
.faq-arrow {
   flex-shrink: 0;
   font-size: 18px;
   color: #555;
   transition: transform 0.25s;
}
.faq-item.open .faq-arrow {
   transform: rotate(180deg);
}
.faq-a {
   display: none;
   padding: 0 20px 18px 46px;
   font-size: 14px;
   color: #555;
   line-height: 1.6;
}
.faq-item.open .faq-a {
   display: block;
}

/* ── CONTENT TABLE ── */
.content-table {
   width: 100%;
   border-collapse: collapse;
   font-size: 14px;
   margin-top: 16px;
   margin-bottom: 20px;
}
.content-table th {
   background: #f4f6fa;
   color: #555;
   font-weight: 600;
   font-size: 12px;
   text-transform: uppercase;
   letter-spacing: 0.5px;
   padding: 10px 14px;
   text-align: left;
   border-bottom: 1px solid #e0e4ed;
}
.content-table td {
   padding: 12px 14px;
   color: #444;
   border-bottom: 1px solid #edf0f6;
   vertical-align: middle;
}
.content-table tr:last-child td {
   border-bottom: none;
}
.content-table tr:hover td {
   background: #fafbfd;
}

/* ── FOOTER ── */
footer {
   background: #232f3e;
   padding: 50px 40px 30px;
   position: relative;
   z-index: 1;
}
.footer-grid {
   max-width: 1000px;
   margin: 0 auto 40px;
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 30px;
}
.footer-col h4 {
   font-size: 13px;
   font-weight: 600;
   color: #888;
   margin-bottom: 14px;
}
.footer-col ul {
   list-style: none;
   margin: 0;
   padding: 0;
}
.footer-col ul li {
   margin: 0;
   padding: 0;
}
.footer-col a {
   display: block;
   text-decoration: none;
   color: #fff;
   font-size: 14px;
   margin-bottom: 10px;
}
.footer-col a:hover {
   color: #3cb96a;
}
.footer-divider {
   max-width: 1000px;
   margin: 0 auto;
   border: none;
   border-top: 1px solid #d8dce6;
   margin-bottom: 16px;
}
.footer-copy {
   max-width: 1000px;
   margin: 0 auto;
   text-align: right;
   font-size: 12px;
   color: #aaa;
}

/* ── COOKIE BANNER ── */
.cookie-bar {
   position: fixed;
   bottom: 0;
   left: 0;
   right: 0;
   background: #232f3e;
   padding: 14px 30px;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   font-size: 13px;
   color: #444;
   z-index: 200;
}
.cookie-bar a {
   color: #3cb96a;
   font-weight: 600;
}
.cookie-bar span {
   color: #fff;
}
.cookie-close {
   background: none;
   border: none;
   font-size: 20px;
   cursor: pointer;
   color: #888;
   margin-left: 10px;
   line-height: 1;
}

/* ── SCROLL TO TOP ── */
.scroll-top {
   background: url(../img/arrow-top.svg) no-repeat;
   background-position: center;
   position: fixed;
   bottom: 70px;
   right: 20px;
   width: 40px;
   height: 40px;
   border: 1px solid #dde2ec;
   border-radius: 50%;
   z-index: 150;
   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

/* ── PLAY NOW BUTTON ── */
.btn-play {
   display: inline-block;
   background: #3aa552;
   color: #fff;
   font-size: 15px;
   font-weight: 700;
   letter-spacing: 0.2px;
   text-transform: uppercase;
   padding: 15px 0;
   border-radius: 30px;
   text-decoration: none;
   text-align: center;
   transition:
      background 0.35s ease,
      color 0.35s ease,
      box-shadow 0.35s ease;
   border: 2px solid transparent;
   cursor: pointer;
   line-height: 20px;
}
.btn-play:hover {
   background: #1d8333;
   color: #fff;
   text-decoration: none;
}
.btn-play:focus {
   border-color: #6ac17d;
   background: #3aa552;
   outline: none;
}

/* ── STAR RATING ── */
.stars {
   display: flex;
   justify-content: center;
   align-items: center;
}
.stars svg {
   margin: 0 2px;
   width: 20px;
   height: 20px;
}

/* ── TOP-3 CASINO CARDS ── */
.top3-grid {
   display: flex;
   flex-wrap: wrap;
   margin-right: -15px;
   margin-left: -15px;
   margin-bottom: 24px;
}
.casino-card {
   position: relative;
   width: calc(100% - 30px);
   margin: 0 15px 15px;
   padding: 20px 30px;
   text-align: center;
   display: flex;
   flex-direction: column;
   justify-content: flex-start;
   align-items: center;
   transition: all 0.35s ease;
   background: hsla(0, 0%, 100%, 0.5);
   box-shadow: inset -2px -1px 2px hsla(0, 0%, 100%, 0.8);
   -webkit-backdrop-filter: blur(20px);
   backdrop-filter: blur(20px);
   border-radius: 20px;
}
.casino-card:hover {
   box-shadow:
      0 10px 10px rgba(170, 202, 239, 0.4),
      0 15px 15px rgba(245, 184, 239, 0.3);
   background: #fff;
}
@media (min-width: 768px) {
   .casino-card {
      width: calc(50% - 30px);
   }
}
@media (min-width: 992px) {
   .casino-card {
      width: calc(33.333% - 30px);
   }
}
.casino-card .top-badge {
   position: absolute;
   top: 10px;
   left: 10px;
   text-transform: uppercase;
   font-weight: 700;
   font-size: 12px;
   line-height: 15px;
   border-radius: 20px;
   width: 55px;
   padding: 5px;
   display: flex;
   justify-content: center;
   align-items: center;
   color: #3aa552;
   background: transparent;
   border: 1px solid #3aa552;
}
.casino-card .casino-logo-placeholder {
   width: 100%;
   max-width: 285px;
   height: 70px;
   display: flex;
   align-items: center;
   justify-content: center;
   margin: 0 0 15px;
}
.casino-card .casino-logo {
   max-width: 75%;
   max-height: 75%;
   width: auto;
   height: auto;
}
.casino-card .casino-name {
   font-size: 1rem;
   font-weight: 700;
   color: #313233;
   word-break: break-word;
   margin: 12px 0 15px;
   width: 100%;
   text-align: center;
}
.casino-card .bonus-label {
   color: #616366;
   font-size: 12px;
   line-height: 15px;
   margin-bottom: 5px;
   width: 100%;
   text-align: center;
}
.casino-card .bonus-value {
   font-size: 0.9375rem;
   font-weight: 600;
   color: #313233;
   margin: 0 0 15px;
   width: 100%;
   text-align: center;
}
.casino-card .stars {
   margin: 0 0 15px;
}
.casino-card .btn-play {
   display: block;
   min-height: 50px;
   width: 100%;
   max-width: 245px;
   margin: 0 auto;
   padding: 13px;
   border-radius: 30px;
   background: #a00300;
   border: 2px solid transparent;
   color: #fff;
   font-size: 15px;
   line-height: 20px;
}
.casino-card .btn-play:hover {
   background: #630200;
   color: #fff;
}
.casino-card .review-link {
   display: block;
   padding-top: 15px;
   font-size: 0.75rem;
   font-weight: 400;
   letter-spacing: 1px;
   color: #0c0c0d;
   text-decoration: none;
   position: relative;
}
.casino-card .review-link::after {
   content: "";
   display: block;
   width: 100%;
   height: 1px;
   background: #0c0c0d;
   position: absolute;
   bottom: 0;
   left: 0;
   transition: all 0.35s ease;
}
.casino-card .review-link:hover {
   color: #0c0c0d;
   text-decoration: none;
}

/* ── CASINO TABLE ── */
.review_logo {
   width: 100%;
   max-width: 100%;
   height: auto;
   margin: 0 auto;
   display: block;
}
.casino-table-wrap {
   margin: 0 0 5px;
   overflow: visible;
   box-shadow: none;
   background: transparent;
}
@media (min-width: 1200px) {
   .casino-table-wrap {
      margin: 15px 0 0;
   }
}
.casino-table {
   overflow: hidden;
   border-radius: 20px;
   background: hsla(0, 0%, 100%, 0.5);
   box-shadow:
      inset 2px -2px 2px rgba(0, 0, 0, 0.1),
      inset -2px 2px 2px hsla(0, 0%, 100%, 0.1);
   -webkit-backdrop-filter: blur(15px);
   backdrop-filter: blur(15px);
   width: 100%;
}
.casino-table__head {
   background: #fff;
   margin-bottom: 5px;
   border-radius: 15px;
   height: 40px;
   display: none;
}
@media (min-width: 1200px) {
   .casino-table__head {
      display: flex;
      align-items: center;
   }
}
.casino-table__head .casino-col {
   padding: 9px 20px;
   font-size: 12px;
   line-height: 15px;
   font-weight: 400;
   color: #313233;
   text-transform: uppercase;
   display: flex;
   justify-content: center;
   align-items: center;
   flex: 1;
}
.casino-table__head .casino-col--logo {
   flex: 0 0 160px;
}
.casino-table__head .casino-col--play {
   flex: 0 0 190px;
}
.casino-row {
   position: relative;
   overflow: hidden;
   margin-bottom: 10px;
   padding: 20px 20px 15px;
   border-radius: 15px;
   display: flex;
   flex-wrap: wrap;
   border-bottom: 5px solid #fff;
   background: hsla(0, 0%, 100%, 0.5);
   box-shadow: inset -2px -1px 2px hsla(0, 0%, 100%, 0.8);
   -webkit-backdrop-filter: blur(20px);
   backdrop-filter: blur(20px);
   transition: all 0.35s ease;
   align-items: center;
}
.casino-row:last-child {
   border-bottom: 0;
}
@media (min-width: 992px) {
   .casino-row {
      background: #fff;
      box-shadow: none;
      -webkit-backdrop-filter: none;
      backdrop-filter: none;
      border-bottom: 0;
      margin-bottom: 5px;
      border-radius: 0;
      padding: 0;
      flex-wrap: nowrap;
   }
}
.casino-row:hover {
   background: #eef1f5;
   box-shadow:
      0 2px 6px rgba(245, 184, 239, 0.3),
      0 0 5px #aacaef;
}
/* Column layout */
.casino-row .casino-col {
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 0 3px 15px;
   min-width: 100%;
   max-width: 100%;
}
@media (min-width: 992px) {
   .casino-row .casino-col {
      min-width: unset;
      max-width: unset;
      padding: 0 3px;
      flex: 1;
   }
}
.casino-row .casino-col:last-child {
   padding: 0 3px;
}
.casino-col--logo {
   position: relative;
   min-height: 50px;
   height: auto;
   padding: 10px !important;
   border-radius: 5px;
}
@media (max-width: 991.98px) {
   .casino-col--logo {
      height: 85px;
      width: 285px;
      min-width: 100px !important;
      max-width: 100% !important;
      margin: 0 auto 15px;
   }
   .casino-col--logo img {
      margin: 0 auto;
      width: 150px;
      display: block;
      max-height: 100%;
   }
}
@media (min-width: 992px) {
   .casino-col--logo {
      flex: 0 0 160px !important;
      min-width: 160px !important;
      max-width: 160px !important;
   }
}
.casino-col--name {
   font-weight: 700;
   text-align: center;
}
@media (min-width: 992px) {
   .casino-col--name {
      flex: 1.5 !important;
   }
}
.casino-col--bonus {
   text-align: center;
}
@media (min-width: 992px) {
   .casino-col--bonus {
      flex: 2 !important;
   }
}
.casino-col--rating {
   text-align: center;
}
@media (min-width: 992px) {
   .casino-col--rating {
      flex: 0 0 130px !important;
   }
}
@media (min-width: 992px) {
   .casino-col--pay {
      flex: 0 0 130px !important;
   }
}
.casino-col--play {
   flex-direction: column;
}
@media (min-width: 992px) {
   .casino-col--play {
      flex: 0 0 190px !important;
   }
}
/* Inner cell elements */
.casino-table .row-num {
   width: 25px;
   height: 25px;
   font-size: 0.75rem;
   position: absolute;
   top: 10px;
   left: 10px;
   background: #eef1f5;
   border: 1px solid #d7dde6;
   border-radius: 50%;
   color: #313233;
   font-weight: 700;
   line-height: 25px;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
}
@media (min-width: 992px) {
   .casino-table .row-num {
      top: 5px;
      left: 5px;
   }
}
.casino-table .logo-cell {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%;
}
.casino-table .t-logo-txt {
   min-height: 50px;
   height: auto;
   margin-bottom: 15px;
   border-radius: 5px;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 100%;
}
@media (min-width: 992px) {
   .casino-table .t-logo-txt {
      margin-bottom: 0;
   }
}
.casino-table .bonus-cell {
   font-size: 0.9375rem;
   font-weight: 600;
   color: #313233;
   line-height: 1.25;
   text-align: center;
   padding: 0 0;
}
.casino-table .play-cell .btn-play,
.casino-table .casino-col--play .btn-play {
   width: 245px;
   min-height: 50px;
   font-size: 15px;
   line-height: 20px;
   letter-spacing: 0.2px;
   background: #a00300;
   border: 2px solid transparent;
   color: #fff;
   border-radius: 30px;
   padding: 15px 0;
   display: block;
   text-align: center;
}
@media (min-width: 992px) {
   .casino-table .play-cell .btn-play,
   .casino-table .casino-col--play .btn-play {
      width: 115px;
   }
}
.casino-table .play-cell .btn-play:hover,
.casino-table .casino-col--play .btn-play:hover {
   background: #630200;
   color: #fff;
}
.casino-table .review-sub {
   display: block;
   padding-top: 10px;
   font-size: 0.75rem;
   font-weight: 400;
   letter-spacing: 1px;
   color: #000;
   text-decoration: underline;
   text-align: center;
   position: relative;
}
.casino-table .review-sub:hover {
/*    color: #ff720d; */
	color: #000;
   text-decoration: none;
   cursor: pointer;
}

/* ── MOBILE ── */
@media (max-width: 768px) {
   header {
      padding: 0 16px;
   }
   nav {
      display: none;
   }
   .hamburger {
      display: flex;
   }

   .page-wrap {
      padding: 20px 0 60px;
   }
   .content-col {
      max-width: 100%;
      padding: 0 12px;
   }

   .hero-card {
      padding: 28px 20px 220px;
      border-radius: 12px;
   }
   .hero-card h1 {
      font-size: 22px;
   }
   .hero-card h2 {
      font-size: 22px;
   }
   .section-card {
      padding: 24px 20px;
      border-radius: 12px;
   }
   .section-card h2 {
      font-size: 19px;
   }

   .section-icon-wrap {
      flex-direction: column-reverse;
   }
   .section-icon {
      margin-left: 0;
      margin-bottom: 16px;
   }

   .icon-left {
      width: 58px;
      height: 58px;
   }

   .footer-grid {
      grid-template-columns: 1fr 1fr;
   }
   .footer-copy {
      text-align: center;
   }
   footer {
      padding: 36px 20px 24px;
   }
   footer h4 {
      color: #fff;
   }

   /* TOP-3 on mobile: single column */
   .casino-card {
      width: calc(100% - 30px);
   }

   .content-table {
      font-size: 13px;
   }
   .content-table th,
   .content-table td {
      padding: 9px 10px;
   }

   .deposit-grid {
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
   }
}

/* ── DEPOSIT AMOUNT BADGES ── */
.deposit-grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 16px;
   margin-bottom: 24px;
}
.deposit-card {
   background: hsl(220deg 23.08% 97.45%);
   box-shadow: inset -2px -1px 2px hsla(0, 0%, 100%, 0.8);
   -webkit-backdrop-filter: blur(20px);
   backdrop-filter: blur(20px);
   border-radius: 20px;
   padding: 20px 15px 13px;
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 12px;
}
.deposit-link {
   text-decoration: none;
}
.deposit-link:hover .deposit-label {
   color: #3cb96a;
}
.deposit-badge {
   width: 120px;
   height: 120px;
   border-radius: 50%;
}
.deposit-label {
   font-size: 16px;
   font-weight: 600;
   color: #111;
}

/* ── SECTION COIN ICON ── */
.coin-icon {
   flex-shrink: 0;
   width: 90px;
   height: 90px;
   background: rgba(60, 185, 106, 0.12);
   border-radius: 50%;
   border: 3px dashed #3cb96a;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 22px;
   font-weight: 900;
   color: #3cb96a;
   margin-left: 24px;
   margin-top: 4px;
   flex-shrink: 0;
}

/* ── GAME IMAGE ── */
.game-img-wrap {
   border-radius: 10px;
   overflow: hidden;
   margin-top: 16px;
   background: #1a1a2e;
   height: 160px;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 0;
}
.game-img-wrap .game-slot {
   flex: 1;
   height: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
   font-weight: 700;
   font-size: 12px;
   color: rgba(255, 255, 255, 0.7);
   border-right: 1px solid rgba(255, 255, 255, 0.1);
   padding: 8px;
   text-align: center;
}
.game-img-wrap .game-slot:last-child {
   border-right: none;
}
.game-slot.gladiator {
   background: linear-gradient(135deg, #8b4513, #d4a017);
}
.game-slot.invisible {
   background: linear-gradient(135deg, #2c3e50, #4a6fa5);
}
.game-slot.rocky {
   background: linear-gradient(135deg, #c0392b, #e74c3c);
}
.game-slot.panther {
   background: linear-gradient(135deg, #6b3fa0, #b06ab3);
}

.invisible {
   position: relative;
   width: 100%;
   padding-right: 15px;
   padding-left: 15px;
}
@media (min-width: 1200px) {
   .invisible {
      -ms-flex: 0 0 25%;
      flex: 0 0 25%;
      max-width: 25%;
   }
   .content-card {
      flex: 0 0 75%;
      max-width: 100%;
   }
}
@media (max-width: 768px) {
   .deposit-grid {
      grid-template-columns: repeat(2, 1fr);
      gap: 8px;
   }
   .coin-icon {
      margin-left: 0;
      margin-bottom: 16px;
   }
}

/* ── REVIEW PAGE ── */

/* Logo card */
.review-logo-card {
   background: #fff;
   border-radius: 18px;
   padding: 36px 40px;
   margin-bottom: 16px;
   display: flex;
   align-items: center;
   justify-content: center;
   min-height: 140px;
}
.review-logo-card img{
	max-width:100%;
}
/* Info card */
.review-info-card {
   background: #fff;
   border-radius: 18px;
   padding: 28px 36px 32px;
   margin-bottom: 16px;
}
.review-info-top {
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
   margin-bottom: 20px;
   gap: 16px;
}
.review-info-left h1 {
   font-size: 24px;
   font-weight: 800;
   color: #1a1a1a;
   margin-bottom: 6px;
}
.review-info-left .bonus-line {
   font-size: 15px;
   font-weight: 600;
   color: #1a1a1a;
   margin-top: 8px;
}
.btn-play-lg {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   background: #3aa552;
   color: #fff;
   font-size: 14px;
   font-weight: 700;
   letter-spacing: 1px;
   text-transform: uppercase;
   padding: 14px 28px;
   border-radius: 50px;
   text-decoration: none;
   white-space: nowrap;
   flex-shrink: 0;
   transition: background 0.15s;
}
.screenshot-image {
   width: 100%;
   height: 100%;
   object-fit: cover;
   border-radius: 10px;
   display: block;
}
.btn-play-lg:hover {
   background: #247339;
}
.btn-play-lg .play-icon {
   width: 0;
   height: 0;
   border-style: solid;
   border-width: 6px 0 6px 10px;
   border-color: transparent transparent transparent #fff;
}

/* Info grid table */
.info-grid {
   border-top: 1px solid #eef0f6;
   margin-top: 4px;
}
.info-row {
   display: grid;
   grid-template-columns: 1fr 1fr;
   border-bottom: 1px solid #eef0f6;
}
.info-row:last-child {
   border-bottom: none;
}
.info-cell {
   display: grid;
   grid-template-columns: 160px 1fr;
   padding: 13px 0;
   align-items: start;
   gap: 12px;
}
.info-cell:first-child {
   padding-right: 24px;
}
.info-cell:last-child {
   padding-left: 24px;
   border-left: 1px solid #eef0f6;
}
.info-label {
   font-size: 13.5px;
   color: #313233;
   font-weight: 400;
}
.info-value {
   font-size: 13.5px;
   font-weight: 500;
   color: #1a1a1a;
}
.check-icon,
.cross-icon {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   width: 24px;
   height: 24px;
   border-radius: 50%;
   font-size: 13px;
}
.check-icon {
   border: 2px solid #3cb96a;
   color: #3cb96a;
}
.cross-icon {
   border: 2px solid #e53935;
   color: #e53935;
}

/* Currencies card */
.currencies-card {
   background: #fff;
   border-radius: 18px;
   padding: 24px 36px 28px;
   margin-bottom: 16px;
   text-align: center;
}
.currencies-card h3 {
   font-size: 18px;
   font-weight: 700;
   color: #1a1a1a;
   margin-bottom: 18px;
}
.currency-pills {
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
   justify-content: flex-start;
}
.currency-pill {
   display: flex;
   align-items: center;
   min-width: 55px;
   min-height: 55px;
   width: 55px;
   height: 55px;
   border-radius: 10px;
   background: #eef1f5;
   -ms-flex-pack: center;
   justify-content: center;
   font-size: 15px;
   line-height: 20px;
   font-weight: 700;
   color: #616366;
}

/* Screenshots */
.screenshots-section {
   margin-bottom: 16px;
   position: relative;
   z-index: 1;
}
.screenshots-title {
   font-size: 20px;
   font-weight: 800;
   color: #1a1a1a;
   margin-bottom: 14px;
}
.screenshots-grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 10px;
}
.screenshots-grid.is-slider {
   display: flex;
   overflow-x: scroll;
   scroll-behavior: smooth;
   cursor: grab;
   -webkit-overflow-scrolling: touch;
   scrollbar-width: none;
   -ms-overflow-style: none;
   grid-template-columns: unset;
}
.screenshots-grid.is-slider::-webkit-scrollbar {
   display: none;
}
.screenshots-grid.is-slider.is-dragging {
   cursor: grabbing;
   scroll-behavior: auto;
}
.screenshots-grid.is-slider .screenshot-item {
   flex: 0 0 calc(33.33% - 7px);
   min-width: calc(33.33% - 7px);
}
.screenshot-item {
   border-radius: 10px;
   overflow: hidden;
   aspect-ratio: 16/9;
   background: #1a1a2e;
   display: flex;
   align-items: center;
   justify-content: center;
}

.screenshot-item .ss-inner {
   width: 100%;
   height: 100%;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   padding: 10px;
   gap: 6px;
   position: relative;
}
.ss-wz-badge {
   position: absolute;
   top: 8px;
   right: 8px;
   background: #f5a623;
   color: #fff;
   font-size: 10px;
   font-weight: 800;
   padding: 3px 7px;
   border-radius: 4px;
}
.ss-1 {
   background: linear-gradient(135deg, #1a4a1a 0%, #2d6e2d 40%, #1a3a1a 100%);
}
.ss-2 {
   background: linear-gradient(135deg, #0a1628 0%, #1a2d4a 50%, #0a1628 100%);
}
.ss-3 {
   background: linear-gradient(135deg, #1a3a1a 0%, #2a5a2a 40%, #1a2a1a 100%);
}
.ss-promo-block {
   background: rgba(255, 255, 255, 0.12);
   border-radius: 6px;
   width: 30%;
   flex-shrink: 0;
   height: 80%;
   margin-top: auto;
}

/* Bonus table card */
.bonus-table-card {
   background: #fff;
   border-radius: 18px;
   padding: 28px 36px 32px;
   margin-bottom: 24px;
	overflow:auto;
}
.bonus-table-card h2 {
   font-size: 22px;
   font-weight: 800;
   color: #1a1a1a;
   margin-bottom: 18px;
}
.bonus-table {
   width: 100%;
   border-collapse: collapse;
   font-size: 14px;
}
.bonus-table thead tr {
   background: #f2f4fa;
}
.bonus-table thead th {
   padding: 10px 16px;
   font-size: 13px;
   font-weight: 600;
   color: #555;
   text-align: left;
}
.bonus-table tbody tr {
   border-bottom: 1px solid #edf0f6;
}
.bonus-table tbody tr:last-child {
   border-bottom: none;
}
.bonus-table tbody td {
   padding: 8px 10px;
   color: #444;
   vertical-align: middle;
}
.td_link{
	display: flex;
    justify-content: space-between;
    align-items: center;
}
}
/* Sticky play bar (mobile) */
.sticky-play-bar {
   display: none;
   position: fixed;
   bottom: 0;
   left: 0;
   right: 0;
   background: #2e8b46;
   z-index: 180;
   padding: 12px 20px;
}
.sticky-play-bar a {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   color: #fff;
   font-size: 14px;
   font-weight: 700;
   letter-spacing: 1px;
   text-transform: uppercase;
   text-decoration: none;
}

@media (max-width: 768px) {
   .review-logo-card {
      padding: 24px 20px;
      min-height: 100px;
      border-radius: 12px;
   }

   .review-info-card {
      padding: 20px 18px 24px;
      border-radius: 12px;
   }
   .review-info-top {
      flex-direction: column;
      align-items: flex-start;
   }
   .review-info-top .btn-play-lg {
      width: 100%;
      justify-content: center;
   }
   .review-info-left h1 {
      font-size: 20px;
   }

   .info-row {
      grid-template-columns: 1fr;
   }
   .info-cell {
      grid-template-columns: 130px 1fr;
      padding: 10px 0;
   }
   .info-cell:first-child {
      border-bottom: 1px solid #eef0f6;
      padding-right: 0;
   }
   .info-cell:last-child {
      border-left: none;
      padding-left: 0;
   }

   .currencies-card {
      padding: 20px 18px 22px;
      border-radius: 12px;
      text-align: left;
   }

   .screenshots-grid {
      grid-template-columns: 1fr;
      gap: 10px;
   }
   .screenshots-grid.is-slider .screenshot-item {
      flex: 0 0 80%;
      min-width: 80%;
   }
   .screenshot-item {
      aspect-ratio: 16/8;
   }

   .bonus-table-card {
      padding: 20px 18px 24px;
      border-radius: 12px;
   }
   .bonus-table-card h2 {
      font-size: 18px;
   }

   .sticky-play-bar {
      display: block;
   }
   .scroll-top {
      bottom: 68px;
   }
   .cookie-bar {
      display: none;
   }
}
@media (max-width: 468px) {
   .deposit-grid {
      grid-template-columns: 1fr;
   }
	
	.bonus-table tbody td:first-child{
		display: block;
		width: 300px;
	}
	.btn-play-lg {
		font-size: 12px;
		padding: 12px 22px;
	}
}
