/* =========================================================================
   card-rail — геро, табло, плитки, сетки логотипов, карточка бренда,
   рельс, таблицы донора в нашем листе, оглавление, FAQ, кнопки
   casinoblox.co.nz
   ========================================================================= */

/* --- [cbx:btn] ---------------------------------------------------------- */
.cbx-btn{
  display:inline-grid; grid-auto-flow:column; align-items:center; gap:8px;
  min-height:44px; padding:0 20px; border-radius:6px; border:0;
  background:var(--cbx-rose); color:var(--cbx-chalk) !important;
  font:700 15px/1 var(--cbx-head); letter-spacing:.2px; text-decoration:none;
  cursor:pointer;
}
.cbx-btn:hover{ background:var(--cbx-rose-deep); color:var(--cbx-chalk) !important; }
.cbx-btn--ghost{
  background:transparent; color:var(--cbx-chalk) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.34);
}
.cbx-btn--ghost:hover{ background:rgba(255,255,255,.08); }
.cbx-btn--sm{ min-height:38px; padding:0 14px; font-size:14px; }
.cbx-btn--ink{ background:var(--cbx-royal); }
.cbx-btn--ink:hover{ background:var(--cbx-royal-deep); }

/* --- [cbx:hero] --------------------------------------------------------- */
.cbx-hero{ background:var(--cbx-felt); color:var(--cbx-chalk); padding:40px 0 46px; }
.cbx-hero__lane{
  width:100%; max-width:var(--cbx-lane); margin:0 auto; padding:0 var(--cbx-step);
  display:grid; grid-template-columns:1.08fr .92fr; gap:38px; align-items:center;
}
@media (max-width:900px){ .cbx-hero__lane{ grid-template-columns:1fr; gap:24px; } .cbx-hero{ padding:26px 0 30px; } }
.cbx-hero h1{ color:var(--cbx-chalk); font-size:42px; margin:0 0 14px; max-width:15ch; }
@media (max-width:640px){ .cbx-hero h1{ font-size:30px; } }
.cbx-hero__lead{ color:#b9c0cb; font-size:18px; line-height:1.6; margin:0 0 20px; max-width:52ch; }
.cbx-hero__acts{ display:grid; grid-auto-flow:column; justify-content:start; gap:12px; }
@media (max-width:420px){ .cbx-hero__acts{ grid-auto-flow:row; } }
.cbx-hero__shot{ position:relative; }
.cbx-hero__shot img{ display:block; width:100%; border-radius:14px; }
.cbx-hero__stamp{
  position:absolute; left:-14px; bottom:18px;
  display:grid; grid-template-columns:auto auto; align-items:center; gap:10px;
  background:var(--cbx-chalk); color:var(--cbx-felt);
  padding:10px 14px; border-radius:10px; box-shadow:0 14px 30px rgba(0,0,0,.35);
}
.cbx-hero__stamp b{ font:700 22px/1 var(--cbx-head); font-variant-numeric:tabular-nums; }
.cbx-hero__stamp span{ font-size:12px; color:var(--cbx-fog); line-height:1.3; display:block; max-width:11ch; }
@media (max-width:900px){ .cbx-hero__stamp{ left:10px; } }

/* --- [cbx:board] табло -------------------------------------------------- */
.cbx-board{ background:var(--cbx-band); border-bottom:1px solid var(--cbx-rule); }
.cbx-board__lane{
  width:100%; max-width:var(--cbx-lane); margin:0 auto; padding:22px var(--cbx-step);
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--cbx-rule);
}
.cbx-board__lane > *{ background:var(--cbx-band); padding:6px 16px; }
@media (max-width:760px){ .cbx-board__lane{ grid-template-columns:1fr 1fr; gap:1px; } }
.cbx-cell b{ display:block; font:700 30px/1.1 var(--cbx-head); font-variant-numeric:tabular-nums; color:var(--cbx-felt); }
.cbx-cell span{ display:block; margin-top:5px; font-size:13px; color:var(--cbx-fog); }
.cbx-cell svg{ width:20px; height:20px; stroke:var(--cbx-royal); fill:none; stroke-width:1.75; margin-bottom:6px; }

