/* ============================================================
   SLOTRAVE FINLAND — restyle of the content area (v3)
   Header/footer/sidebar keep the template look; the content zone
   is a custom design: deep navy night, white+blue Finnish cross,
   aurora (northern lights) teal/purple glow, snowflake accents.
   ============================================================ */

:root {
  --es-red: #e5232b;
  --es-red-deep: #a10f1d;
  --es-yellow: #ffc400;
  --es-gold: #ffdf6b;
  --es-violet: #2a86ff;
  --es-magenta: #57e0c0;
  --es-ink: #081633;
  --es-text: #f4ecff;
  --es-muted: #cdbadf;
  --es-flag-line: linear-gradient(90deg, #ffffff 0 30%, #2a86ff 30% 68%, #57e0c0 68% 100%);
  --es-plate: linear-gradient(180deg, #ffd84d 0%, #ffb700 100%);
  --ar-num-plate: linear-gradient(180deg, #7fe6cf 0%, #2a86ff 100%);
  --ar-sun-bullet: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg stroke='%238fe9df' stroke-width='1.6' stroke-linecap='round'%3E%3Cline x1='12' y1='12' x2='22.00' y2='12.00'/%3E%3Cline x1='17.00' y1='12.00' x2='19.81' y2='13.53'/%3E%3Cline x1='17.00' y1='12.00' x2='19.81' y2='10.47'/%3E%3Cline x1='12' y1='12' x2='17.00' y2='20.66'/%3E%3Cline x1='14.50' y1='16.33' x2='14.58' y2='19.53'/%3E%3Cline x1='14.50' y1='16.33' x2='17.23' y2='17.99'/%3E%3Cline x1='12' y1='12' x2='7.00' y2='20.66'/%3E%3Cline x1='9.50' y1='16.33' x2='6.77' y2='17.99'/%3E%3Cline x1='9.50' y1='16.33' x2='9.42' y2='19.53'/%3E%3Cline x1='12' y1='12' x2='2.00' y2='12.00'/%3E%3Cline x1='7.00' y1='12.00' x2='4.19' y2='10.47'/%3E%3Cline x1='7.00' y1='12.00' x2='4.19' y2='13.53'/%3E%3Cline x1='12' y1='12' x2='7.00' y2='3.34'/%3E%3Cline x1='9.50' y1='7.67' x2='9.42' y2='4.47'/%3E%3Cline x1='9.50' y1='7.67' x2='6.77' y2='6.01'/%3E%3Cline x1='12' y1='12' x2='17.00' y2='3.34'/%3E%3Cline x1='14.50' y1='7.67' x2='17.23' y2='6.01'/%3E%3Cline x1='14.50' y1='7.67' x2='14.58' y2='4.47'/%3E%3C/g%3E%3C/svg%3E");
}

/* ------------------------------------------------------------
   Исправление шаблона: «flex: 1 1 1» невалиден и игнорируется,
   колонка контента растягивалась по контенту и резалась справа.
   ------------------------------------------------------------ */
.main__wrap .main__content {
  flex: 1 1 0;
  min-width: 0;
  max-width: 100%;
}

/* ------------------------------------------------------------
   Фон всей страницы: глубокий индиго с мягкими celeste/золотыми
   свечениями (цвета флага Аргентины). Хедер/футер/сайдбар имеют
   собственные фоны — их стилистика не меняется.
   ------------------------------------------------------------ */
body {
  background-color: #081633;
  background-image:
    radial-gradient(1100px 620px at 12% -6%, rgba(47, 107, 255, 0.18) 0%, rgba(47, 107, 255, 0) 60%),
    radial-gradient(980px 520px at 100% 2%, rgba(87, 224, 192, 0.13) 0%, rgba(87, 224, 192, 0) 55%),
    radial-gradient(900px 760px at 50% 118%, rgba(160, 108, 255, 0.10) 0%, rgba(160, 108, 255, 0) 60%),
    linear-gradient(180deg, #08132e 0%, #060d22 100%);
  background-attachment: fixed;
  background-repeat: no-repeat;
}

/* ------------------------------------------------------------
   Общий вид секций: стеклянные карточки с неоновой кромкой
   ------------------------------------------------------------ */
.main__content .section {
  position: relative;
  border-radius: 20px;
  padding: 32px 30px;
  background: #371049;
  border: 1px solid rgba(90, 130, 220, 0.28);
  box-shadow: 0 16px 46px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  overflow: hidden;
}

/* неоновая линия сверху карточки — с медленным «перетеканием» цвета */
.main__content .section:not(.prime):not(.banner):not(.app-banner):not(.prelink)::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--es-magenta) 20%, var(--es-violet) 40%, var(--es-yellow) 60%, var(--es-magenta) 80%, transparent 100%);
  background-size: 200% 100%;
  opacity: 0.8;
  animation: es-line-flow 7s linear infinite;
}

@keyframes es-line-flow {
  0% {
    background-position: 0% 0;
  }
  100% {
    background-position: -200% 0;
  }
}

.main__content .section.prime,
.main__content .section.banner,
.main__content .section.app-banner,
.main__content .sidebar__section-mob,
.main__content .section.prelink {
  background: none;
  border: none;
  box-shadow: none;
  padding-left: 0;
  padding-right: 0;
  overflow: visible;
}

/* декоративные фоновые арты шаблона внутри секций больше не нужны —
   карточки самодостаточны (в баннерах и хиро фоны остаются) */
.main__content .section:not(.prime):not(.banner):not(.app-banner) > .background {
  display: none !important;
}

.home-s-15 > img {
  display: none !important;
}

/* контент секций больше не упирается в узкие max-width шаблона */
.section .relative {
  margin-left: 0 !important;
  max-width: none !important;
}

/* ------------------------------------------------------------
   Заголовки
   ------------------------------------------------------------ */
.section h2 {
  color: var(--es-text);
  border-bottom: none;          /* убираем жёлтую линию шаблона */
  padding-bottom: 14px;
  position: relative;
  letter-spacing: 0.2px;
}

.section h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 84px;
  height: 4px;
  border-radius: 2px;
  background: var(--es-flag-line);
  box-shadow: 0 0 12px rgba(255, 196, 0, 0.45);
}

.section h3 {
  color: var(--es-gold);
}

/* заголовки перед текстовыми вставками: выравнивание с их внутренним
   отступом + зазор, чтобы заголовок не прилипал к боксу */
.section h2:has(+ .overlay-list-2),
.section h3:has(+ .overlay-list-2) {
  padding-left: 20px;
  padding-right: 20px;
  margin-bottom: 14px;
}

.section :is(h2, h3):has(+ .table-wrapper, + .table-banner-wrapper, + .accordion, + .bg-img-border, + .section-figure) {
  margin-bottom: 14px;
}

.section h2:has(+ .overlay-list-2)::after {
  left: 20px;
}

.banner__title {
  border-bottom: none;
  padding-bottom: 0;
}

.banner__title::after {
  display: none;
}

