/* BetLabel Style Reset and Base */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: Arial, sans-serif;
  background: #ffffff; /* White background */
  color: #1e3a8a; /* Dark blue text */
  line-height: 1.4;
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
}

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

.cover {
  width: 100%;
}

.button {
  display: inline-block;
  padding: 12px 24px;
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%); /* Yellow gradient */
  color: #1e3a8a; /* Dark blue text */
  border: none;
  border-radius: 6px;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
  transition: all 0.3s ease;
  text-transform: uppercase;
  font-size: 14px;
}

.button:hover {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
  transform: translateY(-2px);
}

.title {
  font-weight: bold;
  margin-bottom: 15px;
}

.title.general {
  font-size: 2.5rem;
  color: #1e40af; /* Blue accent */
}

.title.high {
  font-size: 1.8rem;
  color: #1e40af; /* Blue accent */
}

/* ========== ADAPTIVE HEADER STYLES ========== */

/* Header Base */
.header__cover {
  background: #1e3a8a; /* Dark blue header */
  padding: 15px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 1000;
  border-bottom: 2px solid #1e40af;
}

.header__logo img {
  height: 40px;
  width: auto;
}

/* Button Base Styles */
.button {
  display: inline-block;
  padding: 8px 16px;
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%); /* Yellow gradient */
  color: #1e3a8a; /* Dark blue text */
  border: none;
  border-radius: 6px;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
  transition: all 0.3s ease;
  text-transform: uppercase;
  font-size: 12px;
  text-decoration: none;
}

.button:hover {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
  transform: translateY(-2px);
}

.header__button-signin {
  background: transparent;
  border: 2px solid #fbbf24; /* Yellow border */
  color: #fbbf24; /* Yellow text */
  padding: 6px 14px;
}

.header__button-signup {
  background: linear-gradient(135deg, #1e40af 0%, #1d4ed8 100%); /* Blue gradient */
  color: #ffffff;
  padding: 8px 16px;
}

/* Desktop Navigation */
.header__nav {
  display: flex;
  align-items: center;
  gap: 30px;
}

.header__menu {
  display: flex;
  list-style: none;
  gap: 25px;
  margin: 0;
  padding: 0;
}

.header__menu-item a {
  color: #ffffff;
  text-decoration: none;
  font-weight: 500;
  transition: color 0.3s ease;
  padding: 10px 0;
  position: relative;
}

.header__menu-item a:hover {
  color: #fbbf24; /* Yellow on hover */
}

.header__menu-item a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background: #fbbf24; /* Yellow underline */
  transition: width 0.3s ease;
}

.header__menu-item a:hover::after {
  width: 100%;
}

/* Desktop Buttons Container */
.header__desktop-buttons {
  display: flex;
  gap: 15px;
  align-items: center;
}

/* Time Display */
.header__time {
  color: #fbbf24; /* Yellow */
  font-weight: bold;
  font-size: 16px;
  margin-left: 20px;
}

/* Language Dropdown */
.header__language-dropdown {
  position: relative;
  margin-left: 15px;
}

.header__language-button {
  background: #fbbf24; /* Yellow */
  color: #1e3a8a; /* Dark blue */
  padding: 8px 12px;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  transition: background 0.3s ease;
}

.header__language-button:hover {
  background: #f59e0b;
}

.header__language-button svg {
  width: 12px !important;
  height: 12px !important;
  transition: transform 0.3s ease;
}

.header__language-button.active svg {
  transform: rotate(180deg);
}

.header__language-menu {
  position: absolute;
  top: 100%;
  right: 0;
  background: #e0f2fe; /* Light blue */
  border: 1px solid #b3e5fc;
  border-radius: 4px;
  min-width: 80px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: all 0.3s ease;
  z-index: 1001;
  box-shadow: 0 4px 12px rgba(30, 58, 138, 0.3);
}

.header__language-menu.active {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.header__language-item {
  display: block;
  padding: 10px 15px;
  color: #1e3a8a; /* Dark blue */
  text-decoration: none;
  transition: background 0.3s ease;
  text-transform: uppercase;
  font-size: 12px;
}

.header__language-item:hover {
  background: #1e40af; /* Blue */
  color: #ffffff;
}

.header__language-item:first-child {
  border-radius: 4px 4px 0 0;
}

.header__language-item:last-child {
  border-radius: 0 0 4px 4px;
}

/* Mobile Buttons Container */
.header__mobile-buttons {
  display: none;
  align-items: center;
  gap: 10px;
}

/* Burger Menu Button */
.header__burger {
  display: none;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 5px;
  margin-left: 10px;
}

.burger-icon {
  width: 24px;
  height: 24px;
  position: relative;
  transform: rotate(0deg);
  transition: 0.3s ease-in-out;
}

.burger-icon span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: #ffffff;
  border-radius: 2px;
  opacity: 1;
  left: 0;
  transform: rotate(0deg);
  transition: 0.25s ease-in-out;
}

.burger-icon span:nth-child(1) {
  top: 0px;
}

.burger-icon span:nth-child(2) {
  top: 8px;
}

.burger-icon span:nth-child(3) {
  top: 16px;
}

/* Burger Animation - Active State */
.header__burger.active .burger-icon span:nth-child(1) {
  top: 8px;
  transform: rotate(135deg);
}

.header__burger.active .burger-icon span:nth-child(2) {
  opacity: 0;
  left: -60px;
}

.header__burger.active .burger-icon span:nth-child(3) {
  top: 8px;
  transform: rotate(-135deg);
}

/* Mobile Menu Overlay */
.header__mobile-menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(30, 58, 138, 0.95);
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
}

.header__mobile-menu.active {
  opacity: 1;
  visibility: visible;
}

.header__mobile-menu-content {
  position: absolute;
  top: 80px;
  left: 0;
  right: 0;
  background: #1e3a8a; /* Dark blue */
  border-top: 2px solid #fbbf24;
  transform: translateY(-20px);
  transition: transform 0.3s ease;
}

.header__mobile-menu.active .header__mobile-menu-content {
  transform: translateY(0);
}

.header__mobile-menu-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.header__mobile-menu-item {
  border-bottom: 1px solid #1e40af;
}

.header__mobile-menu-item:last-child {
  border-bottom: none;
}

.header__mobile-menu-item a {
  display: block;
  padding: 20px 30px;
  color: #ffffff;
  text-decoration: none;
  font-size: 16px;
  font-weight: 500;
  transition: all 0.3s ease;
  position: relative;
}

.header__mobile-menu-item a:hover {
  background: #1e40af;
  color: #fbbf24;
  padding-left: 40px;
}

.header__mobile-menu-item a::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 4px;
  height: 100%;
  background: #fbbf24; /* Yellow */
  transform: scaleY(0);
  transition: transform 0.3s ease;
}

.header__mobile-menu-item a:hover::before {
  transform: scaleY(1);
}

/* Body Lock when Menu Open */
body.menu-open {
  overflow: hidden;
}

/* ========== RESPONSIVE BREAKPOINTS ========== */