/* --- [cbx:sect] секции на холсте --------------------------------------- */
.cbx-sect{ padding:var(--cbx-air) 0; }
.cbx-sect--paper{ background:var(--cbx-chalk); }
.cbx-sect--band{ background:var(--cbx-band); }
.cbx-sect__lane{ width:100%; max-width:var(--cbx-lane); margin:0 auto; padding:0 var(--cbx-step); }
.cbx-sect__head{
  display:grid; grid-template-columns:auto 1fr auto; align-items:baseline; gap:14px;
  margin:0 0 20px; padding-bottom:12px; border-bottom:1px solid var(--cbx-rule);
}
.cbx-sect--dark .cbx-sect__head{ border-bottom-color:#2b333f; }
.cbx-sect__head h2{ margin:0; font-size:25px; }
.cbx-sect--dark .cbx-sect__head h2{ color:var(--cbx-chalk); }
.cbx-sect__head svg{ width:22px; height:22px; stroke:var(--cbx-rose); fill:none; stroke-width:1.75; }
.cbx-sect__more{ font-size:14px; font-weight:600; text-decoration:none; white-space:nowrap; }
.cbx-sect--dark .cbx-sect__more{ color:#b9c0cb; }
.cbx-sect__note{ margin:0 0 18px; color:var(--cbx-fog); font-size:15px; max-width:70ch; }
.cbx-sect--dark .cbx-sect__note{ color:#8d96a3; }

/* --- [cbx:tiles] плитки разделов --------------------------------------- */
.cbx-tiles{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
@media (max-width:860px){ .cbx-tiles{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .cbx-tiles{ grid-template-columns:1fr; } }
.cbx-tile{
  display:grid; grid-template-rows:auto auto 1fr auto; gap:6px;
  padding:18px 18px 16px; text-decoration:none;
  background:var(--cbx-chalk); border:1px solid var(--cbx-rule); border-radius:10px;
}
.cbx-tile:hover{ border-color:var(--cbx-royal); box-shadow:0 10px 24px rgba(59,42,151,.12); }
.cbx-tile svg{ width:26px; height:26px; stroke:var(--cbx-royal); fill:none; stroke-width:1.75; }
.cbx-tile strong{ font:700 18px/1.3 var(--cbx-head); color:var(--cbx-felt); }
.cbx-tile span{ font-size:14px; color:var(--cbx-fog); line-height:1.55; }
.cbx-tile em{ font-style:normal; font-size:13px; font-weight:700; color:var(--cbx-rose); }

/* --- [cbx:pay] [cbx:soft] сетки логотипов со счётчиками ---------------- */
.cbx-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:12px; }
@media (max-width:860px){ .cbx-grid{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:520px){ .cbx-grid{ grid-template-columns:repeat(3,1fr); } }
.cbx-chip{
  display:grid; grid-template-rows:52px auto auto; align-content:start; gap:4px;
  padding:12px 8px 14px; text-align:center; text-decoration:none; overflow:hidden;
  background:var(--cbx-chalk); border:1px solid var(--cbx-rule); border-radius:9px;
}
.cbx-chip:hover{ border-color:var(--cbx-rose); }
.cbx-chip__pad{ display:grid; place-items:center; background:#fff; border-radius:6px; overflow:hidden; }
.cbx-chip__pad svg{ width:26px; height:26px; color:var(--cbx-royal); }
.cbx-chip__pad img{ max-height:34px; max-width:82%; width:auto; display:block; }
.cbx-chip b{ font:600 14px/1.25 var(--cbx-head); color:var(--cbx-felt); overflow-wrap:anywhere; }
.cbx-chip span{ font-size:12px; color:var(--cbx-fog); font-variant-numeric:tabular-nums; }

/* --- [cbx:index] индекс обзоров на /casino/ -----------------------------
   Плитка `cbx-chip` там несла логотип, имя и слово «review», а строку бонуса
   каждого бренда — донорская сетка ниже (третья витрина на странице). Блоки
   слиты в одну строку индекса: знак, имя, бонус, «review». Кнопок `/go/` в
   индексе нет — витрина с кнопками на странице ОДНА (08.0я). */
.cbx-idx{ display:grid; grid-template-columns:1fr 1fr; gap:10px 18px; }
@media (max-width:980px){ .cbx-idx{ grid-template-columns:minmax(0,1fr); } }
.cbx-idx__row{
  display:grid; grid-template-columns:46px minmax(76px,.85fr) minmax(0,1.25fr) auto;
  align-items:center; gap:12px; padding:9px 13px; text-decoration:none;
  background:var(--cbx-chalk); border:1px solid var(--cbx-rule); border-radius:9px;
}
.cbx-idx__row:hover{ border-color:var(--cbx-rose); }
.cbx-idx__pad{ display:grid; place-items:center; height:34px; background:#fff;
  border-radius:6px; overflow:hidden; }
.cbx-idx__pad img{ max-height:28px; max-width:88%; width:auto; display:block; }
.cbx-idx__pad svg{ width:22px; height:22px; color:var(--cbx-royal); }
.cbx-idx__name{ font:600 14.5px/1.25 var(--cbx-head); color:var(--cbx-felt); overflow-wrap:anywhere; }
.cbx-idx__bonus{ font-size:13px; line-height:1.4; color:var(--cbx-fog); overflow-wrap:anywhere; }
.cbx-idx__bonus b{ color:var(--cbx-felt); font-weight:700; font-variant-numeric:tabular-nums; }
.cbx-idx__go{ font-size:12px; font-weight:600; color:var(--cbx-royal); white-space:nowrap; }
.cbx-idx__row:hover .cbx-idx__go{ color:var(--cbx-rose); }
@media (max-width:760px){
  /* три строки на карточку — высоко: имя и «review» в одну строку, бонус под ними */
  .cbx-idx__row{ grid-template-columns:40px minmax(0,1fr) auto; gap:3px 10px; padding:10px 12px; }
  .cbx-idx__pad{ grid-column:1; grid-row:1 / span 2; align-self:start; }
  .cbx-idx__name{ grid-column:2; grid-row:1; }
  .cbx-idx__go{ grid-column:3; grid-row:1; }
  .cbx-idx__bonus{ grid-column:2 / -1; grid-row:2; }
  .cbx-idx__bonus:empty{ display:none; }
}
/* --- [/cbx:index] ------------------------------------------------------- */

/* --- [cbx:fresh] лента обновлений -------------------------------------- */
.cbx-feed{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
@media (max-width:860px){ .cbx-feed{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .cbx-feed{ grid-template-columns:1fr; } }
.cbx-item{
  display:grid; grid-template-rows:auto auto 1fr; gap:7px;
  padding:16px 16px 18px; text-decoration:none;
  background:var(--cbx-chalk); border:1px solid var(--cbx-rule); border-radius:10px;
  border-left:3px solid var(--cbx-rose);
}
.cbx-item:hover{ box-shadow:0 10px 24px rgba(16,20,24,.1); }
.cbx-item time{ font:600 12px/1 var(--cbx-head); color:var(--cbx-fog); letter-spacing:.6px; text-transform:uppercase; }
.cbx-item .cbx-tag{ font:700 11px/1 var(--cbx-head); letter-spacing:.08em; color:#fff; }
.cbx-item strong{ font:700 17px/1.35 var(--cbx-head); color:var(--cbx-felt); }
.cbx-item span{ font-size:14px; color:var(--cbx-fog); line-height:1.55; }

/* --- [cbx:brand] карточка бренда на обзоре ----------------------------- */
.cbx-brandcard{
  display:grid; grid-template-columns:132px minmax(0,1fr) auto; gap:22px; align-items:center;
  background:var(--cbx-band); border:0; border-radius:var(--cbx-round);
  box-shadow:0 6px 18px rgba(16,20,24,.08);
  padding:20px 24px; margin:0 0 var(--cbx-air);
}
@media (max-width:760px){ .cbx-brandcard{ grid-template-columns:88px minmax(0,1fr); gap:14px; padding:16px; } }
.cbx-brandcard__logo{ display:grid; place-items:center; background:#fff; border:1px solid var(--cbx-rule); border-radius:10px; padding:10px; }
.cbx-brandcard__logo img{ display:block; width:100%; height:auto; }
.cbx-brandcard__facts{ list-style:none; margin:10px 0 0; padding:0; display:grid; gap:6px; }
.cbx-brandcard__facts li{ display:grid; grid-template-columns:18px 1fr; gap:9px; align-items:start; font-size:15px; }
.cbx-brandcard__facts svg{ width:16px; height:16px; margin-top:4px; stroke:var(--cbx-royal); fill:none; stroke-width:1.9; }
.cbx-brandcard h2{ margin:0; font-size:24px; }
.cbx-brandcard__cta{ display:grid; gap:8px; justify-items:stretch; text-align:center; }
@media (max-width:760px){ .cbx-brandcard__cta{ grid-column:1 / -1; } }
.cbx-brandcard__cta small{ color:var(--cbx-fog); font-size:12px; }
.cbx-brandcard__bonus{ font:700 19px/1.2 var(--cbx-head); color:var(--cbx-rose-deep); font-variant-numeric:tabular-nums; }

/* --- [cbx:rail] --------------------------------------------------------- */
.cbx-rail{ display:grid; gap:18px; align-content:start; }
@media (max-width:980px){ .cbx-rail{ grid-template-columns:1fr 1fr; } }
@media (max-width:640px){ .cbx-rail{ grid-template-columns:1fr; } }
.cbx-card{
  background:var(--cbx-chalk); border:1px solid var(--cbx-rule); border-radius:10px;
  padding:16px 18px 18px;
}
.cbx-card--ink{ background:var(--cbx-felt-deep); border-color:#2b333f; color:#b9c0cb; }
.cbx-card > h3{
  margin:0 0 12px; padding-bottom:9px; border-bottom:1px solid var(--cbx-rule);
  font-size:16px; letter-spacing:.2px;
  display:grid; grid-template-columns:auto 1fr; align-items:center; gap:8px;
}
.cbx-card--ink > h3{ color:var(--cbx-chalk); border-bottom-color:#2b333f; }
.cbx-card > h3 svg{ width:18px; height:18px; stroke:var(--cbx-rose); fill:none; stroke-width:1.8; }
.cbx-card ul{ list-style:none; margin:0; padding:0; }
.cbx-card p{ margin:0 0 .8em; font-size:14px; line-height:1.6; }
.cbx-card p:last-child{ margin-bottom:0; }

.cbx-facts li{
  display:grid; grid-template-columns:1fr auto; gap:10px; align-items:baseline;
  padding:7px 0; border-bottom:1px dashed var(--cbx-rule); font-size:14px;
}
.cbx-facts li:last-child{ border-bottom:0; }
.cbx-facts b{ font-family:var(--cbx-head); font-variant-numeric:tabular-nums; color:var(--cbx-felt); }

.cbx-steps{ counter-reset:cbxstep; }
.cbx-steps li{
  counter-increment:cbxstep;
  display:grid; grid-template-columns:24px 1fr; gap:10px; align-items:start;
  padding:7px 0; font-size:14px; line-height:1.5;
}
.cbx-steps li::before{
  content:counter(cbxstep);
  display:grid; place-items:center; width:24px; height:24px; border-radius:50%;
  background:var(--cbx-royal); color:var(--cbx-chalk); font:700 13px/1 var(--cbx-head);
}
.cbx-links li{ padding:7px 0; border-bottom:1px solid var(--cbx-rule); }
.cbx-links li:last-child{ border-bottom:0; }
.cbx-links a{ text-decoration:none; font-size:14px; font-weight:600; }
.cbx-links a:hover{ text-decoration:underline; }
.cbx-card--ink a{ color:#c9cfd9; }

/* --- [cbx:toc] оглавление ---------------------------------------------- */
.cbx-toc{
  margin:0 0 var(--cbx-air); background:var(--cbx-band);
  border:0; border-radius:10px; padding:0 16px;   /* врезка в листе живёт тоном, а не второй обводкой */
}
.cbx-toc > summary{
  list-style:none; cursor:pointer; padding:13px 0; min-height:44px;
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:9px;
  font:700 15px/1.3 var(--cbx-head); color:var(--cbx-felt);
}
.cbx-toc > summary::-webkit-details-marker{ display:none; }
.cbx-toc > summary svg{ width:18px; height:18px; stroke:var(--cbx-royal); fill:none; stroke-width:1.8; }
.cbx-toc > summary::after{ content:"+"; font-size:19px; color:var(--cbx-fog); }
.cbx-toc[open] > summary::after{ content:"\2212"; }
.cbx-toc ol{ margin:0 0 14px; padding:0 0 0 20px; columns:2; column-gap:26px; }
@media (max-width:640px){ .cbx-toc ol{ columns:1; } }
.cbx-toc li{ margin:0 0 6px; font-size:14px; break-inside:avoid; }
.cbx-toc a{ text-decoration:none; }
.cbx-toc a:hover{ text-decoration:underline; }

/* --- [cbx:faq] ---------------------------------------------------------- */
.cbx-faq{ display:grid; gap:12px; }
.cbx-faq__q{
  background:var(--cbx-chalk); border:1px solid var(--cbx-rule); border-radius:10px;
  padding:16px 18px;
}
.cbx-faq__q h3{ margin:0 0 7px; font-size:17px; }
.cbx-faq__q p{ margin:0; font-size:15px; line-height:1.62; color:#3c4551; }
.cbx-faq__q p + p{ margin-top:.7em; }

/* --- [cbx:table] таблицы донора в нашем листе -------------------------- */
.cbx-scroll{ overflow-x:auto; margin:0 0 1.3em; }
.cbx-prose table{
  width:100%; border-collapse:collapse; font-size:14.5px; background:var(--cbx-chalk);
}
.cbx-prose table th{
  background:var(--cbx-felt-deep); color:var(--cbx-chalk);
  font:600 13px/1.3 var(--cbx-head); letter-spacing:.4px; text-transform:uppercase;
  padding:11px 17px; text-align:left; border:0;
}
.cbx-prose table td{ padding:11px 17px; border-bottom:1px solid var(--cbx-rule); vertical-align:middle; }
.cbx-prose table tr:nth-child(even) td{ background:#fafaff; }
.cbx-prose table img{ max-height:44px; width:auto; }
.cbx-prose table a[href^="/go/"]{
  display:inline-grid; align-items:center; min-height:44px; padding:0 14px; border-radius:6px;
  background:var(--cbx-rose); color:var(--cbx-chalk) !important;
  font:700 14px/1 var(--cbx-head); text-decoration:none; white-space:nowrap;
}
.cbx-prose table a[href^="/go/"]:hover{ background:var(--cbx-rose-deep); }
/* узкий экран: таблица донора едет вбок внутри себя, а не рвёт страницу */
@media (max-width:760px){
  .cbx-page table{ display:block; width:100%; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .cbx-prose table th, .cbx-prose table td{ white-space:normal; min-width:96px; }
}

/* --- [cbx:note] правовая рамка ----------------------------------------- */
.cbx-note{
  display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:start;
  background:var(--cbx-band); border:0; border-left:3px solid var(--cbx-royal);
  border-radius:8px; padding:14px 16px; margin:var(--cbx-air) 0 0; font-size:14px; line-height:1.6;
}
.cbx-note svg{ width:20px; height:20px; stroke:var(--cbx-royal); fill:none; stroke-width:1.8; margin-top:2px; }

/* --- [cbx:desk] редакционный блок раздела: карта сайта, лента и короткие
       заметки состоят из ссылок — текст про метод раздела идёт В ДВЕ КОЛОНКИ,
       одна колонка на 74ch под сеткой во всю ширину оставляет пустой правую
       половину полосы (09.24). На узком экране колонка одна. ------------- */
.cbx-desk{ margin:var(--cbx-air) 0 0; padding:var(--cbx-step) 0 0;
  border-top:2px solid var(--cbx-royal); }
.cbx-prose .cbx-desk > h2{ margin:0 0 14px; padding-top:0; border-top:0; }
.cbx-desk__t{ columns:2; column-gap:38px; font-size:16px; line-height:1.68;
  color:var(--cbx-slate); }
.cbx-desk__t > p{ margin:0 0 1.05em; break-inside:avoid-column; }
.cbx-desk__t > p:last-child{ margin-bottom:0; }
@media (max-width:760px){ .cbx-desk__t{ columns:1; font-size:16.5px; } }

/* --- [cbx:tail] лист, шапка страницы, дата и метка ленты ------------- */
.cbx-page{background:var(--cbx-felt)}
.cbx-main{display:block;padding:0 0 var(--cbx-air)}
.cbx-main>.cbx-lane{padding-top:var(--cbx-air)}
.cbx-upd{margin:var(--cbx-step) 0 0;padding-top:14px;border-top:1px solid var(--cbx-rule);
  font-size:13px;line-height:1.6;color:var(--cbx-fog)}
.cbx-upd time{color:var(--cbx-slate);font-weight:600}
.cbx-tag{display:inline-block;align-self:start;padding:3px 9px;border-radius:999px;
  background:var(--cbx-royal);color:#fff;font-size:11px;letter-spacing:.08em;
  text-transform:uppercase;font-weight:700}
/* --- [/cbx:tail] ---------------------------------------------------- */

/* --- [cbx:tile] плитка логотипа в таблицах: всегда белая, знак не прижат -- */
.cbx-prose img.cbx-tile{ display:block; width:104px; height:52px; padding:7px 9px;
  background:#fff; border:1px solid var(--cbx-rule); border-radius:9px;
  object-fit:contain; object-position:center; }
.cbx-prose td:has(> img.cbx-tile){ width:120px; }
@media (max-width:760px){ .cbx-prose img.cbx-tile{ width:84px; height:44px; padding:5px 7px; } }
/* --- [/cbx:tile] ------------------------------------------------------ */

/* --- [cbx:touch] мобильный обиход: широкая таблица прокручивается, цель касания 44px --- */
.cbx-hd__lane .cbx-brand{ min-height:44px; }
.cbx-prose a.button,
.cbx-prose td.bn > a,
.cbx-prose td.nm > a{ min-height:44px; display:inline-flex; align-items:center; justify-content:center; }
.cbx-sect__more{ min-height:44px; display:inline-flex; align-items:center; }
@media (max-width:760px){
  .cbx-page td > a{ min-height:44px; display:inline-flex; align-items:center; }
  .cbx-ft__bottom a{ display:inline-block; padding:11px 0; }
}
/* --- [/cbx:touch] ------------------------------------------------------ */

/* --- [cbx:shot] фотография внутри статьи: столбик справа от текста на десктопе,
       на узком экране уходит ПОД абзац (05.0ш — полоса заголовка остаётся текстовой) --- */
.cbx-shot{ float:right; width:302px; margin:.2em 0 1.15em 26px; background:var(--cbx-chalk);
  border:1px solid var(--cbx-rule); border-radius:var(--cbx-round); overflow:hidden;
  box-shadow:0 1px 0 var(--cbx-rule); }
.cbx-shot > img{ display:block; width:100%; height:auto; }
.cbx-shot figcaption{ padding:11px 15px 13px; font-size:13.5px; line-height:1.46;
  color:var(--cbx-slate); font-family:var(--cbx-body); }
.cbx-shot figcaption small{ display:block; margin-top:6px; font-size:11.5px; color:var(--cbx-fog); }
.cbx-shot figcaption small a{ color:inherit; text-decoration:underline; }
.cbx-prose > h2, .cbx-prose > h3{ clear:none; }
@media (max-width:900px){ .cbx-shot{ width:264px; margin-left:20px; } }
@media (max-width:760px){
  .cbx-shot{ float:none; width:100%; margin:1.25em 0 1.4em; }
  .cbx-shot figcaption{ padding:12px 14px 14px; }
}
/* --- [/cbx:shot] -------------------------------------------------------- */

/* --- [cbxc] блок карточек кластера на хабе: H1 -> интро -> ЭТОТ блок -> текст.
       Знак бренда — плитка 184x184 на белом в поле 72 px; знак темы — свой SVG.
       Заголовок и описание внутри ссылки — блочные span'ы, иначе одна строка. --- */
.cbxc{ margin:26px 0 30px; padding:20px 20px 22px; background:var(--cbx-band);
  border:1px solid var(--cbx-rule); border-radius:var(--cbx-round); }
.cbxc__h{ display:flex; align-items:center; gap:10px; margin:0 0 5px; }
.cbxc__h svg{ width:22px; height:22px; flex:none; stroke:var(--cbx-rose); fill:none;
  stroke-width:1.75; }
.cbxc__h b{ font:700 21px/1.25 var(--cbx-head); color:var(--cbx-felt); }
.cbxc__h span{ margin-left:auto; font-size:13px; color:var(--cbx-fog); white-space:nowrap; }
.cbxc__lead{ margin:0 0 16px; font-size:14.5px; line-height:1.55; color:var(--cbx-fog); }
.cbxc__lead:empty{ display:none; margin:0; }
.cbxc__grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(256px,1fr)); gap:12px; }
.cbxc-card{ display:grid; grid-template-columns:72px 1fr; grid-template-rows:auto auto;
  column-gap:14px; row-gap:3px; align-content:start; padding:12px 14px 13px;
  text-decoration:none; background:var(--cbx-chalk); border:1px solid var(--cbx-rule);
  border-radius:10px; }
.cbxc-card:hover{ border-color:var(--cbx-royal); box-shadow:0 8px 20px rgba(59,42,151,.10); }
.cbxc-card__pad{ grid-row:1 / 3; display:grid; place-items:center; width:72px; height:72px;
  background:#fff; border:1px solid var(--cbx-rule); border-radius:8px; overflow:hidden; }
.cbxc-card__pad img{ display:block; width:72px; height:72px; object-fit:contain; }
.cbxc-card__pad svg{ width:30px; height:30px; color:var(--cbx-royal); }
.cbxc-card__t{ display:block; align-self:end; font:700 16px/1.3 var(--cbx-head);
  color:var(--cbx-felt); overflow-wrap:anywhere; }
.cbxc-card__d{ display:block; font-size:13.5px; line-height:1.5; color:var(--cbx-fog); }
.cbxc-card:hover .cbxc-card__t{ color:var(--cbx-royal); }
/* перенесённый под интро готовый перечень (86 обзоров на /casino/) */
.cbxc-moved{ margin:26px 0 30px; }
.cbxc-moved .cbx-sect{ padding:20px 0 22px; border:1px solid var(--cbx-rule);
  border-radius:var(--cbx-round); }
.cbxc-moved .cbx-sect__lane{ padding:0 18px; }
@media (max-width:560px){
  .cbxc{ padding:16px 14px 18px; }
  .cbxc__h b{ font-size:19px; }
  .cbxc__grid{ grid-template-columns:1fr; }
  .cbxc-card{ grid-template-columns:64px 1fr; column-gap:12px; padding:11px 12px 12px; }
  .cbxc-card__pad{ width:64px; height:64px; }
  .cbxc-card__pad img{ width:64px; height:64px; }
}
/* --- [/cbxc] ------------------------------------------------------------ */

/* --- [cbx:wire] лента автопостинга moz.biz на хабе новостей ---------------
   Разметку анонса приносит публикатор сети: сразу за своим маркером он кладёт
   `div` с ИНЛАЙНОВЫМ `margin-bottom:20px`, внутри `h4 > a` и `p`. Ни классов, ни
   обёрток у него нет, поэтому оформление висит на контейнере и на голых тегах, а
   инлайновый отступ перебивается через !important — иначе анонсы стоят с чужим
   шагом. Пока анонсов нет, обёртка пустая (внутри только комментарий-маркер) и
   `:empty` её прячет: заголовка ей не давать, иначе на видном месте хаба висит
   пустая секция. */
.cbx-wire:empty{ display:none; }
.cbx-wire{ margin:22px 0 26px; padding:18px 20px 4px; background:var(--cbx-chalk);
  border:1px solid var(--cbx-rule); border-left:3px solid var(--cbx-rose);
  border-radius:var(--cbx-round); }
.cbx-wire>div{ margin:0 0 16px !important; padding:0 0 14px;
  border-bottom:1px solid var(--cbx-rule); }
.cbx-wire>div:last-child{ border-bottom:0; }
.cbx-wire h4{ margin:0 0 5px; font:700 18px/1.3 var(--cbx-head); color:var(--cbx-felt); }
.cbx-wire h4 a{ color:inherit; text-decoration:none; overflow-wrap:anywhere; }
.cbx-wire h4 a:hover,.cbx-wire h4 a:focus-visible{ color:var(--cbx-royal); }
.cbx-wire p{ margin:0; font-size:14.5px; line-height:1.55; color:var(--cbx-fog); }
.cbx-wire img{ max-width:100%; height:auto; }
.cbx-wire table{ display:block; max-width:100%; overflow-x:auto; }
@media (max-width:560px){
  .cbx-wire{ padding:14px 14px 2px; }
  .cbx-wire h4{ font-size:16.5px; }
}
/* Статья робота: `%CONTENT_1%` приходит ГОЛЫМ html — таблица без нашей обёртки
   `.cbx-scroll`, картинка без `max-width`, `pre`, длинные ссылки. Свои страницы
   завёрнуты все до одной, поэтому по живому сайту замер overflow даёт ноль, а
   перелив вылезет в первой же автопубликации, уже после сдачи. Правила висят на
   ОТДЕЛЬНОМ классе шаблона `.cbx-post`, а не на `.cbx-prose`: у своих страниц
   таблицы лежат в `.cbx-scroll` и `display:block` сломал бы им ширину.
   `display:block` у `table` обязателен — иначе прокрутка не работает. */
.cbx-post>table,.cbx-post>div>table{ display:block; width:100%; max-width:100%;
  overflow-x:auto; -webkit-overflow-scrolling:touch; }
.cbx-post img{ max-width:100%; height:auto; }
.cbx-post pre{ max-width:100%; overflow-x:auto; }
.cbx-post a{ overflow-wrap:anywhere; }
.cbx-post iframe{ max-width:100%; }
/* --- [/cbx:wire] -------------------------------------------------------- */

/* --- [cbx:offer] блок оффера вместо рекламных таблиц донора --------------
   Донор рисовал их своим css (`preset`, `casinotable`, `ctabox`, `rtop`), мы его
   сняли, а своего на эти блоки не написали — таблицы и кнопки ехали голыми
   (жалоба владельца 25.09.2026: «ссылки для реклам не в правильных форматах»).
   Устройство по DESIGN §22.09 п.5: бренд → «белая плитка логотипа + строка
   предложения + действие»; таблицей условия НЕ рисуются.
   Контраст посчитан: fog #5d6672 на band #f2f1f8 = 5,18 · rose-deep #ad2454
   на band = 5,93 · белое на rose #d6336c = 4,62 (все ≥ 4,5). */
/* ⛔⛔ `float:none; clear:both` обязательны: фото статьи (`.cbx-shot`, float:right
   302 px) иначе сжимает блок до 432 px в колонке 760 — ровно так же, как оно сжимало
   витрину (разбор в vitrine.css, замер 25.09.2026). */
.cbx-offer{
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:22px; align-items:center;
  background:var(--cbx-band); border-radius:var(--cbx-round);
  box-shadow:0 6px 18px rgba(16,20,24,.08);
  padding:20px 24px; margin:0 0 var(--cbx-air);
  width:100%; max-width:100%; float:none; clear:both;
}
.cbx-offer--brand{ grid-template-columns:132px minmax(0,1fr) auto; }
.cbx-offer__tile{
  display:grid; place-items:center; background:#fff; border:1px solid var(--cbx-rule);
  border-radius:10px; padding:10px; min-height:64px;
}
.cbx-offer__tile img{ display:block; width:100%; height:auto; }
.cbx-offer__body{ min-width:0; display:grid; gap:8px; }
.cbx-offer__brand{ font:700 21px/1.25 var(--cbx-head); color:var(--cbx-felt); }
.cbx-offer__brand a{ color:inherit; text-decoration:none; }
.cbx-offer__brand a:hover,.cbx-offer__brand a:focus-visible{ color:var(--cbx-royal); }
.cbx-offer__deal{ display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 12px; }
.cbx-offer__kind{
  font:600 12px/1 var(--cbx-head); letter-spacing:.09em; text-transform:uppercase;
  color:var(--cbx-fog); flex:0 0 100%;
}
.cbx-offer__val{
  font:700 26px/1.15 var(--cbx-head); color:var(--cbx-rose-deep);
  font-variant-numeric:tabular-nums;
}
.cbx-offer__add{ font:600 16px/1.3 var(--cbx-head); color:var(--cbx-slate); }
.cbx-offer__rate{
  background:var(--cbx-chalk); border:1px solid var(--cbx-rule); border-radius:999px;
  padding:3px 11px; font:700 13px/1 var(--cbx-head); color:var(--cbx-fog);
}
.cbx-offer__terms{ list-style:none; margin:2px 0 0; padding:0; display:grid; gap:7px; }
.cbx-offer__terms li{
  display:grid; grid-template-columns:minmax(120px,196px) minmax(0,1fr); gap:2px 16px;
  align-items:baseline; font-size:15px; line-height:1.5; color:var(--cbx-slate);
}
.cbx-offer__terms li span{
  font:600 13px/1.5 var(--cbx-head); letter-spacing:.02em;
  color:var(--cbx-fog); text-transform:uppercase;
}
.cbx-offer__act{ display:grid; gap:8px; justify-items:stretch; text-align:center; }
.cbx-offer__act .cbx-btn{ justify-content:center; }
/* График депозитных бонусов: 8 предложений × 4 условия. Каждое предложение —
   своя строка с СВОИМИ условиями справа, иначе суммы и требования не сходятся.
   Кнопка у такой панели одна и уходит вниз по центру: сбоку она повисала бы
   посреди полутора тысяч пикселей списка. */
.cbx-offer--list{ grid-template-columns:minmax(0,1fr); gap:18px; }
.cbx-offer--list .cbx-offer__body{ gap:0; }
.cbx-offer__row{
  display:grid; grid-template-columns:minmax(180px,236px) minmax(0,1fr);
  gap:8px 28px; align-items:start;
  padding:14px 0; border-top:1px solid var(--cbx-rule);
}
.cbx-offer__all{ display:grid; gap:6px; padding:0 0 14px; }
.cbx-offer__all + .cbx-offer__row{ border-top:1px solid var(--cbx-rule); padding-top:14px; }
.cbx-offer__row:first-child{ border-top:0; padding-top:0; }
.cbx-offer__row:last-child{ padding-bottom:0; }
.cbx-offer__row .cbx-offer__deal{ gap:4px 10px; }
.cbx-offer__row .cbx-offer__terms{ margin:0; gap:5px; }
.cbx-offer__row .cbx-offer__terms li{ grid-template-columns:minmax(110px,178px) minmax(0,1fr); }
.cbx-offer--list .cbx-offer__act{ justify-items:center; }
.cbx-offer--list .cbx-offer__act .cbx-btn{ min-width:min(320px,100%); }
.cbx-offer__cap{
  clear:both; margin:0 0 12px; font:700 20px/1.3 var(--cbx-head); color:var(--cbx-felt);
}
/* Кнопка не упирается в край: полоса действия шириной колонки, поля свои. */
.cbx-cta{
  display:grid; justify-items:center; gap:6px;
  margin:var(--cbx-air) 0; padding:18px 20px;
  background:var(--cbx-band); border-radius:var(--cbx-round);
  width:100%; max-width:100%; float:none; clear:both;
}
.cbx-cta .cbx-btn{ min-width:min(320px,100%); justify-content:center; }
@media (max-width:760px){
  .cbx-offer,.cbx-offer--brand{ grid-template-columns:88px minmax(0,1fr); gap:14px; padding:16px; }
  .cbx-offer__body{ grid-column:2; }
  .cbx-offer--deal{ grid-template-columns:minmax(0,1fr); }
  .cbx-offer--deal .cbx-offer__body{ grid-column:1; }
  .cbx-offer__act{ grid-column:1 / -1; }
  .cbx-offer__val{ font-size:23px; }
  .cbx-offer__terms li{ grid-template-columns:minmax(0,1fr); gap:1px; }
  .cbx-offer__row{ grid-template-columns:minmax(0,1fr); gap:6px; padding:12px 0; }
  .cbx-offer__row .cbx-offer__terms li{ grid-template-columns:minmax(0,1fr); }
}
/* --- [/cbx:offer] ------------------------------------------------------- */

/* --- [cbx:jump] --------------------------------------------------------- */
/* Переход из первого абзаца на витрину страницы (владелец, 28.09.2026:
   «страница в топ-1, а переходов нет»). Внутренняя навигация, поэтому НЕ розовая:
   розовым на сети покрашен `/go/`. Прокрутка — css, без js. */
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
.cbxv-wrap .cbxv-h{ scroll-margin-top:18px; }

.cbx-jump{ display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:14px 22px; margin:26px 0; padding:18px 22px;
  border-radius:var(--cbx-round); color:var(--cbx-chalk);
  background:linear-gradient(135deg,var(--cbx-royal-deep) 0%,var(--cbx-royal) 100%); }
.cbx-jump__t{ flex:1 1 320px; margin:0; font:400 15.5px/1.5 var(--cbx-body);
  color:#ece9fb; }
.cbx-jump__t b{ color:var(--cbx-chalk); font-weight:700; }
.cbx-jump__b{ flex:0 0 auto; display:inline-flex; align-items:center; gap:9px;
  padding:13px 22px; border-radius:8px; background:var(--cbx-chalk);
  color:var(--cbx-royal-deep)!important; text-decoration:none!important;
  font:700 15px/1 var(--cbx-head); letter-spacing:.2px;
  box-shadow:0 2px 0 rgba(16,20,24,.22);
  transition:background .12s, box-shadow .12s, transform .12s; }
.cbx-jump__b:hover{ background:var(--cbx-band); color:var(--cbx-royal-deep)!important;
  box-shadow:0 1px 0 rgba(16,20,24,.22); transform:translateY(1px); }
.cbx-jump__b:focus-visible{ outline:3px solid var(--cbx-rose-lit); outline-offset:3px; }
.cbx-jump__i{ width:17px; height:17px; }
.cbx-jump__b:hover .cbx-jump__i{ transform:translateY(2px); transition:transform .12s; }

@media (max-width:600px){
  .cbx-jump{ padding:16px; gap:12px; }
  .cbx-jump__t{ flex:1 1 100%; font-size:15px; }
  .cbx-jump__b{ width:100%; justify-content:center; padding:14px 18px; }
}
/* --- [/cbx:jump] -------------------------------------------------------- */

/* --- [cbx:shot-wide] ---------------------------------------------------- */
.cbx-shot--left{ float:left; margin:.2em 26px 1.15em 0; }
@media (max-width:900px){ .cbx-shot--left{ margin-right:20px; margin-left:0; } }
@media (max-width:760px){ .cbx-shot--left{ float:none; margin:1.25em 0 1.4em; } }

.cbx-shot--wide{ float:none!important; clear:both; width:100%; max-width:100%;
  margin:1.25em 0 1.45em; display:grid; grid-template-columns:minmax(0,1fr); }
.cbx-shot--wide > img{ width:100%; height:clamp(190px,27vw,300px); object-fit:cover;
  object-position:center 42%; }
.cbx-shot--wide figcaption{ padding:12px 16px 14px; font-size:14px; }
@media (max-width:760px){
  .cbx-shot--wide{ margin:1.1em 0 1.3em; }
  .cbx-shot--wide > img{ height:clamp(170px,46vw,240px); }
}
/* --- [/cbx:shot-wide] --------------------------------------------------- */