/* ------------------------------------------------------------
   ХИРО: скрим под текст + жёлтая плашка бренда + бегущая рамка
   ------------------------------------------------------------ */
.prime {
  position: relative;
  z-index: 0;
  border: 2px solid rgba(87, 224, 192, 0.65);
  border-radius: 20px;
  overflow: visible;
  animation: es-banner-pulse 3.6s ease-in-out infinite;
}

.prime .background {
  border-radius: 17px;
  overflow: hidden;
}

.prime::before {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 24px;
  z-index: -1;
  filter: blur(8px);
  background: conic-gradient(from var(--es-angle),
      #ffffff 0%, transparent 12%, #2a86ff 26%, transparent 40%,
      #57e0c0 54%, transparent 68%, #a06cff 82%, transparent 100%);
  animation: es-border-run 5s linear infinite;
}

.prime__background img {
  object-position: right center;
}

/* мягкий скрим: подстраховывает читаемость, не съедая фон картинки */
.prime__background::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(22, 2, 34, 0.6) 0%, rgba(22, 2, 34, 0.42) 32%, rgba(22, 2, 34, 0.15) 52%, rgba(22, 2, 34, 0) 66%),
    linear-gradient(0deg, rgba(22, 2, 34, 0.4) 0%, rgba(22, 2, 34, 0) 28%);
}

.prime__wrap {
  padding-left: 28px;
  z-index: 2;
}

/* чуть больше воздуха между ссылками в хедере */
@media screen and (min-width: 901px) {
  .header .nav__list {
    gap: 34px;
  }
}

/* хлебные крошки над H1 в хиро */
.breadcrumbs {
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  font-size: 14px;
  font-weight: 700;
}

.breadcrumbs a {
  color: var(--es-muted);
  text-decoration: none;
  transition: color 0.2s ease-in-out;
}

.breadcrumbs a:hover {
  color: var(--es-yellow);
}

.breadcrumbs__sep {
  color: var(--es-violet);
}

.breadcrumbs__current {
  color: var(--es-gold);
}

/* плашка рейтинга */
.prime__rating {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 7px 14px;
  margin-bottom: 14px;
  border-radius: 999px;
  border: 1px solid rgba(255, 196, 0, 0.45);
  background: rgba(22, 2, 34, 0.65);
  width: max-content;
  backdrop-filter: blur(4px);
}

.prime__rating-text {
  color: var(--es-muted);
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.6px;
}

.prime__rating-value {
  font-family: "ABC", "Lato", sans-serif;
  font-weight: 900;
  background: linear-gradient(180deg, var(--es-gold) 0%, #ff8a00 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* бренд-строка H1 — жёлтая скошенная плашка в духе основного сайта */
.prime__title {
  color: #ffffff;
}

.prime__title > span:first-child {
  display: inline-block;
  width: max-content;
  max-width: 100%;
  padding: 5px 16px 3px;
  margin-bottom: 10px;
  background: var(--es-plate);
  color: var(--es-ink);
  transform: skewX(-6deg);
  border-radius: 6px;
  box-shadow: 0 6px 22px rgba(255, 183, 0, 0.35);
  text-shadow: none;
}

/* текст хиро не выходит из приглушённой зоны на яркий арт
   (у страниц свои .prime__text до 660px — перекрываем) */
.main__content .prime__text {
  color: var(--es-muted);
  max-width: 460px !important;
  line-height: 1.6;
  margin-bottom: 18px;
}

.main__content .prime__title {
  max-width: 560px;
}

/* Хлебные крошки в хиро (страницы bonus/app — на месте плашки-рейтинга) */
.prime__crumbs {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: 14px;
  padding: 7px 15px;
  border-radius: 999px;
  background: rgba(20, 16, 51, 0.55);
  border: 1px solid rgba(87, 224, 192, 0.35);
  box-shadow: 0 0 14px rgba(42, 134, 255, 0.25);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  backdrop-filter: blur(6px);
}

.prime__crumbs a {
  color: var(--es-muted);
  text-decoration: none;
  transition: color 0.2s ease;
}

.prime__crumbs a:hover,
.prime__crumbs a:focus {
  color: #ffffff;
}

.prime__crumbs-sep {
  color: rgba(205, 186, 223, 0.55);
}

.prime__crumbs-current {
  color: var(--es-yellow);
}

/* ------------------------------------------------------------
   БАННЕРЫ: скрим + жёлтые плашки офферов
   ------------------------------------------------------------ */
.banner,
.app-banner {
  position: relative;
  z-index: 0;
  border-radius: 20px;
  border: 2px solid rgba(200, 107, 255, 0.75);
  overflow: visible;
  animation: es-banner-pulse 3s ease-in-out infinite;
}

/* картинка и скрим скругляются вместе с баннером */
.banner .background,
.app-banner .background {
  border-radius: 17px;
  overflow: hidden;
}

/* бегущее по рамке свечение (как у блока Hot/Cold) в бренд-цветах */
.banner::before,
.app-banner::before {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 24px;
  z-index: -1;
  filter: blur(7px);
  background: conic-gradient(from var(--es-angle),
      #ffffff 0%, transparent 12%, #2a86ff 26%, transparent 40%,
      #57e0c0 54%, transparent 68%, #a06cff 82%, transparent 100%);
  animation: es-border-run 4s linear infinite;
}

@keyframes es-banner-pulse {
  0%, 100% {
    box-shadow: 0 0 12px rgba(252, 81, 255, 0.3), 0 0 30px rgba(165, 96, 255, 0.18);
  }
  50% {
    box-shadow: 0 0 22px rgba(252, 81, 255, 0.55), 0 0 46px rgba(255, 196, 0, 0.22);
  }
}

.banner__background::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(22, 2, 34, 0.55) 0%, rgba(22, 2, 34, 0.35) 36%, rgba(22, 2, 34, 0.08) 58%, rgba(22, 2, 34, 0) 72%);
}

/* app-баннер: кнопки по краям — виньетка с приглушёнными краями и ярким центром */
.app-banner__background::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(22, 2, 34, 0.6) 0%, rgba(22, 2, 34, 0.2) 26%, rgba(22, 2, 34, 0) 42%, rgba(22, 2, 34, 0) 58%, rgba(22, 2, 34, 0.2) 74%, rgba(22, 2, 34, 0.6) 100%);
}

/* текст и плашки — над скримом (у шаблона wrap не спозиционирован,
   и абсолютный слой фона затемнял контент) */
.banner__wrap,
.app-banner__wrap {
  position: relative;
  z-index: 2;
}

/* кнопки app-баннера разводим к краям без ограничения ширины */
.app-banner__wrap {
  max-width: none;
}

.app-banner__img {
  position: relative;
  z-index: 2;
}

.banner__title {
  color: #ffffff;
}

.banner__subtitle span {
  display: inline-block;
  width: max-content;
  max-width: 100%;
  padding: 6px 16px 4px;
  background: var(--es-plate);
  color: var(--es-ink) !important;
  font-family: "ABC", "Lato", sans-serif;
  font-weight: 900;
  transform: skewX(-6deg);
  border-radius: 6px;
  box-shadow: 0 4px 18px rgba(255, 183, 0, 0.3);
}