/* Tablet and below */
@media (max-width: 768px) {
  .header__nav {
    display: none;
  }

  .header__desktop-buttons {
    display: none;
  }

  .header__mobile-buttons {
    display: flex;
  }

  .header__burger {
    display: block;
  }
}

/* Mobile */
@media (max-width: 480px) {
  .header__cover {
    padding: 10px 15px;
  }

  .header__logo img {
    height: 35px;
  }

  .header__mobile-buttons .button {
    font-size: 10px;
    padding: 5px 10px;
  }

  .header__mobile-menu-item a {
    padding: 15px 20px;
    font-size: 14px;
  }

  .header__mobile-menu-content {
    top: 65px;
  }
}

/* Large screens */
@media (min-width: 1200px) {
  .header__cover {
    padding: 15px 40px;
  }

  .header__menu {
    gap: 35px;
  }

  .header__desktop-buttons {
    gap: 20px;
  }
}

/* Content Layout */
.content {
  display: flex;
  min-height: calc(100vh - 80px);
}

/* Sidebar Styles - Light Blue Cards */
.sidebar {
  background: #ffffff;
  width: 280px;
  padding: 20px;
  border-right: 1px solid #b3e5fc;
}

.sidebar__left {
  order: 1;
}

.sidebar__right {
  order: 3;
  border-right: none;
  border-left: 1px solid #b3e5fc;
}

/* Left Sidebar */
.sidebar__links {
  margin-bottom: 30px;
}

.sidebar__link {
  display: flex;
  align-items: center;
  padding: 15px;
  background: #e0f2fe; /* Light blue */
  border-radius: 8px;
  margin-bottom: 10px;
  transition: background 0.3s ease;
}

.sidebar__link:hover {
  background: #b3e5fc;
}

.sidebar__link-icon {
  width: 24px;
  height: 24px;
  margin-right: 12px;
}

.sidebar__link-icon svg {
  width: 24px;
  height: 24px;
}

.sidebar__link-text {
  flex: 1;
  color: #1e3a8a; /* Dark blue */
  font-weight: 500;
}

.sidebar__link-arrow img,
.sidebar__link-arrow svg {
  width: 16px;
  height: 16px;
}

.sidebar__link-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #1e40af;
  font-size: 12px;
}

.sidebar__link-controls img,
.sidebar__link-controls svg {
  width: 12px;
  height: 12px;
}

/* Sidebar Tabs */
.sidebar__tabs-nav {
  display: flex;
  background: #e0f2fe; /* Light blue */
  border-radius: 6px;
  margin-bottom: 20px;
}

.sidebar__tabs-nav__item {
  flex: 1;
  padding: 12px;
  text-align: center;
  color: #1e40af;
  transition: all 0.3s ease;
  border-radius: 6px;
}

.sidebar__tabs-nav__item:hover,
.sidebar__tabs-nav__item.active {
  background: #1e40af; /* Blue */
  color: #ffffff;
}

.sidebar__tab-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 15px;
  background: #e0f2fe; /* Light blue */
  border-radius: 6px;
  margin-bottom: 10px;
  color: #1e3a8a; /* Dark blue */
  font-weight: 500;
  transition: background 0.3s ease;
}

.sidebar__tab-link:hover {
  background: #b3e5fc;
}

.sidebar__tab-link img,
.sidebar__tab-link svg {
  width: 16px;
  height: 16px;
}

/* Sidebar Navigation */
.sidebar__nav {
  list-style: none;
}

.sidebar__nav li {
  margin-bottom: 8px;
}

.sidebar__nav-item {
  display: flex;
  align-items: center;
  padding: 10px 15px;
  background: #e0f2fe; /* Light blue */
  border-radius: 6px;
  color: #1e3a8a; /* Dark blue */
  transition: background 0.3s ease;
}

.sidebar__nav-item:hover {
  background: #b3e5fc;
}

.sidebar__nav-icon {
  width: 20px;
  height: 20px;
  margin-right: 12px;
}

.sidebar__nav-icon svg {
  width: 20px;
  height: 20px;
}

/* Table of Contents */
.review {
  background: #e0f2fe; /* Light blue */
  border-radius: 8px;
  overflow: hidden;
}

.review__head {
  background: #1e40af; /* Blue */
  color: #ffffff;
  padding: 15px;
  font-weight: bold;
  cursor: pointer;
}

.review ul {
  list-style: none;
  padding: 0;
}

.review li {
  border-bottom: 1px solid #b3e5fc;
}

.review li:last-child {
  border-bottom: none;
}

.review a {
  display: block;
  padding: 12px 15px;
  color: #1e3a8a; /* Dark blue */
  transition: background 0.3s ease;
}

.review a:hover {
  background: #b3e5fc;
  color: #1e40af;
}

/* Right Sidebar */
.sidebar__reg {
  background: #e0f2fe; /* Light blue */
  border-radius: 8px;
  padding: 20px;
  margin-bottom: 20px;
}

.sidebar__reg-caption {
  color: #1e40af; /* Blue */
  font-weight: bold;
  font-size: 16px;
  margin-bottom: 15px;
  text-align: center;
}

.sidebar__reg-buttons {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
}

.sidebar__reg-button {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 15px 10px;
  background: #ffffff;
  border: 1px solid #b3e5fc;
  border-radius: 6px;
  color: #1e3a8a; /* Dark blue */
  font-size: 12px;
  transition: background 0.3s ease;
}

.sidebar__reg-button:hover {
  background: #f0f9ff;
}

.sidebar__reg-button img,
.sidebar__reg-button svg {
  width: 24px;
  height: 24px;
  margin-bottom: 8px;
}

.sidebar__reg-form {
  display: block;
}

.sidebar__reg-input {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 15px;
  background: #ffffff;
  border: 1px solid #b3e5fc;
  border-radius: 6px;
  margin-bottom: 10px;
  color: #1e3a8a; /* Dark blue */
  cursor: pointer;
  transition: background 0.3s ease;
}

.sidebar__reg-input:hover {
  background: #f0f9ff;
}

.sidebar__reg-input img,
.sidebar__reg-input svg {
  width: 20px;
  height: 20px;
}

.sidebar__reg-input .icon-arrow {
  width: 12px;
  height: 12px;
}

.sidebar__reg-text {
  font-size: 11px;
  color: #1e40af;
  text-align: center;
  margin-top: 15px;
  line-height: 1.4;
}

.sidebar__bonusText {
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%); /* Yellow */
  color: #1e3a8a; /* Dark blue */
  padding: 15px;
  border-radius: 8px;
  text-align: center;
  font-weight: bold;
  margin-bottom: 20px;
}

/* Betting Slip */
.sidebar__bets {
  background: #e0f2fe; /* Light blue */
  border-radius: 8px;
  overflow: hidden;
  display: block;
}

.sidebar__bets-head {
  background: #1e40af; /* Blue */
  color: #ffffff;
  padding: 12px 15px;
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  font-weight: bold;
}

.sidebar__bets-body {
  padding: 20px;
}

.sidebar__bets-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 15px;
}

.sidebar__bets-caption p {
  color: #1e40af; /* Blue */
  font-weight: bold;
  font-size: 12px;
}

