/* =====================================================================
   ForGamblers.io — fg-overrides.css (CLEAN PRO BUILD)
   Updated: 2026-04-08
   RU: Глобальные оверрайды для Kadence (child theme) + блоков + GEO-страниц.
   EN: Global overrides for Kadence (child theme) + blocks + GEO pages.

   RU: Что сделано в этой версии
   - Обновлено оглавление.
   - Секции сгруппированы в более логичном порядке (Header → Layout → Components → Pages → Tables → Mobile → GEO → TOC).
   - Убраны пустые разделители-комментарии (без CSS).

   EN: What changed in this version
   - Updated table of contents.
   - Sections regrouped into a more logical order (Header → Layout → Components → Pages → Tables → Mobile → GEO → TOC).
   - Removed empty separator-only sections (no CSS).

   ---------------------------------------------------------------------
   TABLE OF CONTENTS (by sections below)
   0) Vars & Tokens
   1) Header & Navigation
   2) Layout & Typography
   3) Components (Bonuses / Pills / Cards)
   4) Pages (About / Trust / At-a-glance / How-we-test)
   5) Tables (Reviews / Xmas / Responsive tables)
   6) Steps / Tiles / Block fixes
   7) Mobile tweaks
   8) Performance (iOS / Reduced motion)
   9) Payments & Lists
   10) Casino games grid (fallback)
   11) Country blocks (Canada)
   12) DE (Germany) overrides
   13) TOC pill (On this page)

   ===================================================================== */



/* =====================================================================
   0) Vars & Tokens
   ===================================================================== */


/* ================= 0) Vars & Tokens ================= */
:root{
  --fg-chip-size: 56px;
  --fg-chip-gap: 10px;

  --fg-header-z: 1200;
  --fg-cta-z: 60;

  --fg-stripe-dark: #0f131b;
  --fg-stripe-light: #141c26;

  --global-content-width: var(--contentWidth, 1440px);
  --fg-content-max: var(--global-content-width, 1440px);

  --cr-surface: #0f131b;
  --cr-border:  #273042;
  --cr-muted:   #9fb0c9;
  --cr-muted-strong: #c9d4e5;
}

@media (max-width: 992px){
  :root{
    --fg-chip-size: 40px;
  }
}
@media (max-width: 480px){
  :root{
    --fg-chip-size: 53px;
    --fg-chip-gap: 10px;
  }
}

/* ================= 1) A11y helper ================= */
.sr-only{
  position:absolute !important;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
  border:0;
}

/* ================= 2) Header brand + wordmark ================= */
.site-header .fg-brand,
.site-footer .fg-brand{
  display:inline-flex;
  align-items:center;
  gap:var(--fg-chip-gap);
  text-decoration:none;
  color:inherit;
}

.site-header .fg-brand::before,
.site-footer .fg-brand::before{
  content:"";
  width:var(--fg-chip-size);
  height:var(--fg-chip-size);
  background:var(--fg-chip-url, url("/wp-content/themes/kadence-child/assets/fg-logo-glint.avif")) no-repeat center / contain;
  flex:0 0 auto;
  transition:filter .2s ease;
}

.site-header .fg-brand:hover::before,
.site-footer .fg-brand:hover::before{
  filter:drop-shadow(0 0 6px rgba(255,215,0,.45));
}

.fg-wordmark{
  display:inline-flex;
  align-items:baseline;
  gap:.10em;
  font-family:"Poppins","Inter",system-ui,sans-serif;
  font-weight:800;
  letter-spacing:.15px;
}