.banner__subtitle span + span {
  margin-top: 8px;
}

/* flex-элемент не должен раздуваться шире родителя (иначе плашки уезжают за экран) */
.banner__subtitle {
  min-width: 0;
  max-width: 100%;
}

/* чёрная плашка шаблона поверх нашей жёлтой — долой */
.banner__subtitle > span::before {
  display: none;
}

.banner__subtitle {
  text-shadow: none;
}

/* ------------------------------------------------------------
   Списки-«чипы»: свои маркеры, без огоньков шаблона
   ------------------------------------------------------------ */
.section .list {
  gap: 8px;
}

.section .list li {
  text-align: left;
  padding: 12px 16px 12px 42px;
  border-radius: 12px;
  border: 1px solid rgba(180, 140, 255, 0.3);
  background: linear-gradient(90deg, rgba(152, 108, 228, 0.22) 0%, rgba(78, 36, 116, 0.4) 100%);
  line-height: 1.55;
}

.section .list li:not(:last-child) {
  border-bottom: 1px solid rgba(42, 134, 255, 0.22);
}

.section .list li::before {
  content: "";
  top: 50%;
  left: 13px;
  transform: translateY(-50%);
  width: 17px;
  height: 17px;
  border-radius: 0;
  background: var(--ar-sun-bullet) center / contain no-repeat !important;
  box-shadow: none;
  filter: drop-shadow(0 0 4px rgba(246, 180, 14, 0.55));
}

.section .list li::after {
  display: none;                /* огоньки шаблона убраны */
}

/* вложенный список внутри пункта: плоские подпункты с мелким круглым
   маркером (не карточки-ромбы как у родителя) — «список в списке» читаемее */
.section .list .list {
  margin-top: 10px;
  gap: 6px;
}

.section .list .list li {
  background: none;
  border: none;
  border-radius: 0;
  padding: 2px 0 2px 22px;
}

.section .list .list li:not(:last-child) {
  border-bottom: none;
}

.section .list .list li::before {
  content: "";
  top: 0.7em;
  left: 4px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  transform: none;
  background: var(--es-violet) !important;
  box-shadow: 0 0 6px rgba(42, 134, 255, 0.6);
}

/* нумерованные шаги: вместо синих плиток — стекло + золотые номера */
.feature-list {
  counter-reset: es-step;
  max-width: none;
  gap: 10px;
}

.feature-list > li {
  background: linear-gradient(90deg, rgba(165, 96, 255, 0.14) 0%, rgba(28, 0, 41, 0.5) 70%);
  border: 1px solid rgba(42, 134, 255, 0.3);
  border-radius: 12px;
  font-weight: 700;
  row-gap: 6px; /* зазор между жирной меткой и абзацем внутри пункта */
}

.feature-list--number > li {
  counter-increment: es-step;
  margin-left: 52px;
  padding: 13px 14px;
  justify-content: center;
}

/* пункты со ссылками: flex дробит содержимое (текст/ссылка/точка) на
   отдельные строки — таким пунктам обычный поток в одну строку */
.main__content .feature-list > li:has(> a) {
  display: block;
  line-height: 1.6;
}

.feature-list--number > li::before {
  content: counter(es-step);
  position: absolute;
  left: -52px;
  top: 50%;
  transform: translateY(-50%);
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-family: "ABC", "Lato", sans-serif;
  font-weight: 900;
  font-size: 17px;
  color: #0e2036;
  background: var(--ar-num-plate);
  box-shadow: 0 0 14px rgba(42, 134, 255, 0.5);
}

/* ------------------------------------------------------------
   Плюсы / минусы
   ------------------------------------------------------------ */
/* Эффект «Hot/Cold» как на основном сайте Slotrave: огненная рамка у плюсов,
   ледяная у минусов — бегущее по контуру свечение + пульсация */
@property --es-angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

.pros-cons__item {
  position: relative;
  z-index: 0;
  border-radius: 16px;
  padding: 20px 16px 8px;
}