.sidebar__bets-caption img,
.sidebar__bets-caption svg {
  width: 16px;
  height: 16px;
}

.sidebar__bets-banner {
  background: #ffffff;
  border: 1px solid #b3e5fc;
  padding: 20px;
  border-radius: 6px;
  text-align: center;
  color: #1e40af;
  font-size: 14px;
  margin-bottom: 20px;
  min-height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sidebar__bets-button {
  width: 100%;
  text-align: center;
  padding: 12px;
}

/* Main Content - White Background */
.main {
  flex: 1;
  order: 2;
  background: #ffffff;
}

/* Hero Section */
.prime__cover {
  position: relative;
  height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.prime__background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  filter: blur(8px);
}

.prime__background img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.prime__wrap {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 600px;
  padding: 0 20px;
}

.rating__item {
  background: rgba(30, 58, 138, 0.8); /* Dark blue with opacity */
  padding: 10px 20px;
  border-radius: 25px;
  margin-bottom: 20px;
  display: inline-block;
}

.rating__item p {
  color: #ffffff;
  font-size: 14px;
  margin-bottom: 5px;
}

.rating__numbers {
  color: #fbbf24; /* Yellow */
  font-weight: bold;
  font-size: 18px;
}

.prime__title {
  color: #ffffff !important;
  margin-bottom: 15px;
  text-shadow: 2px 2px 4px rgba(30, 58, 138, 0.8);
  text-align: left;
  margin-left: -260px;
}

.prime__text {
  color: #ffffff;
  font-size: 20px;
  margin-bottom: 25px;
  text-shadow: 1px 1px 2px rgba(30, 58, 138, 0.8);
  text-align: left !important;
  margin-left: -260px;
}

.prime__button {
  font-size: 16px;
  padding: 15px 40px;
  box-shadow: 0 4px 15px rgba(251, 191, 36, 0.3);
}

/* Article Sections - Light Blue Cards */
.section {
  padding: 40px 30px;
}

.section.article {
  background: #e0f2fe; /* Light blue */
  margin: 20px;
  border-radius: 12px;
  border: 1px solid #b3e5fc;
}

.section h2 {
  color: #1e40af; /* Blue */
  font-size: 1.8rem;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid #1e40af;
}

.section p {
  color: #1e3a8a; /* Dark blue */
  line-height: 1.6;
  margin-bottom: 15px;
}

.section h3 {
  color: #1e3a8a; /* Dark blue */
  font-size: 1.3rem;
  margin: 25px 0 15px 0;
}

.section ul {
  color: #1e3a8a; /* Dark blue */
  margin-left: 20px;
  margin-bottom: 15px;
}

.section li {
  margin-bottom: 8px;
}

/* Tables Section */
.tables__wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin-top: 30px;
  overflow-x: auto !important;
}

.advantages__table table,
.about__table table {
  width: 100%;
  background: #ffffff;
  border: 1px solid #b3e5fc;
  border-radius: 8px;
  overflow-x: hidden !important;
}

.advantages__table td,
.about__table td {
  padding: 15px;
  border-bottom: 1px solid #b3e5fc;
  color: #1e3a8a; /* Dark blue */
}

.advantages__table td:first-child {
  width: 50px;
  text-align: center;
}

.advantages__table img,
.advantages__table svg {
  width: 24px;
  height: 24px;
}

.about__table td:first-child {
  color: #1e40af; /* Blue */
  font-weight: bold;
}

/* Bonus Section */
.upto {
  position: relative;
  height: 300px;
  display: flex;
  align-items: center;
  margin: 20px;
  border-radius: 12px;
  overflow: hidden;
}

.upto__background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.upto__background img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.upto__wrap {
  position: relative;
  z-index: 2;
  padding: 0 50px;
}

.upto__title {
  color: #ffffff !important;
  font-size: 3rem;
  margin-bottom: 10px;
  text-shadow: 1px 1px 2px rgba(30, 58, 138, 0.8),
  1px 1px 2px rgba(30, 58, 138, 0.8),
  1px 1px 2px rgba(30, 58, 138, 0.8),
  1px 1px 2px rgba(30, 58, 138, 0.8),
  2px 2px 2px rgba(30, 58, 138, 0.8);
}

.upto__text {
  color: #ebebeb !important;
  font-size: 20px;
  margin-bottom: 25px;
  text-shadow: 1px 1px 2px rgba(30, 58, 138, 0.8),
  1px 1px 2px rgba(30, 58, 138, 0.8),
  1px 1px 2px rgba(30, 58, 138, 0.8),
  1px 1px 2px rgba(30, 58, 138, 0.8),
  2px 2px 2px rgba(30, 58, 138, 0.8);
}

.upto__button {
  font-size: 16px;
  padding: 15px 40px;
  box-shadow: 0 4px 15px rgba(251, 191, 36, 0.3);
}

/* Content Section */
.content-section {
  padding: 40px 30px;
  color: #1e3a8a; /* Dark blue */
}

.content-section h2 {
  color: #1e40af; /* Blue */
  font-size: 1.8rem;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid #1e40af;
}

.content-section h3 {
  color: #1e3a8a; /* Dark blue */
  font-size: 1.3rem;
  margin: 25px 0 15px 0;
}

.content-section p {
  line-height: 1.6;
  margin-bottom: 15px;
}

.content-section ul {
  margin-left: 20px;
  margin-bottom: 15px;
}

.content-section li {
  margin-bottom: 8px;
}

/* Rating Section */
.rating__table table {
  width: 100%;
  background: #ffffff;
  border: 1px solid #b3e5fc;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 30px;
}

.rating__table td {
  padding: 15px;
  border-bottom: 1px solid #b3e5fc;
  color: #1e3a8a; /* Dark blue */
}

.rating__table td:first-child {
  color: #1e40af; /* Blue */
  font-weight: bold;
}

.rating__table img,
.rating__table svg {
  width: 16px;
  height: 16px;
  margin-right: 2px;
}

@media (max-width: 768px) {
  .rating__table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .rating__table table {
    min-width: 600px;
  }
}

.button-box {
  text-align: center;
}

.article__button {
  font-size: 16px;
  padding: 15px 40px;
}

/* FAQ Section */
.faq__list {
  list-style: none;
}

.faq__item {
  background: #e0f2fe; /* Light blue */
  border: 1px solid #b3e5fc;
  border-radius: 8px;
  margin-bottom: 15px;
  overflow: hidden;
}

.faq-item__title {
  padding: 20px;
  color: #1e3a8a; /* Dark blue */
  cursor: pointer;
  background: #e0f2fe; /* Light blue */
  transition: background 0.3s ease;
  position: relative;
}

.faq-item__title:hover {
  background: #b3e5fc;
}

.faq-item__title:after {
  content: '+';
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  color: #1e40af; /* Blue */
  font-size: 24px;
  font-weight: bold;
}

.faq__item.active .faq-item__title:after {
  content: '-';
}