.fg-wordmark__for,
.fg-wordmark__io{
  background:linear-gradient(90deg,hsl(238 100% 71%) 0%,hsl(295 100% 84%) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  font-size:clamp(18px, calc(var(--fg-chip-size)*0.62), 60px);
  line-height:1;
}

.fg-wordmark__for::after{
  content:".";
  margin:0 .06em;
  background:inherit;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
}

@media (max-width:480px){
  .site-header .fg-brand{
    gap:8px;
  }
}

/* ================= 6) Layers: sticky header + sticky CTA ================= */
.kadence-sticky-header,
.site-header,
.site-header .site-header-wrap,
.site-header .header-main,
.site-header .site-header-inner-wrap{
  z-index:var(--fg-header-z) !important;
}

@media (max-width:768px){
  .single-casinos .cr-bonus__cta,
  .single-casino-reviews .cr-bonus__cta,
  .cr-hero__bonus .cr-bonus__cta{
    position:sticky;
    bottom:12px;
    z-index:var(--fg-cta-z);
    padding-top:12px;
    margin-top:10px;
    border-radius:12px;
    background:linear-gradient(180deg, rgba(15,19,27,0), rgba(15,19,27,.85) 40%, rgba(15,19,27,.95));
    backdrop-filter:blur(2px);
    -webkit-backdrop-filter:blur(2px);
  }

  .single-casinos .cr-bonus__cta .cr-btn--primary,
  .single-casino-reviews .cr-bonus__cta .cr-btn--primary,
  .cr-hero__bonus .cr-bonus__cta .cr-btn--primary{
    width:100%;
    justify-content:center;
  }
}

/* =========================================================
   HGF — Header gap fix
   ========================================================= */
body.page .content-area .entry-content-wrap{
  padding-top:0 !important;
}

body.page .entry-content > *:first-child,
body.page .entry-content > .kb-row-layout-wrap:first-child,
body.page .entry-content > .wp-block-kadence-rowlayout:first-child,
body.page .entry-content > .wp-block-group:first-child,
body.page .entry-content > .wp-block-cover:first-child{
  margin-top:0 !important;
}

body.page .fg-hero:first-child,
body.page .entry-content > .fg-hero:first-child{
  margin-top:0 !important;
}

body.page .entry-content > *:first-child h1:first-child{
  margin-top:0 !important;
}

@media (min-width:782px){
  body.admin-bar .site-header.is-sticky{
    top:32px;
  }
}
@media (max-width:781.98px){
  body.admin-bar .site-header.is-sticky{
    top:46px;
  }
}

/* =====================================================================
   27) Header dropdowns (Kadence) — dark theme + Polylang (stable & neat)
   RU: Аккуратные выпадашки + фикс языкового меню (не уезжает, не пропадает).
   EN: Clean dark dropdowns + stable Polylang language menu (no drifting/flicker).
   ===================================================================== */

/* ---------------------------------------------------------------------
   27.0 Kadence dropdown wrapper reset (без убийства всего через "*")
   RU: Снимаем лишние белые обёртки Kadence, но не трогаем ВСЕ элементы подряд.
   EN: Remove Kadence wrapper “white boxes” without nuking all children.
------------------------------------------------------------------------ */
.site-header .kadence-menu-dropdown{
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* ---------------------------------------------------------------------
   27.1 Regular dropdowns (ALL except Polylang)
   RU: Тёмная выпадашка нормальной ширины + без “слова столбиком”.
   EN: Dark dropdown with sane width + no awkward word breaks.
------------------------------------------------------------------------ */

/* Контейнер подменю (кроме языков Polylang) */
.site-header .main-navigation li:not(.pll-parent-menu-item) > ul.sub-menu,
.site-header .primary-navigation li:not(.pll-parent-menu-item) > ul.sub-menu,
.site-header .secondary-navigation li:not(.pll-parent-menu-item) > ul.sub-menu{
  min-width: 260px !important;
  width: min(360px, calc(100vw - 24px)) !important;
  max-width: calc(100vw - 24px) !important;
  box-sizing: border-box;
  padding: 8px 0 !important;
  margin-top: 0 !important;

  background: #141c26 !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 10px !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.55) !important;

  /* RU: слова не ломаем по буквам, но длинные строки можно переносить */
  /* EN: keep words intact, but allow long lines to wrap when needed */
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

/* Пункты */
.site-header .main-navigation li:not(.pll-parent-menu-item) > ul.sub-menu > li,
.site-header .primary-navigation li:not(.pll-parent-menu-item) > ul.sub-menu > li,
.site-header .secondary-navigation li:not(.pll-parent-menu-item) > ul.sub-menu > li{
  background: transparent !important;
  border: 0 !important;
}

/* Ссылки */
.site-header .main-navigation li:not(.pll-parent-menu-item) > ul.sub-menu > li > a,
.site-header .primary-navigation li:not(.pll-parent-menu-item) > ul.sub-menu > li > a,
.site-header .secondary-navigation li:not(.pll-parent-menu-item) > ul.sub-menu > li > a{
  display: block;
  padding: 10px 18px !important;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;

  color: #e5ecff !important;
  background: transparent !important;

  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

/* Hover */
.site-header .main-navigation li:not(.pll-parent-menu-item) > ul.sub-menu > li > a:hover,
.site-header .primary-navigation li:not(.pll-parent-menu-item) > ul.sub-menu > li > a:hover,
.site-header .secondary-navigation li:not(.pll-parent-menu-item) > ul.sub-menu > li > a:hover{
  color: #a855ff !important;
  background: rgba(168,85,255,.06) !important;
}

@media (min-width: 1025px){
  .site-header .main-navigation .menu > li.menu-item-has-children:not(.pll-parent-menu-item):nth-last-child(-n+3) > ul.sub-menu,
  .site-header .primary-navigation .menu > li.menu-item-has-children:not(.pll-parent-menu-item):nth-last-child(-n+3) > ul.sub-menu,
  .site-header .secondary-navigation .menu > li.menu-item-has-children:not(.pll-parent-menu-item):nth-last-child(-n+3) > ul.sub-menu{
    left: auto !important;
    right: 0 !important;
  }
}

/* ---------------------------------------------------------------------
   27.2 Polylang dropdown (flags) — compact, aligned to the right, easy hover
   RU: Меню языков не широкое, выравниваем по правому краю, делаем “мостик”.
   EN: Compact language dropdown, right-aligned, with hover “bridge”.
------------------------------------------------------------------------ */

@media (min-width: 1025px){

  /* Родитель — якорь для абсолютного подменю */
  .site-header .main-navigation li.pll-parent-menu-item,
  .site-header .primary-navigation li.pll-parent-menu-item,
  .site-header .secondary-navigation li.pll-parent-menu-item{
    position: relative;
  }

  /* Подменю языков — компактное и прижато вправо */
  .site-header .main-navigation li.pll-parent-menu-item > ul.sub-menu,
  .site-header .primary-navigation li.pll-parent-menu-item > ul.sub-menu,
  .site-header .secondary-navigation li.pll-parent-menu-item > ul.sub-menu{
    left: auto !important;
    right: 0 !important;

    min-width: 0 !important;
    width: max-content !important;
    max-width: calc(100vw - 16px);

    padding: 6px !important;
    margin: 0 !important;

    background: #020617 !important;
    border: 1px solid rgba(15,23,42,.85) !important;
    border-radius: 10px !important;
    box-shadow: 0 18px 40px rgba(0,0,0,.70) !important;

    overflow: visible !important;
    z-index: 99999 !important;
  }

  /* RU: “мостик” — прозрачная зона над меню, чтобы оно не исчезало
     EN: hover bridge — transparent zone above dropdown to prevent flicker */
  .site-header .main-navigation li.pll-parent-menu-item > ul.sub-menu::before,
  .site-header .primary-navigation li.pll-parent-menu-item > ul.sub-menu::before,
  .site-header .secondary-navigation li.pll-parent-menu-item > ul.sub-menu::before{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -12px;      /* высота “мостика” */
    height: 12px;
    background: transparent;
  }

  /* Пункты языка */
  .site-header .main-navigation li.pll-parent-menu-item > ul.sub-menu > li,
  .site-header .primary-navigation li.pll-parent-menu-item > ul.sub-menu > li,
  .site-header .secondary-navigation li.pll-parent-menu-item > ul.sub-menu > li{
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
  }

  /* Ссылка-флаг (увеличиваем hitbox, но не делаем огромную плашку) */
  .site-header .main-navigation li.pll-parent-menu-item > ul.sub-menu > li > a,
  .site-header .primary-navigation li.pll-parent-menu-item > ul.sub-menu > li > a,
  .site-header .secondary-navigation li.pll-parent-menu-item > ul.sub-menu > li > a{
    display: flex;
    align-items: center;
    justify-content: center;

    padding: 8px 10px !important;  /* RU: проще поймать мышкой */
    line-height: 1 !important;

    background: transparent !important;
    border-radius: 8px !important;
  }

  /* Hover по флагу — лёгкая подсветка */
  .site-header .main-navigation li.pll-parent-menu-item > ul.sub-menu > li > a:hover,
  .site-header .primary-navigation li.pll-parent-menu-item > ul.sub-menu > li > a:hover,
  .site-header .secondary-navigation li.pll-parent-menu-item > ul.sub-menu > li > a:hover{
    background: rgba(255,255,255,.06) !important;
  }

  /* На случай пустых li */
  .site-header .main-navigation li.pll-parent-menu-item > ul.sub-menu > li:empty,
  .site-header .primary-navigation li.pll-parent-menu-item > ul.sub-menu > li:empty,
  .site-header .secondary-navigation li.pll-parent-menu-item > ul.sub-menu > li:empty{
    display: none !important;
  }
}

/* ---------------------------------------------------------------------
   27.3 Small screens: allow wrapping (but keep words intact)
   RU: На узких экранах пусть переносится по пробелам, но не по буквам.
   EN: On small screens wrap by spaces, not letters.
------------------------------------------------------------------------ */
@media (max-width: 1024px){
  .site-header .main-navigation ul.sub-menu > li > a,
  .site-header .primary-navigation ul.sub-menu > li > a,
  .site-header .secondary-navigation ul.sub-menu > li > a{
    white-space: normal;
    word-break: normal !important;
    overflow-wrap: normal !important;
  }
}

/* =====================================================================
   FG — Breadcrumbs (optional polish)
   ===================================================================== */
.fg-breadcrumbs{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 13px;
  color: rgba(255,255,255,.72);
  margin: 12px 0 10px;
}
.fg-breadcrumbs a{
  color: rgba(255,255,255,.88);
  text-decoration: none;
  border-bottom: 1px dashed rgba(255,255,255,.24);
}
.fg-breadcrumbs a:hover{
  border-bottom-color: rgba(255,255,255,.44);
}
.fg-breadcrumbs .sep{
  color: rgba(255,255,255,.45);
}

/* =========================================================
   FG Header Breadcrumbs (Rank Math)
   RU: Крошки в шапке, тонкая липкая полоска
   EN: Header breadcrumbs, thin sticky strip
   ========================================================= */

.fg-header-breadcrumbs{
  background: rgba(10, 14, 22, 0.45);
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

/* RU: ограничиваем ширину 1440 и делаем аккуратные отступы
   EN: keep 1440 container + clean padding */
.fg-header-breadcrumbs .rank-math-breadcrumb{
  max-width: 1440px;
  margin: 0 auto;
  padding: 8px 20px;
  font-size: 13px;
  line-height: 1.35;
}

/* RU: ссылки и разделители
   EN: links & separators */
.fg-header-breadcrumbs .rank-math-breadcrumb a{
  text-decoration: none;
  opacity: 0.9;
}
.fg-header-breadcrumbs .rank-math-breadcrumb a:hover{
  text-decoration: underline;
}
.fg-header-breadcrumbs .rank-math-breadcrumb .separator{
  opacity: 0.55;
  margin: 0 6px;
}

/* RU: не показывать на главной
   EN: hide on homepage */
.home .fg-header-breadcrumbs{
  display: none;
}

/* ================= 3) Section titles ================= */
.fg-wrap .fg-section-head{
  text-align:center;
}

.fg-wrap .fg-section-head .fg-h2{
  font-weight:800;
  letter-spacing:.15px;
  margin:.35rem auto .6rem;
  background:linear-gradient(90deg,#8aa2c2,#4e607a);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-shadow:none;
}

.fg-wrap .fg-section-head .fg-h2::after{
  content:"";
  display:block;
  width:84px;
  height:3px;
  margin:.45rem auto 0;
  border-radius:3px;
  background:linear-gradient(90deg,#8aa2c2,#4e607a);
  opacity:.55;
}

@media (max-width:640px){
  .fg-wrap .fg-section-head .fg-h2{
    margin-top:.15rem;
  }
  .fg-wrap .fg-section-head .fg-h2::after{
    width:64px;
  }
}

/* ================= 11) Full-width stripes (Kadence Row) ================= */
.fg-about > .wp-block-kadence-rowlayout.fg-section{
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  width:100vw;
  max-width:100vw;
  overflow-x:hidden;
}

.fg-about > .wp-block-kadence-rowlayout.fg-section > :is(
  .kt-row-layout-inner,
  .kb-row-layout-wrap,
  .kadence-rowlayout-inner
){
  max-width:var(--fg-content-max);
  margin-inline:auto;
  padding:clamp(24px, 2.8vw, 40px) clamp(16px, 2vw, 24px);
  box-sizing:border-box;
}

/* =====================================================================
   FG — Group normalization
   ===================================================================== */
.entry-content > .wp-block-group.is-layout-constrained:not(.alignwide):not(.alignfull),
.entry-content > .wp-block-group.is-layout-flow:not(.alignwide):not(.alignfull){
  box-sizing:border-box;
  max-width:var(--global-content-width, 1440px);
  width:100%;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-inline:clamp(12px, 2vw, 20px);
}

.entry-content .wp-block-group{
  text-align:left;
}

.entry-content .wp-block-group.is-layout-constrained{
  justify-content:flex-start;
}

/* =========================================================
   FG — Casino review pattern typography
   ========================================================= */

.single-casinos .fg-review-body h2{
  font-size:22px !important;
  letter-spacing:.08em;
}

.single-casinos .fg-review-body h3{
  font-size:18px !important;
}

.single-casinos .fg-review-body p,
.single-casinos .fg-review-body li{
  font-size:15px !important;
  line-height:1.6;
}


/* ==== Casino review template: larger body text ==== */
.single-casinos .entry-content p,
.single-casinos .entry-content li,
.single-casinos .entry-content td,
.single-casinos .entry-content th{
  font-size:18px;
  line-height:1.6;
}

.single-casinos .entry-content h2{
  font-size:26px;
}

.single-casinos .entry-content h3{
  font-size:22px;
}

.single-casinos .entry-content h4{
  font-size:18px;
}

/* ================= 4) BONUS block (generic) ================= */
.cr-bonus{
  display:grid;
  gap:16px;
}

.cr-bonus__headline{
  font-weight:700;
  font-size:clamp(18px,2.1vw,22px);
  line-height:1.3;
  padding:10px 12px;
  border:1px solid var(--cr-border);
  background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,0));
  border-radius:10px;
}

.cr-bonus__steps{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}

.cr-bonus-step{
  border:1px solid var(--cr-border);
  background:var(--cr-surface);
  border-radius:12px;
  padding:12px;
  transition:border-color .15s, box-shadow .15s, background-color .2s;
}

.cr-bonus-step:hover{
  border-color:rgba(255,255,255,.2);
  box-shadow:0 0 0 1px rgba(255,255,255,.03) inset;
}

.cr-bonus-step__label{
  font-weight:700;
  margin-bottom:6px;
  color:var(--cr-muted-strong);
}

.cr-bonus-step__main{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px 10px;
  margin-bottom:8px;
}

.cr-bonus-cap,
.cr-bonus-fsval{
  color:var(--cr-muted);
  font-size:14px;
}

.cr-bonus-step__meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.cr-bonus-code{
  letter-spacing:.4px;
}

.cr-bonus .badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  font-size:12px;
  line-height:1;
  border-radius:999px;
  border:1px solid var(--cr-border);
  background:rgba(255,255,255,.06);
  transition:.15s;
}

.cr-bonus .badge .ico{
  width:14px;
  height:14px;
  flex:0 0 auto;
}

.cr-bonus .badge:hover{
  background:rgba(255,255,255,.10);
  border-color:rgba(255,255,255,.25);
}

.cr-bonus .cr-chip{
  display:inline-flex;
  align-items:center;
  padding:5px 9px;
  font-size:13px;
  line-height:1;
  border-radius:999px;
  border:1px solid var(--cr-border);
  background:rgba(255,255,255,.03);
}

.cr-bonus__facts{
  display:grid;
  gap:10px;
  padding:10px;
  border:1px dashed var(--cr-border);
  border-radius:10px;
  background:rgba(255,255,255,.02);
}

.cr-bonus__facts .cr-fact{
  margin:0;
}

.cr-bonus__facts .cr-fact + .cr-fact{
  margin-top:6px;
}

.cr-bonus__facts .cr-fact__label{
  min-width:140px;
  display:inline-block;
  color:var(--cr-muted-strong);
}

.cr-bonus__cta{
  margin-top:6px;
}

.cr-bonus .cr-btn--xs{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  line-height:1;
  padding:6px 8px;
  border-radius:8px;
  margin-left:6px;
  border:1px solid var(--cr-border);
  background:transparent;
  cursor:pointer;
}

.cr-bonus .cr-btn--xs:hover{
  background:rgba(255,255,255,.05);
}

@media (min-width:768px){
  .cr-bonus__steps{
    grid-template-columns:1fr 1fr;
  }
}
@media (min-width:1120px){
  .cr-bonus__steps{
    grid-template-columns:repeat(3,1fr);
  }
}

/* ================= 5) /bonuses/ cards ================= */
.bonuses-page .cr-grid.cr-grid--cards{
  max-width:var(--global-content-width);
  margin-inline:auto;
  padding-inline:clamp(12px,2vw,20px);
  display:grid;
  gap:22px;
  grid-template-columns:repeat(3, minmax(280px,1fr));
}

@media (max-width:1100px){
  .bonuses-page .cr-grid.cr-grid--cards{
    grid-template-columns:repeat(2, minmax(260px,1fr));
  }
}
@media (max-width:640px){
  .bonuses-page .cr-grid.cr-grid--cards{
    grid-template-columns:1fr;
    gap:16px;
  }
}

.bonuses-page .cr-card{
  padding:16px;
  border:1px solid var(--cr-border);
  background:var(--cr-surface);
  border-radius:12px;
  display:flex;
  flex-direction:column;
  min-height:260px;
}

.bonuses-page .cr-card__head{
  display:flex;
  align-items:center;
  gap:12px;
  justify-content:space-between;
  margin-bottom:10px;
}

.bonuses-page .cr-card__sub{
  margin-bottom:10px;
}

.bonuses-page .cr-logo-wrap{
  height:60px;
  display:flex;
  align-items:center;
}

.bonuses-page .cr-logo-img{
  max-height:60px;
  width:auto;
  object-fit:contain;
  display:block;
}

.bonuses-page .cr-card__rating-badge{
  margin-left:auto;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--cr-border);
  font-weight:700;
  font-size:12px;
  line-height:1;
}

.bonuses-page .cr-badges,
.bonuses-page .cr-terms{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:10px;
}

.bonuses-page .cr-badges .badge,
.bonuses-page .cr-terms .badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  font-size:12px;
  line-height:1;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
}

@media (max-width:640px){
  .bonuses-page .cr-card{
    padding:14px;
  }
}

.bonuses-page .cr-bonus__cta .cr-btn--primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 16px;
  border-radius:10px;
  font-weight:700;
  text-decoration:none;
  color:#111;
  background:linear-gradient(180deg,#ffe082,#ffca28 60%,#ffb300);
  box-shadow:0 0 0 1px rgba(0,0,0,.20) inset,
             0 10px 24px rgba(0,0,0,.25);
  transition:transform .12s, box-shadow .2s, background-color .2s;
}

.bonuses-page .cr-bonus__cta .cr-btn--primary:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(0,0,0,.35);
}

.bonuses-page .cr-bonus__cta .cr-btn--primary:active{
  transform:translateY(0);
  box-shadow:0 4px 10px rgba(0,0,0,.30);
}

.bonuses-page .cr-bonus__cta .cr-btn--primary:focus-visible{
  outline:2px solid #7aa2ff;
  outline-offset:2px;
}

/* ================= 13) Pills (+ responsive) ================= */
ul.fg-pills{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:12px 0 24px;
  padding:0;
  list-style:none;
}

ul.fg-pills > li{
  background:#111926;
  border:1px solid rgba(255,255,255,.12);
  color:#e8eef7;
  border-radius:9999px;
  padding:6px 12px;
  line-height:1.1;
  font-weight:600;
  white-space:nowrap;
}

ul.fg-pills.fg-pills--light > li{
  background:#eef2f7;
  border-color:#d0dae8;
  color:#0f172a;
}

/* чтобы на about-страницах по умолчанию центрировались */
.fg-about ul.fg-pills{
  justify-content:center;
}

/* About EN + DE: сброс маркеров */
.page-id-17 .entry-content ul.fg-pills,
.page-id-5831 .entry-content ul.fg-pills{
  list-style:none !important;
  padding-left:0 !important;
  margin-left:0 !important;
}

.page-id-17 .entry-content ul.fg-pills > li::before,
.page-id-17 .entry-content ul.fg-pills > li::marker,
.page-id-5831 .entry-content ul.fg-pills > li::before,
.page-id-5831 .entry-content ul.fg-pills > li::marker{
  content:none !important;
}

/* 3–1 desktop */
@media (min-width:1100px){
  .page-id-17 ul.fg-pills.fg-pills--3-1,
  .page-id-5831 ul.fg-pills.fg-pills--3-1{
    display:grid !important;
    grid-template-columns:repeat(6, 1fr);
    column-gap:16px;
    row-gap:12px;
    justify-items:center;
  }

  .page-id-17 ul.fg-pills.fg-pills--3-1 > li,
  .page-id-5831 ul.fg-pills.fg-pills--3-1 > li{
    grid-column:span 2;
    margin:0 !important;
    max-width:100%;
    white-space:normal;
    overflow-wrap:anywhere;
    box-sizing:border-box;
  }

  .page-id-17 ul.fg-pills.fg-pills--3-1 > li:last-child,
  .page-id-5831 ul.fg-pills.fg-pills--3-1 > li:last-child{
    grid-column:3 / span 2;
  }
}

@media (max-width:1100px){
  .page-id-17 ul.fg-pills.fg-pills--3-1,
  .page-id-5831 ul.fg-pills.fg-pills--3-1{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
  }
}

/* 2×2 */
@media (min-width:700px){
  .page-id-17 ul.fg-pills.fg-pills--2x2,
  .page-id-5831 ul.fg-pills.fg-pills--2x2{
    display:grid !important;
    grid-template-columns:repeat(2,1fr);
    gap:14px 18px;
    justify-items:center;
  }

  .page-id-17 ul.fg-pills.fg-pills--2x2 > li,
  .page-id-5831 ul.fg-pills.fg-pills--2x2 > li{
    margin:0 !important;
    width:100%;
    max-width:520px;
    text-align:center;
    padding:10px 14px;
    line-height:1.25;
    white-space:normal;
    overflow-wrap:anywhere;
    box-sizing:border-box;
  }
}

/* mobile: одна колонка, центр */
@media (max-width:640px){
  .page-id-17 ul.fg-pills,
  .page-id-17 ul.fg-pills.fg-pills--3-1,
  .page-id-17 ul.fg-pills.fg-pills--2x2,
  .page-id-5831 ul.fg-pills,
  .page-id-5831 ul.fg-pills.fg-pills--3-1,
  .page-id-5831 ul.fg-pills.fg-pills--2x2{
    display:grid !important;
    grid-template-columns:1fr;
    gap:10px;
    justify-items:center;
  }

  .page-id-17 ul.fg-pills > li,
  .page-id-5831 ul.fg-pills > li{
    width:100%;
    max-width:520px;
    text-align:center;
    justify-content:center;
    padding:10px 14px;
    line-height:1.25;
    white-space:normal;
  }
}

/* ================= 17) Cards container & Kadence overlay ================= */
.fg-list{
  position:relative;
  overflow:hidden;
  contain:paint;
  z-index:1;
}

.fg-list .fg-card{
  position:relative;
}

.fg-home-outro{
  position:relative;
  z-index:10;
  isolation:isolate;
}

.kadence-rowlayout .kt-row-layout-overlay{
  z-index:1 !important;
  pointer-events:none !important;
}

/* =========================================================
   FG — Home + Reviews cards: width + CTA pulse
   ========================================================= */
ul.cr-list.fg-cards{
  box-sizing:border-box;
  width:min(100%, var(--global-content-width, 1440px));
  max-width:var(--global-content-width, 1440px);
  margin:24px auto 32px !important;
  padding-inline:clamp(12px, 2vw, 20px);
  list-style:none;
}

ul.cr-list.fg-cards > li{
  margin:0 0 18px;
}

ul.cr-list.fg-cards .cr-card{
  border-radius:18px;
  box-shadow:0 14px 32px rgba(0,0,0,.55);
  overflow:hidden;
}

ul.cr-list.fg-cards .cr-card__cta{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:6px;
}

ul.cr-list.fg-cards .cr-card__cta .cr-btn--primary{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 26px;
  border-radius:14px;
  border:none;
  font-weight:700;
  text-decoration:none;
  white-space:nowrap;
  color:#111827;
  background:linear-gradient(180deg,#ffe082,#ffca28 55%,#ffb300);
  box-shadow:0 0 0 1px rgba(0,0,0,.32) inset,
             0 12px 30px rgba(0,0,0,.5);
  overflow:visible;
}

ul.cr-list.fg-cards .cr-card__cta .cr-btn--primary::before{
  content:"";
  position:absolute;
  inset:-3px;
  border-radius:inherit;
  pointer-events:none;
  box-shadow:0 0 0 0 rgba(255,208,0,.58);
  opacity:0;
  animation:fg-cta-pulse 2.4s ease-out infinite;
}

ul.cr-list.fg-cards .cr-card__cta .cr-btn--primary:hover{
  box-shadow:0 0 0 1px rgba(0,0,0,.32) inset,
             0 10px 24px rgba(0,0,0,.45);
  transform:translateY(-1px);
}

ul.cr-list.fg-cards .cr-card__cta .cr-btn--primary:active{
  transform:translateY(0);
  box-shadow:0 0 0 1px rgba(0,0,0,.32) inset,
             0 6px 14px rgba(0,0,0,.4);
}

ul.cr-list.fg-cards .cr-card__cta .cr-btn--primary:focus-visible{
  outline:2px solid #7aa2ff;
  outline-offset:2px;
}

@keyframes fg-cta-pulse{
  0%{
    opacity:.9;
    box-shadow:0 0 0 0 rgba(255,208,0,.58);
  }
  60%{
    opacity:0;
    box-shadow:0 0 0 22px rgba(255,208,0,0);
  }
  100%{
    opacity:0;
    box-shadow:0 0 0 0 rgba(255,208,0,0);
  }
}

@media (max-width:900px){
  ul.cr-list.fg-cards .cr-card{
    flex-direction:column;
    align-items:flex-start;
  }

  ul.cr-list.fg-cards .cr-card__cta{
    align-items:stretch;
    width:100%;
  }

  ul.cr-list.fg-cards .cr-card__cta .cr-btn--primary{
    width:100%;
    justify-content:center;
  }
}

/* =====================================================
   FG Cards (shortcodes fg_home_cards / fg_top_casinos)
   RU: Делаем карточки читаемыми на ЛЮБОМ фоне:
       - фиксируем цвет текста внутри (иначе тема даёт чёрный)
       - добавляем glass (прозрачность + blur) как у твоих "таблеток"
       - есть fallback для браузеров без backdrop-filter
   EN: Make cards readable on any background + glass look.
   ===================================================== */

body .cr-list.fg-cards{
  /* RU: базовые токены — можно крутить “крутость” тут */
  --fg-card-bg: rgba(15, 19, 27, .72);          /* прозрачный тёмный */
  --fg-card-border: rgba(255,255,255,.10);
  --fg-card-shadow: 0 18px 50px rgba(0,0,0,.35);
  --fg-card-text: rgba(245,247,255,.94);
  --fg-card-muted: rgba(245,247,255,.72);
  --fg-card-bonus: rgba(245,247,255,.92);
  --fg-card-blur: 14px;                         /* степень “glass” */
}

/* RU: сама карточка */
body .cr-list.fg-cards .cr-card{
  background: var(--fg-card-bg) !important;
  border: 1px solid var(--fg-card-border) !important;
  box-shadow: var(--fg-card-shadow) !important;
  color: var(--fg-card-text) !important;

  backdrop-filter: blur(var(--fg-card-blur)) saturate(140%);
  -webkit-backdrop-filter: blur(var(--fg-card-blur)) saturate(140%);
}

/* RU: если blur не поддерживается — пусть будет твой старый solid */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){
  body .cr-list.fg-cards .cr-card{
    background: #151b25 !important;
  }
}

/* RU: чтобы тема не делала абзацы чёрными */
body .cr-list.fg-cards .cr-content{ color: var(--fg-card-text) !important; }
body .cr-list.fg-cards .cr-content :is(p, small){ color: inherit !important; }

/* RU: subline (хост) */
body .cr-list.fg-cards .fg-card__sub{
  opacity: 1 !important;
  color: var(--fg-card-muted) !important;
}

/* RU: бонус — главный текст, делаем контрастным */
body .cr-list.fg-cards :is(.fg-bonus, .fg-bonus-line, .fg-card__bonus){
  color: var(--fg-card-bonus) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.35);
}

