:root {
  --ayo-red: #e11922;
  --ayo-red-dark: #980b12;
  --ayo-maroon: #5b0b12;
  --ayo-deep: #210306;
  --ayo-gold: #f4c44f;
  --ayo-cream: #fff3dc;
  --play-icon-src: url('../images/play-icon.svg');
  --banner-nav-button-bg: rgba(82, 10, 16, .78);
  --banner-nav-button-bg-hover: #e11922;
  --home-progressive-jackpot-bg: linear-gradient(#e11922, #43070c);
  --home-progressive-jackpot-border-color: #f4c44f;
  --home-progressive-jackpot-color: #fff3dc;
  --home-progressive-jackpot-currency-color: #f4c44f;
  --home-progressive-jackpot-inner-cntr-bg: linear-gradient(#9c1118, #350306);
  --home-progressive-jackpot-border-cntr-bg: rgba(42, 2, 5, .92);
  --home-progressive-jackpot-border-cntr-border: 3px solid #e11922;
  --home-progressive-jackpot-jackpot-cntr-bg: linear-gradient(#f4c44f, #980b12);
  --home-progressive-jackpot-jackpot-inner-cntr-bg: #160103;
  --home-progressive-jackpot-jackpot-border-cntr-border: 3px dotted #e11922;
}

html,
body {
  background: #210306 url('../images/ayo368-bg.webp') center top / cover fixed no-repeat !important;
  color: var(--ayo-cream);
}

.desktop-page,
.mobile-page {
  background:
    linear-gradient(rgba(31, 2, 5, .82), rgba(49, 4, 8, .9)),
    url('../images/ayo368-bg.webp') center top / cover fixed no-repeat !important;
}

.topbar-container,
.site-header,
.fixed-footer,
.site-footer {
  background: rgba(51, 4, 8, .96) !important;
}

.site-header {
  border-bottom: 3px solid var(--ayo-gold) !important;
  box-shadow: 0 8px 24px rgba(40, 0, 0, .38);
}

.desktop-page .site-header .logo {
  background-image: none !important;
}

.desktop-page .site-header .logo img {
  content: url('../images/ayo368-logo.webp');
  width: 100%;
  height: 92px;
  object-fit: contain;
}

.mobile-page .site-header .logo img {
  content: url('../images/ayo368-logo-mobile.png');
  width: 185px;
  max-height: 61px;
  object-fit: contain;
}

.announcement-container,
.login-links-container > a:first-child,
.home-game-list-container [data-section='title'] > span,
.popular-game-title-container [data-section='title'] > span {
  background: linear-gradient(135deg, var(--ayo-red), #a50b12) !important;
}

.announcement-container {
  border: 1px solid rgba(244, 196, 79, .8);
  box-shadow: 0 6px 22px rgba(84, 5, 9, .28);
}

.announcement-container [data-section='announcements'] {
  background: rgba(42, 3, 6, .9) !important;
}

.register-button,
.standard-secondary-button,
.download-btn,
.download-apk-section a,
.download-apk .btn {
  background: linear-gradient(180deg, #f04435, #b20d15) !important;
  border-color: var(--ayo-gold) !important;
  color: #fff !important;
}

.login-button,
.login-links-container > a:last-child {
  background: linear-gradient(180deg, var(--ayo-gold), #d57b19) !important;
  color: #4a080d !important;
}

.home-progressive-jackpot,
.home-progressive-jackpot .inner-container,
.home-progressive-jackpot .jackpot-container {
  border-color: var(--ayo-gold) !important;
}

.home-progressive-jackpot {
  background: linear-gradient(180deg, #6b0d14, #e11922 52%, #3a0508) !important;
}

.home-progressive-jackpot .inner-container {
  background: linear-gradient(180deg, #830d14, #320306) !important;
}

.home-progressive-jackpot .border-container {
  background: rgba(35, 2, 4, .96) !important;
  border-color: var(--ayo-red) !important;
}

.home-progressive-jackpot .jackpot-container {
  background: linear-gradient(180deg, var(--ayo-gold), #9c1118) !important;
}

.home-progressive-jackpot .jackpot-inner-container {
  background: #160103 !important;
}

.home-progressive-jackpot .jackpot-border-container {
  border-color: var(--ayo-red) !important;
}

.home-progressive-jackpot .jackpot-currency,
.home-progressive-jackpot .jackpot-play-text,
.top-menu > li:hover > a,
.top-menu > li[data-active='true'] > a,
.fixed-footer a.active,
.main-menu-outer-container a[data-active='true'] {
  color: var(--ayo-gold) !important;
}

.popular-games,
.home-game-list-container,
.home-info-container,
.footer-links,
.site-footer-desc,
.bank-list-container,
.standard-footer-info {
  background-color: rgba(43, 4, 7, .9) !important;
}

.site-footer {
  background:
    linear-gradient(rgba(33, 3, 6, .92), rgba(68, 7, 12, .94)),
    url('../images/ayo368-bg.webp') center bottom / cover no-repeat !important;
}

.site-footer .container,
.site-footer-desc,
.site-footer .footer-links {
  color: #f7d9c3 !important;
}

.footer-description-section {
  display: none !important;
}

.banner-img {
  object-fit: cover;
}

.ayo368-link-banner img {
  content: url('../images/ayo368-hero.webp') !important;
  object-fit: cover;
}

.download-apk > div:first-child img,
.download-apk-container > div:first-child img {
  content: url('../images/ayo368-pwa-icon.png') !important;
  object-fit: contain;
}

#apk_id,
#vpn_id,
.apk,
.floating-vpn-icon,
.rtp-slot-live {
  display: none !important;
}

.ayo-seo-article {
  padding: 32px 20px;
  background: rgba(33, 3, 6, .96);
  color: #f7d9c3;
}

.ayo-seo-article-inner {
  width: min(1180px, 100%);
  margin: 0 auto;
  line-height: 1.72;
}

.ayo-seo-article h1 {
  margin: 0 0 20px;
  color: var(--ayo-gold);
  font-size: clamp(27px, 3vw, 40px);
  line-height: 1.22;
}

.ayo-seo-article h2 {
  margin: 32px 0 12px;
  color: #ffd87a;
  font-size: clamp(22px, 2.2vw, 29px);
}

.ayo-seo-article h3 {
  margin: 24px 0 9px;
  color: #fff3dc;
  font-size: clamp(18px, 1.8vw, 23px);
}

.ayo-seo-article h4 {
  margin: 22px 0 8px;
  color: #ffd87a;
  font-size: 18px;
}

.ayo-seo-article p {
  margin: 0 0 15px;
}

.ayo-seo-article a {
  color: var(--ayo-gold);
  font-weight: 700;
  text-decoration: underline;
}

.ayo-faq {
  padding: 42px 20px 50px;
  background:
    radial-gradient(circle at top right, rgba(225, 25, 34, .2), transparent 34%),
    #2b0407;
  color: #f7d9c3;
}

.ayo-faq-inner {
  width: min(1180px, 100%);
  margin: 0 auto;
}

.ayo-faq-eyebrow {
  display: block;
  color: var(--ayo-gold);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.ayo-faq h2 {
  margin: 8px 0 10px;
  color: #ffd87a;
  font-size: clamp(24px, 2.5vw, 34px);
  line-height: 1.2;
}

.ayo-faq-lead {
  max-width: 720px;
  margin: 0 0 24px;
  line-height: 1.65;
}

.ayo-faq-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: start;
}

.ayo-faq details {
  overflow: hidden;
  border: 1px solid rgba(244, 196, 79, .42);
  border-radius: 10px;
  background: linear-gradient(145deg, rgba(91, 11, 18, .92), rgba(48, 4, 8, .96));
  box-shadow: 0 10px 25px rgba(12, 0, 1, .2);
}

.ayo-faq details[open] {
  border-color: rgba(244, 196, 79, .82);
}

.ayo-faq summary {
  position: relative;
  padding: 16px 46px 16px 17px;
  color: #fff3dc;
  font-weight: 700;
  line-height: 1.45;
  cursor: pointer;
  list-style: none;
}

.ayo-faq summary::-webkit-details-marker {
  display: none;
}

.ayo-faq summary::after {
  content: '+';
  position: absolute;
  top: 50%;
  right: 17px;
  color: var(--ayo-gold);
  font-size: 24px;
  font-weight: 400;
  transform: translateY(-50%);
}

.ayo-faq details[open] summary::after {
  content: '−';
}

.ayo-faq details p {
  margin: 0;
  padding: 0 17px 17px;
  color: #f7d9c3;
  line-height: 1.65;
}

.popular-games,
.home-game-list-container [data-section='content'],
.bank-list-container {
  border-color: rgba(244, 196, 79, .62) !important;
}

.download-apk-container {
  box-shadow: inset 0 1px 0 rgba(255, 234, 180, .5), inset 0 -1px 0 rgba(122, 6, 12, .7);
}

.nav-btn {
  border: 1px solid rgba(244, 196, 79, .8) !important;
}

.modal-content {
  background: linear-gradient(180deg, #5b0b12, #260306) !important;
  border: 1px solid var(--ayo-gold) !important;
}

.powered-by-link,
.mpoplay-certification-link {
  display: inline-block;
  text-decoration: none;
}

.powered-by-logo {
  content: url('../images/mpoplay.webp') !important;
  width: auto !important;
  height: 40px !important;
  max-width: 210px;
  object-fit: contain;
}

@media (max-width: 768px) {
  html,
  body {
    background-position: center top !important;
    background-attachment: scroll !important;
  }

  .desktop-page,
  .mobile-page {
    background:
      linear-gradient(rgba(31, 2, 5, .78), rgba(58, 5, 10, .9)),
      url('../images/ayo368-bg.webp') center top / auto 720px repeat-y !important;
  }

  .download-apk-notification {
    background: linear-gradient(90deg, #5b0b12, #8d1118) !important;
    border-bottom: 1px solid var(--ayo-gold);
  }

  .powered-by-logo {
    height: 34px !important;
    max-width: 180px;
  }

  .ayo-seo-article {
    padding: 24px 16px;
  }

  .ayo-seo-article h1 {
    font-size: 25px;
  }

  .ayo-seo-article h2 {
    font-size: 21px;
  }

  .ayo-seo-article h3 {
    font-size: 18px;
  }

  .ayo-faq {
    padding: 30px 16px 38px;
  }

  .ayo-faq-list {
    grid-template-columns: 1fr;
  }

  .ayo-faq h2 {
    font-size: 23px;
  }
}