.faq-item__desc {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.faq-item__desc .wrap {
  padding: 0 20px 20px 20px;
}

.faq-item__desc p {
  color: #1e3a8a; /* Dark blue */
  line-height: 1.6;
}

/* Back to Top */
.back-top {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 1000;
}

.back-top__button {
  display: block;
  width: 50px;
  height: 50px;
  background: #1e40af; /* Blue */
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 15px rgba(30, 64, 175, 0.3);
  transition: all 0.3s ease;
}

.back-top__button:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(30, 64, 175, 0.4);
}

.back-top__button img,
.back-top__button svg {
  width: 20px;
  height: 20px;
}
@media (max-width: 768px) {
  .back-top {
    right: 1rem;
  }
}

/* Footer */
.footer {
  background: #1e3a8a; /* Dark blue */
  border-top: 2px solid #1e40af;
}

.footer__block {
  padding: 20px 30px;
  border-bottom: 1px solid #1e40af;
}

.footer__block:last-child {
  border-bottom: none;
}

.footer__link {
  display: block;
  color: #fbbf24; /* Yellow */
  font-weight: bold;
  font-size: 16px;
  text-align: center;
  transition: color 0.3s ease;
}

.footer__link:hover {
  color: #f59e0b;
}

.footer__text p {
  color: #ffffff;
  line-height: 1.6;
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
}

.footer__pays {
  text-align: center;
}

.footer__pays img {
  max-width: 200px;
}

.footer__copy {
  color: #b3e5fc;
  font-size: 14px;
  text-align: center;
}

.footer__additonal {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 30px;
}

.footer__age {
  background: #fbbf24; /* Yellow */
  color: #1e3a8a; /* Dark blue */
  padding: 8px 15px;
  border-radius: 4px;
  font-weight: bold;
}

.footer__mobile {
  color: #fbbf24; /* Yellow */
  font-weight: bold;
  transition: color 0.3s ease;
}

.footer__mobile:hover {
  color: #f59e0b;
}

/* Mobile Responsive */
@media (max-width: 1200px) {
  .content {
    flex-direction: column;
    overflow-x: hidden;
  }
  
  .sidebar {
    width: 100%;
    order: 2;
  }
  
  .main {
    order: 1;
  }
  
  .sidebar__right {
    order: 3;
  }
  
  .tables__wrap {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .header__menu {
    display: none;
  }
  
  .header__menu.active {
    display: flex;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #1e3a8a; /* Dark blue */
    flex-direction: column;
    padding: 20px;
    border-top: 1px solid #1e40af;
  }
  
  .header-menu__desc {
    flex-direction: column;
    gap: 15px;
    margin-right: 0;
    margin-bottom: 20px;
  }
  
  .header__buttons {
    display: none;
  }
  
  .header__button-menu {
    display: block;
  }
  
  .prime__title {
    font-size: 2rem;
  }
  
  .upto__title {
    font-size: 2rem;
  }
  
  .section {
    padding: 20px 15px;
  }
  
  .sidebar {
    padding: 15px;
  }
  
  .sidebar__reg-buttons {
    flex-direction: column;
  }
}

/* ========== TABLE OF CONTENTS ========== */
#TableOfContents {
  background-color: #e0f2fe; /* Light blue */
  padding: 1.75rem;
  border-radius: 1rem;
  border: 1px solid #b3e5fc;
  font-size: 1rem;
  margin: 2.5rem 0;
  color: #1e3a8a; /* Dark blue */
}

#TableOfContents ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

#TableOfContents li {
  margin-bottom: 1rem;
}

#TableOfContents a {
  color: #1e40af; /* Blue */
  text-decoration: none;
  font-weight: 500;
  transition: all 0.2s ease;
  display: block;
  padding: 0.5rem 0.75rem;
  border-radius: 0.5rem;
}

#TableOfContents a:hover {
  color: #1e3a8a; /* Dark blue */
  background-color: #b3e5fc;
  transform: translateX(5px);
}

/* ========== TABLE STYLES ========== */
.table-container {
  background-color: #e0f2fe; /* Light blue */
  border: 1px solid #b3e5fc;
  border-radius: 0.75rem;
  margin: 2rem 0;
}

/* Обёртка для скролла */
.table-scroll {
  overflow-x: auto;
  width: 100%;
}

/* Сама таблица */
.table-scroll table {
  width: 100%;
  min-width: 600px;
  border-collapse: collapse;
  font-size: 0.95rem;
  color: #1e3a8a; /* Dark blue */
  background-color: transparent;
}

thead {
  background-color: #1e40af; /* Blue */
}

th {
  padding: 1rem 0.75rem;
  text-align: left;
  font-weight: 600;
  color: #fff;
  border-bottom: 2px solid #1d4ed8;
}

td {
  padding: 0.875rem 0.75rem;
  border-bottom: 1px solid #b3e5fc;
}

tbody tr:hover {
  background-color: #b3e5fc;
}

tbody tr:last-child td {
  border-bottom: none;
}

/* Ссылки в таблице */
table a {
  color: #fbbf24; /* Yellow */
  text-decoration: none;
  font-weight: 500;
}

table a:hover {
  color: #1e3a8a; /* Dark blue */
  text-decoration: underline;
}

@media (max-width: 768px) {
  table {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
  }
}

/* ========== FAQ BLOCK ========== */
.faq-block {
  background-color: #e0f2fe; /* Light blue */
  padding: 3rem 2rem;
  margin: 4rem 0;
  border-radius: 1rem;
  border: 1px solid #b3e5fc;
}

.faq-heading {
  font-size: 2.25rem;
  font-weight: 800;
  color: #1e40af; /* Blue */
  margin-bottom: 2.5rem;
  text-align: center;
}

.faq-item {
  background-color: #ffffff;
  border: 1px solid #b3e5fc;
  border-radius: 1rem;
  padding: 1.75rem;
  margin-bottom: 1.5rem;
  color: #1e3a8a; /* Dark blue */
  font-size: 1rem;
  transition: all 0.3s ease;
}

.faq-item h3 {
  font-size: 1.35rem;
  color: #1e40af; /* Blue */
  margin-bottom: 1rem;
  font-weight: 700;
}

.faq-item div {
  line-height: 1.7;
  color: #1e3a8a; /* Dark blue */
}

.faq-item:hover {
  background-color: #f0f9ff;
  transform: translateY(-3px);
  border-color: #1e40af;
  box-shadow: 0 8px 20px rgba(30, 64, 175, 0.15);
}

@media (max-width: 768px) {
  .faq-block {
    padding: 2rem 1rem;
  }
  
  .faq-heading {
    font-size: 1.75rem;
  }
  
  .faq-item {
    padding: 1.25rem;
  }
  
  .faq-item h3 {
    font-size: 1.2rem;
  }
}/* BetLabel Style Reset and Base */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: Arial, sans-serif;
  background: #ffffff; /* White background */
  color: #1e3a8a; /* Dark blue text */
  line-height: 1.4;
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
}

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

.cover {
  width: 100%;
}

.button {
  display: inline-block;
  padding: 12px 24px;
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%); /* Yellow gradient */
  color: #1e3a8a; /* Dark blue text */
  border: none;
  border-radius: 6px;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
  transition: all 0.3s ease;
  text-transform: uppercase;
  font-size: 14px;
}

