:root {       --bg-main: #050b18;       --bg-deep: #081226;       --bg-soft: #0d1a34;       --surface-main: rgba(15, 26, 52, 0.94);       --surface-alt: rgba(11, 20, 40, 0.94);       --surface-lite: rgba(21, 34, 67, 0.78);       --stroke: rgba(137, 158, 219, 0.16);       --stroke-strong: rgba(129, 107, 255, 0.28);       --text-main: #f5f7ff;       --text-soft: #b4c0ef;       --text-muted: #8090c6;       --accent-blue: #4a8cff;       --accent-violet: #8f39ff;       --accent-cyan: #34d6ff;       --accent-green: #1ae38b;       --radius-xl: 28px;       --radius-lg: 22px;       --radius-md: 18px;       --shadow-main: 0 18px 48px rgba(0, 0, 0, 0.34);       --wrap-width: 1280px;       --gap-section: 18px;     }      * { box-sizing: border-box; }     html { scroll-behavior: smooth; }     body {       margin: 0;       min-width: 320px;       font-family: "Source Sans 3", Arial, sans-serif;       line-height: 1.55;       color: var(--text-main);       background:         radial-gradient(circle at top center, rgba(143, 57, 255, 0.16), transparent 30%),         radial-gradient(circle at 20% 0%, rgba(52, 214, 255, 0.10), transparent 24%),         linear-gradient(180deg, var(--bg-main) 0%, var(--bg-deep) 42%, #09162d 100%);     }      img { display: block; max-width: 100%; }     a { color: inherit; text-decoration: none; }     h1, h2, h3, p, ul, ol, table { margin: 0; }      .shell {       width: min(100% - 32px, var(--wrap-width));       margin: 0 auto;     }     .breadcrumbs ul {       list-style: none;       display: flex;       gap: 4px;       padding: 0;     }     .panel {       background: linear-gradient(180deg, var(--surface-main), var(--surface-alt));       border: 1px solid var(--stroke);       border-radius: var(--radius-xl);       box-shadow: var(--shadow-main);     }      .sitebar {       position: sticky;       top: 0;       z-index: 30;       background: rgba(5, 11, 24, 0.88);       backdrop-filter: blur(12px);       border-bottom: 1px solid rgba(137, 158, 219, 0.12);     }      .sitebar__inner {       display: grid;       grid-template-columns: auto 1fr auto;       gap: 20px;       align-items: center;       min-height: 84px;       padding: 10px 0;     }      .logo-link {       display: inline-flex;       align-items: center;       gap: 12px;       min-width: 0;       font-weight: 800;       letter-spacing: 0.03em;     }      .logo-link__badge {       width: 54px;       height: 54px;       flex: 0 0 54px;       display: grid;       place-items: center;       overflow: hidden;       border-radius: 16px;       background: linear-gradient(135deg, rgba(74,140,255,0.24), rgba(143,57,255,0.24));       border: 1px solid rgba(143, 57, 255, 0.28);       box-shadow: 0 0 0 1px rgba(255,255,255,0.03) inset;     }      .logo-link__text {       font-size: 18px;       text-transform: uppercase;       white-space: nowrap;     }      .menu-row,     .action-row,     .hero-banner__buttons,     .game-tags,     .trust-row {       display: flex;       flex-wrap: wrap;       gap: 12px;       align-items: center;     }      .menu-row { justify-content: center; min-width: 0; }     .action-row { justify-content: flex-end; }     .hero-banner__buttons { justify-content: center; margin-top: 22px; }     .trust-row { justify-content: flex-start; }      .menu-link,     .btn,     .btn-soft,     .tag {       transition: background 0.25s ease, border-color 0.25s ease, transform 0.15s ease;       display: inline-flex;       align-items: center;       justify-content: center;       min-height: 44px;       padding: 0 18px;       border-radius: 999px;       border: 1px solid rgba(137, 158, 219, 0.16);       background: rgba(19, 33, 63, 0.7);       font-size: 14px;       font-weight: 700;       text-align: center;     }      .menu-link {       min-height: 40px;       padding: 0 16px;       color: var(--text-soft);     }      .btn-soft,     .tag { color: var(--text-soft); }      .btn--accent {       border: 0;       color: var(--text-main);       background: linear-gradient(90deg, var(--accent-blue), var(--accent-violet));       box-shadow: 0 10px 24px rgba(74, 140, 255, 0.24);     }      .btn:hover,     .btn-soft:hover,     .menu-link:hover,     .tag:hover {       background: linear-gradient(90deg, rgba(74,140,255,0.25), rgba(143,57,255,0.25));       border-color: var(--stroke-strong);       transform: translateY(-1px);     }      .btn--accent:hover {       background: linear-gradient(90deg, var(--accent-violet), var(--accent-cyan));       box-shadow: 0 12px 28px rgba(143, 57, 255, 0.35);       transform: translateY(-1px);     }      .top-block {       padding: 22px 0 var(--gap-section);     }      .crumbs {       display: flex;       flex-wrap: wrap;       gap: 8px;       margin-bottom: 18px;       color: var(--text-soft);       font-size: 14px;     }      .hero-grid {       display: grid;       grid-template-columns: minmax(0, 7fr) minmax(280px, 3fr);       gap: 18px;       align-items: stretch;     }      .hero-banner {       position: relative;       min-height: 420px;       display: flex;       align-items: center;       justify-content: center;       overflow: hidden;       text-align: center;     }      .hero-banner__image {       position: absolute;       inset: 0;       width: 100%;       height: 100%;       object-fit: cover;       filter: brightness(0.48);     }      .hero-banner::after {       content: "";       position: absolute;       inset: 0;       background: linear-gradient(135deg, rgba(5,11,24,0.42), rgba(9,18,38,0.68));     }      .hero-banner__body {       position: relative;       z-index: 1;       max-width: 740px;       padding: 60px 40px;     }      .eyebrow {       display: inline-flex;       align-items: center;       justify-content: center;       padding: 8px 14px;       border-radius: 999px;       background: rgba(74,140,255,0.18);       border: 1px solid rgba(74,140,255,0.30);       color: #e1e7ff;       font-size: 13px;       font-weight: 700;       letter-spacing: 0.08em;       text-transform: uppercase;     }      .hero-banner__title {       max-width: 25ch;       margin: 18px auto 0;       font-size: clamp(32px, 4vw, 54px);       line-height: 1.02;       letter-spacing: -0.03em;     }      .hero-banner__text {       max-width: 54ch;       margin: 16px auto 0;       color: #d9e1ff;       font-size: 17px;     }      .app-panel {       min-height: 420px;       padding: 28px;       display: flex;       flex-direction: column;       justify-content: space-between;       background: linear-gradient(180deg, rgba(19, 33, 63, 0.98), rgba(9, 17, 34, 0.98));     }      .app-panel__label,     .jackpot-card__label {       color: var(--text-soft);       font-size: 13px;       font-weight: 700;       letter-spacing: 0.08em;       text-transform: uppercase;     }      .app-panel__title,     .section-heading,     .copy-block__title {       letter-spacing: -0.02em;     }      .app-panel__title {       margin-top: 10px;       font-size: clamp(24px, 3vw, 34px);       line-height: 1.05;     }      .app-panel__text {       margin-top: 14px;       color: #d9e1ff;       font-size: 15px;     }      .app-panel__metrics {       display: grid;       grid-template-columns: repeat(2, minmax(0, 1fr));       gap: 12px;       margin: 24px 0;     }      .metric-box {       padding: 14px;       border-radius: var(--radius-md);       background: rgba(12, 22, 43, 0.74);       border: 1px solid rgba(137, 158, 219, 0.12);     }      .metric-box__value {       display: block;       font-size: 24px;       font-weight: 800;       line-height: 1;     }      .metric-box__label {       display: block;       margin-top: 8px;       color: var(--text-soft);       font-size: 12px;       letter-spacing: 0.06em;       text-transform: uppercase;     }      .app-panel__button img {       width: 100%;       max-width: 240px;       height: auto;     }      .block {       padding: var(--gap-section) 0;     }      .block__inner { padding: 22px; }      .block__head {       display: flex;       align-items: center;       justify-content: space-between;       flex-wrap: wrap;       gap: 16px;       margin-bottom: 18px;     }      .section-heading {       font-size: clamp(24px, 2.4vw, 34px);     }      .game-tags { margin-bottom: 18px; }      .tag--active {       color: var(--text-main);       background: linear-gradient(90deg, rgba(74,140,255,0.20), rgba(143,57,255,0.20));       border-color: rgba(143, 57, 255, 0.24);     }      .games-grid,     .jackpot-grid,     .benefit-grid,     .payments-grid,     .payment-logo-grid,     .footer-grid {       display: grid;       gap: 16px;     }      .games-grid {       grid-template-columns: repeat(5, minmax(0, 200px));       justify-content: center;     }     .jackpot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; align-items: end; }     .benefit-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }     .payment-logo-grid,     .payments-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }     .footer-grid { grid-template-columns: 1.2fr 1fr 1fr 1fr; gap: 20px; }      .game-card {       overflow: hidden;       border-radius: var(--radius-lg);       background: rgba(11, 20, 40, 0.88);       border: 1px solid rgba(137, 158, 219, 0.10);     }      .game-card__media {       position: relative;       width: 200px;       height: 200px;       overflow: hidden;     }      .game-card__media img {       width: 100%;       height: 100%;       object-fit: cover;     }      .game-card__overlay {       position: absolute;       inset: 0;       display: flex;       align-items: center;       justify-content: center;       opacity: 0;       background: linear-gradient(180deg, rgba(5,11,24,0.08), rgba(5,11,24,0.72));       transition: opacity 0.25s ease;     }      .game-card:hover .game-card__overlay,     .game-card:focus-within .game-card__overlay {       opacity: 1;     }      .game-card__body { padding: 14px; }      .game-card__title,     .benefit-card__title,     .jackpot-card__title,     .footer-col__title {       display: block;       line-height: 1.2;     }      .game-card__title { font-size: 16px; }     .game-card__meta {       display: block;       margin-top: 6px;       color: var(--text-soft);       font-size: 14px;     }      .jackpot-card {       position: relative;       min-height: 280px;       padding: 28px 24px;       overflow: hidden;       text-align: center;     }      .jackpot-card::before {       content: "";       position: absolute;       inset: auto -20% -40% -20%;       height: 180px;       background: radial-gradient(circle, rgba(74,140,255,0.26), transparent 68%);       pointer-events: none;     }      .jackpot-card--featured {       min-height: 340px;       border-color: rgba(143, 57, 255, 0.24);     }      .jackpot-card__image {       position: absolute;       inset: 0;       width: 100%;       height: 100%;       object-fit: cover;       opacity: 0.34;     }      .jackpot-card > * { position: relative; z-index: 1; }      .jackpot-card__title {       margin-top: 12px;       font-size: 34px;     }      .jackpot-card__amount {       margin-top: 14px;       font-size: clamp(34px, 4vw, 56px);       line-height: 1;       font-weight: 900;       letter-spacing: -0.04em;       overflow-wrap: anywhere;     }      .jackpot-card__text {       margin-top: 12px;       color: var(--text-soft);     }      .jackpot-card__cta { margin-top: 20px; }      .benefit-card {       padding: 18px;       border-radius: 20px;       background: rgba(11, 20, 40, 0.74);       border: 1px solid rgba(137, 158, 219, 0.10);     }      .benefit-card__icon {       width: 52px;       height: 52px;       border-radius: 16px;       background: linear-gradient(135deg, rgba(74,140,255,0.24), rgba(143,57,255,0.28));     }      .benefit-card__title {       margin-top: 14px;       font-size: 18px;     }      .benefit-card__text {       margin-top: 10px;       color: var(--text-soft);       font-size: 15px;     }      .copy-block { text-align: justify; }      .copy-block__title {       margin-bottom: 18px;       font-size: clamp(28px, 3vw, 40px);     }      .copy-block h2,     .copy-block h3 {       margin-top: 22px;       margin-bottom: 12px;       line-height: 1.2;     }      .copy-block p { color: #dbe3ff; }     .copy-block p + p { margin-top: 14px; }     .copy-block ul,     .copy-block ol { margin-top: 18px; padding-left: 0; color: #dbe3ff; }     .copy-block ul { list-style: none; }      .copy-block ul li,     .copy-block ol li { margin-top: 12px; }      .copy-block ul li {       position: relative;       padding-left: 22px;     }      .copy-block ul li::before {       content: "";       position: absolute;       left: 0;       top: 0.7em;       width: 8px;       height: 8px;       border-radius: 50%;       background: linear-gradient(90deg, var(--accent-blue), var(--accent-violet));       transform: translateY(-50%);     }      .copy-block ol {       list-style: none;       counter-reset: article-counter;     }      .copy-block ol li {       counter-increment: article-counter;       position: relative;       padding-left: 42px;       min-height: 28px;     }      .copy-block ol li::before {       content: counter(article-counter);       position: absolute;       left: 0;       top: 0;       width: 28px;       height: 28px;       display: inline-flex;       align-items: center;       justify-content: center;       border-radius: 50%;       background: linear-gradient(90deg, var(--accent-blue), var(--accent-violet));       color: var(--text-main);       font-size: 13px;       font-weight: 800;     }      .copy-block table {       width: 100%;       margin-top: 22px;       border-collapse: collapse;       border-radius: 18px;       overflow: hidden;       background: rgba(11, 20, 40, 0.72);       border: 1px solid rgba(137, 158, 219, 0.12);     }      .copy-block thead {       background: linear-gradient(90deg, rgba(74,140,255,0.22), rgba(143,57,255,0.22));     }      .copy-block th,     .copy-block td {       padding: 14px 16px;       text-align: left;       border-bottom: 1px solid rgba(137, 158, 219, 0.10);       color: #dbe3ff;       font-size: 15px;     }      .copy-block th {       color: var(--text-main);       font-weight: 800;     }      .copy-block tbody tr:last-child td { border-bottom: 0; }  .copy-block p a {   color: #0b6dd2; } .copy-block p a:hover {   color: #59a5f2; }      .payment-logo {       min-height: 86px;       display: flex;       align-items: center;       justify-content: center;       padding: 14px;       border-radius: var(--radius-md);       background: rgba(11, 20, 40, 0.76);       border: 1px solid rgba(137, 158, 219, 0.10);       overflow: hidden;     }      .payment-logo img {       width: 100%;       max-width: 110px;       max-height: 34px;       object-fit: contain;       filter: grayscale(1) brightness(1.35);     }      .payment-chip {       min-height: 78px;       display: grid;       place-items: center;       padding: 12px;       border-radius: var(--radius-md);       background: rgba(11, 20, 40, 0.76);       border: 1px solid rgba(137, 158, 219, 0.10);       color: #dce5ff;       font-size: 22px;       font-weight: 900;       text-align: center;     }      .site-footer { padding: 20px 0 40px; }     .site-footer__inner { padding: 24px; }      .footer-brand {       display: inline-flex;       align-items: center;       gap: 12px;       margin-bottom: 12px;       font-weight: 800;       text-transform: uppercase;     }      .footer-col__title {       margin-bottom: 12px;       font-size: 16px;     }      .site-footer p,     .site-footer li,     .site-footer a { color: var(--text-soft); }      .site-footer ul {       list-style: none;       padding: 0;       margin: 0;     }      .site-footer li + li { margin-top: 8px; }      .site-footer__base {       display: flex;       align-items: center;       justify-content: space-between;       flex-wrap: wrap;       gap: 20px;       margin-top: 20px;       padding-top: 18px;       border-top: 1px solid rgba(137, 158, 219, 0.10);     }      .site-footer__copy {       color: var(--text-muted);       font-size: 14px;     }      .trust-badge {       min-width: 62px;       min-height: 62px;       display: inline-flex;       align-items: center;       justify-content: center;       padding: 10px 14px;       border-radius: var(--radius-md);       background: rgba(11, 20, 40, 0.82);       border: 1px solid rgba(137, 158, 219, 0.10);       color: #dce5ff;       font-weight: 900;       text-align: center;       line-height: 1.1;     }      .trust-badge small {       display: block;       margin-top: 4px;       font-size: 11px;       font-weight: 700;       color: var(--text-soft);     }      .scroll-top {       position: fixed;       right: 16px;       bottom: 16px;       z-index: 40;       min-width: 56px;       min-height: 56px;       display: inline-flex;       align-items: center;       justify-content: center;       padding: 0 18px;       border-radius: 999px;       background: linear-gradient(90deg, var(--accent-blue), var(--accent-violet));       color: var(--text-main);       font-size: 14px;       font-weight: 800;       box-shadow: 0 10px 24px rgba(74, 140, 255, 0.24);     }      .schema-only { display: none; }      @media (max-width: 1180px) {       .sitebar__inner { grid-template-columns: 1fr; }       .logo-link,       .menu-row,       .action-row { justify-content: center; }       .hero-grid { grid-template-columns: 1fr; }       .games-grid {         grid-template-columns: repeat(4, minmax(0, 200px));         justify-content: center;       }       .benefit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }       .payment-logo-grid,       .payments-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }       .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }     }      @media (max-width: 920px) {       .jackpot-grid,       .footer-grid,       .app-panel__metrics { grid-template-columns: 1fr; }       .games-grid {         grid-template-columns: repeat(2, minmax(0, 200px));         justify-content: center;       }       .payment-logo-grid,       .payments-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }       .site-footer__base { flex-direction: column; align-items: flex-start; }     }      @media (max-width: 640px) {       .shell { width: min(100% - 20px, var(--wrap-width)); }       .hero-banner__body,       .app-panel,       .block__inner,       .site-footer__inner { padding: 18px; }       .hero-banner { min-height: 360px; }       .benefit-grid,       .payment-logo-grid,       .payments-grid,       .games-grid { grid-template-columns: 1fr; }       .hero-banner__buttons,       .action-row,       .menu-row { flex-direction: column; align-items: stretch; }       .menu-link,       .btn,       .btn-soft,       .tag { width: 100%; }       .block__head { align-items: flex-start; }       .crumbs { font-size: 13px; }       .logo-link__text { white-space: normal; }       .trust-row { width: 100%; }       .trust-badge { flex: 1 1 calc(33.333% - 8px); min-width: 0; }       .scroll-top {         right: 12px;         bottom: 12px;       }     }