/* ─────────────────────────────────────────────────────────
   Base / Reset
────────────────────────────────────────────────────────── */
html, body{
  margin:0;
  max-width:100%;
  overflow-x:hidden;
}
body{
  padding-top:var(--hdrH, 64px);
}
html { scrollbar-gutter: stable both-edges; }

*{ box-sizing:border-box }
img, video, canvas, svg, iframe{ max-width:100%; height:auto; display:block }

/* Цвета — как на официальном SlotsGem */
:root{
  --bg:#0b0e11;
  --panel:#12151c;
  --panel-2:#171b24;
  --ink:#e8ecf4;
  --ink-muted:#9aa3b5;
  --line:rgba(255,215,0,.14);
  --max:1320px;
  --gold:#f5d100;
  --gold-deep:#d4a800;
  --gold1:#ffd700;
  --gold2:#e6b800;
  --gold3:#b8860b;
  --purple-glow:rgba(120, 60, 180, 0.35);
  --purple-deep:#2a1538;
  --teal-accent:#5ec4c4;
  --ring:0 0 0 1px rgba(255,255,255,.06) inset, 0 1px 0 rgba(255,255,255,.05) inset, 0 10px 30px rgba(0,0,0,.55);
  --hdrH:64px;
  --radius:12px;
}

/* Глобальная типографика/фон */
html,body{
  color:var(--ink);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  background:var(--bg);
}
body:before{
  content:""; position:fixed; inset:0; pointer-events:none; opacity:.95;
  background:
    radial-gradient(900px 500px at 15% 0%, var(--purple-glow), transparent 55%),
    radial-gradient(700px 480px at 95% 20%, rgba(94, 196, 196, 0.12), transparent 50%),
    radial-gradient(800px 400px at 50% 100%, rgba(255, 215, 0, 0.06), transparent 45%),
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="160" height="160"><defs><filter id="n"><feTurbulence baseFrequency="0.7" numOctaves="2" seed="2" type="fractalNoise"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .05 0"/></filter></defs><rect width="100%" height="100%" filter="url(%23n)"/></svg>') repeat;
}

/* Универсальный пульс */
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(255, 215, 0, 0.45) }
  70%{ box-shadow:0 0 0 18px rgba(120, 60, 180, 0) }
  100%{ box-shadow:0 0 0 0 rgba(255, 215, 0, 0) }
}
.pulse{ animation:pulse 1.8s infinite }

/* ─────────────────────────────────────────────────────────
   Header / Topbar
────────────────────────────────────────────────────────── */
header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:119;
  background:linear-gradient(180deg,#0f1218,#151a22);
  border-bottom:1px solid var(--line);
  backdrop-filter:saturate(130%) blur(8px);
}
header.scrolled{ box-shadow:0 10px 24px rgba(0,0,0,.38) }
.head{
  max-width:var(--max); margin:0 auto; padding:10px 14px;
  display:flex; align-items:center; gap:10px; min-width:0;
}
.burger{
  display:none; background:none; border:1px solid #1c1c22; color:hsl(0, 0%, 100%);
  border-radius:10px; padding:8px 10px;
}
.logo{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  text-decoration:none;
  color:inherit;
  min-width:0;
}
.logo-lockup{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.logo-gem{
  height:44px;
  width:auto;
  flex-shrink:0;
  display:block;
  object-fit:contain;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,.5));
}
.logo-wordmark{
  height:48px;
  width:auto;
  max-width:min(46vw, 200px);
  display:block;
  object-fit:contain;
  object-position:left center;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,.6));
}

@media (max-width:520px){
  .logo-lockup{ gap:6px }
  .logo-gem{ height:30px }
  .logo-wordmark{ height:30px; max-width:min(42vw, 180px) }
}

@media (max-width:390px){
  .logo-gem{ height:24px }
  .logo-wordmark{ height:20px; max-width:min(38vw, 160px) }
}