.button:hover {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
  transform: translateY(-2px);
}

.title {
  font-weight: bold;
  margin-bottom: 15px;
}

.title.general {
  font-size: 2.5rem;
  color: #1e40af; /* Blue accent */
}

.title.high {
  font-size: 1.8rem;
  color: #1e40af; /* Blue accent */
}

/* ========== ADAPTIVE HEADER STYLES ========== */

/* Header Base */
.header__cover {
  background: #1e3a8a; /* Dark blue header */
  padding: 15px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 1000;
  border-bottom: 2px solid #1e40af;
}

.header__logo img {
  height: 40px;
  width: auto;
}

/* Button Base Styles */
.button {
  display: inline-block;
  padding: 8px 16px;
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%); /* Yellow gradient */
  color: #1e3a8a; /* Dark blue text */
  border: none;
  border-radius: 6px;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
  transition: all 0.3s ease;
  text-transform: uppercase;
  font-size: 12px;
  text-decoration: none;
}

.button:hover {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
  transform: translateY(-2px);
}

.header__button-signin {
  background: transparent;
  border: 2px solid #fbbf24; /* Yellow border */
  color: #fbbf24; /* Yellow text */
  padding: 6px 14px;
}

.header__button-signup {
  background: linear-gradient(135deg, #1e40af 0%, #1d4ed8 100%); /* Blue gradient */
  color: #ffffff;
  padding: 8px 16px;
}

/* Desktop Navigation */
.header__nav {
  display: flex;
  align-items: center;
  gap: 30px;
}

.header__menu {
  display: flex;
  list-style: none;
  gap: 25px;
  margin: 0;
  padding: 0;
}

.header__menu-item a {
  color: #ffffff;
  text-decoration: none;
  font-weight: 500;
  transition: color 0.3s ease;
  padding: 10px 0;
  position: relative;
}

.header__menu-item a:hover {
  color: #fbbf24; /* Yellow on hover */
}

.header__menu-item a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background: #fbbf24; /* Yellow underline */
  transition: width 0.3s ease;
}

.header__menu-item a:hover::after {
  width: 100%;
}

/* Desktop Buttons Container */
.header__desktop-buttons {
  display: flex;
  gap: 15px;
  align-items: center;
}

/* Time Display */
.header__time {
  color: #fbbf24; /* Yellow */
  font-weight: bold;
  font-size: 16px;
  margin-left: 20px;
}

/* Language Dropdown */
.header__language-dropdown {
  position: relative;
  margin-left: 15px;
}

.header__language-button {
  background: #fbbf24; /* Yellow */
  color: #1e3a8a; /* Dark blue */
  padding: 8px 12px;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  transition: background 0.3s ease;
}

.header__language-button:hover {
  background: #f59e0b;
}

.header__language-button svg {
  width: 12px !important;
  height: 12px !important;
  transition: transform 0.3s ease;
}

.header__language-button.active svg {
  transform: rotate(180deg);
}

.header__language-menu {
  position: absolute;
  top: 100%;
  right: 0;
  background: #e0f2fe; /* Light blue */
  border: 1px solid #b3e5fc;
  border-radius: 4px;
  min-width: 80px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-10px);
  transition: all 0.3s ease;
  z-index: 1001;
  box-shadow: 0 4px 12px rgba(30, 58, 138, 0.3);
}

.header__language-menu.active {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.header__language-item {
  display: block;
  padding: 10px 15px;
  color: #1e3a8a; /* Dark blue */
  text-decoration: none;
  transition: background 0.3s ease;
  text-transform: uppercase;
  font-size: 12px;
}

.header__language-item:hover {
  background: #1e40af; /* Blue */
  color: #ffffff;
}

.header__language-item:first-child {
  border-radius: 4px 4px 0 0;
}

.header__language-item:last-child {
  border-radius: 0 0 4px 4px;
}

/* Mobile Buttons Container */
.header__mobile-buttons {
  display: none;
  align-items: center;
  gap: 10px;
}

/* Burger Menu Button */
.header__burger {
  display: none;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 5px;
  margin-left: 10px;
}

.burger-icon {
  width: 24px;
  height: 24px;
  position: relative;
  transform: rotate(0deg);
  transition: 0.3s ease-in-out;
}

.burger-icon span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: #ffffff;
  border-radius: 2px;
  opacity: 1;
  left: 0;
  transform: rotate(0deg);
  transition: 0.25s ease-in-out;
}

.burger-icon span:nth-child(1) {
  top: 0px;
}

.burger-icon span:nth-child(2) {
  top: 8px;
}

.burger-icon span:nth-child(3) {
  top: 16px;
}

/* Burger Animation - Active State */
.header__burger.active .burger-icon span:nth-child(1) {
  top: 8px;
  transform: rotate(135deg);
}

.header__burger.active .burger-icon span:nth-child(2) {
  opacity: 0;
  left: -60px;
}

.header__burger.active .burger-icon span:nth-child(3) {
  top: 8px;
  transform: rotate(-135deg);
}

/* Mobile Menu Overlay */
.header__mobile-menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: rgba(30, 58, 138, 0.95);
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
}

.header__mobile-menu.active {
  opacity: 1;
  visibility: visible;
}

.header__mobile-menu-content {
  position: absolute;
  top: 80px;
  left: 0;
  right: 0;
  background: #1e3a8a; /* Dark blue */
  border-top: 2px solid #fbbf24;
  transform: translateY(-20px);
  transition: transform 0.3s ease;
}

.header__mobile-menu.active .header__mobile-menu-content {
  transform: translateY(0);
}

.header__mobile-menu-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.header__mobile-menu-item {
  border-bottom: 1px solid #1e40af;
}

.header__mobile-menu-item:last-child {
  border-bottom: none;
}

.header__mobile-menu-item a {
  display: block;
  padding: 20px 30px;
  color: #ffffff;
  text-decoration: none;
  font-size: 16px;
  font-weight: 500;
  transition: all 0.3s ease;
  position: relative;
}

.header__mobile-menu-item a:hover {
  background: #1e40af;
  color: #fbbf24;
  padding-left: 40px;
}

.header__mobile-menu-item a::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 4px;
  height: 100%;
  background: #fbbf24; /* Yellow */
  transform: scaleY(0);
  transition: transform 0.3s ease;
}

.header__mobile-menu-item a:hover::before {
  transform: scaleY(1);
}

/* Body Lock when Menu Open */
body.menu-open {
  overflow: hidden;
}

/* ========== RESPONSIVE BREAKPOINTS ========== */

/* Tablet and below */
@media (max-width: 768px) {
  .header__nav {
    display: none;
  }

  .header__desktop-buttons {
    display: none;
  }

  .header__mobile-buttons {
    display: flex;
  }

  .header__burger {
    display: block;
  }
}

/* Mobile */
@media (max-width: 480px) {
  .header__cover {
    padding: 10px 15px;
  }

  .header__logo img {
    height: 35px;
  }

  .header__mobile-buttons .button {
    font-size: 10px;
    padding: 5px 10px;
  }

  .header__mobile-menu-item a {
    padding: 15px 20px;
    font-size: 14px;
  }

  .header__mobile-menu-content {
    top: 65px;
  }
}