.pros-cons__item--pros {
  border: 3px solid #ff3b30;
  background: linear-gradient(160deg, #4d0d20 0%, #200630 60%, #2b0a26 100%);
  animation: es-flame-pulse 2.4s ease-in-out infinite;
}

.pros-cons__item--cons {
  border: 3px solid #2d6bff;
  background: linear-gradient(160deg, #0c1a56 0%, #180530 60%, #101040 100%);
  animation: es-ice-pulse 2.4s ease-in-out infinite;
}

/* бегущая по контуру «энергия» (перекрывает webp-рамки шаблона) */
.pros-cons__item--pros::before,
.pros-cons__item--cons::before {
  content: "";
  position: absolute;
  inset: -7px;
  border-radius: 22px;
  z-index: -1;
  filter: blur(7px);
  animation: es-border-run 3.2s linear infinite;
}

.pros-cons__item--pros::before {
  background: conic-gradient(from var(--es-angle),
      #ff3b30 0%, transparent 16%, #ff9d00 30%, transparent 44%,
      #ff3b30 55%, transparent 70%, #ff9d00 85%, transparent 100%);
}

.pros-cons__item--cons::before {
  background: conic-gradient(from var(--es-angle),
      #2d6bff 0%, transparent 16%, #4fd8ff 30%, transparent 44%,
      #2d6bff 55%, transparent 70%, #4fd8ff 85%, transparent 100%);
}

/* непрозрачная «крышка» поверх кольца, под контентом: кольцо видно только за рамкой */
.pros-cons__item--pros::after,
.pros-cons__item--cons::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 13px;
  z-index: -1;
}

.pros-cons__item--pros::after {
  background: linear-gradient(160deg, #4d0d20 0%, #200630 60%, #2b0a26 100%);
}

.pros-cons__item--cons::after {
  background: linear-gradient(160deg, #0c1a56 0%, #180530 60%, #101040 100%);
}

@keyframes es-border-run {
  to {
    --es-angle: 360deg;
  }
}

@keyframes es-flame-pulse {
  0%, 100% {
    box-shadow: 0 0 12px rgba(255, 59, 48, 0.45), 0 0 30px rgba(255, 130, 40, 0.22), inset 0 0 18px rgba(255, 59, 48, 0.16);
  }
  50% {
    box-shadow: 0 0 24px rgba(255, 59, 48, 0.85), 0 0 52px rgba(255, 130, 40, 0.4), inset 0 0 26px rgba(255, 59, 48, 0.3);
  }
}

@keyframes es-ice-pulse {
  0%, 100% {
    box-shadow: 0 0 12px rgba(45, 107, 255, 0.45), 0 0 30px rgba(79, 216, 255, 0.22), inset 0 0 18px rgba(45, 107, 255, 0.16);
  }
  50% {
    box-shadow: 0 0 24px rgba(45, 107, 255, 0.85), 0 0 52px rgba(79, 216, 255, 0.4), inset 0 0 26px rgba(45, 107, 255, 0.3);
  }
}

/* уважение к настройкам доступности */
@media (prefers-reduced-motion: reduce) {
  .pros-cons__item--pros,
  .pros-cons__item--cons,
  .pros-cons__item--pros::before,
  .pros-cons__item--cons::before,
  .banner,
  .app-banner,
  .banner::before,
  .app-banner::before,
  .prime,
  .prime::before,
  .main__content .section::before,
  .primary-button,
  .secondary-button,
  .app-button,
  .rating-review__title span img,
  .prime__rating,
  .section h2::after,
  .section-figure img,
  .scroll-to-top,
  .error-page__code {
    animation: none;
  }
}

.pros-cons__item .list li {
  border: none;
  background: none;
  border-radius: 0;
}

.pros-cons__item .list li:not(:last-child) {
  border-bottom: 1px dashed rgba(255, 255, 255, 0.14);
}

/* маркеры «Ventajas» — золотое Солнце Мая (как базовый), «Desventajas» — celeste-ромб */
.pros-cons__item--pros .list li::before {
  background: var(--ar-sun-bullet) center / contain no-repeat !important;
  filter: drop-shadow(0 0 4px rgba(246, 180, 14, 0.55));
}

.pros-cons__item--cons .list li::before {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  transform: translateY(-50%) rotate(45deg);
  background: linear-gradient(135deg, #57e0c0 0%, #2a86ff 100%) !important;
  background-image: linear-gradient(135deg, #57e0c0 0%, #2a86ff 100%) !important;
  box-shadow: 0 0 8px rgba(42, 134, 255, 0.55);
  filter: none;
}

/* ------------------------------------------------------------
   Таблицы: тёмное стекло, золотые шапки, зебра
   ------------------------------------------------------------ */
.table-wrapper,
.table-wrapper--bg {
  border-radius: 16px;
  border: 1px solid rgba(42, 134, 255, 0.3);
  background-image: none;
  /* единый градиент для всех таблиц — как у table-banner */
  background: linear-gradient(120deg, rgba(87, 224, 192, 0.16) 0%, rgba(30, 46, 96, 0.74) 42%, rgba(8, 15, 40, 0.95) 100%);
}

.table thead {
  color: var(--es-gold);
}

.table thead th {
  border-bottom: none;
  text-shadow: none;
}

/* градиентная «черта» под шапкой обычных таблиц — как у .table-banner
   (бело-сине-красный флаг). Рисуем фоном самого thead: линия всегда точно
   по ширине таблицы и не ломает раскладку строк. */
.table thead {
  background-image: linear-gradient(90deg, rgba(255, 255, 255, 0.55) 0 33%, rgba(47, 107, 255, 0.55) 33% 66%, rgba(229, 35, 43, 0.55) 66% 100%);
  background-repeat: no-repeat;
  background-position: left bottom;
  background-size: 100% 2px;
}

/* узкая таблица оценок в «Puntuación» — по центру блока */
.home-s-15 .table-wrapper {
  margin-left: auto;
  margin-right: auto;
}

/* первая строка не должна прилипать к шапке (только у таблиц с шапкой) */
.table thead + tbody tr:first-child td {
  padding-top: 18px;
}

.table-banner thead + tbody tr:first-child td {
  padding-top: 20px;
}

.table tbody tr:nth-child(odd) {
  background: rgba(255, 255, 255, 0.028);
}

/* строка-подзаголовок внутри таблицы (напр. «Pasos para activar el bono») */
.table tbody tr.table__subhead td {
  padding-top: 20px;
  color: var(--es-gold);
  font-family: "ABC", "Lato", sans-serif;
  font-weight: 900;
  font-size: 18px;
  border-top: 2px solid rgba(255, 196, 0, 0.3);
}

.table tbody tr.table__subhead td:first-child {
  display: table-cell;
}

.table tbody tr.table__subhead td:first-child::after {
  display: none;
}

.table tbody tr.table__subhead {
  background: rgba(255, 196, 0, 0.05) !important;
}

.table-banner-wrapper {
  border-radius: 16px;
  border: 1px solid rgba(42, 134, 255, 0.3);
  background: linear-gradient(120deg, rgba(87, 224, 192, 0.16) 0%, rgba(30, 46, 96, 0.74) 42%, rgba(8, 15, 40, 0.95) 100%);
}

.table-banner thead {
  color: var(--es-gold);
}

.table-banner thead tr::after {
  background: var(--es-flag-line);
  opacity: 0.55;
}

.table-banner tbody tr:not(:last-child)::after {
  background: rgba(255, 196, 0, 0.16);
}

/* ------------------------------------------------------------
   Аккордеон (FAQ)
   ------------------------------------------------------------ */
.accordion .accordion__item {
  border-radius: 14px;
  border: 1px solid rgba(42, 134, 255, 0.3);
  background: linear-gradient(120deg, rgba(165, 96, 255, 0.12) 0%, rgba(26, 5, 38, 0.9) 100%);
  overflow: hidden;
}

.accordion .accordion__item:not(:last-child) {
  margin-bottom: 12px;
}

.accordion .accordion__title {
  color: var(--es-text);
  transition: color 0.2s ease-in-out;
}

.accordion .accordion__title:hover {
  color: var(--es-yellow);
}

/* ------------------------------------------------------------
   Отзывы
   ------------------------------------------------------------ */
.rating-review__item {
  border-radius: 18px;
  border: 1px solid rgba(255, 196, 0, 0.28);
  background:
    radial-gradient(130% 100% at 15% 0%, rgba(255, 196, 0, 0.1) 0%, rgba(255, 196, 0, 0) 45%),
    linear-gradient(160deg, rgba(42, 17, 64, 0.92) 0%, rgba(20, 3, 30, 0.95) 100%);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.4);
}

/* все карточки отзывов одной высоты — по самому высокому (swiper растягивает слайды) */
.card-wrapper .swiper-wrapper {
  align-items: stretch;
}

.rating-review__item.swiper-slide {
  height: auto;
}

.rating-review__title span img {
  border: 2px solid var(--es-yellow);
  border-radius: 50%;
}

.rating-review__text {
  font-style: italic;
  color: var(--es-muted);
  font-size: 16px;
  line-height: 1.6;
}

/* ------------------------------------------------------------
   Сплит-блоки (картинка + текст): собственный стиль вместо
   рамки border.webp шаблона — стеклянная панель с неоновой кромкой
   ------------------------------------------------------------ */
.bg-img-border {
  position: relative;
  border-radius: 18px;
  border: 1px solid rgba(165, 96, 255, 0.3);
  background:
    radial-gradient(120% 100% at 12% 0%, rgba(252, 81, 255, 0.1) 0%, rgba(252, 81, 255, 0) 50%),
    linear-gradient(160deg, rgba(42, 17, 64, 0.92) 0%, rgba(20, 3, 30, 0.96) 100%);
  padding: 24px;
  box-shadow: 0 10px 34px rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  overflow: hidden;
}

/* декоративная рамка шаблона больше не используется */
.bg-img-border > .background {
  display: none !important;
}

/* бегущая неоновая кромка сверху — как у карточек секций */
.bg-img-border::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--es-magenta) 20%, var(--es-violet) 40%, var(--es-yellow) 60%, var(--es-magenta) 80%, transparent 100%);
  background-size: 200% 100%;
  opacity: 0.8;
  animation: es-line-flow 7s linear infinite;
}

/* единые отступы панели во всех секциях (шаблон даёт то 40×20, то 30×20) */
.main__content .bg-img-border {
  padding: 24px !important;
}

.split-block {
  display: flex;
  align-items: center;
  gap: 30px;
  margin: 0 !important;
}

.split-block__img {
  flex: 0 0 42%;
  max-width: 480px;
  width: auto;
  margin: 0 !important;
  align-self: center;
}

.split-block__img img,
.split-block__img > img:first-child,
.split-block__img > img:last-child {
  display: block;
  position: static !important;   /* шаблон местами делает img абсолютным — он исчезает */
  opacity: 1 !important;         /* и местами затемняет картинку (opacity .7) */
  width: 100%;
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;      /* min-height:540 + translateY(-50%) выталкивали img из панели */
  transform: none !important;
  margin: 0 !important;
  border-radius: 14px;
  border: 1px solid rgba(255, 196, 0, 0.28);
  box-shadow: 0 0 22px rgba(165, 96, 255, 0.28);
  animation: es-soft-glow 4.5s ease-in-out infinite;
}

.split-block__content {
  flex: 1 1 0;
  min-width: 0;
  width: auto;
}

.split-block__content > h3:first-child {
  margin-bottom: 12px;
}

/* заголовок внутри сплит-блока — точно как стандартные h3 сайта
   (шаблон делал его 32px с тенью) */
.main__content .split-block__content h3 {
  font-family: "ABC", "Lato", sans-serif;
  font-size: 24px !important;
  font-weight: 900;
  line-height: normal;
  text-shadow: none;
  -webkit-text-stroke-width: 0;
  color: var(--es-gold);
}

@media screen and (max-width: 750px) {
  .main__content .split-block__content h3 {
    font-size: 20px !important;
  }
}

@media screen and (max-width: 900px) {
  /* без внутренних боковых отступов: картинка во всю ширину панели,
     текст — на единой линии 12px, как весь текст сайта */
  .bg-img-border,
  .main__content .bg-img-border {
    padding: 16px 0 18px !important;
    border-left: none;
    border-right: none;
    border-radius: 12px;
  }

  .split-block {
    flex-direction: column;
    gap: 20px;
  }

  .split-block--reverse {
    flex-direction: column;
  }

  .split-block__img {
    flex-basis: auto;
    width: 100%;
    max-width: 460px;      /* картинка с прежним максимальным размером, по центру */
    margin: 0 auto !important;
  }

  .split-block__img img,
  .split-block__img > img:first-child,
  .split-block__img > img:last-child {
    border-radius: 10px;
  }

  .split-block__content {
    width: 100%;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
}

/* Иллюстрации внутри секций: на всю ширину блока, высота до 400px,
   без затемнений, объект по центру, «дышащее» неоновое свечение */
.section-figure {
  margin: 20px 0;
}

.section-figure img {
  display: block;
  width: 100%;
  max-height: 400px;
  object-fit: cover;
  object-position: center;
  border-radius: 14px;
  border: 1px solid rgba(165, 96, 255, 0.3);
  animation: es-soft-glow 4.5s ease-in-out infinite;
}

@keyframes es-soft-glow {
  0%, 100% {
    box-shadow: 0 0 10px rgba(165, 96, 255, 0.2);
  }
  50% {
    box-shadow: 0 0 22px rgba(252, 81, 255, 0.4);
  }
}

/* карточка-выделение бонуса (вместо таблицы «Nombre y efectos del bono») */
.bonus-highlight {
  position: relative;
  padding: 20px 22px;
  border-radius: 16px;
  border: 1px solid rgba(255, 196, 0, 0.4);
  background:
    radial-gradient(120% 100% at 0% 0%, rgba(255, 196, 0, 0.14) 0%, rgba(255, 196, 0, 0) 55%),
    linear-gradient(160deg, rgba(42, 134, 255, 0.14) 0%, rgba(20, 16, 51, 0.7) 60%);
}

.bonus-highlight__label {
  display: inline-block;
  margin-bottom: 12px;
  padding: 5px 14px;
  border-radius: 999px;
  background: var(--es-plate);
  color: var(--es-ink);
  font-family: "ABC", "Lato", sans-serif;
  font-weight: 900;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

.bonus-highlight__name {
  margin: 0 0 6px;
  color: var(--es-gold);
  font-family: "ABC", "Lato", sans-serif;
  font-weight: 900;
  font-size: 20px;
  line-height: 1.3;
}

.bonus-highlight__desc {
  margin: 0;
  color: var(--es-text);
  line-height: 1.6;
}

/* шаги активации бонуса — бейдж «Paso N» + текст */
.steps-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 18px 0 0; /* отступ от заголовка «Pasos para activar el bono» */
  counter-reset: none;
}

.steps-list > li {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  border-radius: 12px;
  border: 1px solid rgba(42, 134, 255, 0.24);
  background: linear-gradient(90deg, rgba(42, 134, 255, 0.14) 0%, rgba(20, 16, 51, 0.5) 70%);
}

.steps-list__badge {
  flex: 0 0 auto;
  min-width: 72px;
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 12px;
  border-radius: 8px;
  background: var(--es-plate);
  color: var(--es-ink);
  font-family: "ABC", "Lato", sans-serif;
  font-weight: 900;
  font-size: 14px;
  line-height: 1;
  box-shadow: 0 0 12px rgba(255, 196, 0, 0.35);
}

.steps-list__text {
  color: var(--es-text);
  line-height: 1.5;
}

@media (max-width: 560px) {
  .steps-list > li {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
}

/* синие текстовые вставки шаблона — в бренд-фиолет */
.overlay-list-2 {
  max-width: none;
  background: linear-gradient(140deg, rgba(42, 134, 255, 0.18) 0%, rgba(20, 16, 51, 0.62) 65%);
  border: 1px solid rgba(42, 134, 255, 0.2);
}

/* лишние нижние отступы шаблона у вставок (давали пустые низы карточек) */
.home-s-5 .overlay-list-2,
.home-s-12 .overlay-list-2,
.home-s-13 .overlay-list-2 {
  margin-bottom: 0;
}

/* ------------------------------------------------------------
   Неоновая энергия — общесайтовые акценты
   ------------------------------------------------------------ */
/* CTA-кнопки «дышат» неоном, как вывеска в хедере */
.primary-button,
.secondary-button {
  animation: es-btn-glow 2.8s ease-in-out infinite;
}

.primary-button:hover,
.primary-button:focus,
.secondary-button:hover,
.secondary-button:focus {
  animation-play-state: paused;
}

@keyframes es-btn-glow {
  0%, 100% {
    filter: drop-shadow(0 0 3px rgba(255, 196, 0, 0.3));
  }
  50% {
    filter: drop-shadow(0 0 10px rgba(255, 196, 0, 0.65));
  }
}

.app-button {
  animation: es-appbtn-glow 2.8s ease-in-out infinite;
}

@keyframes es-appbtn-glow {
  0%, 100% {
    filter: drop-shadow(0 0 3px rgba(252, 81, 255, 0.35));
  }
  50% {
    filter: drop-shadow(0 0 10px rgba(252, 81, 255, 0.7));
  }
}

/* золотое пульсирующее кольцо у аватаров отзывов */
.rating-review__title span img {
  animation: es-avatar-pulse 3s ease-in-out infinite;
}

@keyframes es-avatar-pulse {
  0%, 100% {
    box-shadow: 0 0 4px rgba(255, 196, 0, 0.35);
  }
  50% {
    box-shadow: 0 0 12px rgba(255, 196, 0, 0.75);
  }
}

/* карточки отзывов и аккордеон отзываются свечением на наведение */
.rating-review__item,
.accordion .accordion__item {
  transition: box-shadow 0.3s ease-in-out, border-color 0.3s ease-in-out;
}

.rating-review__item:hover {
  border-color: rgba(255, 196, 0, 0.55);
  box-shadow: 0 0 20px rgba(255, 196, 0, 0.25), 0 8px 28px rgba(0, 0, 0, 0.4);
}

.accordion .accordion__item:hover {
  border-color: rgba(252, 81, 255, 0.5);
  box-shadow: 0 0 16px rgba(252, 81, 255, 0.22);
}

/* плашка рейтинга в хиро мягко мерцает золотом */
.prime__rating {
  animation: es-rating-glow 3.4s ease-in-out infinite;
}

@keyframes es-rating-glow {
  0%, 100% {
    border-color: rgba(255, 196, 0, 0.4);
    box-shadow: 0 0 6px rgba(255, 196, 0, 0.15);
  }
  50% {
    border-color: rgba(255, 196, 0, 0.75);
    box-shadow: 0 0 14px rgba(255, 196, 0, 0.4);
  }
}

/* подчёркивание заголовков слегка светится */
.section h2::after {
  animation: es-underline-glow 4s ease-in-out infinite;
}

@keyframes es-underline-glow {
  0%, 100% {
    box-shadow: 0 0 8px rgba(255, 196, 0, 0.35);
  }
  50% {
    box-shadow: 0 0 16px rgba(229, 32, 58, 0.55);
  }
}

/* ------------------------------------------------------------
   Прочее
   ------------------------------------------------------------ */
.section a:not([class]) {
  color: var(--es-yellow);
  text-decoration: underline;
}

.section a:not([class]):hover {
  color: var(--es-gold);
}

.scroll-to-top {
  animation: es-appbtn-glow 3s ease-in-out infinite;
}

.scroll-to-top:hover {
  animation-play-state: paused;
  filter: drop-shadow(0 0 8px rgba(255, 196, 0, 0.6));
}

/* ---------- Páginas legales ---------- */
.legal-page {
  max-width: none; /* контент на всю ширину, как на основных страницах */
}

.legal-page h1 {
  margin-bottom: 8px;
  background: linear-gradient(92deg, #ffffff 0%, var(--es-gold) 60%, var(--es-yellow) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.legal-page__date {
  color: var(--es-yellow);
  font-size: 14px;
  margin-bottom: 24px;
}

.legal-page h2 {
  margin-top: 28px;
  margin-bottom: 12px;
  color: var(--es-gold);
}

.legal-page h2::after {
  display: none;
}

.legal-page p {
  margin-bottom: 12px;
}

.legal-page .list {
  margin-bottom: 12px;
}

.legal-page a {
  color: var(--es-yellow);
  text-decoration: underline;
}

.legal-page a:hover {
  color: var(--primary-text-color);
}

/* ---------- Página 404 ---------- */
.error-page {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 55vh;
  text-align: center;
}

.error-page__wrap {
  max-width: 560px;
  margin: 0 auto;
}

.error-page__code {
  display: block;
  font-family: "ABC", "Lato", sans-serif;
  font-size: 120px;
  line-height: 1;
  font-weight: 900;
  background: linear-gradient(180deg, var(--es-yellow) 0%, #ff8a00 55%, var(--es-red) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: es-code-glow 3s ease-in-out infinite;
}

@keyframes es-code-glow {
  0%, 100% {
    filter: drop-shadow(0 0 6px rgba(255, 196, 0, 0.35));
  }
  50% {
    filter: drop-shadow(0 0 18px rgba(229, 32, 58, 0.6));
  }
}

.error-page__title {
  margin-top: 12px;
}

.error-page__text {
  margin: 16px 0 24px;
}

.error-page__buttons {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
}

/* кнопки 404 — одинаковая высота и выравнивание пары */
.error-page__buttons .primary-button,
.error-page__buttons .secondary-button {
  min-height: 64px;
  min-width: 200px;
  margin: 0;
}

/* ---------- Aviso de cookies ---------- */
.cookie-banner {
  position: fixed;
  left: 50%;
  bottom: 16px;
  transform: translateX(-50%);
  z-index: 1000;
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
  width: calc(100% - 32px);
  max-width: 720px;
  padding: 16px 20px;
  border-radius: 14px;
  border: 1px solid rgba(255, 196, 0, 0.35);
  background: linear-gradient(90deg, #3a0a4c 0%, #1c0029 100%);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
}

.cookie-banner p {
  flex: 1 1 320px;
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
}

.cookie-banner a {
  color: var(--es-yellow);
  text-decoration: underline;
}

.cookie-banner__buttons {
  display: flex;
  gap: 10px;
}

.cookie-banner button {
  cursor: pointer;
  border: none;
  border-radius: 8px;
  padding: 10px 18px;
  font-weight: 700;
  font-family: inherit;
  transition: var(--primary-transition);
}

.cookie-banner__accept {
  background: var(--es-plate);
  color: var(--es-ink);
}

.cookie-banner__accept:hover {
  filter: brightness(1.1);
}

.cookie-banner__reject {
  background: transparent;
  color: var(--primary-text-color);
  border: 1px solid rgba(255, 255, 255, 0.35);
}

.cookie-banner__reject:hover {
  border-color: var(--es-yellow);
  color: var(--es-yellow);
}

/* отступы баннеров на десктопе + офферы без переноса в одну строку */
@media screen and (min-width: 901px) {
  .banner {
    padding-left: 50px;
    padding-right: 50px;
  }

  .banner__wrap {
    max-width: 760px;
  }

  .banner__subtitle span {
    white-space: nowrap;
  }
}

@media screen and (min-width: 901px) and (max-width: 1360px) {
  .banner__subtitle {
    font-size: 26px;
  }
}

/* ---------- Адаптив ---------- */
/* Сайдбар прячется на 1050px — с этого же момента сразу мобильный вид,
   без промежуточных состояний: карточный декор снимается, секции в край,
   как в мобильной вёрстке шаблона */
@media screen and (max-width: 900px) {
  .main__content .section,
  .prime,
  .banner,
  .app-banner {
    border-radius: 0;
    border-left: none;
    border-right: none;
    box-shadow: none;
  }

  /* на мобильном виде хиро и баннеры в край — вместо боковых рамок
     бегущие неоновые линии по верхней и нижней кромке (встречные) */
  .banner,
  .app-banner,
  .prime {
    border-top: none;
    border-bottom: none;
    animation: none;
  }

  .banner::before,
  .app-banner::before,
  .prime::before {
    display: block;
    inset: 0;
    border-radius: 0;
    filter: none;
    z-index: 3; /* кромочные полоски поверх контента (картинка телефона стоит на нижней) */
    pointer-events: none;
    background-image:
      linear-gradient(90deg, transparent 0%, var(--es-magenta) 20%, var(--es-violet) 40%, var(--es-yellow) 60%, var(--es-magenta) 80%, transparent 100%),
      linear-gradient(90deg, transparent 0%, var(--es-yellow) 20%, var(--es-violet) 40%, var(--es-magenta) 60%, var(--es-yellow) 80%, transparent 100%);
    background-size: 200% 3px, 200% 3px;
    background-position: 0% 0, 0% 100%;
    background-repeat: no-repeat, no-repeat;
    animation: es-mob-edges 6s linear infinite;
  }

  .banner .background,
  .app-banner .background,
  .prime .background {
    border-radius: 0;
  }

  /* перетекающая линия-разделитель у секций остаётся и на мобильном */
  .main__content .section:not(.prime):not(.banner):not(.app-banner):not(.prelink)::before {
    display: block;
  }

  /* app-баннер: на мобильном фоновый арт с телефоном конфликтует с
     кнопками и картинкой телефона — вместо него чистый бренд-градиент */
  .app-banner .background img {
    display: none;
  }

  .app-banner .background {
    background:
      radial-gradient(120% 90% at 50% 0%, rgba(87, 224, 192, 0.22) 0%, rgba(87, 224, 192, 0) 55%),
      linear-gradient(158deg, #0c1c46 0%, #081633 52%, #0b1c40 100%);
  }

  .app-banner__background::after {
    display: none;
  }

  /* app-баннер: единая мобильная раскладка на всём диапазоне ≤1050
     (у шаблона она включалась только с 750px — между 750 и 1050
     телефон позиционировался по-десктопному и уезжал за край) */
  .app-banner {
    flex-direction: column;
    padding: 35px 20px;
  }

  .app-banner__wrap {
    width: auto;
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }

  .app-banner .app-button {
    min-width: 240px;
  }

  /* телефон по центру, вплотную к нижней неоновой полоске, полоска — поверх */
  .app-banner__img {
    position: relative !important;
    left: unset !important;
    right: unset !important;
    top: unset !important;
    transform: none !important;
    display: block;
    max-height: 330px;
    margin: 24px auto -35px !important; /* низ картинки на линии */
  }

  /* жёлтые плашки офферов мягко пульсируют золотом */
  .banner__subtitle span,
  .prime__title > span:first-child {
    animation: es-plate-glow 3s ease-in-out infinite;
  }
}

@keyframes es-mob-edges {
  to {
    background-position: -200% 0, 200% 100%;
  }
}

@keyframes es-plate-glow {
  0%, 100% {
    box-shadow: 0 4px 14px rgba(255, 183, 0, 0.25);
  }
  50% {
    box-shadow: 0 4px 28px rgba(255, 183, 0, 0.6);
  }
}

/* мобильный вид: фон секций и выравнивание заголовков с контентом */
@media screen and (max-width: 900px) {
  .main__content .section {
    background: #371049;
    border-top: 1px solid rgba(42, 134, 255, 0.22);
    border-bottom: 1px solid rgba(42, 134, 255, 0.22);
  }

  /* единая линия текста на мобильном: заголовки, абзацы, списки и
     вставки выравниваются по одному отступу 12px
     (заголовки внутри вставок уже имеют отступ бокса — не трогаем) */
  .section :is(h2, h3):not(.overlay-list-2 *, .split-block *) {
    padding-left: 12px;
    padding-right: 12px;
  }

  .section h2::after {
    left: 12px;
  }

  .main__content .section > p,
  .main__content .section .relative > p,
  .main__content .section .overlay-list-3 > p,
  .main__content .section > .list,
  .main__content .section .relative > .list,
  .main__content .section > .feature-list,
  .main__content .section .relative > .feature-list {
    padding-left: 12px;
    padding-right: 12px;
  }

  .overlay-list-2 {
    padding-left: 12px;
    padding-right: 12px;
  }

  /* :has-правило рабочего стола не должно добавлять вторые 20px */
  .section h2:has(+ .overlay-list-2),
  .section h3:has(+ .overlay-list-2) {
    padding-left: 12px;
    padding-right: 12px;
  }

  .section h2:has(+ .overlay-list-2)::after {
    left: 12px;
  }
}
/* тёмный бокс шаблона за текстом хиро/баннеров не нужен — читаемость даёт скрим */
@media screen and (max-width: 1300px) {
  .prime__wrap.background__fill,
  .background__fill {
    background: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    border-radius: 0;
  }

  .prime__background::after {
    background:
      linear-gradient(90deg, rgba(22, 2, 34, 0.95) 0%, rgba(22, 2, 34, 0.82) 38%, rgba(22, 2, 34, 0.42) 58%, rgba(22, 2, 34, 0) 74%),
      linear-gradient(0deg, rgba(22, 2, 34, 0.55) 0%, rgba(22, 2, 34, 0) 30%);
  }
}

/* мобильный вид (сайдбар скрыт): текст по центру — затемнение равномерное,
   как overlay-mob у шаблона, а не градиент слева */
@media screen and (max-width: 900px) {
  .prime__background::after {
    background:
      linear-gradient(0deg, rgba(22, 2, 34, 0.75) 0%, rgba(22, 2, 34, 0.45) 40%, rgba(22, 2, 34, 0.35) 100%);
  }

  .banner__background::after,
  .app-banner__background::after {
    background: rgba(22, 2, 34, 0.55);
  }

  /* текст и плашки не должны вылезать за экран: контейнер не шире вьюпорта,
     плашки переносятся по словам */
  .banner__wrap,
  .prime__wrap {
    max-width: 100%;
  }

  .banner__subtitle {
    align-items: center;
    text-align: center;
  }

  .banner__buttons {
    justify-content: center;
  }

  .banner__subtitle span,
  .prime__title > span:first-child {
    white-space: normal;
    min-width: 0;
    max-width: calc(100% - 12px);
  }

  /* описание в хиро на ярком арте — стеклянная подложка для читаемости */
  .main__content .prime__text {
    background: rgba(22, 2, 34, 0.68);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid rgba(165, 96, 255, 0.2);
  }
}

@media screen and (max-width: 560px) {
  .banner__subtitle {
    font-size: 21px;
  }
}

@media (max-width: 768px) {
  .main__content .section {
    padding: 22px 16px;
  }

  .prime__wrap {
    padding-left: 8px;
  }

  .feature-list--number > li {
    margin-left: 46px;
  }

  .feature-list--number > li::before {
    left: -46px;
    width: 34px;
    height: 34px;
    font-size: 15px;
  }
}

@media (max-width: 560px) {
  .error-page__code {
    font-size: 84px;
  }
}

/* круглый флаг Chile в лэнг-кнопках хедера и сайдбара */
.header__lang-btn > img:first-child,
.sidebar__lang > img:first-child {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
  flex: 0 0 auto;
}

/* моб: по умолчанию таблицы влезают в ширину экрана (без принуд. скролла и
   пустого места). Двухколоночные «ключ-значение» — таких большинство. */
/* моб: широким таблицам даём минимальную ширину, чтобы текст не скукоживался
   (обёртка .table-banner-wrapper скроллится по горизонтали; на ПК скролла нет) */
@media screen and (max-width: 900px) {
  .table-banner {
    min-width: 640px;
  }

  /* многоколоночные обычные таблицы (Juegos de mesa) тоже не скукоживаем */
  .home-s-10 .table {
    min-width: 620px;
  }
}

/* Двухколоночные таблицы «ключ-значение» (app: requisitos, características, bono):
   у секций переиспользованы CL-классы home-s-9/home-s-10 с 3-колоночной fixed-раскладкой,
   из-за чего первая колонка сжималась и короткие ключи переносились.
   Решение: auto-раскладка + первая колонка сжимается точно по контенту (width:1% + nowrap),
   вторая забирает всё остальное. */
#requisitos .table,
#caracteristicas .table {
  table-layout: auto;
  width: 100%;
}

#requisitos .table th:first-child,
#requisitos .table td:first-child,
#caracteristicas .table th:first-child,
#caracteristicas .table td:first-child {
  width: 1%;
  white-space: nowrap;
}

/* на мобиле не сжимаем текст: таблица держит min-width, а обёртка .table-wrapper
   (overflow:auto) прокручивается по горизонтали — как остальные таблицы */
@media screen and (max-width: 900px) {
  #requisitos .table,
  #caracteristicas .table {
    min-width: 520px;
  }
}

/* больше воздуха между колонками: правый паддинг ячеек 16px (было 10/12px) */
.table thead th,
.table tbody td,
.table-banner thead th,
.table-banner tbody td {
  padding-right: 16px;
}

/* текст в строках — по центру по вертикали (в шаблоне был padding сверху 0 / снизу 16,
   из-за чего текст прижимался к верху зебра-полосы) */
.table tbody td,
.table-banner tbody td {
  padding-top: 9px;
  padding-bottom: 9px;
  vertical-align: middle;
}

.table tbody tr:last-child td,
.table-banner tbody tr:last-child td {
  padding-bottom: 9px;
}

/* гармоничное распределение колонок таблицы Tragamonedas (5 колонок) —
   auto-раскладка (не fixed), проценты = подсказки: колонки не налезают,
   а длинные заголовки-однословники получают достаточную ширину */
.home-s-9 .table-banner {
  table-layout: auto;
  width: 100%;
}

/* порядок колонок AR: Nombre | Proveedor | RTP | Mecánica de juego | Apuesta mín/máx */
.home-s-9 .table-banner th:nth-child(1),
.home-s-9 .table-banner td:nth-child(1) {
  width: 21%;
}

.home-s-9 .table-banner th:nth-child(2),
.home-s-9 .table-banner td:nth-child(2) {
  width: 16%;
}

.home-s-9 .table-banner th:nth-child(3),
.home-s-9 .table-banner td:nth-child(3) {
  width: 10%;
}

.home-s-9 .table-banner th:nth-child(4),
.home-s-9 .table-banner td:nth-child(4) {
  width: 28%;
}

.home-s-9 .table-banner th:nth-child(5),
.home-s-9 .table-banner td:nth-child(5) {
  width: 25%;
}

/* на ПК заголовки таблиц Tragamonedas и Juegos de mesa — в одну строку
   (на мобиле таблицы прокручиваются, там перенос допустим) */
@media screen and (min-width: 901px) {
  .home-s-9 .table-banner thead th,
  .home-s-10 .table thead th {
    white-space: nowrap;
  }
}

/* гармоничное распределение колонок таблицы Juegos de mesa (3 колонки).
   auto (не fixed): заголовок в 1 строку РАСШИРЯЕТ колонку, а не налезает на соседнюю. */
.home-s-10 .table {
  table-layout: auto;
  width: 100%;
}

.home-s-10 .table th:nth-child(1),
.home-s-10 .table td:nth-child(1) {
  width: 20%;
}

.home-s-10 .table th:nth-child(2),
.home-s-10 .table td:nth-child(2) {
  width: 53%;
}

.home-s-10 .table th:nth-child(3),
.home-s-10 .table td:nth-child(3) {
  width: 27%;
}

/* ------------------------------------------------------------
   Таблица Igralni avtomati (6 колонок) — ровное распределение,
   заголовки в 1 строку на ПК, скролл на мобиле.
   ------------------------------------------------------------ */
.home-s-slots .table-banner {
  table-layout: auto;
  width: 100%;
}

.home-s-slots .table-banner th:nth-child(1),
.home-s-slots .table-banner td:nth-child(1) { width: 22%; }
.home-s-slots .table-banner th:nth-child(2),
.home-s-slots .table-banner td:nth-child(2) { width: 18%; }
.home-s-slots .table-banner th:nth-child(3),
.home-s-slots .table-banner td:nth-child(3) { width: 12%; }
.home-s-slots .table-banner th:nth-child(4),
.home-s-slots .table-banner td:nth-child(4) { width: 14%; }
.home-s-slots .table-banner th:nth-child(5),
.home-s-slots .table-banner td:nth-child(5) { width: 14%; }
.home-s-slots .table-banner th:nth-child(6),
.home-s-slots .table-banner td:nth-child(6) { width: 20%; }

@media screen and (min-width: 901px) {
  .home-s-slots .table-banner thead th { white-space: nowrap; }
}
@media screen and (max-width: 900px) {
  .home-s-slots .table-banner { min-width: 720px; }
}

/* ------------------------------------------------------------
   ВРЕМЕННО: выбор языка отключён — стрелки скрыты, hover и клик
   заблокированы (сайдбар + кнопка в шапке/моб-меню).
   Для включения обратно удалить этот блок.
   ------------------------------------------------------------ */
.sidebar__lang,
.header__lang-btn {
  pointer-events: none;
  cursor: default;
}

.sidebar__lang > img:last-child,
.header__lang-btn-arrow {
  display: none !important;
}