/* RU: лёгкий “дорогой” блик сверху (без опасных blend-mode) */
body .cr-list.fg-cards .cr-card::after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  pointer-events:none;
  background: radial-gradient(650px 240px at 18% 0%,
    rgba(255,255,255,.14),
    rgba(255,255,255,0) 62%);
  opacity:.55;
}

/* ================= 8) ABOUT (EN + DE) ================= */
/* EN: About ForGamblers.io — page-id-17
 * DE: Über uns — page-id-5831
 */

.page-id-17 .entry-title,
.page-id-5831 .entry-title,
.page-id-17 header.entry-header,
.page-id-5831 header.entry-header,
.page-id-17 .content-header,
.page-id-5831 .content-header,
.page-id-17 .entry-hero,
.page-id-5831 .entry-hero,
.page-id-17 .kadence-page-title,
.page-id-5831 .kadence-page-title,
.page-id-17 .page-title,
.page-id-5831 .page-title{
  display:none !important;
}

.page-id-17 .content-wrap,
.page-id-5831 .content-wrap,
.page-id-17 .entry-content-wrap,
.page-id-5831 .entry-content-wrap,
.page-id-17 .content-container,
.page-id-5831 .content-container,
.page-id-17 .entry-content,
.page-id-5831 .entry-content{
  padding-top:0 !important;
  margin-top:0 !important;
}

.fg-about{
  --fg-content-max: var(--global-content-width, 1440px);
}

.fg-about > *{
  margin-top:0 !important;
  margin-bottom:0 !important;
}

.fg-about > :where(
  .wp-block-group,
  .wp-block-columns,
  .wp-block-kadence-rowlayout,
  .kb-row-layout-wrap,
  .kt-row-layout-inner
):not(.alignwide):not(.alignfull){
  max-width:var(--fg-content-max);
  margin-left:auto !important;
  margin-right:auto !important;
  padding-inline:clamp(10px, 2vw, 16px);
  box-sizing:border-box;
}

.fg-about .fg-section{
  padding-block:32px;
}
@media (min-width:1024px){
  .fg-about .fg-section{
    padding-block:36px;
  }
}
@media (max-width:781.98px){
  .fg-about .fg-section{
    padding-block:28px;
  }
}

.fg-about .fg-section > *{
  margin:0;
}

.fg-about .fg-section > * + *{
  margin-top:12px;
}

.fg-about h1{
  margin:0 0 14px;
  line-height:1.2;
}
.fg-about h2{
  margin:0 0 12px;
  line-height:1.2;
}
.fg-about h3{
  margin:0 0 6px;
  line-height:1.25;
}

.fg-about p,
.fg-about ul,
.fg-about ol{
  margin:0;
  line-height:1.5;
}

/* Линию высоты текста тоже применим к обеим страницам */
.page-id-17 .entry-content :where(p, ul, ol),
.page-id-5831 .entry-content :where(p, ul, ol){
  line-height:1.55;
}

/* Прячем ez-TOC на обеих about-страницах */
.page-id-17 :where(
  #ez-toc-container,
  nav.ez-toc,
  .ez-toc-container,
  .ez-toc,
  .ez-toc-widget-container,
  .ez-toc-title-container
),
.page-id-5831 :where(
  #ez-toc-container,
  nav.ez-toc,
  .ez-toc-container,
  .ez-toc,
  .ez-toc-widget-container,
  .ez-toc-title-container
){
  display:none !important;
}

/* Первый Group-блок — без обёрток/теней и по центру */
.page-id-17 .entry-content > .wp-block-group:first-of-type,
.page-id-5831 .entry-content > .wp-block-group:first-of-type{
  display:block !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  border-radius:0 !important;
  padding:0 !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* ================= 9) Kadence ICON GRID (About) ================= */
.page-id-17{
  --fg-content-max: var(--global-content-width);
}

.fg-about .fg-icons-grid{
  max-width:min(var(--fg-content-max), 92vw);
  margin:0 auto;
  padding:clamp(16px, 2.5vw, 28px);
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(320px,1fr));
  gap:clamp(14px, 1.6vw, 20px) clamp(18px, 2vw, 28px);
  justify-items:center;
}

@media (min-width:1100px){
  .fg-about .fg-icons-grid{
    grid-template-columns:repeat(4, minmax(0,1fr));
    gap:22px 24px;
  }
}

.fg-about .fg-icons-grid > *{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-align:left;
  gap:10px;
  max-width:560px;
}

.fg-about .fg-icons-grid .kb-svg-icon-wrap{
  display:grid;
  place-items:center;
  width:56px;
  height:56px;
  border:2px solid rgba(205,213,227,.35);
  border-radius:14px;
  color:#e6edf6;
  background:transparent;
  transition:transform .18s, border-color .18s, color .18s;
}