/* Large screens */
@media (min-width: 1200px) {
  .header__cover {
    padding: 15px 40px;
  }

  .header__menu {
    gap: 35px;
  }

  .header__desktop-buttons {
    gap: 20px;
  }
}

/* Content Layout */
.content {
  display: flex;
  min-height: calc(100vh - 80px);
}

/* Sidebar Styles - Light Blue Cards */
.sidebar {
  background: #ffffff;
  width: 280px;
  padding: 20px;
  border-right: 1px solid #b3e5fc;
}

.sidebar__left {
  order: 1;
}

.sidebar__right {
  order: 3;
  border-right: none;
  border-left: 1px solid #b3e5fc;
}

/* Left Sidebar */
.sidebar__links {
  margin-bottom: 30px;
}

.sidebar__link {
  display: flex;
  align-items: center;
  padding: 15px;
  background: #e0f2fe; /* Light blue */
  border-radius: 8px;
  margin-bottom: 10px;
  transition: background 0.3s ease;
}

.sidebar__link:hover {
  background: #b3e5fc;
}

.sidebar__link-icon {
  width: 24px;
  height: 24px;
  margin-right: 12px;
}

.sidebar__link-icon svg {
  width: 24px;
  height: 24px;
}

.sidebar__link-text {
  flex: 1;
  color: #1e3a8a; /* Dark blue */
  font-weight: 500;
}

.sidebar__link-arrow img,
.sidebar__link-arrow svg {
  width: 16px;
  height: 16px;
}

.sidebar__link-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #1e40af;
  font-size: 12px;
}

.sidebar__link-controls img,
.sidebar__link-controls svg {
  width: 12px;
  height: 12px;
}

/* Sidebar Tabs */
.sidebar__tabs-nav {
  display: flex;
  background: #e0f2fe; /* Light blue */
  border-radius: 6px;
  margin-bottom: 20px;
}

.sidebar__tabs-nav__item {
  flex: 1;
  padding: 12px;
  text-align: center;
  color: #1e40af;
  transition: all 0.3s ease;
  border-radius: 6px;
}

.sidebar__tabs-nav__item:hover,
.sidebar__tabs-nav__item.active {
  background: #1e40af; /* Blue */
  color: #ffffff;
}

.sidebar__tab-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 15px;
  background: #e0f2fe; /* Light blue */
  border-radius: 6px;
  margin-bottom: 10px;
  color: #1e3a8a; /* Dark blue */
  font-weight: 500;
  transition: background 0.3s ease;
}

.sidebar__tab-link:hover {
  background: #b3e5fc;
}

.sidebar__tab-link img,
.sidebar__tab-link svg {
  width: 16px;
  height: 16px;
}

/* Sidebar Navigation */
.sidebar__nav {
  list-style: none;
}

.sidebar__nav li {
  margin-bottom: 8px;
}

.sidebar__nav-item {
  display: flex;
  align-items: center;
  padding: 10px 15px;
  background: #e0f2fe; /* Light blue */
  border-radius: 6px;
  color: #1e3a8a; /* Dark blue */
  transition: background 0.3s ease;
}

.sidebar__nav-item:hover {
  background: #b3e5fc;
}

.sidebar__nav-icon {
  width: 20px;
  height: 20px;
  margin-right: 12px;
}

.sidebar__nav-icon svg {
  width: 20px;
  height: 20px;
}

/* Table of Contents */
.review {
  background: #e0f2fe; /* Light blue */
  border-radius: 8px;
  overflow: hidden;
}

.review__head {
  background: #1e40af; /* Blue */
  color: #ffffff;
  padding: 15px;
  font-weight: bold;
  cursor: pointer;
}

.review ul {
  list-style: none;
  padding: 0;
}

.review li {
  border-bottom: 1px solid #b3e5fc;
}

.review li:last-child {
  border-bottom: none;
}

.review a {
  display: block;
  padding: 12px 15px;
  color: #1e3a8a; /* Dark blue */
  transition: background 0.3s ease;
}

.review a:hover {
  background: #b3e5fc;
  color: #1e40af;
}

/* Right Sidebar */
.sidebar__reg {
  background: #e0f2fe; /* Light blue */
  border-radius: 8px;
  padding: 20px;
  margin-bottom: 20px;
}

.sidebar__reg-caption {
  color: #1e40af; /* Blue */
  font-weight: bold;
  font-size: 16px;
  margin-bottom: 15px;
  text-align: center;
}

.sidebar__reg-buttons {
  display: flex;
  gap: 10px;
  margin-bottom: 20px;
}

.sidebar__reg-button {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 15px 10px;
  background: #ffffff;
  border: 1px solid #b3e5fc;
  border-radius: 6px;
  color: #1e3a8a; /* Dark blue */
  font-size: 12px;
  transition: background 0.3s ease;
}

.sidebar__reg-button:hover {
  background: #f0f9ff;
}

.sidebar__reg-button img,
.sidebar__reg-button svg {
  width: 24px;
  height: 24px;
  margin-bottom: 8px;
}

.sidebar__reg-form {
  display: block;
}

.sidebar__reg-input {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 15px;
  background: #ffffff;
  border: 1px solid #b3e5fc;
  border-radius: 6px;
  margin-bottom: 10px;
  color: #1e3a8a; /* Dark blue */
  cursor: pointer;
  transition: background 0.3s ease;
}

.sidebar__reg-input:hover {
  background: #f0f9ff;
}

.sidebar__reg-input img,
.sidebar__reg-input svg {
  width: 20px;
  height: 20px;
}

.sidebar__reg-input .icon-arrow {
  width: 12px;
  height: 12px;
}

.sidebar__reg-text {
  font-size: 11px;
  color: #1e40af;
  text-align: center;
  margin-top: 15px;
  line-height: 1.4;
}

.sidebar__bonusText {
  background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%); /* Yellow */
  color: #1e3a8a; /* Dark blue */
  padding: 15px;
  border-radius: 8px;
  text-align: center;
  font-weight: bold;
  margin-bottom: 20px;
}

/* Betting Slip */
.sidebar__bets {
  background: #e0f2fe; /* Light blue */
  border-radius: 8px;
  overflow: hidden;
  display: block;
}

.sidebar__bets-head {
  background: #1e40af; /* Blue */
  color: #ffffff;
  padding: 12px 15px;
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  font-weight: bold;
}

.sidebar__bets-body {
  padding: 20px;
}

.sidebar__bets-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 15px;
}

.sidebar__bets-caption p {
  color: #1e40af; /* Blue */
  font-weight: bold;
  font-size: 12px;
}

.sidebar__bets-caption img,
.sidebar__bets-caption svg {
  width: 16px;
  height: 16px;
}

