* { margin:0; padding:0; box-sizing:border-box;  scroll-behavior: smooth;}
body { overflow-x:hidden; position: relative; background: rgba(241, 245, 249, 1);}
a {transition: 0.4s; text-decoration: underline;}
a:hover {color: #14E4A2;}
input, button {border:none; box-shadow:none; transition:0.4s;}
button { cursor:pointer; background:transparent;}
input {outline:none;}
img { max-width: 100%; display: block;}

@font-face {font-family: "Inter"; src: url("/Inter.ttf") format("truetype");}
p { font-family: 'inter', sans-serif; font-size: 16px; font-weight: 400; line-height: 24px; color: rgba(69, 85, 108, 1);}
h1, h2, h3, h4, h5, h6 {  color: rgba(65, 41, 152, 1); font-family: 'inter', sans-serif; }
h1 {font-size: 52px; line-height: 60px; font-weight: 800; text-transform: uppercase;}
h2 {font-size: 34px; line-height: 40px;}
h3 {font-size: 30px; line-height: 38px;}
b, i, label, input, button, td, th, td, figcaption, span, li, a, strong { color: rgba(69, 85, 108, 1); font-size: 16px; font-style: normal; font-weight: 400; 
  line-height: 20px; font-family: 'inter', sans-serif}

@media (max-width: 1150px) {
  h1 {font-size: 38px; line-height: 50px;}
}
@media (max-width: 650px) {
  h1 {font-size: 28px; line-height: 36px;}
  h2 {font-size: 24px; line-height: 30px;}
  h3 {font-size: 22px; line-height: 28px;}
  b, i, label, input, button, th, tr, td, figcaption, span, p, li, a, strong {font-size: 14px; line-height: 19px;}
}

h1, h2, h3, h4, h5, h6, p, ul, ol, .faq-container, main figure, .table-container, .header-inner, .hero-list, .section-button, .columns-container,
.quote-section, .toc-wrapper, .nav-inner, .fixed-buttons, .footer-inner, .casino-list {width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 20px;}
h1, h2, h3, h4, h5, h6 {padding-bottom: 12px; padding-top: 20px;}
p {padding-bottom: 12px; padding-top: 8px;}
@media (max-width: 650px) {
  h1, h2, h3, h4, h5, h6, p, ul, ol, .faq-container, main figure, .table-container, .header-inner, .hero-list, .section-button, .columns-container,
    .quote-section, .toc-wrapper, .nav-inner, .fixed-buttons, .footer-inner, .casino-list {width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 12px;}
  h1, h2, h3, h4, h5, h6 {padding-bottom: 8px; padding-top: 12px;}
  p {padding-bottom: 8px; padding-top: 8px;}
}

.content-ul, .content-ol {margin-top: 8px; margin-bottom: 20px; list-style: none;}
.content-ul {display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px;}
.content-ul li {list-style:none; position: relative; font-style: normal; border: 1px solid rgba(226, 232, 240, 0.7);
  background: rgba(255, 255, 255, 1); padding: 12px 16px 12px 50px; border-radius: 10px;}
.content-ul li:before {content: ''; position: absolute; top:10px; left:16px; width: 24px; height: 24px; background: url(/wp-content/uploads/2026/10/list.svg)no-repeat; background-size: cover;}
.content-ol {display: grid; grid-template-columns: 1fr; gap: 12px;}
.content-ol li {background: rgba(255, 255, 255, 1); padding: 12px 16px 12px 50px; border-radius: 10px; position: relative; counter-increment: counter-ol; }
.content-ol li::before { position: absolute; content: counter(counter-ol); display: flex; align-items: center; justify-content: center;
    width: 24px; height: 24px; color: #fff; background: rgba(65, 41, 152, 1);border-radius: 4px; top: 10px; left: 16px;}
@media (max-width: 650px) {
  .content-ul {grid-template-columns: 1fr;}
  .content-ul li::before, .content-ol li::before {left: 10px;}
  .content-ul li, .content-ol li {padding: 12px 16px 12px 44px;}
}

/* Images */
main figure { margin: 0 auto; margin-bottom: 20px;}
.general-image { display: block; border-radius: 15px; max-height: 400px; width: auto; height: auto; margin: 0 auto 10px auto;}
.vertical .general-image {max-height: 500px; max-width: 70%;}
.horizontal .general-image {max-width: 100%;}
figure { margin-bottom: 20px; text-align: center;}
figcaption {color: inherit;}


/* CONTENT */
.entry-content{margin-top: 65px;}
.section {background: rgba(255, 255, 255, 1); border: 1px solid rgba(226, 232, 240, 1); padding: 16px 0 30px 0;}
.section .content-ul li, .section .content-ol li {background: rgba(241, 245, 249, 1);}
@media (max-width: 650px) {
  .section  {padding: 10px 0 16px 0;}
}
.section-button { display: flex; justify-content: center; margin: 0 auto; padding-top: 8px; padding-bottom: 8px;}
.section-button button {background: linear-gradient(131.51deg, #412998 0%, #2A1A6B 45.76%, #14E4A2 118.98%); padding: 16px 20px;
  border-radius: 10px; color: rgba(255, 255, 255, 1); font-size: 16px; line-height: 20px; font-weight: bold; min-width: 280px;}
.section-button button:hover {opacity: 0.8;}

/* HEADER */
.site-header { position: fixed; top: 0; left: 0; width: 100%; z-index: 5; height: 65px; background: rgba(255, 255, 255, 1);}
.header-inner { display: flex; align-items: center; justify-content: space-between; height: 100%; padding-top: 10px; padding-bottom: 10px;}
.site-branding { height: 100%;}
.custom-logo-link { display: block; height: 100%;}
.custom-logo { max-height: 100%; width: auto;}
.header-inner.no-menu { justify-content: center;}
.main-navigation { display: flex; gap: 20px;}
.main-navigation .menu-item { text-decoration: none;}
.main-navigation.no-menu { display: none;}
.header-buttons { display: none; gap: 20px;}
.header-buttons button { border-radius: 50px; padding: 10px 32px; font-weight: bold; font-size: 18px; line-height: 22px;}
button.btn-reg { background: #14E4A2;}
button.btn-log { background: transparent; border: 1px solid #14E4A2;}

/* Mobile Navigation */
.menu-toggle { display: none; position: relative;}
.mobile-navigation { position: fixed; top: 0; right: 0; display: block; z-index: 5; background: rgba(65, 41, 152, 1); width: 90%; max-width: 350px; min-height: 100vh; padding: 30px 20px; transition: right 0.8s;}
.mobile-navigation[hidden] { right: -200%;}
.mobile-navigation__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 75px;}
.menu-close { display: block;}
.mobile-navigation__menu { display: flex; flex-direction: column; gap: 28px;}
.mobile-navigation__menu .menu-item { color: #fff; text-align: center; text-decoration: none;}
.mobile-navigation__menu .menu-item:active, .mobile-navigation__menu .menu-item:hover { color: #181616;}
.menu-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.5); z-index: 1; display: block;}
.menu-overlay[hidden] { display: none;}

@media (max-width: 1250px) {
  .menu-toggle {display: block;}
  .header-buttons {display: none;}
  .main-navigation {display: none;}
}


/* HERO-SECTION */
.hero-section {background: linear-gradient(131.51deg, #412998 0%, #2A1A6B 45.76%, #14E4A2 118.98%); padding: 40px 0;}
.hero-section p {color: rgba(255, 255, 255, 0.85); text-align: center; padding-top: 0;}
.hero-section h1 {color: rgba(255, 255, 255, 1); text-align: center; padding-top: 0;}
.hero-list {display: flex; align-items: center; flex-wrap: wrap; gap: 10px 20px; justify-content: center;}
.hero-list-item {display: flex; align-items: center; gap: 8px;}
.hero-list-item span {color: rgba(255, 255, 255, 1); font-weight: bold;}
.hero-list-item img {width: 18px; height: 18px;}
@media (max-width: 650px) { 
  .hero-section {padding: 20px 0;}
}
@media (max-width: 400px) { 
  .hero-list {justify-content: flex-start;}
}

/* TABLE-SECTION */
.table-container { overflow: hidden; margin-bottom: 20px; margin-top: 20px;}
.table-section { width: 100%; border-collapse: collapse; overflow: hidden; border-radius: 14px;}
.table-thead tr { background: rgba(65, 41, 152, 1); border-radius: 14px 0;}
.table-thead tr th {padding: 20px; color: rgba(255, 255, 255, 1);}
.table-section tr:nth-child(2n) {background: rgba(255, 255, 255, 1);}
.table-section td {text-align: center; padding: 10px;}
@media (max-width: 900px) { 
  .table-container { overflow: auto;}
}
@media (max-width: 650px) {
    .table-section td, .table-thead tr th {white-space: nowrap;}
}

/* PLUS-MINUS-SECTION */
.columns-container {display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 10px;}
.columns-section {border: 1px solid rgba(226, 232, 240, 1); background: rgba(255, 255, 255, 1); border-radius: 16px;}
.columns-section-head {background: rgba(20, 288, 162, 1); padding: 20px 16px; border-radius: 16px 16px 0 0;}
.columns-section-head span {font-weight: bold; font-size: 18px; color: rgba(30, 41, 59, 1);}
.plus-section .columns-section-head {background: rgba(20, 228, 162, 0.18);}
.minus-section .columns-section-head {background: rgba(255, 7, 193, 0.3);}
.columns-section ul {padding: 16px 12px;}
.columns-section li {list-style:none; position: relative; padding-left: 18px; padding-bottom: 8px;}
.plus-section li:before {content: ''; position: absolute; top:5px; left:0; width:8px; height: 8px; border-radius: 50%;
  background: rgba(20, 228, 162, 0.5); }
.minus-section li:before {content: ''; position: absolute; top:5px; left:0; width:8px; height: 8px; border-radius: 50%;
  background: rgba(255, 7, 193, 0.3); }
@media (max-width: 650px) {
  .columns-container {grid-template-columns: 1fr; }
}

/* FAQ */
.faq-item {background: rgba(255, 255, 255, 1); border: 1px solid rgba(226, 232, 240, 1); border-radius: 14px;
  position: relative; margin: 0 auto 20px; transition: 0.4s; padding: 16px 0px 16px 16px;}
.faq-question {color: rgba(30, 41, 59, 1); font-size: 16px; line-height: 26px; font-weight: bold; position: relative; max-width: 100%;
  padding-top: 0; padding-left: 0; padding-bottom: 0; padding-right: 56px; }
.faq-answer { padding-bottom: 0; padding-top: 0; color: rgba(69, 85, 108, 1); height: 0; overflow: hidden; max-width: 100%;
  opacity: 0;}
.faq-container .icon { width: 30px; height: 30px; background: #14e4a2; position: absolute; right: 15px; top: 15px; border-radius: 50%;}
.faq-container .icon:before { content: no-open-quote; height: 6px; width: 14px;position: absolute; right: 8px; top: 12px;
   transition: transform 0.4s; background: url(/wp-content/uploads/2026/10/icon-arrow.svg)no-repeat; background-size: cover;}
.faq-container .toggle { margin: 0; cursor: pointer; position: absolute; top: 0; left: 0; z-index: 3; width: 100%; height: 100%; opacity: 0; }
.faq-container .toggle:checked ~ .icon:before { transform: rotate(180deg);}
.faq-container .toggle:checked ~ .faq-answer { height: auto; opacity: 1; z-index: 2; padding-top: 12px; padding-right: 0px; padding-left: 0;}

/* QUOTE */
.quote-section {margin-bottom: 20px; margin-top: 20px;}
.quote-inner {border: 1px solid rgba(226, 232, 240, 0.7); background: rgba(255, 255, 255, 1); border-radius: 10px; position: relative;}
.quote-inner:before {content: no-open-quote; height: 100%; width: 6px;position: absolute; left: 0px; top: 0px; background: #14e4a2;
  border-radius: 10px 0 0 10px;}
.quote p {padding: 0 0; max-width: 100%;}

/* table of contents */
.toc-wrapper { overflow: hidden; margin-top: 24px;}
.toc-toggle { width: 100%; text-align: left; padding: 10px 20px; font-size: 14px; line-height: 100%; cursor: pointer; font-family: 'inter', sans-serif;
  display: flex; justify-content: flex-start; align-items: center; gap: 6px;  color: rgba(65, 41, 152, 1); border-radius: 12px 12px 0 0;
   background: rgba(255, 255, 255, 1);}
.toc-list {  display: flex; gap: 5px; flex-direction: row; flex-wrap: wrap; width: 100%; max-width: 100%; padding: 0 0;}
.toc-list li {list-style: none;}
.toc-list a {text-decoration: none; font-size: 12px; border-bottom: 2px solid rgba(65, 41, 152, 0.42); background: rgba(241, 245, 249, 1);
  padding: 8px 20px; border-radius: 50px; display: inline-block;}
.toc-content { display: block; background: rgba(255, 255, 255, 1); border-radius: 0 0 12px 12px; padding: 10px 20px 10px 20px;}
.toc-content.is-open { display: none;}
.toc-toggle.is-open { border-radius: 12px;}


/* FIXED BUTTONS */
.fixed-container {position: fixed; bottom: 0; left: 0; width: 100%; padding: 10px 0; background: #412998; display: none;}
.fixed-buttons {display: flex; justify-content: center; gap: 8px;}
.fixed-buttons button {border-radius: 50px; padding: 10px 22px; font-weight: bold; font-size: 16px; line-height: 22px;}
.fixed-buttons button.btn-log {color: #14E4A2;}
/* @media (max-width: 1250px) {
  .fixed-container {display: block;}
} */

/* FOOTER */
.scrollToTop { background: #412998; border-radius: 50%; width: 30px; height: 30px; display: flex; justify-content: center; align-items: center;
  position: fixed; bottom: 15%;right: 20px; opacity: 0; cursor: pointer; z-index: 5;}
.scrollToTop svg { fill: #fff; width: 50%; height: 50%;}

.footer-container {padding: 40px 0; background: rgba(65, 41, 152, 1);}
.footer-inner p {color: rgba(255, 255, 255, 1); font-size: 14px; width: 100%; padding: 0 0; max-width: 400px; margin-left: 0;}
.footer-inner p a {color: #14E4A2;}
.footer-icons {display: flex; align-items: center; gap: 12px; margin-top: 12px;}
.footer-icon {background: rgba(255, 255, 255, 0.06); border-radius: 8px; width: 36px; height: 36px; display: flex; justify-content: center;
  align-items: center;}

/* 404 PAGE */
.error-404 { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 100px 20px 40px;}
.error-404__content { width: 100%; max-width: 760px; margin: 0 auto; text-align: center; background: rgba(255, 255, 255, 1); border: 1px solid rgba(226, 232, 240, 1); border-radius: 20px; padding: 50px 30px;}
.error-404__code { color: rgba(65, 41, 152, 1); font-size: 96px; line-height: 1; font-weight: 800; padding: 0; margin: 0 auto 16px;}
.error-404 .entry-title { padding-top: 0; padding-bottom: 12px;}
.error-404__text { margin-bottom: 20px;}
.error-404__link { display: inline-block; background: linear-gradient(131.51deg, #412998 0%, #2A1A6B 45.76%, #14E4A2 118.98%); color: rgba(255, 255, 255, 1); text-decoration: none; padding: 16px 20px; border-radius: 10px;}
.error-404__link:hover { opacity: 0.8; color: rgba(255, 255, 255, 1);}

@media (max-width: 650px) {
  .error-404 { padding: 85px 12px 30px;}
  .error-404__content { padding: 35px 16px;}
  .error-404__code { font-size: 72px; line-height: 1;}
}

/* CASINO CARD */
.casino-list {margin-top: 20px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px;}
.casino-card {padding: 24px; background: rgba(255, 255, 255, 1); border: 1px solid rgba(226, 232, 240, 1); border-radius: 16px;}
.casino-card__header {display: flex; align-items: center; gap: 24px; padding-bottom: 24px; border-bottom: 1px solid rgba(226, 232, 240, 1);}
.casino-card__brand {flex: 1; min-width: 0;}
.casino-card__brand h3 {width: 100%; max-width: 100%; margin: 0; padding: 0 0 12px; color: rgba(65, 41, 152, 1); font-size: 28px; line-height: 34px; font-weight: bold;}
.casino-card__rating {display: flex; align-items: center; gap: 8px; margin-bottom: 12px; color: #F5B800; font-size: 20px; line-height: 24px; letter-spacing: 2px;}
.casino-card__rating span { font-weight: bold;}
.casino-card__stars {color: #F5B800;}
.casino-card__brand p {width: 100%; max-width: 100%; margin: 0; padding: 0; color: rgba(69, 85, 108, 1);}
.casino-card__brand strong {color: rgba(65, 41, 152, 1); font-weight: 700;}
.casino-card__details {display: grid; grid-template-columns: 2fr 1fr 1fr; align-items: center; gap: 20px; padding-top: 24px;}
.casino-card__item {display: flex; flex-direction: column; gap: 8px; min-width: 0; padding-right: 20px; border-right: 1px solid rgba(226, 232, 240, 1);
  justify-content: flex-start; height: 100%;}
.casino-card .casino-card__item:nth-child(3) {border-right:none;}
.casino-card__item span {color: rgba(69, 85, 108, 1); font-size: 14px; line-height: 20px;}
.casino-card__item strong {color: rgba(65, 41, 152, 1); font-weight: 800; overflow-wrap: anywhere;}
.casino-card__button {display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 54px; padding: 16px 24px; border-radius: 10px; 
  background: linear-gradient(131.51deg, #412998 0%, #2A1A6B 45.76%, #14E4A2 118.98%); color: rgba(255, 255, 255, 1); font-size: 16px; 
  line-height: 20px; font-weight: 700; text-align: center; text-decoration: none; white-space: nowrap; transition: opacity 0.3s; grid-column: 1 / -1; width: 100%;}
.casino-card__button:hover {opacity: 0.85; color: rgba(255, 255, 255, 1);}
.casino-card__logo {display: flex; align-items: center; justify-content: center; flex: 0 0 200px; width: 200px; height: 140px; overflow: hidden; border-radius: 14px; 
  background: rgba(241, 245, 249, 1); padding: 12px;}
.casino-card__logo img {display: block; width: 100%; height: 100%; max-width: 100%; object-fit: contain;}
.casino-card__header {display: flex; align-items: center; gap: 28px; padding-bottom: 24px; border-bottom: 1px solid rgba(226, 232, 240, 1);}
.casino-card__brand {flex: 1; min-width: 0;}
.casino-card__rating-value {color: rgba(69, 85, 108, 1); font-size: 16px; letter-spacing: 0;}
.casino-card__license {display: inline-flex; align-items: center; gap: 8px; margin-bottom: 12px; padding: 8px 14px; background: rgba(65, 41, 152, 0.1); 
  border-radius: 50px;}
.casino-card__license img {width: 22px; height: 22px; object-fit: contain;}
.casino-card__license span {color: rgba(65, 41, 152, 1); font-weight: 700;}
.casino-card__brand p {margin: 0; padding: 0;}
.casino-card__item img {display: block; width: 36px; height: 36px; margin-bottom: 8px; object-fit: contain;}
.casino-card__button-arrow {color: rgba(255, 255, 255, 1); font-size: 22px; line-height: 1;}

@media (max-width: 1000px) {
    .casino-card {padding: 20px;}
    .casino-card__details { gap: 16px;}
    .casino-card__item {padding-right: 12px;}
    .casino-card__item strong {font-size: 18px; line-height: 24px;}
    
}
@media (max-width: 850px) {
  .casino-list { grid-template-columns: 1fr; gap: 16px;}
}

@media (max-width: 650px) {
    .casino-card {padding: 16px; border-radius: 12px;}
    .casino-card__header {gap: 12px; padding-bottom: 16px;}
    .casino-card__brand h3 {font-size: 22px; line-height: 28px; padding-bottom: 8px;}
    .casino-card__rating {flex-wrap: wrap; gap: 6px; font-size: 17px; line-height: 22px; letter-spacing: 1px; margin-bottom: 8px;}
    .casino-card__rating span {font-size: 14px;}
    .casino-card__details {grid-template-columns: 1fr 1fr; gap: 0; padding-top: 8px;}
    .casino-card__item {padding: 12px 8px 12px 0; border-right: none; border-bottom: 1px solid rgba(226, 232, 240, 1); gap: 6px;}
    .casino-card__item:nth-child(odd) {padding-right: 12px; border-right: 1px solid rgba(226, 232, 240, 1);}
    .casino-card__item:nth-child(even) {padding-left: 12px;}
    .casino-card__item span {font-size: 13px; line-height: 18px;}
    .casino-card__item strong {font-size: 16px; line-height: 22px;}
    .casino-card__button {grid-column: 1 / -1; width: 100%; margin-top: 16px; padding: 14px 12px; min-height: 48px; white-space: normal;}
    .casino-card__item:nth-child(1) {grid-column: 1 / 3;}
}




/* TABLET */
@media (max-width: 1000px) {
    .casino-card__logo {flex-basis: 150px; width: 150px; height: 150px;}
    .casino-card__header {gap: 20px;}
}

/* MOBILE */
@media (max-width: 650px) {
    .casino-card__header {align-items: flex-start; gap: 14px; padding-bottom: 16px;}
    .casino-card__logo {flex: 0 0 90px; width: 90px; height: 90px; border-radius: 10px;}
    .casino-card__brand h3 {font-size: 20px; line-height: 26px; overflow-wrap: anywhere;}
    .casino-card__license {gap: 6px; padding: 6px 10px; margin-bottom: 8px;}
    .casino-card__license img {width: 18px; height: 18px;}
    .casino-card__brand p {font-size: 13px; line-height: 18px;}
    .casino-card__item img {width: 28px; height: 28px; margin-bottom: 4px;}
}