.fg-about .fg-icons-grid > *:hover .kb-svg-icon-wrap{
  color:#ccffe8;
  border-color:rgba(0,208,132,.55);
  transform:translateY(-2px);
}

.fg-about .fg-icons-grid h3{
  margin:8px 0 4px;
  font-weight:700;
  font-size:clamp(18px, 1.1vw + .4rem, 22px);
  line-height:1.25;
  text-wrap:balance;
}

.fg-about .fg-icons-grid p{
  margin:0;
  color:#b8c2d3;
  font-size:15px;
  line-height:1.45;
  max-width:34ch;
  hyphens:auto;
}

body.wp-admin .block-editor-page .fg-icons-grid{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(260px,1fr));
  gap:24px;
  align-items:start;
}

/* ================= 10) HOW WE TEST tiles ================= */
.page-id-17 .fg-method .fg-wrap{
  max-width:var(--global-content-width);
}

.page-id-17 .fg-method__grid{
  counter-reset:mstep;
  list-style:none;
  margin:16px 0 0;
  padding:0;
  display:grid;
  gap:16px;
  grid-template-columns:1fr;
}

@media (min-width:640px){
  .page-id-17 .fg-method__grid{
    grid-template-columns:repeat(2,1fr);
  }
}
@media (min-width:900px){
  .page-id-17 .fg-method__grid{
    grid-template-columns:repeat(4,1fr);
  }
}
@media (min-width:1200px){
  .page-id-17 .fg-method__grid{
    grid-template-columns:repeat(5,1fr);
  }
}

.page-id-17 .fg-method__item,
.page-id-17 .fg-method__item *{
  box-sizing:border-box;
}

.page-id-17 .fg-method__item{
  position:relative;
  padding:14px 12px 12px;
  min-height:126px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
  border-radius:14px;
  transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease, background-color .2s ease;
}

.page-id-17 .fg-method__item:hover{
  transform:translateY(-2px);
  border-color:rgba(0,208,132,.45);
  box-shadow:0 6px 18px rgba(0,0,0,.25);
  background:rgba(255,255,255,.045);
}

.page-id-17 .fg-method__item::before{
  counter-increment:mstep;
  content:counter(mstep, decimal-leading-zero);
  position:absolute;
  top:10px;
  left:10px;
  display:inline-grid;
  place-items:center;
  width:28px;
  height:28px;
  font:700 12px/1 "Inter",system-ui,sans-serif;
  color:#e6f7ff;
  border:1px solid rgba(255,255,255,.18);
  border-radius:8px;
  background:linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.03));
}

.page-id-17 .fg-method__item h3{
  margin:0 0 6px 38px;
  font-weight:700;
  font-size:15px;
  color:#ffffff;
}

.page-id-17 .fg-method__item p{
  margin:0 0 2px 38px;
  color:#b9c4d6;
}

@media (max-width:480px){
  .page-id-17 .fg-method__item h3,
  .page-id-17 .fg-method__item p{
    margin-left:0;
  }
  .page-id-17 .fg-method__item::before{
    position:static;
    margin-bottom:8px;
  }
  .page-id-17 .fg-method__item{
    padding-top:10px;
    text-align:left;
  }
}

/* ================= 12) About: Lists reset ================= */
.page-id-17 .entry-content ul{
  list-style:disc outside !important;
  padding-left:1.15rem !important;
  margin:.5rem 0 1rem 1rem !important;
}

.page-id-17 .entry-content ol{
  list-style:decimal outside !important;
  padding-left:1.15rem !important;
  margin:.5rem 0 1rem 1rem !important;
}

.page-id-17 .entry-content li{
  margin:.25rem 0;
}

.page-id-17 .entry-content li > ul,
.page-id-17 .entry-content li > ol{
  margin-top:.25rem;
  margin-bottom:.25rem;
}

.page-id-17 .kb-list{
  list-style:initial !important;
  padding-left:1.15rem !important;
}

/* ================= 14) WHY TRUST US (3+2) ================= */
.page-id-17 .fg-why{
  display:grid !important;
  grid-template-columns:1fr;
  gap:16px;
  margin-top:clamp(20px, 2.4vw, 40px);
}