.sidebar__bets-banner {
  background: #ffffff;
  border: 1px solid #b3e5fc;
  padding: 20px;
  border-radius: 6px;
  text-align: center;
  color: #1e40af;
  font-size: 14px;
  margin-bottom: 20px;
  min-height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sidebar__bets-button {
  width: 100%;
  text-align: center;
  padding: 12px;
}

/* Main Content - White Background */
.main {
  flex: 1;
  order: 2;
  background: #ffffff;
}

/* Hero Section */
.prime__cover {
  position: relative;
  height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.prime__background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.prime__background img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.prime__wrap {
  position: relative;
  z-index: 2;
  text-align: center;
  max-width: 600px;
  padding: 0 20px;
}

.rating__item {
  background: rgba(30, 58, 138, 0.8); /* Dark blue with opacity */
  padding: 10px 20px;
  border-radius: 25px;
  margin-bottom: 20px;
  display: inline-block;
}

.rating__item p {
  color: #ffffff;
  font-size: 14px;
  margin-bottom: 5px;
}

.rating__numbers {
  color: #fbbf24; /* Yellow */
  font-weight: bold;
  font-size: 18px;
}

.prime__title {
  color: #ffffff !important;
  margin-bottom: 15px;
  text-shadow: 2px 2px 4px rgba(30, 58, 138, 0.8);
}

.prime__text {
  color: #ffffff;
  font-size: 18px;
  margin-bottom: 25px;
  text-shadow: 1px 1px 2px rgba(30, 58, 138, 0.8);
}

.prime__button {
  font-size: 16px;
  padding: 15px 40px;
  box-shadow: 0 4px 15px rgba(251, 191, 36, 0.3);
}

/* Article Sections - Light Blue Cards */
.section {
  padding: 40px 30px;
}

.section.article {
  background: #e0f2fe; /* Light blue */
  margin: 20px;
  border-radius: 12px;
  border: 1px solid #b3e5fc;
}

.section h2 {
  color: #1e40af; /* Blue */
  font-size: 1.8rem;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid #1e40af;
}

.section p {
  color: #1e3a8a; /* Dark blue */
  line-height: 1.6;
  margin-bottom: 15px;
}

.section h3 {
  color: #1e3a8a; /* Dark blue */
  font-size: 1.3rem;
  margin: 25px 0 15px 0;
}

.section ul {
  color: #1e3a8a; /* Dark blue */
  margin-left: 20px;
  margin-bottom: 15px;
}

.section li {
  margin-bottom: 8px;
}

/* Tables Section */
.tables__wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  margin-top: 30px;
  overflow-x: auto !important;
}

.advantages__table table,
.about__table table {
  width: 100%;
  background: #ffffff;
  border: 1px solid #b3e5fc;
  border-radius: 8px;
  overflow-x: hidden !important;
}

.advantages__table td,
.about__table td {
  padding: 15px;
  border-bottom: 1px solid #b3e5fc;
  color: #1e3a8a; /* Dark blue */
}

.advantages__table td:first-child {
  width: 50px;
  text-align: center;
}

.advantages__table img,
.advantages__table svg {
  width: 24px;
  height: 24px;
}

.about__table td:first-child {
  color: #1e40af; /* Blue */
  font-weight: bold;
}

/* Bonus Section */
.upto {
  position: relative;
  height: 300px;
  display: flex;
  align-items: center;
  margin: 20px;
  border-radius: 12px;
  overflow: hidden;
}

.upto__background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.upto__background img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.upto__wrap {
  position: relative;
  z-index: 2;
  padding: 0 50px;
}

.upto__title {
  color: #ffffff !important;
  font-size: 3rem;
  margin-bottom: 10px;
  text-shadow: 1px 1px 2px rgba(30, 58, 138, 0.8),
  1px 1px 2px rgba(30, 58, 138, 0.8),
  1px 1px 2px rgba(30, 58, 138, 0.8),
  1px 1px 2px rgba(30, 58, 138, 0.8),
  2px 2px 2px rgba(30, 58, 138, 0.8);
}

.upto__text {
  color: #ebebeb !important;
  font-size: 20px;
  margin-bottom: 25px;
  text-shadow: 1px 1px 2px rgba(30, 58, 138, 0.8),
  1px 1px 2px rgba(30, 58, 138, 0.8),
  1px 1px 2px rgba(30, 58, 138, 0.8),
  1px 1px 2px rgba(30, 58, 138, 0.8),
  2px 2px 2px rgba(30, 58, 138, 0.8);
}

.upto__button {
  font-size: 16px;
  padding: 15px 40px;
  box-shadow: 0 4px 15px rgba(251, 191, 36, 0.3);
}

/* Content Section */
.content-section {
  padding: 40px 30px;
  color: #1e3a8a; /* Dark blue */
}

.content-section h2 {
  color: #1e40af; /* Blue */
  font-size: 1.8rem;
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid #1e40af;
}

.content-section h3 {
  color: #1e3a8a; /* Dark blue */
  font-size: 1.3rem;
  margin: 25px 0 15px 0;
}

.content-section p {
  line-height: 1.6;
  margin-bottom: 15px;
}

.content-section ul {
  margin-left: 20px;
  margin-bottom: 15px;
}

.content-section li {
  margin-bottom: 8px;
}

/* Rating Section */
.rating__table table {
  width: 100%;
  background: #ffffff;
  border: 1px solid #b3e5fc;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 30px;
}

.rating__table td {
  padding: 15px;
  border-bottom: 1px solid #b3e5fc;
  color: #1e3a8a; /* Dark blue */
}

.rating__table td:first-child {
  color: #1e40af; /* Blue */
  font-weight: bold;
}

.rating__table img,
.rating__table svg {
  width: 16px;
  height: 16px;
  margin-right: 2px;
}

@media (max-width: 768px) {
  .rating__table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .rating__table table {
    min-width: 600px;
  }
}

.button-box {
  text-align: center;
}

.article__button {
  font-size: 16px;
  padding: 15px 40px;
}

/* FAQ Section */
.faq__list {
  list-style: none;
}

.faq__item {
  background: #e0f2fe; /* Light blue */
  border: 1px solid #b3e5fc;
  border-radius: 8px;
  margin-bottom: 15px;
  overflow: hidden;
}

.faq-item__title {
  padding: 20px;
  color: #1e3a8a; /* Dark blue */
  cursor: pointer;
  background: #e0f2fe; /* Light blue */
  transition: background 0.3s ease;
  position: relative;
}

.faq-item__title:hover {
  background: #b3e5fc;
}

.faq-item__title:after {
  content: '+';
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  color: #1e40af; /* Blue */
  font-size: 24px;
  font-weight: bold;
}

.faq__item.active .faq-item__title:after {
  content: '-';
}

.faq-item__desc {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.faq-item__desc .wrap {
  padding: 0 20px 20px 20px;
}

.faq-item__desc p {
  color: #1e3a8a; /* Dark blue */
  line-height: 1.6;
}

/* Back to Top */
.back-top {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 1000;
}

.back-top__button {
  display: block;
  width: 50px;
  height: 50px;
  background: #1e40af; /* Blue */
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 15px rgba(30, 64, 175, 0.3);
  transition: all 0.3s ease;
}

.back-top__button:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(30, 64, 175, 0.4);
}

.back-top__button img,
.back-top__button svg {
  width: 20px;
  height: 20px;
}
@media (max-width: 768px) {
  .back-top {
    right: 1rem;
  }
}

/* Footer */
.footer {
  background: #1e3a8a; /* Dark blue */
  border-top: 2px solid #1e40af;
}

.footer__block {
  padding: 20px 30px;
  border-bottom: 1px solid #1e40af;
}

.footer__block:last-child {
  border-bottom: none;
}

.footer__link {
  display: block;
  color: #fbbf24; /* Yellow */
  font-weight: bold;
  font-size: 16px;
  text-align: center;
  transition: color 0.3s ease;
}

.footer__link:hover {
  color: #f59e0b;
}

.footer__text p {
  color: #ffffff;
  line-height: 1.6;
  text-align: center;
  max-width: 800px;
  margin: 0 auto;
}

.footer__pays {
  text-align: center;
}

.footer__pays img {
  max-width: 200px;
}

.footer__copy {
  color: #b3e5fc;
  font-size: 14px;
  text-align: center;
}

.footer__additonal {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 30px;
}

.footer__age {
  background: #fbbf24; /* Yellow */
  color: #1e3a8a; /* Dark blue */
  padding: 8px 15px;
  border-radius: 4px;
  font-weight: bold;
}

.footer__mobile {
  color: #fbbf24; /* Yellow */
  font-weight: bold;
  transition: color 0.3s ease;
}

.footer__mobile:hover {
  color: #f59e0b;
}

/* Mobile Responsive */
@media (max-width: 1200px) {
  .content {
    flex-direction: column;
    overflow-x: hidden;
  }
  
  .sidebar {
    width: 100%;
    order: 2;
  }
  
  .main {
    order: 1;
  }
  
  .sidebar__right {
    order: 3;
  }
  
  .tables__wrap {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .header__menu {
    display: none;
  }
  
  .header__menu.active {
    display: flex;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #1e3a8a; /* Dark blue */
    flex-direction: column;
    padding: 20px;
    border-top: 1px solid #1e40af;
  }
  
  .header-menu__desc {
    flex-direction: column;
    gap: 15px;
    margin-right: 0;
    margin-bottom: 20px;
  }
  
  .header__buttons {
    display: none;
  }
  
  .header__button-menu {
    display: block;
  }
  
  .prime__title {
    font-size: 2rem;
  }
  
  .upto__title {
    font-size: 2rem;
  }
  
  .section {
    padding: 20px 15px;
  }
  
  .sidebar {
    padding: 15px;
  }
  
  .sidebar__reg-buttons {
    flex-direction: column;
  }
}

/* ========== TABLE OF CONTENTS ========== */
#TableOfContents {
  background-color: #e0f2fe; /* Light blue */
  padding: 1.75rem;
  border-radius: 1rem;
  border: 1px solid #b3e5fc;
  font-size: 1rem;
  margin: 2.5rem 0;
  color: #1e3a8a; /* Dark blue */
}

#TableOfContents ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

#TableOfContents li {
  margin-bottom: 1rem;
}