.search{
  flex:1 1 420px; min-width:0; display:flex; align-items:center; gap:8px;
  background:linear-gradient(180deg,rgba(18,21,28,.92),#0b0e11); border:1px solid rgba(255,215,0,.12);
  border-radius:999px; padding:8px 12px; box-shadow:var(--ring)
}
.search svg{ color:var(--gold); opacity:.85; flex-shrink:0 }
.search input{ flex:1 1 auto; min-width:0; background:transparent; border:0; outline:0; color:var(--ink) }
.search input::placeholder{ color:var(--ink-muted) }
.btn{
  flex:0 0 auto; white-space:nowrap;
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 18px; border-radius:10px; text-decoration:none; color:var(--ink);
  background:linear-gradient(180deg,#3d2460,#2a1538); border:1px solid rgba(180,120,255,.35); box-shadow:var(--ring);
  font-weight:700; font-size:13px; letter-spacing:.02em;
  min-height:40px;
  transition:background .2s ease, border-color .2s ease, transform .2s ease;
}
.btn--login{
  background:transparent;
  border:1px solid rgba(255,255,255,.55);
  color:#fff;
}
.btn--login:hover{
  border-color:rgba(255,255,255,.8);
  background:rgba(255,255,255,.06);
}
.btn--reg{
  background:var(--gold);
  border:1px solid var(--gold);
  color:#0b0e11;
  font-weight:800;
  animation:pulse 1.8s infinite;
  transition:transform .25s ease, filter .25s ease;
}

/* Увеличение при наведении / клавиатурном фокусе (десктоп) */
@media (hover:hover){
  .btn.btn--reg:hover,
  .btn.btn--reg:focus-visible{
    transform: translateZ(0) scale(1.06);
  }
}

/* Если пользователь отключил анимации — без увеличения */
@media (prefers-reduced-motion: reduce){
  .btn--reg{ transition: none; }
  .btn.btn--reg:hover,
  .btn.btn--reg:focus-visible{ transform: none; }
}

/* ─────────────────────────────────────────────────────────
   Layout / Shell
────────────────────────────────────────────────────────── */
.shell{
  max-width:var(--max); margin:0 auto; padding:18px 14px;
  display:grid; grid-template-columns:260px 1fr; gap:20px; min-width:0;
}
.shell > *{ min-width:0 }
.shell > main{ min-width:0 }
main p, main h1, main h2, main h3, main a{ overflow-wrap:anywhere; word-break:break-word }

/* Только где нужно — отсекаем «лишний» горизонтальный оверфлоу */
.frame, .medals, .grid{ overflow-x:hidden }

/* Sidebar (desktop) */
.aside{
  position:sticky;
  top:calc(var(--hdrH, 64px) + 10px);
  align-self:start;
  background:linear-gradient(180deg,#12151c,#1a1f28);
  border:1px solid var(--line); border-radius:16px; padding:14px; box-shadow:var(--ring);
  max-height:calc(100vh - (var(--hdrH, 64px) + 24px));
  overflow-y:auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.aside::-webkit-scrollbar{
  width:0;
  height:0;
}
.nav{ list-style:none; margin:0; padding:0 }
.nav li{ margin:6px 0 }
.nav a{
  display:flex; align-items:center; gap:10px; padding:11px 12px; border-radius:10px;
  color:var(--ink); border:1px solid transparent; text-decoration:none;
  font-weight:500;
  transition:background .2s ease, color .2s ease;
}
.nav a:hover{
  background:rgba(255,255,255,.06);
  color:#fff;
}
.nav a.is-active{
  background:rgba(255,215,0,.1);
  border-color:rgba(255,215,0,.18);
  color:var(--gold1);
  font-weight:700;
}
.sep{ height:10px; margin:8px 6px; border-top:1px solid #222222; border-bottom:1px solid #2a2a2a; opacity:.8 }
.sep-title{ margin:8px 8px 4px; color:#fbfbfb; font-size:12px; letter-spacing:.08em }

/* Drawer (mobile) */
.drawer{
  position:fixed; top:0; left:0; bottom:0; width:min(82vw,320px);
  background:linear-gradient(180deg,#0f1218,#1a1f28); border-right:1px solid var(--line);
  box-shadow:0 20px 60px rgba(0,0,0,.6); transform:translateX(-100%); transition:transform .28s ease;
  z-index:130; display:flex; flex-direction:column; border-radius:0 18px 18px 0;
}
.drawer.open{ transform: translateX(0) }
.drawer .dhead{ display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-bottom:1px solid #484848 }
.dclose{ background:none; border:1px solid #424242; color:#cfe6ff; border-radius:10px; padding:8px 10px }
.dnav{
  flex:1;
  min-height:0;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding:10px 10px 16px;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.dnav::-webkit-scrollbar{
  width:0;
  height:0;
}
.drawer-lang{
  flex-shrink:0;
  padding:12px 14px 14px;
  border-bottom:1px solid var(--line);
}
.drawer-lang-label{
  margin:0 0 8px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--ink-muted);
}
.lang-switch--drawer{
  display:block;
  width:100%;
  margin-left:0 !important;
}
.lang-switch--drawer .lang-btn{
  width:100%;
  justify-content:center;
}
.lang-switch--drawer .lang-menu{
  left:0;
  right:0;
  min-width:0;
  width:100%;
}
@media (min-width:993px){
  .drawer-lang{ display:none; }
  .lang-switch--drawer{ display:none !important; }
}
@media (max-width:992px){
  .lang-switch--header{ display:none !important; }
}



/* Page Title */
.page-title{
  text-align:center;
  margin:6px 0 16px;
  font-size:clamp(1.4rem, 2.4vw, 1.85rem);
  font-weight:900;
  letter-spacing:.02em;
  line-height:1.25;
  color:#fff;
}

/* Hero / Banner */
.frame{
  background:#12151c;
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px;
  box-shadow:var(--ring);
  position:relative;
  overflow:hidden;
}
.frame:before{
  content:""; position:absolute; inset:6px; border-radius:14px; border:2px solid transparent;
  background:linear-gradient(#1a1d26,#12151c) padding-box,
             linear-gradient(135deg,var(--gold3),var(--gold1) 45%, var(--gold2)) border-box;
  pointer-events:none; z-index:0;
}
.banner{
  width:100%;
  border-radius:10px;
  position:relative;
  z-index:1;
  object-fit:cover;
  display:block;
}

/* Кнопка на баннере */
.banner-btn{
  position:absolute;
  bottom:44px;
  left:72px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 40px;
  border-radius:10px;
  font-weight:800;
  font-size:14px;
  letter-spacing:.03em;
  text-transform:uppercase;
  color:#0b0e11;
  text-decoration:none;
  background:var(--gold);
  border:2px solid #1a1a1a;
  box-shadow:0 4px 16px rgba(0,0,0,.45);
  z-index:2;
  transition:transform .25s ease, filter .25s ease;
  animation:pulse 1.8s infinite;
}
.banner-btn:hover{
  background:#ffe44d;
  transform:scale(1.04);
  filter:brightness(1.05);
}

/* ── Mobile tweaks ───────────────────────────────────────── */
@media (max-width:520px){
  .banner-btn{
    left:50%;
    transform:translateX(-50%);
    bottom:18px;
    width:min(78%, 280px);
    padding:12px 16px;
    font-size:13px;
    min-height:44px;
  }
  .banner-btn:hover{
    transform:translateX(-50%) scale(1.03);
  }
}

@media (max-width:390px){
  .banner-btn{
    width:min(86%, 300px);
    bottom:14px;
    padding:12px 14px;
    font-size:13px;
  }
}



/* Medallions */
.medals{ display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:18px; margin-top:18px; min-width:0 }
.medal{ text-align:center; color:#dce9ff; text-decoration:none }
.medal .ring{ aspect-ratio:1/1; border-radius:50%; overflow:hidden; background:#0e223000; box-shadow:0 10px 24px rgba(0,0,0,.45) }
.medal img{ width:100%; height:100%; object-fit:cover; transform:scale(1); transition:transform .35s ease }
.medal:hover img{ transform:scale(1.06) }
.medal b{ display:block; margin-top:10px; font-size:14px }
.medal .ring {
  aspect-ratio: 1/1;
  border-radius: 50%;
  background: #0e223000;
  box-shadow: 0 10px 24px rgba(0,0,0,.45);
  transition: box-shadow .35s ease, border .35s ease;
  border: 2px solid transparent;
}

.medal:hover .ring {
  border: 1px solid #c86bfa18;
  box-shadow: inset 0 0 10px rgb(255, 170, 0), 
              inset 0 0 10px rgba(255, 213, 0, 0.967);
}

/* Cards grid */
.grid{ display:grid; gap:16px; grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:20px; min-width:0 }
.card{
  display:block; text-decoration:none; color:inherit;
  background:#151a22;
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius); overflow:hidden; box-shadow:var(--ring);
  transition:transform .2s ease, border-color .2s ease;
}
@media (hover:hover){
  .card:hover{
    transform:translateY(-3px);
    border-color:rgba(255,215,0,.25);
  }
}
.media{ position:relative; aspect-ratio:16/9; overflow:hidden }
.media img{ width:100%; height:100%; object-fit:cover; transform:scale(1); transition:transform .5s ease }
.card:hover .media img{ transform:scale(1.06) }
.play{
  position:absolute; inset:auto 50% 50% auto; transform:translate(50%,50%);
  padding:10px 20px; border-radius:10px; font-weight:800; color:#0b0e11;
  background:var(--gold);
  border:1px solid #1a1a1a;
  box-shadow:0 4px 14px rgba(0,0,0,.4);
  opacity:0; transition:opacity .2s ease, transform .2s ease;
}
.card:hover .play{ opacity:1; transform:translate(50%,50%) scale(1.04) }
@media (hover:none){
  .play{ opacity:.95; font-size:12px; padding:8px 14px; }
}
.info{ padding:10px 12px 12px }
.title{ margin:0 0 2px; font-weight:800 }
.vendor{ margin:0; color:var(--teal-accent); font-size:12px; opacity:.9 }

/* Sections / CTA */
.section{
  margin-top:24px;
  margin-bottom:18px;
  color:var(--ink);
  line-height:1.65;
  padding:20px 18px;
  background:#12151c;
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius);
  box-shadow:var(--ring);
}
.section h2{
  color:var(--gold1);
  font-weight:800;
  letter-spacing:.02em;
  font-size:clamp(1.15rem, 1.8vw, 1.35rem);
  margin:0 0 12px;
  line-height:1.3;
}
.section h3{
  color:#f0e6b8;
  font-weight:700;
  font-size:1rem;
  margin:1.1em 0 .5em;
}
.section p{ margin:0 0 .8em; color:var(--ink); }
.section p:last-child{ margin-bottom:0; }
.section ul, .section ol{ margin:0 0 .85em; padding-left:1.2em; }
.section li{ margin-bottom:.3em; }
.section .section{
  margin:14px 0 0;
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
  border-radius:0;
}
.intro{
  background:linear-gradient(180deg,#151a22,#12151c);
  border-color:rgba(255,215,0,.16);
}
.intro p{
  max-width:900px;
  margin:0 auto;
  text-align:left;
  font-size:1rem;
  line-height:1.7;
}
.cta-center{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}
.pulse-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:12px 28px;
  font-weight:800;
  font-size:15px;
  letter-spacing:.03em;
  text-transform:uppercase;
  color:#0b0e11;
  text-decoration:none;
  border-radius:10px;
  background:var(--gold);
  border:2px solid #1a1a1a;
  box-shadow:0 4px 16px rgba(0,0,0,.4);
  animation:pulse 1.8s infinite;
  transition:transform .25s ease, filter .25s ease;
}
@media (hover:hover){
  .pulse-btn:hover{
    transform:scale(1.04);
    background:#ffe44d;
    filter:brightness(1.05);
  }
}

/* Providers */
.prov-grid{ display:grid; gap:16px; grid-template-columns:repeat(4,minmax(0,1fr)) }
.prov{
  display:flex; flex-direction:column; align-items:center; text-decoration:none; color:#dce9ff;
  background:#323232; border:1px solid #393939; border-radius:16px; padding:14px;
  box-shadow:var(--ring); transition:transform .2s ease, box-shadow .2s ease;
}
.prov:hover{ transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.35), var(--ring) }
.prov-media{
  width:100%; aspect-ratio:16/9; background:#202020; border-radius:10px; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
.prov-media img{ width:80%; height:80%; object-fit:contain; filter:drop-shadow(0 2px 8px rgba(0,0,0,.35)) }
.prov-name{ margin-top:10px; font-weight:800; letter-spacing:.2px; text-align:center; color:#eaf2ff }
.vmore-btn{
  display:inline-block; padding:10px 18px; font-weight:800; border-radius:999px; text-decoration:none; color:#fff;
  background:radial-gradient(60% 120% at 30% 20%, rgba(255, 174, 25, 0.35), transparent 40%),
             linear-gradient(180deg,#ffbf00 20%, #a36d00 80%);
  border:1px solid #fe9d00; box-shadow:0 0 16px rgba(255, 217, 25, 0.25), var(--ring);
}
.vmore-btn:hover{ transform:scale(1.04) }

/* Таблицы */
.table-wrapper{
  background:rgba(47,47,47,.55);
  border:1px solid rgba(86,86,86,.5);
  border-radius:16px;
  box-shadow:var(--ring);
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  margin:14px 0 18px;
}
.table-wrapper table,
table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
  margin:0;
}
.table-wrapper th,
.table-wrapper td{
  box-sizing:border-box;
  padding:12px 14px;
  text-align:left;
  vertical-align:middle;
  line-height:1.45;
  font-size:14px;
  color:#e9edf3;
  border-bottom:1px solid rgba(255,255,255,.12);
  overflow-wrap:anywhere;
  word-break:normal;
  white-space:normal;
  hyphens:auto;
}
.table-wrapper thead th{
  font-weight:800;
  color:#fff;
  background:rgba(255,215,0,.08);
  border-bottom:1px solid rgba(255,215,0,.28);
  white-space:nowrap;
}
.table-wrapper tbody tr:last-child th,
.table-wrapper tbody tr:last-child td{
  border-bottom:0;
}
.table-wrapper tbody tr:nth-child(even) td,
.table-wrapper tbody tr:nth-child(even) th{
  background:rgba(255,255,255,.03);
}
.table-wrapper tbody tr:hover td,
.table-wrapper tbody tr:hover th{
  background:rgba(255,255,255,.06);
}

/* 2-колоночные key/value — первая колонка уже */
.table-wrapper table.kv-table th:first-child,
.table-wrapper table.kv-table td:first-child{
  width:36%;
  font-weight:700;
  color:#fff;
  white-space:normal;
}
.table-wrapper table.kv-table th:last-child,
.table-wrapper table.kv-table td:last-child{
  width:64%;
}

/* Равные колонки для 3–5 колонок */
.table-wrapper table.cols-3{ min-width:420px; }
.table-wrapper table.cols-4{ min-width:520px; }
.table-wrapper table.cols-5{ min-width:640px; }
.table-wrapper table.cols-3 th,
.table-wrapper table.cols-3 td{ width:33.333%; }
.table-wrapper table.cols-4 th,
.table-wrapper table.cols-4 td{ width:25%; }
.table-wrapper table.cols-5 th,
.table-wrapper table.cols-5 td{ width:20%; }

/* Чистая семантичная таблица фактов */
.facts-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
}
.facts-table th,
.facts-table td{
  padding:12px 16px;
  vertical-align:top;
  text-align:left;
}
.facts-table th{
  white-space:nowrap;
  font-weight:800;
  color:#eaf2ff;
  width:240px;
}
.facts-table tr + tr th,
.facts-table tr + tr td{
  border-top:1px solid #3c3c3c;
}
.facts-table a{
  color:#cfe6ff;
  text-decoration:underline;
}
.facts-table a:hover{ color:#fff }

@media (max-width:640px){
  .table-wrapper th,
  .table-wrapper td{
    padding:10px 10px;
    font-size:13px;
  }
  .table-wrapper thead th{ white-space:normal; }
  .facts-table th{
    display:block;
    padding-bottom:4px;
    width:auto;
  }
  .facts-table td{
    display:block;
    padding-top:0;
  }
  .facts-table tr + tr th{ border-top:1px solid #414141 }
  .facts-table tr + tr td{ border-top:0 }
}


/* ─────────────────────────────────────────────────────────
   Spielerstimmen — Google Reviews style
────────────────────────────────────────────────────────── */
.reviews-google{
  margin:28px 0 8px;
  padding:28px 22px 26px;
  border-radius:16px;
  background:
    radial-gradient(ellipse 80% 55% at 50% -10%, rgba(140,60,180,.28), transparent 60%),
    linear-gradient(180deg, #1a0f14 0%, #120a0c 55%, #0e0808 100%);
  border:1px solid rgba(255,255,255,.06);
  color:#fff;
}
.reviews-google__title{
  margin:0 0 20px;
  font-size:clamp(1.2rem, 2vw, 1.45rem);
  font-weight:800;
  letter-spacing:.02em;
  color:var(--gold1);
}
.reviews-google__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:22px;
}
.reviews-google__logo-row{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:8px;
}
.reviews-google__g{ flex-shrink:0; display:block }
.reviews-google__label{
  font-size:1.15rem;
  font-weight:700;
  color:#fff;
}
.reviews-google__rating-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.reviews-google__score{
  font-size:2rem;
  font-weight:800;
  line-height:1;
  color:#fff;
}
.reviews-google__stars{
  display:inline-flex;
  align-items:center;
  gap:2px;
}
.reviews-google__count{
  font-size:.95rem;
  color:rgba(255,255,255,.75);
}
.reviews-google__cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:12px 22px;
  border-radius:12px;
  font-weight:700;
  font-size:14px;
  color:#fff;
  text-decoration:none;
  background:linear-gradient(90deg, #a855f7 0%, #ec4899 100%);
  border:0;
  box-shadow:0 8px 24px rgba(168,85,247,.28);
  transition:filter .2s ease, transform .2s ease;
}
@media (hover:hover){
  .reviews-google__cta:hover{
    filter:brightness(1.08);
    transform:translateY(-1px);
  }
}
.reviews-google__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}
.review-card{
  background:#3a241c;
  border-radius:14px;
  padding:22px 20px;
  border:1px solid rgba(255,255,255,.04);
}
.review-card__head{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:12px;
}
.review-card__avatar{
  width:42px;
  height:42px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#5a5a5a;
  color:#fff;
  font-weight:700;
  font-size:1rem;
  flex-shrink:0;
}
.review-card__meta{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.review-card__name{
  font-weight:700;
  color:#fff;
  font-size:.95rem;
}
.review-card__date{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:.78rem;
  color:rgba(255,255,255,.55);
}
.review-card__date svg{ flex-shrink:0 }
.review-card__stars{
  display:flex;
  gap:2px;
  margin-bottom:10px;
}
.review-card__text{
  margin:0;
  font-size:14px;
  line-height:1.55;
  color:rgba(255,255,255,.92);
}
@media (max-width:900px){
  .reviews-google__grid{ grid-template-columns:1fr; }
}
@media (max-width:520px){
  .reviews-google{ padding:22px 14px 20px; }
  .reviews-google__cta{ width:100%; }
  .reviews-google__score{ font-size:1.7rem; }
}

/* ─────────────────────────────────────────────────────────
   Footer
────────────────────────────────────────────────────────── */
.site-footer{
  margin-top:40px;
  background:linear-gradient(180deg,#151a22,#0b0e11);
  border-top:1px solid var(--line);
  box-shadow:0 -12px 40px rgba(0,0,0,.4) inset;
}
.site-footer a{ color:var(--ink); text-decoration:none }
.site-footer a:hover{ color:var(--gold) }
.ft-wrap{ max-width:1320px; margin:0 auto; padding:28px 14px 32px; color:var(--ink) }
.ft-head{
  display:flex; align-items:center; gap:20px; flex-wrap:wrap;
  justify-content:space-between; margin-bottom:16px;
}
.ft-logo{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
  min-width:0;
}
.ft-logo .logo-lockup{ gap:12px }
.ft-logo .logo-gem{ height:48px }
.ft-logo .logo-wordmark{
  height:52px;
  max-width:min(50vw, 220px);
}
@media (max-width:520px){
  .ft-logo .logo-gem{ height:34px }
  .ft-logo .logo-wordmark{ height:36px; max-width:min(48vw, 200px) }
}
.ft-cta-center{ flex:1; display:flex; justify-content:center }
.ft-btn{
  display:inline-block; padding:12px 28px; font-weight:800; font-size:15px; color:#0b0e11;
  text-decoration:none; border-radius:8px; max-width:320px; letter-spacing:.06em; text-transform:uppercase;
  background:linear-gradient(180deg,var(--gold),var(--gold-deep));
  border:1px solid rgba(255,255,255,.35);
  box-shadow:0 0 22px rgba(255,215,0,.22), 0 4px 14px rgba(0,0,0,.35);
}
.ft-btn--chat{
  font-size:14px;
  letter-spacing:.08em;
  padding:13px 32px;
  min-width:min(200px, 88vw);
  text-align:center;
}
.ft-btn:hover{ transform:scale(1.04); filter:brightness(1.05); box-shadow:0 0 28px rgba(255,215,0,.28) }
.ft-trust{ display:flex; align-items:center; gap:18px }
.ft-trust img{ height:30px; width:auto; display:block; opacity:.9; filter:drop-shadow(0 2px 6px rgba(0,0,0,.35)) }
.ft-trust a:hover img{ opacity:1 }
.ft-grid{
  display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:18px; padding:16px 0;
  border-top:1px solid rgba(255,215,0,.12); border-bottom:1px solid rgba(255,215,0,.1);
}
@media (max-width:1100px){
  .ft-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:720px){
  .ft-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:420px){
  .ft-grid{ grid-template-columns:1fr; }
}
.ft-col{ display:flex; flex-direction:column; gap:8px }
.ft-title{ font-weight:800; color:var(--gold); margin-bottom:6px }
.ft-pay{
  display:flex; flex-direction:column; align-items:center; gap:10px; margin:14px 0;
}
.ft-pay span{ opacity:.9; text-align:center }
.ft-pay ul{
  display:flex; flex-wrap:wrap; justify-content:center; gap:14px; padding:0; margin:0; list-style:none;
}
.ft-pay img{ height:26px; width:auto; display:block; filter:drop-shadow(0 2px 6px rgba(0,0,0,.25)) }
.ft-bottom{
  border-top:1px solid #464646; margin-top:12px; padding-top:12px;
  font-size:13px; color:#e1e1e1; display:flex; justify-content:center; text-align:center;
}

/* ─────────────────────────────────────────────────────────
   Sticky patch (desktop header compensation)
────────────────────────────────────────────────────────── */
@media (min-width:993px){
  .aside{
    position:sticky !important;
    top:calc(var(--hdrH, 64px) + 10px);
  }
}
/* mobile drawer усиленно скрыт за пределами */
@media (max-width:992px){
  .drawer{ transform:translateX(-110%) }
}

/* ─────────────────────────────────────────────────────────
   Responsive
────────────────────────────────────────────────────────── */
@media (max-width:1200px){
  .prov-grid{ grid-template-columns:repeat(3,1fr) }
  .medals{ grid-template-columns:repeat(6,1fr) }
  .grid{ grid-template-columns:repeat(3,1fr) }
}
@media (max-width:992px){
  .shell{ grid-template-columns:1fr }
  .aside{ display:none }
  .burger{ display:inline-flex }
  .search{ display:none !important; }   /* ← скрыли поиск */
  .medals{ grid-template-columns:repeat(4,1fr) }
  .grid{ grid-template-columns:repeat(2,1fr) }
}
@media (max-width:520px){
  .head{ gap:8px }
  .btn{ padding:7px 10px; font-size:13px }
  .search{ padding:6px 10px }
  .medals{ grid-template-columns:repeat(3,1fr) }
  .head, .shell, .site-footer{ padding-left:12px; padding-right:12px }
  .frame{ padding:10px }
  .frame:before{ inset:6px }
}
@media (max-width:390px){
  .search{ display:none }
  .btn{ padding:6px 9px; font-size:12px }
  .medals{ grid-template-columns:repeat(2,1fr) }
  .grid{ grid-template-columns:1fr }
}

/* ─────────────────────────────────────────────────────────
   (Опционально) стиль для зафиксированного aside — на будущее
   Сейчас JS его не включает, но пусть будет один корректный блок
────────────────────────────────────────────────────────── */
.aside--fixed{
  position:fixed !important;
  top:var(--asideTop,74px);
  left:var(--asideLeft,14px);
  width:var(--asideWidth,260px);
  height:calc(100vh - (var(--asideTop,74px) + 14px));
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  -ms-overflow-style:none;
  z-index:90;
  transform:translateY(var(--asideShift,0px));
}
.aside--fixed::-webkit-scrollbar{
  width:0;
  height:0;
}

/* ==== Legacy 2-col force removed — use .table-wrapper + .kv-table / .cols-N ==== */
#payments{
  overflow-x:auto;
  padding-bottom:6px;
}


/* Контейнер */
.lang-switch {
  position: relative;
  display: inline-block;
  margin-left: 12px;
  z-index: 999;
}

/* Кнопка */
.lang-btn {
  background: linear-gradient(180deg, #ffd34d, #e6b800);
  border: none;
  padding: 8px 14px;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  border-radius: 6px;
  color: #414141;
  box-shadow: 0 2px 6px rgba(0,0,0,0.4);
  transition: all .3s ease;
}

.lang-btn:hover {
  background: linear-gradient(180deg, #ffdf6a, #f1c233);
}

/* ===================== LANGUAGE SWITCH (final) ===================== */
/* Контейнер */
.lang-switch{
  position:relative;
  display:inline-flex;
  align-items:center;
  z-index:999;
  margin-left:12px;
}

/* «Мостик», чтобы курсор не терялся между кнопкой и меню */
.lang-switch::before{
  content:"";
  position:absolute;
  left:0; right:0; top:100%;
  height:0;
}
.lang-switch.open::before{ height:10px; }

/* Кнопка-капсула под стиль Connexion/Inscription */
.lang-btn{
  height:40px;
  padding:0 18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:0;
  border-radius:999px;
  cursor:pointer;
  font-weight:700;
  font-size:14px;
  letter-spacing:.2px;
  text-transform:uppercase;
  color:#fff;
  text-shadow:0 1px 0 rgba(0,0,0,.35);
  background:
    radial-gradient(120% 100% at 25% 0%, rgba(255, 254, 253, 0.35) 0%, rgba(255,170,238,0) 55%),
    linear-gradient(180deg,rgb(223, 183, 42) 0%, rgb(148, 111, 0) 100%);
  border:1px solid rgba(255, 255, 255, 0.539);
  box-shadow:
    0 8px 20px rgba(0,0,0,.45),
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(0,0,0,.35);
  line-height:1;
  overflow:hidden;
  transition:filter .15s ease, transform .15s ease;
}
.lang-btn:hover{ filter:brightness(1.06); }
.lang-btn:active{ transform:translateY(1px); }

/* Флаг (только десктоп) */
.lang-flag{
  display:block;
  width:18px; height:12px;
  object-fit:cover;
  border-radius:2px;
  box-shadow:0 0 0 1px rgba(0,0,0,.25);
}

/* Меню */
.lang-menu{
  display:none;
  position:absolute;
  right:0;
  top:calc(100% + 10px);
  min-width:160px;
  margin:0;
  padding:8px 0;
  list-style:none;
  background:linear-gradient(180deg,#302f30,#151516);
  border:1px solid #555555;
  border-radius:12px;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.06) inset,
    0 12px 30px rgba(0,0,0,.55);
}
.lang-switch.open .lang-menu{ display:block; }

.lang-menu li{ padding:6px 14px; }
.lang-menu a{
  display:flex; align-items:center; gap:10px;
  color:#eaf2ff; text-decoration:none; font-size:14px; white-space:nowrap;
}
.lang-menu li:hover{ background:rgba(126, 126, 126, 0.16); }

/* ===== MOBILE: без флагов и компактные отступы ===== */
@media (max-width:520px){
  .head{ gap:6px; }
  .lang-switch{ margin-left:4px; }
  .lang-btn{ height:36px; padding:0 12px; font-size:13px; gap:0; }

  /* скрыть ВСЕ флаги внутри свитча (и в кнопке, и в меню) */
  .lang-switch .lang-flag{ display:none !important; }

  /* когда флагов нет — убираем зазор в пунктах меню */
  .lang-menu a{ gap:0; }
}

/* Rechtstext-Seiten */
.legal-main{ padding-bottom:32px; max-width:920px }
.legal-hero{
  text-align:center;
  padding:32px 24px 28px;
  margin:0 auto 28px;
  background:linear-gradient(165deg, rgba(255,215,0,.1) 0%, rgba(42,21,56,.35) 55%, transparent 100%);
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:var(--ring);
}
.legal-hero .page-title{ margin:0 0 12px }
.legal-hero .legal-lead{ margin:0 auto }
.legal-hero__badge{
  display:inline-block;
  padding:5px 14px;
  margin-bottom:14px;
  border-radius:999px;
  background:rgba(255,215,0,.12);
  color:var(--gold);
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.legal-lead{
  max-width:720px;
  margin:0 auto 24px;
  color:var(--ink-muted);
  line-height:1.65;
  font-size:15px;
}
.legal-cards{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:16px;
  margin:0 0 28px;
}
.legal-card{
  padding:22px 20px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:0 8px 24px rgba(0,0,0,.25);
  transition:border-color .2s, transform .2s;
}
.legal-card:hover{
  border-color:rgba(255,215,0,.35);
  transform:translateY(-2px);
}
.legal-card__icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  margin-bottom:14px;
  border-radius:12px;
  background:rgba(255,215,0,.1);
  color:var(--gold);
}
.legal-card h3{
  margin:0 0 8px;
  font-size:1rem;
  color:var(--ink);
}
.legal-card p{
  margin:0;
  font-size:14px;
  line-height:1.55;
  color:var(--ink-muted);
}
.contact-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
  gap:16px;
  margin:0 0 24px;
}
.contact-card{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:22px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:14px;
}
.contact-card__label{
  font-size:12px;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--gold);
}
.contact-card a{
  font-size:1.05rem;
  font-weight:600;
  color:var(--ink);
  text-decoration:none;
}
.contact-card a:hover{ color:var(--gold) }
.contact-card p{ margin:0; font-size:14px; color:var(--ink-muted); line-height:1.55 }
.legal-main .legal-section{
  padding:22px 24px;
  margin-bottom:14px;
  background:rgba(18,21,28,.55);
  border:1px solid var(--line);
  border-radius:14px;
}
.legal-section h2{
  font-size:1.15rem;
  margin:0 0 .75em;
  color:var(--gold);
}
.legal-section p{ line-height:1.65; color:var(--ink-muted) }
.legal-section ul{
  padding-left:1.25rem;
  color:var(--ink-muted);
  line-height:1.65;
}
.legal-section a{ color:var(--gold) }
.legal-section a:hover{ color:#ffe44d }
.legal-back{ margin-top:1.5rem; font-weight:600 }
.legal-back a{ color:var(--gold); text-decoration:underline }
.legal-back a:hover{ color:#ffe44d }
.ft-grid--legal{ grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)) }

/* Bonus / Artikel-Seiten */
.article-main{ max-width:920px; padding-bottom:36px }
.article-main .section{ margin-bottom:28px }
.article-main .section h2{
  font-size:1.35rem; margin:0 0 14px; color:var(--gold);
}
.article-main .section h3{
  font-size:1.1rem; margin:1.25em 0 10px; color:var(--ink);
}
.article-main p{
  line-height:1.7; color:var(--ink-muted); margin:0 0 14px;
}
.article-main ol{
  padding-left:1.35rem; margin:0 0 16px; color:var(--ink-muted); line-height:1.65;
}
.article-main ol li{ margin-bottom:8px }
.article-float{
  float:left; width:min(42%, 360px); margin:4px 24px 14px 0;
  border-radius:14px; border:1px solid var(--line);
  box-shadow:var(--ring), 0 12px 32px rgba(0,0,0,.35);
}
.article-float--right{
  float:right; margin:4px 0 14px 24px;
}
.article-main::after{ content:""; display:table; clear:both }
.bonus-cta{
  display:flex; flex-wrap:wrap; gap:12px; margin:20px 0 8px;
}
.bonus-cta .pulse-btn{ margin:0 }
.bonus-table-wrap{ margin:18px 0 22px }
.faq-block{ margin-top:8px }
.faq-block .faq-item,
.faq-block details{
  margin-bottom:10px;
  padding:16px 16px;
  background:#151a22;
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
}
.faq-block .faq-item:hover,
.faq-block details:hover{
  border-color:rgba(255,215,0,.2);
}
.faq-block .faq-item h3,
.faq-block summary{
  margin:0 0 10px;
  font-size:1rem;
  font-weight:700;
  color:var(--gold1);
  list-style:none;
}
.faq-block summary{ cursor:pointer; color:var(--ink); margin-bottom:0 }
.faq-block summary::-webkit-details-marker{ display:none }
.faq-block details[open] summary{ color:var(--gold); margin-bottom:10px }
.faq-block .faq-item p,
.faq-block details p{ margin:0; font-size:14.5px; color:var(--ink); line-height:1.6 }
@media (max-width:768px){
  .legal-hero{ padding:24px 16px 20px }
  .legal-main .legal-section{ padding:18px 16px }
  .article-float, .article-float--right{
    float:none; width:100%; max-width:100%; margin:0 0 18px;
  }
}

.medal{ color:var(--ink) }
.medal b{ color:var(--ink) }

@media (hover: hover) and (min-width: 993px){
  a[data-go],
  a[data-go]:hover,
  a[data-go]:focus,
  a[data-go]:focus-visible,
  a[data-go] *,
  a[data-go]:hover *,
  a[data-go] img,
  a[data-go]:hover img,
  a[data-go] .promo-img,
  a[data-go]:hover .promo-img{
    cursor: default !important;
  }
}

/* ─────────────────────────────────────────────────────────
   Visual polish — CTR / UX (SEO content untouched)
────────────────────────────────────────────────────────── */
.medals{ gap:14px; margin-top:22px; }
.medal b{
  margin-top:8px;
  font-size:13px;
  font-weight:700;
  letter-spacing:.02em;
  color:#dfe6f2;
}
.medal .ring{
  border:2px solid rgba(255,215,0,.12);
  background:radial-gradient(circle at 30% 20%, rgba(255,215,0,.12), transparent 55%), #10141b;
}
.medal:hover .ring{
  border-color:rgba(255,215,0,.45);
  box-shadow:0 0 0 1px rgba(255,215,0,.2), 0 12px 28px rgba(0,0,0,.4);
}

.table-wrapper{
  background:rgba(12,15,20,.72);
  border-color:rgba(255,215,0,.16);
}

.aside{
  background:linear-gradient(180deg,#141820,#10141b);
  border-color:rgba(255,215,0,.16);
}

header{
  background:linear-gradient(180deg, rgba(12,15,20,.96), rgba(16,20,28,.92));
  backdrop-filter:saturate(140%) blur(12px);
}

/* Focus visibility for accessibility / CTR clarity */
a:focus-visible,
button:focus-visible,
.pulse-btn:focus-visible,
.banner-btn:focus-visible,
.btn:focus-visible{
  outline:2px solid var(--gold1);
  outline-offset:3px;
}

/* Mobile reading comfort */
@media (max-width:768px){
  .section{
    padding:18px 14px;
    margin-top:18px;
    margin-bottom:16px;
    border-radius:14px;
  }
  .section h2{
    font-size:1.15rem;
    padding-left:10px;
  }
  .intro p{ font-size:1rem; line-height:1.7; }
  .pulse-btn{
    width:100%;
    max-width:360px;
    font-size:15px;
  }
  .page-title{ margin-bottom:14px; }
  .shell{ padding:14px 10px; gap:14px; }
}

@media (prefers-reduced-motion: reduce){
  .pulse, .banner-btn, .pulse-btn, .btn--reg{ animation:none !important; }
  .card:hover,
  .pulse-btn:hover,
  .banner-btn:hover,
  .nav a:hover{
    transform:none !important;
  }
}