@media (min-width:700px){
  .page-id-17 .fg-why{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}
@media (min-width:1100px){
  .page-id-17 .fg-why{
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:20px 24px;
  }
}
@media (min-width:1240px){
  .page-id-17 .fg-why{
    grid-template-columns:repeat(6, minmax(0,1fr));
  }
  .page-id-17 .fg-why > *{
    grid-column:span 2;
  }
  .page-id-17 .fg-why > *:nth-last-child(2){
    grid-column:2 / span 2;
  }
  .page-id-17 .fg-why > *:last-child{
    grid-column:4 / span 2;
  }
}

.page-id-17 .fg-why .kb-info-box,
.page-id-17 .fg-why .kt-blocks-info-box{
  height:100%;
  padding:14px 12px !important;
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  border-radius:14px;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
  transition:transform .15s, border-color .15s, box-shadow .15s, background-color .2s;
  align-items:flex-start;
}

.page-id-17 .fg-why .kb-info-box:hover,
.page-id-17 .fg-why .kt-blocks-info-box:hover{
  transform:translateY(-2px);
  border-color:rgba(0,208,132,.45);
  box-shadow:0 6px 18px rgba(0,0,0,.12);
}

.page-id-17 .fg-why .kb-info-box-title,
.page-id-17 .fg-why .kt-blocks-info-box-title{
  margin:0 0 6px !important;
  font-weight:800 !important;
  font-size:18px !important;
  line-height:1.25 !important;
  text-transform:uppercase !important;
  letter-spacing:.5px !important;
  color:#0f172a !important;
  text-align:left !important;
}

.page-id-17 .fg-why .kb-info-box-text,
.page-id-17 .fg-why .kt-blocks-info-box-text{
  margin:0 !important;
  color:#334155 !important;
  font-size:15px !important;
  line-height:1.45 !important;
  text-align:left !important;
}

.page-id-17 .fg-why .kb-info-box-figure,
.page-id-17 .fg-why .kb-info-box-media,
.page-id-17 .fg-why .kt-blocks-info-box-media{
  margin-bottom:8px !important;
}

.page-id-17 .fg-why .kb-info-box-figure :is(svg,img),
.page-id-17 .fg-why .kb-info-box-media :is(svg,img),
.page-id-17 .fg-why .kt-blocks-info-box-media :is(svg,img){
  width:20px;
  height:20px;
}

.page-id-17 .fg-why .kb-info-box .kb-info-box-button,
.page-id-17 .fg-why .kb-info-box-link-wrap,
.page-id-17 .fg-why .kt-blocks-info-box .kt-blocks-info-box-link-wrap{
  display:none !important;
}

/* ================= 15) AT A GLANCE (icon cards) – EN + DE ================= */
.page-id-17 .fg-glance,
.page-id-5831 .fg-glance{
  display:grid !important;
  grid-template-columns:1fr;
  gap:18px 22px;
  margin-top:clamp(18px, 2vw, 28px);
}

@media (min-width:700px){
  .page-id-17 .fg-glance,
  .page-id-5831 .fg-glance{
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
  }
}
@media (min-width:1100px){
  .page-id-17 .fg-glance,
  .page-id-5831 .fg-glance{
    grid-template-columns:repeat(4, minmax(0,1fr)) !important;
  }
  .page-id-17 .fg-glance > *,
  .page-id-5831 .fg-glance > *{
    height:100%;
  }
}

.page-id-17 .fg-glance .kb-info-box,
.page-id-5831 .fg-glance .kb-info-box,
.page-id-17 .fg-glance .kt-blocks-info-box,
.page-id-5831 .fg-glance .kt-blocks-info-box{
  height:100%;
  display:flex;
  align-items:flex-start;
  padding:16px 14px !important;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  box-shadow:0 1px 2px rgba(0,0,0,.12);
  transition:transform .15s ease, border-color .15s ease, box-shadow .15s ease, background-color .2s ease;
}

.page-id-17 .fg-glance .kb-info-box:hover,
.page-id-5831 .fg-glance .kb-info-box:hover,
.page-id-17 .fg-glance .kt-blocks-info-box:hover,
.page-id-5831 .fg-glance .kt-blocks-info-box:hover{
  transform:translateY(-2px);
  border-color:rgba(0,208,132,.45);
  background:rgba(255,255,255,.08);
  box-shadow:0 6px 18px rgba(0,0,0,.22);
}

.page-id-17 .fg-glance .kb-info-box-figure,
.page-id-5831 .fg-glance .kb-info-box-figure,
.page-id-17 .fg-glance .kb-info-box-media,
.page-id-5831 .fg-glance .kb-info-box-media,
.page-id-17 .fg-glance .kt-blocks-info-box-media,
.page-id-5831 .fg-glance .kt-blocks-info-box-media{
  margin:0 12px 0 0 !important;
  width:42px;
  height:42px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border-radius:10px;
  border:2px solid rgba(205,213,227,.35);
  background:transparent;
}

.page-id-17 .fg-glance .kb-info-box-figure :is(svg,img),
.page-id-5831 .fg-glance .kb-info-box-figure :is(svg,img),
.page-id-17 .fg-glance .kb-info-box-media :is(svg,img),
.page-id-5831 .fg-glance .kb-info-box-media :is(svg,img),
.page-id-17 .fg-glance .kt-blocks-info-box-media :is(svg,img),
.page-id-5831 .fg-glance .kt-blocks-info-box-media :is(svg,img){
  width:22px;
  height:22px;
}

.page-id-17 .fg-glance .kb-info-box-title,
.page-id-5831 .fg-glance .kb-info-box-title,
.page-id-17 .fg-glance .kt-blocks-info-box-title,
.page-id-5831 .fg-glance .kt-blocks-info-box-title{
  margin:0 0 6px !important;
  font-weight:800 !important;
  font-size:20px !important;
  line-height:1.25 !important;
  color:#ffffff !important;
  text-align:left !important;
}

.page-id-17 .fg-glance .kb-info-box-text,
.page-id-5831 .fg-glance .kb-info-box-text,
.page-id-17 .fg-glance .kt-blocks-info-box-text,
.page-id-5831 .fg-glance .kt-blocks-info-box-text{
  margin:0 !important;
  color:#cfd8e3 !important;
  font-size:15px !important;
  line-height:1.45 !important;
  text-align:left !important;
}

/* светлый вариант (остается общим для обоих языков) */
.fg-about .fg-section.fg-alt .fg-glance :is(.kb-info-box, .kt-blocks-info-box){
  background:#ffffff;
  border-color:#e3e9f2;
  box-shadow:0 1px 2px rgba(16,24,40,.06);
}

.fg-about .fg-section.fg-alt .fg-glance :is(.kb-info-box-title, .kt-blocks-info-box-title){
  color:#0f172a !important;
}

.fg-about .fg-section.fg-alt .fg-glance :is(.kb-info-box-text, .kt-blocks-info-box-text){
  color:#334155 !important;
}

/* ======================================================
 * ABOUT EN + DE: меньше «воздуха» над заголовками
 * ====================================================== */

/* 1) Секции about: уменьшаем вертикальные отступы */
.page-id-17 .fg-about .fg-section,
.page-id-5831 .fg-about .fg-section{
  padding-top:10px;
  padding-bottom:18px;
}

/* 2) Внутренний контейнер Kadence-рядка — тоже поджимаем сверху */
.page-id-17 .fg-about .fg-section > :is(
  .kt-row-layout-inner,
  .kb-row-layout-wrap,
  .kadence-rowlayout-inner,
  .wp-block-group__inner-container
),
.page-id-5831 .fg-about .fg-section > :is(
  .kt-row-layout-inner,
  .kb-row-layout-wrap,
  .kadence-rowlayout-inner,
  .wp-block-group__inner-container
){
  padding-top:8px !important;
}

/* 3) Первый заголовок в секции — почти без верхнего отступа */
.page-id-17 .fg-about .fg-section :is(h2,h3,h4):first-of-type,
.page-id-5831 .fg-about .fg-section :is(h2,h3,h4):first-of-type{
  margin-top:4px !important;
}

/* 4) Конкретно "At a Glance" — ещё ближе к верху */
.page-id-17 .fg-glance{
  margin-top:8px !important;
}

/* ================= 16) Reviews Table (.fg-table--logos) ================= */
figure.wp-block-table.fg-table.fg-table--logos{
  display:block;
  padding:12px;
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:14px;
  box-shadow:0 2px 12px rgba(16,24,40,.06);
  color:#111827;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

figure.wp-block-table.fg-table.fg-table--logos > table{
  width:100%;
  min-width:860px;
  table-layout:auto;
  border-collapse:separate;
  border-spacing:0 12px;
}

.fg-table.fg-table--logos thead th{
  padding:14px 16px;
  background:transparent;
  border:0;
  text-align:left;
  color:#111827;
  vertical-align:middle;
}

.fg-table.fg-table--logos thead th:nth-child(1),
.fg-table.fg-table--logos tbody td:nth-child(1){
  width:400px;
}

.fg-table.fg-table--logos thead th:nth-child(3),
.fg-table.fg-table--logos tbody td:nth-child(3){
  width:1%;
  white-space:nowrap;
}

.fg-table.fg-table--logos tbody td{
  padding:14px 16px;
  border:0;
  background:#fff;
  color:#111827;
  vertical-align:middle;
}

.fg-table.fg-table--logos tbody tr:nth-child(even) td{
  background:#f8fafc;
}

.fg-table.fg-table--logos tbody td:first-child{
  border-radius:12px 0 0 12px;
  padding-right:12px;
}

.fg-table.fg-table--logos tbody td:last-child{
  border-radius:0 12px 12px 0;
}

.fg-table.fg-table--logos tbody tr{
  transition:background .15s ease;
}

.fg-table.fg-table--logos tbody tr:hover td{
  background:#f1f5f9;
}

.fg-table.fg-table--logos .brand-cell{
  display:flex;
  align-items:center;
  gap:12px;
}

.fg-table.fg-table--logos .fg-logo-link{
  display:inline-flex;
  align-items:center;
}

.fg-table.fg-table--logos .cr-logo-wrap{
  width:400px;
  height:120px;
  display:grid;
  place-items:center;
  background:#f3f4f6;
  border:1px solid #e5e7eb;
  border-radius:10px;
  transition:background .18s, border-color .18s, transform .12s;
}

.fg-table.fg-table--logos .cr-logo-img{
  max-height:56px;
  width:auto;
  object-fit:contain;
  display:block;
}

.fg-table.fg-table--logos tbody tr:hover .cr-logo-wrap{
  background:#e5e7eb;
  border-color:#cbd5e1;
}

.fg-table.fg-table--logos td:nth-child(3) a{
  font-weight:700;
  color:#2563eb;
  text-decoration:underline;
  text-underline-offset:2px;
}

.fg-table.fg-table--logos td:nth-child(3) a:hover{
  color:#1d4ed8;
}

@media (max-width:640px){
  figure.wp-block-table.fg-table.fg-table--logos{
    padding:10px;
    border-radius:12px;
  }
  .fg-table.fg-table--logos :is(thead th, tbody td){
    padding:12px;
  }
  .fg-table.fg-table--logos :is(thead th:nth-child(1), tbody td:nth-child(1)){
    width:200px;
  }
  .fg-table.fg-table--logos .cr-logo-wrap{
    width:180px;
    height:56px;
  }
  .fg-table.fg-table--logos .cr-logo-img{
    max-height:48px;
  }
}

/* ================= 24b) Table inside container: center & full width ================= */
.fg-table .wp-block-table,
.fg-table .wp-block-table.alignwide,
.fg-table .wp-block-table.alignfull{
  margin-left:auto !important;
  margin-right:auto !important;
  max-width:100% !important;
  width:100% !important;
}

.fg-table figure{
  display:block;
}

.fg-table table{
  width:100%;
  table-layout:auto;
}

figure.wp-block-table.fg-table{
  margin-left:auto !important;
  margin-right:auto !important;
  max-width:100% !important;
  width:100% !important;
  display:block;
}

/* ================= 25) Table → cards on mobile (≤640px) ================= */
@media (max-width:640px){
  .fg-table:not(.fg-table--logos) thead{
    display:none !important;
  }

  .fg-table:not(.fg-table--logos) figure,
  .fg-table:not(.fg-table--logos) .wp-block-table{
    display:block;
    width:100% !important;
  }

  .fg-table:not(.fg-table--logos) table{
    display:block !important;
    width:100% !important;
    border-collapse:collapse;
  }

  .fg-table:not(.fg-table--logos) tbody{
    display:block !important;
  }

  .fg-table:not(.fg-table--logos) tr{
    display:block !important;
    margin:12px 0;
    padding:12px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:12px;
    background:rgba(255,255,255,.02);
  }

  .fg-table:not(.fg-table--logos) td{
    display:block !important;
    width:100%;
    padding:6px 0;
  }

  .fg-table.fg-table--rules td:nth-child(1)::before{
    content:"Condition";
    font-weight:600;
    display:block;
    margin-bottom:4px;
    opacity:.85;
  }
  .fg-table.fg-table--rules td:nth-child(2)::before{
    content:"Details";
    font-weight:600;
    display:block;
    margin-bottom:4px;
    opacity:.85;
  }
  .fg-table.fg-table--rules td:nth-child(3)::before{
    content:"Example";
    font-weight:600;
    display:block;
    margin-bottom:4px;
    opacity:.85;
  }
}

/* ======================================================
 * PS-CAPTION — контрастные подписи под таблицами / изображениями
 * ====================================================== */

.entry-content figure.wp-block-image figcaption,
.entry-content figure.wp-block-table figcaption,
.entry-content .wp-element-caption{
  color:#111111 !important;   /* очень тёмный цвет, максимум контраста */
}

.entry-content figure.wp-block-image figcaption a,
.entry-content figure.wp-block-table figcaption a,
.entry-content .wp-element-caption a{
  color:#111111 !important;
  text-decoration:underline;
}

/* ================= 24) Steps grid v2 — Group / UAGB / Kadence ================= */
.fg-steps,
.fg-steps > :is(
  .wp-block-group__inner-container,
  .uagb-container-inner-blocks-wrap,
  .kt-row-layout-inner,
  .kb-row-layout-wrap,
  .is-layout-flex
){
  display:grid !important;
  grid-template-columns:repeat(5, minmax(0,1fr));
  gap:24px;
  align-items:stretch;
}

@media (max-width:1024px){
  .fg-steps,
  .fg-steps > :is(
    .wp-block-group__inner-container,
    .uagb-container-inner-blocks-wrap,
    .kt-row-layout-inner,
    .kb-row-layout-wrap,
    .is-layout-flex
  ){
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:18px;
  }
}

@media (max-width:680px){
  .fg-steps,
  .fg-steps > :is(
    .wp-block-group__inner-container,
    .uagb-container-inner-blocks-wrap,
    .kt-row-layout-inner,
    .kb-row-layout-wrap,
    .is-layout-flex
  ){
    grid-template-columns:1fr !important;
    gap:14px !important;
  }
}

.fg-steps :is(.wp-block-uagb-info-box, .kb-info-box, .kt-blocks-info-box){
  margin:0 !important;
  height:100%;
}

.fg-steps .uagb-infobox__content-wrap{
  max-width:none;
  text-align:center;
}

.fg-steps .uagb-infobox__content{
  align-items:center;
}

.fg-steps p{
  overflow-wrap:anywhere;
  hyphens:auto;
  line-height:1.5;
}



/* =====================================================================
   6a) Spectra/UAGB Info Box — fix icon alignment (Left of Title)
   RU: На фронте иконка иногда "уезжает" наверх (выглядит как отдельная картинка).
       Причина обычно в том, что базовые стили блока не подхватились или
       заголовок (h3) получил стандартный верхний отступ.
       Этот блок жёстко собирает шапку инфобокса в строку: [иконка] [заголовок].
   EN: Sometimes the icon jumps above the title on the front-end.
       This block forces the layout back to one row: [icon] [title].
   ===================================================================== */

/* RU/EN: main row that contains icon + content */
.wp-block-uagb-info-box.uagb-ifb-left-title-image .uagb-infobox__outer-wrap,
.uagb-ifb-left-title-image .uagb-infobox__outer-wrap{
  display:flex;
  align-items:flex-start; /* align to the top of the title */
  gap:14px;
}

/* RU/EN: icon wrappers (SVG or image) */
.wp-block-uagb-info-box.uagb-ifb-left-title-image .uagb-infobox__icon-wrap,
.wp-block-uagb-info-box.uagb-ifb-left-title-image .uagb-infobox__image-wrap,
.uagb-ifb-left-title-image .uagb-infobox__icon-wrap,
.uagb-ifb-left-title-image .uagb-infobox__image-wrap{
  flex:0 0 auto;
  margin:0 !important;
  line-height:0; /* remove baseline gap */
}

/* RU/EN: make SVG / IMG behave predictably */
.wp-block-uagb-info-box.uagb-ifb-left-title-image .uagb-infobox__icon-wrap svg,
.uagb-ifb-left-title-image .uagb-infobox__icon-wrap svg,
.wp-block-uagb-info-box.uagb-ifb-left-title-image .uagb-infobox__image-content img,
.uagb-ifb-left-title-image .uagb-infobox__image-content img{
  display:block;
}

/* RU/EN: content column */
.wp-block-uagb-info-box.uagb-ifb-left-title-image .uagb-infobox__content-wrap,
.uagb-ifb-left-title-image .uagb-infobox__content-wrap{
  flex:1 1 auto;
  min-width:0;
}

/* RU/EN: kill the default top-margin on headings inside the infobox
   (this is what usually pushes the title down and makes the icon look "too high") */
.wp-block-uagb-info-box.uagb-ifb-left-title-image h1,
.wp-block-uagb-info-box.uagb-ifb-left-title-image h2,
.wp-block-uagb-info-box.uagb-ifb-left-title-image h3,
.wp-block-uagb-info-box.uagb-ifb-left-title-image h4,
.wp-block-uagb-info-box.uagb-ifb-left-title-image h5,
.wp-block-uagb-info-box.uagb-ifb-left-title-image h6,
.uagb-ifb-left-title-image h1,
.uagb-ifb-left-title-image h2,
.uagb-ifb-left-title-image h3,
.uagb-ifb-left-title-image h4,
.uagb-ifb-left-title-image h5,
.uagb-ifb-left-title-image h6{
  margin-top:0 !important;
}

/* RU/EN: On very small screens allow wrapping */
@media (max-width: 520px){
  .wp-block-uagb-info-box.uagb-ifb-left-title-image .uagb-infobox__outer-wrap,
  .uagb-ifb-left-title-image .uagb-infobox__outer-wrap{ flex-wrap:wrap; }
}


/* ================= 18) Mobile tweaks (cards/logos/payments) ================= */
@media (max-width:860px){
  .cr-card__payments,
  .fg-payments:not(.ca){
    display:flex;
    flex-wrap:wrap;
    gap:8px 10px;
  }
}

/* =====================================================================
   FG — Mobile rating badge alignment (Casino Reviews list)
   Fix: badge should stay left, compact, not centered in the card.
   Page: /ca/casino-reviews/ (page-id-1322)
   ===================================================================== */

@media (max-width: 920px){
  body.page-id-1322 .cr-card__rating-badge{
    width: auto !important;
    max-width: 170px !important;
    margin: 0 !important;
    align-self: flex-start !important;
    justify-self: start !important;
  }
  body.page-id-1322 .cr-card__rating-badge *{
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* ================= 19) Safari gradient text fix ================= */
@supports (-webkit-touch-callout: none){
  .fg-wordmark__for,
  .fg-wordmark__io{
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
  }
}

/* ================= 20) Reduced motion ================= */
@media (prefers-reduced-motion: reduce){
  *{
    transition:none !important;
    animation:none !important;
  }

  .fg-about .fg-icons-grid > *:hover .kb-svg-icon-wrap,
  .page-id-17 .fg-method__item:hover,
  .page-id-17 .fg-why :is(.kb-info-box,.kt-blocks-info-box):hover,
  .page-id-17 .fg-glance :is(.kb-info-box,.kt-blocks-info-box):hover{
    transform:none !important;
  }
}

/* ================= 21) HOTFIX — fg/cr list centering + 1440 cap ================= */
.entry-content :where(ul.fg-list, ul.cr-list):not(.fg-cards){
  box-sizing:border-box;
  width:min(100%, var(--global-content-width, 1440px));
  max-width:var(--global-content-width, 1440px);
  margin-inline:auto !important;
  padding-inline:clamp(12px, 2vw, 20px);
  clear:both;
}

:where(
  .alignfull,
  .alignwide,
  .wp-block-kadence-rowlayout,
  .kb-row-layout-wrap,
  .kt-row-layout-inner
) > :is(ul.fg-list, ul.cr-list):not(.fg-cards){
  justify-self:center;
}

.cr-card{
  min-width:0;
}
.cr-payments{
  flex-wrap:wrap;
  min-width:0;
}

/* ================= 22) FG PAY ICONS (base sizing) ================= */
.cr-pay{
  display:flex;
  flex-wrap:wrap;
  gap:8px 10px;
  align-items:center;
}

.cr-pay__item{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:4px 8px;
  border-radius:10px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.12);
}

.cr-pay__item img{
  display:block;
  height:22px;
  max-height:22px;
  width:auto !important;
  max-width:120px;
  object-fit:contain;
  vertical-align:middle;
}

.cr-pay--sm .cr-pay__item img{
  height:18px;
  max-height:18px;
}
.cr-pay--md .cr-pay__item img{
  height:22px;
  max-height:22px;
}
.cr-pay--lg .cr-pay__item img{
  height:26px;
  max-height:26px;
}

/* ================= 23) Global reset for card UL ================= */
.entry-content :where(ul.cr-list, ul.fg-list){
  list-style:none;
  padding-left:0;
  margin:0;
}

/* =========================================================================
   26) Casino Games Grid (fg-gamegrid + fg-gamecard)
   ========================================================================= */
.fg-gamegrid{
  --fg-games-gap: 24px;
  --fg-games-bg: #0f131b;
  --fg-games-border: #273042;
  --fg-games-muted: #9fb0c9;
  --fg-games-strong: #e7ecf4;
  --fg-games-shadow: 0 10px 28px rgba(0,0,0,.35);
  --fg-games-radius: 16px;
  --fg-games-pad: 16px;
  --fg-games-chip-bg: rgba(255,255,255,.06);
  --fg-games-chip-br: rgba(255,255,255,.12);
  --fg-games-chip-fg: #e8eef7;
  --fg-games-accent: #7aa2ff;
}

.fg-gamegrid,
.fg-gamegrid > :is(
  .kt-row-layout-inner,
  .kb-row-layout-wrap,
  .kadence-rowlayout-inner,
  .wp-block-group__inner-container,
  .is-layout-flow,
  .is-layout-constrained
){
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:var(--fg-games-gap);
  align-items:stretch;
  box-sizing:border-box;
  width:min(100%, var(--global-content-width, 1440px));
  margin-inline:auto;
  padding-inline:clamp(12px, 2vw, 20px);
}

@media (max-width:1200px){
  .fg-gamegrid,
  .fg-gamegrid > :is(
    .kt-row-layout-inner,
    .kb-row-layout-wrap,
    .kadence-rowlayout-inner,
    .wp-block-group__inner-container,
    .is-layout-flow,
    .is-layout-constrained
  ){
    grid-template-columns:repeat(3, minmax(0,1fr));
  }
}

@media (max-width:990px){
  .fg-gamegrid,
  .fg-gamegrid > :is(
    .kt-row-layout-inner,
    .kb-row-layout-wrap,
    .kadence-rowlayout-inner,
    .wp-block-group__inner-container,
    .is-layout-flow,
    .is-layout-constrained
  ){
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
}

@media (max-width:640px){
  .fg-gamegrid,
  .fg-gamegrid > :is(
    .kt-row-layout-inner,
    .kb-row-layout-wrap,
    .kadence-rowlayout-inner,
    .wp-block-group__inner-container,
    .is-layout-flow,
    .is-layout-constrained
  ){
    grid-template-columns:1fr !important;
    gap:16px;
  }
}

.fg-gamecard{
  height:100%;
  background:var(--fg-games-bg);
  border:1px solid var(--fg-games-border);
  border-radius:var(--fg-games-radius);
  padding:var(--fg-games-pad);
  box-shadow:0 0 0 1px rgba(255,255,255,.02) inset;
  display:flex;
  flex-direction:column;
  gap:10px;
  color:var(--fg-games-strong);
  position:relative;
  isolation:isolate;
  transition:transform .15s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease;
}

.fg-gamecard::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:3px;
  border-radius:var(--fg-games-radius) var(--fg-games-radius) 0 0;
  background:var(--fg-accent, var(--fg-games-accent));
}

.fg-gamecard:hover{
  transform:translateY(-2px);
  box-shadow:var(--fg-games-shadow);
  border-color:rgba(255,255,255,.18);
}

.fg-gamecard__title{
  margin:2px 0 2px;
  font-weight:800;
  font-size:clamp(18px, 1.05rem + .2vw, 22px);
  line-height:1.25;
}

.fg-gamecard__text{
  margin:0 0 2px;
  color:var(--fg-games-muted);
  line-height:1.5;
  font-size:15px;
}

.fg-gamecard__label{
  margin:4px 0 2px;
  font-weight:700;
  font-size:12px;
  letter-spacing:.5px;
  text-transform:uppercase;
  color:#c9d4e5;
}

.fg-gamecard__picks{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:8px 10px;
}

.fg-gamecard__picks li{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  background:var(--fg-games-chip-bg);
  border:1px solid var(--fg-games-chip-br);
  color:var(--fg-games-chip-fg);
  font-size:13px;
  line-height:1.1;
  white-space:nowrap;
}

.fg-gamecard .fg-gamecard__icon{
  width:36px;
  height:36px;
  border:2px solid rgba(205,213,227,.35);
  border-radius:10px;
  display:grid;
  place-items:center;
  color:#e6edf6;
  margin-bottom:4px;
}

.fg-gamecard.type-slots{
  --fg-accent:#a78bfa;
}
.fg-gamecard.type-crash{
  --fg-accent:#f59e0b;
}
.fg-gamecard.type-roulette{
  --fg-accent:#22c55e;
}
.fg-gamecard.type-poker{
  --fg-accent:#60a5fa;
}
.fg-gamecard.type-vpoker{
  --fg-accent:#2dd4bf;
}
.fg-gamecard.type-blackjack{
  --fg-accent:#06b6d4;
}
.fg-gamecard.type-baccarat{
  --fg-accent:#10b981;
}
.fg-gamecard.type-craps{
  --fg-accent:#ef4444;
}

@media (prefers-reduced-motion: reduce){
  .fg-gamecard{
    transition:none !important;
  }
}

/* ======================================================
 * Canada block: контраст в правой колонке (dark text on light bg)
 * ====================================================== */

.kadence-column8_017d40-ac .kt-inside-inner-col{
  color:#111827 !important;
}

.kadence-column8_017d40-ac h2,
.kadence-column8_017d40-ac p,
.kadence-column8_017d40-ac table,
.kadence-column8_017d40-ac th,
.kadence-column8_017d40-ac td,
.kadence-column8_017d40-ac figure.wp-block-table figcaption.wp-element-caption{
  color:#111827 !important;
}

/* ======================================================
 * Footer EN / DE language switch
 * ====================================================== */

/* По умолчанию везде прячем DE-версию */
.fg-footer-main--de{
  display:none;
}

/* Для html lang="de" / "de-DE" показываем немецкий footer */
html[lang^="de"] .fg-footer-main--en{
  display:none;
}
html[lang^="de"] .fg-footer-main--de{
  display:block;
}

/* =========================================
DE Home — Boni block (Row Layout)
Class: fg-de-bonuses
========================================= */


/* DE Home — Boni block (Kadence Row Layout) */
.entry-content > .wp-block-kadence-rowlayout.fg-de-bonuses{
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  width: 100vw !important;
  max-width: 100vw !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow-x: clip;
}

/* CARD — Kadence может вставить kb-row-layout-wrap */
.entry-content > .wp-block-kadence-rowlayout.fg-de-bonuses > :is(.kb-row-layout-wrap,.kt-row-layout-wrap) > .kt-row-layout-inner,
.entry-content > .wp-block-kadence-rowlayout.fg-de-bonuses > .kt-row-layout-inner,
.entry-content > .wp-block-kadence-rowlayout.fg-de-bonuses > .kadence-rowlayout-inner{
  box-sizing: border-box;
  width: min(100%, 1440px) !important;
  margin: 26px auto 34px !important;
  padding: clamp(18px, 3vw, 34px) !important;

  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(148,163,184,.14) !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.45) !important;
}

/* убираем внутренние паддинги колонок */
.entry-content > .wp-block-kadence-rowlayout.fg-de-bonuses .kt-inside-inner-col{
  padding: 0 !important;
}

/* узкая колонка текста */
.entry-content > .wp-block-kadence-rowlayout.fg-de-bonuses .fg-de-text-narrow{
  max-width: 780px;
  margin-inline: auto;
  width: 100%;
}

.entry-content > .wp-block-kadence-rowlayout.fg-de-bonuses h2{
  margin-top: 0;
}

/* =========================================================
   FG-DE — German pages base layout
   .fg-de-page — обёртка для всех DE-страниц (кроме ACF казино)
   ========================================================== */

.fg-de-page{
  width:min(100%, var(--global-content-width, 1440px));
  max-width:var(--global-content-width, 1440px);
  margin:0 auto 60px;
  padding:32px clamp(12px, 2vw, 20px) 48px;
  color:#e5e7f3;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

@media (min-width:960px){
  .fg-de-page{
    padding-inline:24px;
  }
}

/* Базовая типографика внутри DE-страниц */
.fg-de-page h1{
  font-size:clamp(28px, 2.6vw, 36px);
  margin:0 0 18px;
}

.fg-de-page h2{
  font-size:clamp(24px, 2.2vw, 32px);
  margin:32px 0 12px;
}

.fg-de-page h3{
  font-size:clamp(20px, 1.9vw, 26px);
  margin:24px 0 10px;
}

.fg-de-page p{
  font-size:clamp(16px, 1.6vw, 23px); /* около 23px на 1440 */
  line-height:1.7;
  margin:0 0 14px;
  color:#e5e7f3;
}

/* H3 внутри карточек — компактные отступы */
.fg-de-card-body h3{
  margin:8px 0 4px;
}

.fg-de-page ul,
.fg-de-page ol{
  margin:0 0 16px 1.2rem;
  padding:0;
  font-size:clamp(16px, 1.6vw, 23px);
  line-height:1.7;
}

.fg-de-page strong{
  color:#f9fafb;
}

/* Небольшое сужение «колонки текста» */
.fg-de-page .fg-de-text-narrow{
  max-width:780px;
}

/* =========================================================
   FG-DE — Pills / chips для немецких страниц
   ========================================================= */

.fg-de-chip,
.fg-trust-pill{ /* alias для старых блоков */
  display:inline-flex;
  align-items:center;
  padding:3px 12px 5px;
  border-radius:999px;
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-weight:600;
  border:1px solid rgba(148,163,184,0.7);
  background:radial-gradient(circle at 30% 0, rgba(248,250,252,0.22), rgba(15,23,42,0.95));
  box-shadow:
    0 0 0 1px rgba(15,23,42,0.9),
    0 0 16px rgba(148,163,184,0.45);
  color:#e5e7f3;
  white-space:nowrap;
}

/* Цветовые модификаторы */
.fg-de-chip--green,
.fg-pill-green{
  border-color:rgba(74,222,128,0.8);
  box-shadow:
    0 0 0 1px rgba(15,23,42,0.9),
    0 0 20px rgba(74,222,128,0.6);
}

.fg-de-chip--blue,
.fg-pill-blue{
  border-color:rgba(56,189,248,0.8);
  box-shadow:
    0 0 0 1px rgba(15,23,42,0.9),
    0 0 20px rgba(56,189,248,0.6);
}

.fg-de-chip--purple,
.fg-pill-purple{
  border-color:rgba(196,181,253,0.9);
  box-shadow:
    0 0 0 1px rgba(15,23,42,0.9),
    0 0 20px rgba(196,181,253,0.7);
}

.fg-de-chip--orange,
.fg-pill-orange{
  border-color:rgba(251,146,60,0.9);
  box-shadow:
    0 0 0 1px rgba(15,23,42,0.9),
    0 0 20px rgba(251,146,60,0.75);
}

/* =========================================================
   FG-DE — Cards: иконка слева, текст справа
   ========================================================= */

.fg-de-card-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:20px 24px;
  margin:18px 0 8px;
}

@media (max-width:768px){
  .fg-de-card-grid{
    grid-template-columns:1fr;
  }
}

.fg-de-card{
  display:flex;
  gap:14px;
  align-items:flex-start;
  padding:14px 14px 16px;
  border-radius:18px;
  background:radial-gradient(circle at top left, #111827 0, #020617 60%, #020617 100%);
  border:1px solid rgba(51,65,85,0.9);
  box-shadow:0 16px 36px rgba(15,23,42,0.85);
}

/* Иконка/картинка слева */
.fg-de-card-icon{
  flex:0 0 42px;
  width:42px;
  height:42px;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:radial-gradient(circle at 30% 20%, #38bdf8, #0f172a 70%);
  box-shadow:
    0 0 0 1px rgba(148,163,184,0.4),
    0 0 24px rgba(56,189,248,0.5);
  overflow:hidden;
}

.fg-de-card-icon img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.fg-de-card-icon-emoji{
  font-size:22px;
}

/* Текстовая часть */
.fg-de-card-body p{
  margin:8px 0 0;
  font-size:18px;
  line-height:1.7;
  color:#e5e7f3;
}

/* =========================================================
   FG-DE — "Wie wir Online-Casinos in Deutschland testen"
   Светлые карточки (fg-de-test-grid)
   ========================================================= */

.fg-de-test-grid .fg-de-card{
  background:radial-gradient(circle at top left, #f9fafb 0, #e5e7eb 40%, #cbd5e1 100%);
  border-color:rgba(148,163,184,.85);
  box-shadow:0 18px 40px rgba(15,23,42,.55);
  color:#0f172a;
}

.fg-de-test-grid .fg-de-card-body h3{
  color:#0f172a;
}

.fg-de-test-grid .fg-de-card-body p{
  font-size:18px;
  line-height:1.7;
  color:#111827;
}

/* Пилюли внутри test-grid – светлые */
.fg-de-test-grid .fg-de-chip{
  background:radial-gradient(circle at 30% 0, #e0f2fe 0, #f8fafc 70%);
  color:#0f172a;
  border-color:rgba(148,163,184,.9);
  box-shadow:
    0 0 0 1px rgba(148,163,184,.45),
    0 0 18px rgba(148,163,184,.55);
}

/* Светящийся кружок под эмодзи/картинку */
.fg-de-test-grid .fg-de-card-icon{
  background:radial-gradient(circle at 30% 20%, #38bdf8 0, #1e293b 70%);
  box-shadow:
    0 0 0 1px rgba(148,163,184,.5),
    0 0 20px rgba(59,130,246,.75);
  color:#e5f2ff;
}

/* =========================================================
   FG-DE — Player-type picks (Beste Online-Casinos nach Spielertyp)
   ========================================================= */

.fg-de-player-grid{
  margin:18px 0 8px;
}

/* Более тёмные, «неоновые» карточки */
.fg-de-player-grid .fg-de-card{
  background:radial-gradient(circle at top left, #020617 0, #0b1120 45%, #020617 100%);
  border-color:rgba(129,140,248,0.85);
  box-shadow:0 20px 44px rgba(15,23,42,0.95);
  color:#e5e7f3;
}

.fg-de-player-grid .fg-de-card-body h3{
  font-size:20px;
  margin:6px 0 4px;
}

.fg-de-player-grid .fg-de-chip{
  background:radial-gradient(circle at 30% 0, #020617 0, #020617 60%, #020617 100%);
  color:#e5e7f3;
  border-color:rgba(148,163,184,0.9);
}

/* Светящиеся кружки под эмодзи — разные цвета по карточкам */
.fg-de-player-grid .fg-de-card-icon{
  background:radial-gradient(circle at 30% 20%, #6366f1 0, #020617 70%);
  box-shadow:
    0 0 0 1px rgba(129,140,248,0.7),
    0 0 22px rgba(129,140,248,0.85);
  color:#e5f2ff;
}

.fg-de-player-grid .fg-de-card:nth-child(2) .fg-de-card-icon{
  background:radial-gradient(circle at 30% 20%, #22c55e 0, #020617 70%);
  box-shadow:
    0 0 0 1px rgba(74,222,128,0.7),
    0 0 22px rgba(74,222,128,0.85);
}

.fg-de-player-grid .fg-de-card:nth-child(3) .fg-de-card-icon{
  background:radial-gradient(circle at 30% 20%, #38bdf8 0, #020617 70%);
  box-shadow:
    0 0 0 1px rgba(56,189,248,0.7),
    0 0 22px rgba(56,189,248,0.85);
}

.fg-de-player-grid .fg-de-card:nth-child(4) .fg-de-card-icon{
  background:radial-gradient(circle at 30% 20%, #f97316 0, #020617 70%);
  box-shadow:
    0 0 0 1px rgba(249,115,22,0.7),
    0 0 22px rgba(249,115,22,0.9);
}

.fg-de-player-grid .fg-de-card:nth-child(5) .fg-de-card-icon{
  background:radial-gradient(circle at 30% 20%, #eab308 0, #020617 70%);
  box-shadow:
    0 0 0 1px rgba(234,179,8,0.7),
    0 0 22px rgba(234,179,8,0.9);
}

.fg-de-player-grid .fg-de-card:nth-child(6) .fg-de-card-icon{
  background:radial-gradient(circle at 30% 20%, #14b8a6 0, #020617 70%);
  box-shadow:
    0 0 0 1px rgba(45,212,191,0.7),
    0 0 22px rgba(45,212,191,0.9);
}

/* =========================================================
   FG-DE — Крупнее текст в таблицах / служебных блоках
   ========================================================= */

/* Таблицы на немецких страницах */
.fg-de-page table,
.fg-de-page .wp-block-table table{
  font-size:18px;
}

.fg-de-page table td,
.fg-de-page table th,
.fg-de-page .wp-block-table td,
.fg-de-page .wp-block-table th{
  font-size:18px;
  line-height:1.6;
}

/* =========================================================
   FG-DE — Player-type list: fg-de-spotlist (таймлайн)
   ========================================================= */

ul.fg-de-spotlist{
  box-sizing:border-box;
  width:min(100%, var(--global-content-width, 1440px));
  max-width:var(--global-content-width, 1440px);
  margin:18px auto 32px;
  padding:0 clamp(12px, 2vw, 20px);
  padding-left:18px; /* отступ от вертикальной линии */
  list-style:none;
  border-left:2px solid rgba(148,163,184,.45); /* вертикальная линия слева */
}

ul.fg-de-spotlist > li{
  position:relative;
  padding:10px 14px 12px;
  margin-bottom:14px;
  border-radius:12px;
  background:rgba(15,23,42,.92);
  border:1px solid rgba(30,64,175,.65);
  box-shadow:0 10px 26px rgba(15,23,42,.9);
  color:#e5e7f3;
  font-size:15px;
  line-height:1.6;
}

/* отключаем маркеры на всякий случай */
ul.fg-de-spotlist > li::marker{
  content:none;
}

/* Точка на линии */
ul.fg-de-spotlist > li::before{
  content:"";
  position:absolute;
  left:-20px;
  top:16px;
  width:12px;
  height:12px;
  border-radius:999px;
  background:#38bdf8;
  box-shadow:
    0 0 0 3px rgba(56,189,248,.5),
    0 0 16px rgba(56,189,248,.7);
}

/* Маленький label внутри пункта */
ul.fg-de-spotlist > li .fg-de-spot-label{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:#bfdbfe;
  margin-right:4px;
}

/* Название казино (strong) */
ul.fg-de-spotlist > li strong{
  font-size:16px;
  font-weight:800;
  margin-right:2px;
}

@media (max-width:640px){
  ul.fg-de-spotlist{
    padding-inline:12px;
    padding-left:14px;
  }
}

/* =========================================================
   FG-DE — Figure-block: картинка + описание
   ========================================================= */

.fg-de-figure{
  display:flex;
  flex-wrap:wrap;
  gap:16px 20px;
  align-items:flex-start;
  margin:24px 0;
}

.fg-de-figure-img{
  flex:0 0 260px;
  max-width:100%;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(148,163,184,0.5);
  box-shadow:0 18px 32px rgba(15,23,42,0.85);
}

.fg-de-figure-img img{
  display:block;
  width:100%;
  height:auto;
}

.fg-de-figure-body{
  flex:1 1 260px;
  min-width:0;
  font-size:14px;
  line-height:1.7;
}

.fg-de-figure-body h3{
  margin-top:0;
  margin-bottom:8px;
  font-size:18px;
}

/* =========================================================
   FG-DE — Hinweis / Tipp блоки
   ========================================================= */

.fg-de-note{
  margin:18px 0;
  padding:10px 14px 11px;
  border-radius:14px;
  font-size:14px;
  line-height:1.6;
  background:rgba(15,23,42,0.9);
  border:1px solid rgba(148,163,184,0.65);
}

.fg-de-note--tip{
  border-color:rgba(74,222,128,0.7);
  box-shadow:0 0 20px rgba(74,222,128,0.3);
}

.fg-de-note--warning{
  border-color:rgba(251,146,60,0.85);
  box-shadow:0 0 20px rgba(251,146,60,0.35);
}

/* ======================================================
 * RTP calculator (fg-rtp-calc)
 * ====================================================== */

.fg-rtp-calc{
  max-width:480px;
  margin:32px auto;
  padding:20px 22px;
  border-radius:14px;
  background:#111623;
  border:1px solid rgba(255,255,255,0.04);
}

.fg-rtp-calc h2{
  margin-top:0;
  margin-bottom:16px;
  font-size:20px;
}

.fg-rtp-grid{
  display:grid;
  gap:14px;
}

.fg-rtp-grid label{
  display:flex;
  flex-direction:column;
  font-size:14px;
  gap:4px;
}

.fg-rtp-grid input[type="number"]{
  padding:8px 10px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,0.12);
  background:#050814;
  color:#fff;
}

.fg-rtp-grid button#fg-rtp-run{
  margin-top:4px;
  padding:10px 14px;
  border-radius:999px;
  border:none;
  cursor:pointer;
  font-size:14px;
}

.fg-rtp-result{
  margin-top:16px;
  font-size:14px;
}

.fg-rtp-result p{
  margin:4px 0;
}

.fg-rtp-note{
  margin-top:10px;
  font-size:12px;
  opacity:0.75;
}

/* =====================================================================
   FG — Таблетка "On this page" (TOC) — v4 (2025-12-21)
   RU: Замена v3. Оставь ТОЛЬКО этот блок для таблетки TOC.
       Старые версии .fg-pill / .fg-toc удали, иначе будут конфликты.
   EN: Replace v3. Keep ONLY this block for the TOC pill.
       Remove older .fg-pill/.fg-toc blocks to avoid conflicts.
===================================================================== */

/* -----------------------------
   1) НАСТРОЙКИ (крути здесь)
   ----------------------------- */
:root{
  /* RU: высота липкого хедера (fallback). Если Kadence отдаёт переменную высоты —
         мы её используем ниже автоматически.
     EN: sticky header height fallback. If Kadence exposes a header height var —
         we’ll use it automatically below. */
  --fg-toc-top-desktop: 60px;
  --fg-toc-top-mobile:  64px;

  /* RU: ширина как у контента
     EN: same max width as content */
  --fg-toc-max: var(--global-content-width, 1440px);

  /* RU: боковые поля
     EN: side gutters */
  --fg-toc-gutter: clamp(12px, 2vw, 20px);

  /* RU: расстояние между таблеткой и панелью
     EN: gap between pill and dropdown panel */
  --fg-toc-panel-gap: 10px;

  /* RU: толщина таблетки (СДЕЛАЛ ЧУТЬ ТОНЬШЕ)
     EN: pill thickness (slightly thinner) */
  --fg-toc-pill-pad-y: 5px;
  --fg-toc-pill-pad-x: 12px;

  /* RU: шрифт в таблетке
     EN: pill font size */
  --fg-toc-pill-font: 13px;

  /* RU: стекло таблетки (СДЕЛАЛ ПРОЗРАЧНЕЕ)
     EN: pill glass (more transparent) */
  --fg-toc-pill-bg-a: .16;
  --fg-toc-pill-border-a: .10;
  --fg-toc-pill-blur: 14px;

  /* RU: стекло выпадающей панели (СДЕЛАЛ ПРОЗРАЧНЕЕ)
     EN: panel glass (more transparent) */
  --fg-toc-panel-bg: rgba(16, 20, 32, .78);
  --fg-toc-panel-border: rgba(255,255,255,.09);
  --fg-toc-panel-radius: 18px;
  --fg-toc-panel-blur: 16px;
  --fg-toc-panel-shadow: 0 18px 44px rgba(0,0,0,.30);

  /* RU/EN: цвет текста */
  --fg-toc-text: rgba(255,255,255,.92);

  /* RU/EN: “чипы” ссылок */
  --fg-toc-item-bg: rgba(255,255,255,.05);
  --fg-toc-item-bg-hover: rgba(255,255,255,.08);
  --fg-toc-item-border: rgba(255,255,255,.10);
  
    /* RU: Поднять/опустить таблетку. Минус = выше.
     EN: Move the pill up/down. Negative = higher. */
  --fg-toc-top-nudge-desktop: -10px;
  --fg-toc-top-nudge-mobile:  0px;

}

/* RU: выбираем top под desktop/mobile
   EN: pick top for desktop/mobile */
:root{ --fg-toc-top: var(--fg-toc-top-desktop); }
@media (max-width: 920px){
  :root{ --fg-toc-top: var(--fg-toc-top-mobile); }
}

/* RU: выбираем nudge под desktop/mobile
   EN: pick nudge for desktop/mobile */
:root{ --fg-toc-top-nudge: var(--fg-toc-top-nudge-desktop); }
@media (max-width: 920px){
  :root{ --fg-toc-top-nudge: var(--fg-toc-top-nudge-mobile); }
}


/* -----------------------------
   2) ВАЖНО: чтобы дропдаун не обрезался родителями
   ----------------------------- */
.fg-toc-row,
.fg-toc-row .kt-row-layout,
.fg-toc-row .kt-row-column-wrap,
.fg-toc-row .kt-inside-inner-col{
  overflow: visible !important;
}

/* -----------------------------
   3) DETAILS = липкий якорь
   ----------------------------- */
.entry-content details.wp-block-details.fg-pill,
.entry-content .wp-block-details.fg-pill{
  position: sticky;
  z-index: 60;

  /* RU: Авто-высота хедера, если Kadence даёт переменные, иначе fallback на --fg-toc-top
     EN: Auto header height if Kadence vars exist, otherwise fallback */
  top: calc(
  var(--global-kb-header-height, var(--kb-header-height, var(--fg-toc-top)))
  + var(--wp-admin--admin-bar--height, 0px)
  + var(--fg-toc-top-nudge, 0px)
);


  width: min(
    calc(100% - (var(--fg-toc-gutter) + var(--fg-toc-gutter))),
    var(--fg-toc-max)
  );
  margin-left: auto !important;
  margin-right: auto !important;

  text-align: left !important;

  margin-top: 0 !important;
  margin-bottom: 14px !important;

  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* -----------------------------
   4) SUMMARY = таблетка
   ----------------------------- */
.entry-content details.wp-block-details.fg-pill > summary,
.entry-content .wp-block-details.fg-pill > summary{
  display: inline-flex !important;
  width: fit-content;
  max-width: 100%;

  align-items: center;
  justify-content: flex-start;
  gap: 8px;

  padding: var(--fg-toc-pill-pad-y) var(--fg-toc-pill-pad-x);
  border-radius: 999px;

  background: rgba(16, 20, 32, var(--fg-toc-pill-bg-a));
  border: 1px solid rgba(255,255,255, var(--fg-toc-pill-border-a));

  backdrop-filter: blur(var(--fg-toc-pill-blur));
  -webkit-backdrop-filter: blur(var(--fg-toc-pill-blur));

  color: var(--fg-toc-text);
  font-size: var(--fg-toc-pill-font);
  font-weight: 600;
  line-height: 1.1;

  cursor: pointer;
  user-select: none;

  box-shadow: 0 10px 22px rgba(0,0,0,.28);

  white-space: nowrap;
}

/* RU/EN: доступный фокус */
.entry-content details.wp-block-details.fg-pill > summary:focus-visible,
.entry-content .wp-block-details.fg-pill > summary:focus-visible{
  outline: 2px solid rgba(122,162,255,.85);
  outline-offset: 3px;
}

/* RU: убираем стандартный маркер details
   EN: remove default details marker */
.entry-content details.wp-block-details.fg-pill > summary::marker,
.entry-content .wp-block-details.fg-pill > summary::marker,
.entry-content details.wp-block-details.fg-pill > summary::-webkit-details-marker,
.entry-content .wp-block-details.fg-pill > summary::-webkit-details-marker{
  display: none !important;
}

/* RU: стрелка
   EN: chevron */
.entry-content details.wp-block-details.fg-pill > summary::after,
.entry-content .wp-block-details.fg-pill > summary::after{
  content: "▾";
  opacity: .80;
  transform: translateY(-1px);
  transition: transform .18s ease, opacity .18s ease;
}

/* RU: стрелка вверх, когда открыто
   EN: rotate when open */
.entry-content details.wp-block-details.fg-pill[open] > summary::after,
.entry-content .wp-block-details.fg-pill[open] > summary::after{
  transform: rotate(180deg) translateY(1px);
  opacity: .95;
}

/* -----------------------------
   5) Панель TOC (fg-toc) — поверх контента
   ----------------------------- */
.entry-content details.wp-block-details.fg-pill .fg-toc,
.entry-content .wp-block-details.fg-pill .fg-toc{
  display: none;
}

.entry-content details.wp-block-details.fg-pill[open] .fg-toc,
.entry-content .wp-block-details.fg-pill[open] .fg-toc{
  display: block;

  position: absolute;
  left: 0;
  top: calc(100% + var(--fg-toc-panel-gap));
  width: 100%;
  z-index: 70;
}

/* RU: стекло для обёртки UAGB/Spectra
   EN: glass wrapper for UAGB/Spectra */
.entry-content details.wp-block-details.fg-pill[open] .fg-toc :is(.uagb-table-of-contents__wrap, .uagb-toc__wrap),
.entry-content .wp-block-details.fg-pill[open] .fg-toc :is(.uagb-table-of-contents__wrap, .uagb-toc__wrap){
  background: var(--fg-toc-panel-bg) !important;
  border: 1px solid var(--fg-toc-panel-border) !important;
  border-radius: var(--fg-toc-panel-radius) !important;
  box-shadow: var(--fg-toc-panel-shadow) !important;

  backdrop-filter: blur(var(--fg-toc-panel-blur));
  -webkit-backdrop-filter: blur(var(--fg-toc-panel-blur));

  padding: 14px !important;
  color: var(--fg-toc-text) !important;

  max-height: min(60vh, 520px);
  overflow: auto;
}

/* ✅ RU: УБИРАЕМ “Table Of Contents”
   ✅ EN: HIDE “Table Of Contents” title */
.fg-toc :is(
  .uagb-table-of-contents__title,
  .uagb-toc__title,
  .uagb-toc__heading,
  .uagb-toc__title-wrap
){
  display: none !important;
}

/* -----------------------------
   6) Чипы-ссылки
   ----------------------------- */
.fg-toc :is(.uagb-table-of-contents__list-number, .uagb-toc__list-number){
  display: none !important;
}

.fg-toc :is(.uagb-table-of-contents__list, .uagb-toc__list, ul, ol){
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;

  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.fg-toc :is(li){
  margin: 0 !important;
  padding: 0 !important;
}

/* RU: ссылка-чип (одна строка + троеточие)
   EN: chip link (single line + ellipsis) */
.fg-toc a{
  display: inline-flex !important;
  align-items: center;
  gap: 8px;

  padding: 8px 10px;
  border-radius: 12px;

  background: var(--fg-toc-item-bg);
  border: 1px solid var(--fg-toc-item-border);

  color: var(--fg-toc-text) !important;
  text-decoration: none !important;

  word-break: normal !important;
  overflow-wrap: normal !important;

  white-space: normal !important;
  overflow-wrap: anywhere;
  max-width: 100% !important;
}

.fg-toc a:hover{
  background: var(--fg-toc-item-bg-hover);
}

/* RU: мобильная подгонка (чтобы “влезало” легче)
   EN: mobile tighten */
@media (max-width: 520px){
  .fg-toc :is(.uagb-table-of-contents__list, .uagb-toc__list, ul, ol){
    gap: 8px;
  }
  .fg-toc a{
    padding: 7px 9px;
    border-radius: 11px;
    max-width: 100%;
  }
}

/* RU: чтобы якоря (H2/H3/H4) не прятались под липким хедером
   EN: prevent anchors from hiding under sticky header */
.entry-content :is(h2,h3,h4)[id]{
  scroll-margin-top: calc(
    var(--global-kb-header-height, var(--kb-header-height, var(--fg-toc-top)))
    + 18px
  );
}

/* =====================================================
   FG TOC pill — mobile: let item titles fit
   RU: На мобилке пункты в 2 строки + …
   EN: Mobile TOC items: 2-line clamp + ellipsis
   ===================================================== */
@media (max-width: 920px){

  /* RU: пункты-чипы — 2 строки
     EN: chip items — 2 lines */
  .fg-toc a{
    display: -webkit-box !important;       /* перебиваем inline-flex !important */
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;

    white-space: normal !important;
    max-width: 100% !important;

    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: anywhere;
    line-height: 1.25;
  }
}


/* === FIX: flag alignment desktop === */
@media (min-width: 1025px) {
  .fg-langflags--header {
    position: relative;
    right: auto !important;
    margin-left: 8px !important;
  }
  .site-header .header-navigation-inner {
    justify-content: flex-end;
  }
}



/* FG — shrink mobile wordmark so ".io" fits */
@media (max-width: 1024px) {
  body .fg-mh-logo {
    padding-right: 52px !important; /* was 64px */
  }

  body .fg-mh-logo .fg-wordmark,
  body .fg-mh-logo .fg-wordmark__for,
  body .fg-mh-logo .fg-wordmark__io {
    font-size: 14px !important;     /* was 15px */
    letter-spacing: 0 !important;   /* was 0.02em */
    line-height: 1.1 !important;
    white-space: nowrap !important;
  }

  body .fg-mh-logo .fg-wordmark__io {
    font-size: 0.92em !important;   /* make ".io" a bit smaller */
  }
}

@media (max-width: 380px) {
  body .fg-mh-logo .fg-wordmark,
  body .fg-mh-logo .fg-wordmark__for,
  body .fg-mh-logo .fg-wordmark__io {
    font-size: 13px !important;
  }
}

/* ==========================
   Portal (root /) styles were moved to /assets/css/fg-portal-global.css
   ========================== */


/* =====================================================
   Complianz — extra compact mobile banner
   Smaller cookie banner on phones without disabling it
   ===================================================== */
@media (max-width: 767px) {
  #cmplz-cookiebanner-container .cmplz-cookiebanner {
    width: calc(100vw - 12px) !important;
    max-width: calc(100vw - 12px) !important;
    right: 6px !important;
    left: 6px !important;
    bottom: 6px !important;
    padding: 10px !important;
    border-radius: 12px !important;
    box-sizing: border-box !important;
    max-height: 36vh !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
  }

  #cmplz-cookiebanner-container .cmplz-header {
    padding-bottom: 4px !important;
    min-height: 0 !important;
  }

  #cmplz-cookiebanner-container .cmplz-logo,
  #cmplz-cookiebanner-container .cmplz-links.cmplz-information,
  #cmplz-cookiebanner-container .cmplz-documents {
    display: none !important;
  }

  #cmplz-cookiebanner-container .cmplz-title {
    font-size: 14px !important;
    line-height: 1.2 !important;
    margin: 0 !important;
  }

  #cmplz-cookiebanner-container .cmplz-close {
    width: 24px !important;
    height: 24px !important;
  }

  #cmplz-cookiebanner-container .cmplz-body {
    padding-top: 0 !important;
  }

  #cmplz-cookiebanner-container .cmplz-message,
  #cmplz-cookiebanner-container .cmplz-description,
  #cmplz-cookiebanner-container .cmplz-category-title,
  #cmplz-cookiebanner-container .cmplz-link,
  #cmplz-cookiebanner-container .cmplz-btn,
  #cmplz-cookiebanner-container .cmplz-label,
  #cmplz-cookiebanner-container .cmplz-always-active {
    font-size: 11px !important;
    line-height: 1.3 !important;
  }

  #cmplz-cookiebanner-container .cmplz-message {
    margin-bottom: 6px !important;
  }

  #cmplz-cookiebanner-container .cmplz-categories {
    margin-top: 4px !important;
  }

  #cmplz-cookiebanner-container .cmplz-category {
    margin-bottom: 2px !important;
  }

  #cmplz-cookiebanner-container .cmplz-category-header {
    padding: 4px 0 !important;
  }

  #cmplz-cookiebanner-container .cmplz-description {
    padding-top: 2px !important;
  }

  #cmplz-cookiebanner-container .cmplz-buttons {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 6px !important;
    margin-top: 8px !important;
  }

  #cmplz-cookiebanner-container .cmplz-btn,
  #cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn {
    min-height: 34px !important;
    padding: 7px 8px !important;
    margin: 0 !important;
    width: 100% !important;
    justify-content: center !important;
    border-radius: 10px !important;
  }

  #cmplz-cookiebanner-container .cmplz-divider {
    margin: 6px 0 !important;
  }
}

@media (max-width: 380px) {
  #cmplz-cookiebanner-container .cmplz-cookiebanner {
    width: calc(100vw - 10px) !important;
    max-width: calc(100vw - 10px) !important;
    right: 5px !important;
    left: 5px !important;
    bottom: 5px !important;
    padding: 9px !important;
    max-height: 34vh !important;
  }

  #cmplz-cookiebanner-container .cmplz-title {
    font-size: 13px !important;
  }

  #cmplz-cookiebanner-container .cmplz-message,
  #cmplz-cookiebanner-container .cmplz-description,
  #cmplz-cookiebanner-container .cmplz-category-title,
  #cmplz-cookiebanner-container .cmplz-link,
  #cmplz-cookiebanner-container .cmplz-btn,
  #cmplz-cookiebanner-container .cmplz-label,
  #cmplz-cookiebanner-container .cmplz-always-active {
    font-size: 10px !important;
  }

  #cmplz-cookiebanner-container .cmplz-btn,
  #cmplz-cookiebanner-container .cmplz-buttons .cmplz-btn {
    min-height: 32px !important;
    padding: 6px 7px !important;
  }
}