#TableOfContents a {
  color: #1e40af; /* Blue */
  text-decoration: none;
  font-weight: 500;
  transition: all 0.2s ease;
  display: block;
  padding: 0.5rem 0.75rem;
  border-radius: 0.5rem;
}

#TableOfContents a:hover {
  color: #1e3a8a; /* Dark blue */
  background-color: #b3e5fc;
  transform: translateX(5px);
}

/* ========== TABLE STYLES ========== */
.table-container {
  background-color: #e0f2fe; /* Light blue */
  border: 1px solid #b3e5fc;
  border-radius: 0.75rem;
  margin: 2rem 0;
}

/* Обёртка для скролла */
.table-scroll {
  overflow-x: auto;
  width: 100%;
}

/* Сама таблица */
.table-scroll table {
  width: 100%;
  min-width: 600px;
  border-collapse: collapse;
  font-size: 0.95rem;
  color: #1e3a8a; /* Dark blue */
  background-color: transparent;
}

thead {
  background-color: #1e40af; /* Blue */
}

th {
  padding: 1rem 0.75rem;
  text-align: left;
  font-weight: 600;
  color: #fff;
  border-bottom: 2px solid #1d4ed8;
}

td {
  padding: 0.875rem 0.75rem;
  border-bottom: 1px solid #b3e5fc;
}

tbody tr:hover {
  background-color: #b3e5fc;
}

tbody tr:last-child td {
  border-bottom: none;
}

/* Ссылки в таблице */
table a {
  color: #fbbf24; /* Yellow */
  text-decoration: none;
  font-weight: 500;
}

table a:hover {
  color: #1e3a8a; /* Dark blue */
  text-decoration: underline;
}

@media (max-width: 768px) {
  table {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
  }
}

/* ========== FAQ BLOCK ========== */
.faq-block {
  background-color: #e0f2fe; /* Light blue */
  padding: 3rem 2rem;
  margin: 4rem 0;
  border-radius: 1rem;
  border: 1px solid #b3e5fc;
}

.faq-heading {
  font-size: 2.25rem;
  font-weight: 800;
  color: #1e40af; /* Blue */
  margin-bottom: 2.5rem;
  text-align: center;
}

.faq-item {
  background-color: #ffffff;
  border: 1px solid #b3e5fc;
  border-radius: 1rem;
  padding: 1.75rem;
  margin-bottom: 1.5rem;
  color: #1e3a8a; /* Dark blue */
  font-size: 1rem;
  transition: all 0.3s ease;
}

.faq-item h3 {
  font-size: 1.35rem;
  color: #1e40af; /* Blue */
  margin-bottom: 1rem;
  font-weight: 700;
}

.faq-item div {
  line-height: 1.7;
  color: #1e3a8a; /* Dark blue */
}

.faq-item:hover {
  background-color: #f0f9ff;
  transform: translateY(-3px);
  border-color: #1e40af;
  box-shadow: 0 8px 20px rgba(30, 64, 175, 0.15);
}

@media (max-width: 768px) {
  .faq-block {
    padding: 2rem 1rem;
  }
  
  .faq-heading {
    font-size: 1.75rem;
  }
  
  .faq-item {
    padding: 1.25rem;
  }
  
  .faq-item h3 {
    font-size: 1.2rem;
  }
}

/* Планшеты */
@media (max-width: 1024px) {
  .prime__title {
    margin-left: 0;
    text-align: left;
    font-size: 24px;
  }
  .prime__text {
    margin-left: 0;
    text-align: left;
    font-size: 18px;
  }
}

/* Маленькие экраны */
@media (max-width: 768px) {
  .prime__title {
    margin-left: 0;
    text-align: left;
    font-size: 18px !important;
  }
  .prime__text {
    margin-left: 0;
    text-align: left;
    font-size: 14px !important;
  }
}

/* Мобильные устройства */
@media (max-width: 480px) {
  .prime__title {
    margin-left: 0;
    text-align: left;
    font-size: 20px;
  }
  .prime__text {
    margin-left: 0;
    text-align: left;
    font-size: 14px;
  }
}