/* ============================================================
   casinosau.net — скин «Ledger»  (префикс ozk-)
   композиция: плотное табло  ·  манера: редакторская сдержанность
   ============================================================ */

/* ---------- ozk:tokens ---------- */
:root{
  --ozk-canvas:#E9E4DA;
  --ozk-paper:#FFFFFF;
  --ozk-ink:#14171C;
  --ozk-ink-2:#555C69;
  --ozk-ink-3:#595F6B;   /* 4.9:1 на холсте; #6C727E давал 3.81 */
  --ozk-line:#DCD6C9;
  --ozk-line-2:#EDE9E0;
  --ozk-acc:#0E5A4A;
  --ozk-acc-soft:#E3EFEA;
  --ozk-cta:#A8501F;
  --ozk-cta-dk:#8C4218;
  --ozk-gold:#9C7C29;      /* только рамки и штрихи */
  --ozk-gold-tx:#7A5F1C;   /* тот же акцент для ТЕКСТА: 5.9:1 на бумаге */
  --ozk-w-text:760px;
  --ozk-w-wide:888px;
  --ozk-w-frame:1120px;
  --ozk-pad:20px;
  --ozk-sheet:36px;
  --ozk-gap:28px;
  --ozk-ui:"Muli","Segoe UI",system-ui,-apple-system,Arial,sans-serif;
  --ozk-disp:Georgia,"Iowan Old Style","Times New Roman",serif;
}
@media (max-width:900px){
  :root{ --ozk-pad:14px; --ozk-sheet:16px; --ozk-gap:18px; }
}

@font-face{font-family:"Muli";src:url("/app/themes/piranha/assets/public/fonts/Muli-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Muli";src:url("/app/themes/piranha/assets/public/fonts/Muli-Bold.woff2") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Muli";src:url("/app/themes/piranha/assets/public/fonts/Muli-Black.woff2") format("woff2");font-weight:900;font-display:swap}

/* ---------- ozk:reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body.ozk-page{
  margin:0;background:var(--ozk-canvas);color:var(--ozk-ink);
  font:400 17px/1.65 var(--ozk-ui);
  font-variant-numeric:tabular-nums;
}
body.ozk-page img{max-width:100%;height:auto}
/* :where() обнуляет вес базового правила — иначе `body.ozk-page a` (0,1,2) бьёт
   `.ozk-hd-note a` (0,1,1), и ссылка «Gambling Help Online» уезжает в акцентный
   зелёный на почти чёрной плашке: контраст 2.21.
   ⛔ обнулять надо СЕЛЕКТОР ЦЕЛИКОМ, а не хвост: `body.ozk-page :where(a)` — это всё
   ещё (0,1,1), и одноклассовые правила карточек проигрывали ему. На живом сайте от
   этого были подчёркнуты 8 `.ozk-card`, 31 `.ozk-clu-card`, логотип и, главное,
   кнопка `.ozkv-cta` «VISIT SITE» — белая надпись с линией под ней на каждой
   карточке витрины. `:where(body.ozk-page a)` = (0,0,0): своё правило блока
   выигрывает всегда, а подчёркивание остаётся у ссылок в прозе, где его никто не снял */
:where(body.ozk-page a){color:var(--ozk-acc);text-decoration:underline;text-underline-offset:2px}
:where(body.ozk-page a:hover){color:var(--ozk-cta)}

/* нейтрализация голых правил донора на равной специфичности */
:where(.ozk-page) h1,:where(.ozk-page) h2,:where(.ozk-page) h3,
:where(.ozk-page) h4,:where(.ozk-page) p,:where(.ozk-page) ul,
:where(.ozk-page) ol,:where(.ozk-page) table,:where(.ozk-page) figure,
:where(.ozk-page) blockquote{margin:0}

/* ---------- ozk:frame ---------- */
.ozk-wrap{max-width:var(--ozk-w-frame);margin:0 auto;padding-left:var(--ozk-pad);padding-right:var(--ozk-pad)}

/* ---------- ozk:header ---------- */
.ozk-hd{background:var(--ozk-paper);border-bottom:1px solid var(--ozk-line)}
.ozk-hd-note{background:var(--ozk-ink);color:#CFD3DA;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase}
.ozk-hd-note .ozk-wrap{display:flex;gap:16px;justify-content:space-between;align-items:center;min-height:34px;flex-wrap:wrap}
.ozk-hd-note a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.35)}
/* ⛔ высота шапки входит в «верх листа»: на 390 она забирала 141 px из 278, отведённых
   правилом 05.0ш на всё, что стоит над текстом. Полоса 18+ остаётся — сжимается */
.ozk-hd-bar{display:flex;align-items:center;gap:22px;min-height:66px}
.ozk-brand{display:flex;align-items:baseline;gap:9px;text-decoration:none;color:var(--ozk-ink);flex:0 0 auto}
.ozk-brand b{font:700 25px/1 var(--ozk-disp);letter-spacing:.02em}
.ozk-brand i{font:400 12px/1 var(--ozk-ui);font-style:normal;letter-spacing:.24em;text-transform:uppercase;color:var(--ozk-acc)}
.ozk-brand-sub{display:block;font:400 11px/1.3 var(--ozk-ui);letter-spacing:.14em;text-transform:uppercase;color:var(--ozk-ink-3);margin-top:4px}

.ozk-burger,.ozk-nav-tgl{display:none}
.ozk-nav{margin-left:auto}
.ozk-nav>ul{display:flex;list-style:none;margin:0;padding:0;gap:2px}
.ozk-nav>ul>li{position:relative}
.ozk-nav>ul>li>a{
  display:block;padding:10px 12px;font-size:14.5px;font-weight:700;letter-spacing:.03em;
  text-transform:uppercase;color:var(--ozk-ink);text-decoration:none;border-bottom:2px solid transparent;
}
.ozk-nav>ul>li>a:hover,.ozk-nav>ul>li:hover>a{color:var(--ozk-acc);border-bottom-color:var(--ozk-acc)}
.ozk-nav ul ul{
  position:absolute;left:0;top:100%;min-width:248px;background:var(--ozk-paper);
  border:1px solid var(--ozk-line);box-shadow:0 14px 34px rgba(20,23,28,.14);
  list-style:none;margin:0;padding:6px 0;z-index:40;
  opacity:0;visibility:hidden;transform:translateY(4px);transition:.14s;
}
.ozk-nav>ul>li:hover ul,.ozk-nav>ul>li:focus-within ul{opacity:1;visibility:visible;transform:none}
.ozk-nav ul ul a{display:block;padding:9px 16px;font-size:15px;color:var(--ozk-ink);text-decoration:none}
.ozk-nav ul ul a:hover{background:var(--ozk-acc-soft);color:var(--ozk-acc)}

@media (max-width:900px){
  .ozk-hd-bar{min-height:54px;gap:12px}
  .ozk-hd-note{font-size:11px;letter-spacing:.03em}
  .ozk-hd-note .ozk-wrap{min-height:26px;gap:1px 12px;justify-content:flex-start}
  .ozk-burger{display:flex;flex-direction:column;justify-content:center;gap:5px;margin-left:auto;
    width:46px;height:46px;padding:11px;cursor:pointer;border:1px solid var(--ozk-line)}
  .ozk-burger span{display:block;height:2px;background:var(--ozk-ink)}
  .ozk-nav{display:none;order:9;width:100%;margin:0}
  .ozk-nav-tgl:checked ~ .ozk-nav{display:block}
  .ozk-nav>ul{display:block;border-top:1px solid var(--ozk-line);padding-bottom:10px}
  .ozk-nav>ul>li>a{padding:13px 0;font-size:15px;border-bottom:1px solid var(--ozk-line-2)}
  .ozk-nav ul ul{position:static;opacity:1;visibility:visible;transform:none;border:0;box-shadow:none;
    padding:2px 0 10px 14px;min-width:0;border-left:2px solid var(--ozk-acc-soft)}
  .ozk-nav ul ul a{padding:10px 8px}
}

/* ---------- ozk:main ---------- */
.ozk-main{padding:var(--ozk-gap) 0 42px}
/* герой встык к шапке: иначе между белой шапкой и тёмным героем светлая полоса фона */
.ozk-main>.ozk-hero:first-child{margin-top:calc(var(--ozk-gap) * -1)}
.ozk-crumb{font-size:13px;color:var(--ozk-ink-2);margin-bottom:12px;word-break:break-word}
.ozk-crumb a{color:var(--ozk-ink-2);text-decoration:none;border-bottom:1px solid var(--ozk-line)}
.ozk-crumb span{color:var(--ozk-ink-3)}

.ozk-sheet{
  background:var(--ozk-paper);border:1px solid var(--ozk-line);
  padding:var(--ozk-sheet);margin:0 auto;max-width:var(--ozk-w-wide);
}
.ozk-sheet.ozk-narrow{max-width:var(--ozk-w-text)}
.ozk-sheet+.ozk-sheet{margin-top:var(--ozk-gap)}
.ozk-sheet>*+*{margin-top:18px}

/* ---------- ozk:type ---------- */
.ozk-eyebrow{font:700 11.5px/1.2 var(--ozk-ui);letter-spacing:.22em;text-transform:uppercase;color:var(--ozk-acc)}
.ozk-page h1{font:400 clamp(28px,4.2vw,42px)/1.18 var(--ozk-disp);letter-spacing:-.01em;margin:6px 0 0}
.ozk-page h2{font:400 clamp(22px,2.8vw,29px)/1.25 var(--ozk-disp);margin:34px 0 0;padding-top:16px;border-top:1px solid var(--ozk-line-2)}
.ozk-page h3{font:700 19px/1.3 var(--ozk-ui);margin:26px 0 0}
.ozk-page h4{font:700 16px/1.35 var(--ozk-ui);letter-spacing:.02em;margin:20px 0 0}
/* базовые отбивки текста — нулевой специфичностью, иначе они бьют собственные классы
   (витрина, рельс, факты героя: у них margin/padding свои) */
:where(.ozk-page) p{margin:14px 0 0}
:where(.ozk-page) ul,:where(.ozk-page) ol{margin:14px 0 0;padding-left:22px}
:where(.ozk-page) li{margin:6px 0}
.ozk-page blockquote{margin:22px 0 0;padding:4px 0 4px 20px;border-left:3px solid var(--ozk-acc);
  font:400 19px/1.55 var(--ozk-disp);color:var(--ozk-ink)}
.ozk-page strong,.ozk-page b{font-weight:700}
.ozk-lede{font-size:19px;line-height:1.6;color:#2A2F38}
.ozk-meta{font-size:13px;color:var(--ozk-ink-2);letter-spacing:.02em;margin-top:10px}
.ozk-page hr{border:0;border-top:1px solid var(--ozk-line);margin:26px 0 0}

/* ---------- ozk:tables ---------- */
.ozk-tw{overflow-x:auto;margin-top:20px;-webkit-overflow-scrolling:touch}
.ozk-page table{border-collapse:collapse;width:100%;font-size:15.5px}
/* ⛔ обёртка со скроллом ничего не давала: при width:100% таблица не вылезает за неё,
   а сплющивается. На 390 px донорская таблица бонусов в три колонки рвала «$500 + 100
   FREE SPINS» на четыре строки. Минимальная ширина возвращает колонкам смысл, лишнее
   уезжает горизонтальным скроллом внутри обёртки, страница при этом не едет (гейт
   overflow меряет документ) */
.ozk-tw-h{display:none}
@media (max-width:640px){
  .ozk-page .ozk-tw table{min-width:520px}
  /* две колонки «признак → значение» переносятся по словам и скролла не требуют */
  .ozk-page .ozk-tw2 table{min-width:0}
  .ozk-page .ozk-tw2 td,.ozk-page .ozk-tw2 th{padding:10px 10px}
  .ozk-tw-h{display:block;margin:7px 0 0;font-size:13px;color:var(--ozk-ink-2)}
  .ozk-tw-h::after{content:" \2192"}
}
.ozk-page th,.ozk-page td{border-bottom:1px solid var(--ozk-line-2);padding:11px 12px;text-align:left;vertical-align:top}
.ozk-page thead th{background:var(--ozk-ink);color:#fff;font:700 12px/1.3 var(--ozk-ui);
  letter-spacing:.1em;text-transform:uppercase;border-bottom:0}
.ozk-page tbody tr:nth-child(even){background:#FAF8F4}

/* ---------- ozk:figure ---------- */
.ozk-page figure{margin:22px 0 0}
.ozk-page figcaption{font-size:13px;color:var(--ozk-ink-2);margin-top:7px}
.ozk-fig-a{float:right;width:clamp(170px,32%,300px);margin:6px 0 16px 22px}
@media (max-width:640px){.ozk-fig-a{float:none;width:100%;margin:16px 0 0}}
.ozk-page img{border-radius:2px}

/* ---------- ozk:vitrine (витрина) ---------- */
.ozkv-wrap{margin-top:30px;border:1px solid var(--ozk-line);background:#FBF9F5}
.ozkv-top{padding:18px var(--ozk-pad) 0}
.ozkv-wrap h2{margin:0;padding:0;border:0;font:400 clamp(21px,2.6vw,27px)/1.25 var(--ozk-disp)}
.ozkv-note{margin:8px 0 0;font-size:14px;color:var(--ozk-ink-2)}
.ozkv-head{display:none}
.ozkv-more{position:absolute;opacity:0;width:0;height:0}
.ozkv-list{list-style:none;margin:16px 0 0;padding:0 var(--ozk-pad) 4px;counter-reset:ozkv}
.ozkv-list>li{
  display:grid;gap:9px 14px;align-items:center;
  grid-template-columns:30px 80px minmax(150px,1.2fr) minmax(160px,1.5fr) minmax(124px,1fr) 152px;
  grid-template-areas:"r l n o h a" ". . m m m m";
  padding:13px 0;border-top:1px solid var(--ozk-line-2);
}
.ozkv-list>li:first-child{border-top:0}
/* донорский счётчик перед пунктом списка гасим только внутри витрины */
.ozkv-list>li::before{content:none!important}
.ozkv-rank{grid-area:r;font:700 18px/1 var(--ozk-ui);color:var(--ozk-ink-3);text-align:center;align-self:center}
.ozkv-list>li:first-child .ozkv-rank{color:var(--ozk-gold-tx)}
/* плашка под логотипом всегда светлая; тёмной не бывает (владелец 18.08.2026) */
.ozkv-logo{grid-area:l;display:flex;width:80px;height:80px;align-items:center;justify-content:center;
  background:var(--ozk-paper);border:1px solid var(--ozk-line-2);padding:7px}
.ozkv-logo img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:0}
/* светлый логотип на белом не читается — плашка получает более глубокий, но всё ещё светлый тон */
/* подложка ВСЕГДА белая (владелец, 21.09.2026): не видно знак — меняем файл логотипа,
   а не цвет плитки. Светлому знаку даём только более тёмную рамку. */
.ozkv-logo.ozkv-lt{background:var(--ozk-paper);border-color:#C9C0AE}
.ozkv-name{grid-area:n;font:700 16.5px/1.3 var(--ozk-ui);align-self:center}
.ozkv-name a{color:var(--ozk-ink);text-decoration:none}
.ozkv-name a:hover{color:var(--ozk-acc)}
.ozkv-score{display:inline-flex;align-items:baseline;gap:2px;margin-left:8px;
  font:400 12.5px/1 var(--ozk-ui);color:var(--ozk-ink-3);vertical-align:1px}
.ozkv-score b{font:700 15px/1 var(--ozk-ui);color:var(--ozk-acc)}
.ozkv-sub{display:block;font:400 12.5px/1.4 var(--ozk-ui);color:var(--ozk-ink-2);margin-top:4px}
.ozkv-offer{grid-area:o;font-size:15px;line-height:1.42;align-self:center}
.ozkv-offer b{display:block;font:700 15.5px/1.38 var(--ozk-ui);color:var(--ozk-ink)}
.ozkv-terms{display:block;font:400 12.5px/1.45 var(--ozk-ui);color:var(--ozk-ink-2);margin-top:4px}
.ozkv-hl{grid-area:h;font-size:13.5px;color:var(--ozk-ink-2);line-height:1.45;align-self:center}
.ozkv-hl b{display:block;font:700 10.5px/1.2 var(--ozk-ui);letter-spacing:.16em;text-transform:uppercase;color:var(--ozk-acc);margin-bottom:4px}
.ozkv-act{grid-area:a;display:flex;flex-direction:column;gap:7px;align-self:center}
/* вторая строка карточки: платёжные фишки и «за/против» */
/* вторая строка — ровно одна линия: фишки слева, «за/против» справа (эталон ≈165px на строку) */
.ozkv-meta{grid-area:m;display:flex;flex-wrap:nowrap;gap:6px 14px;align-items:center;overflow:hidden;
  border-top:1px dashed var(--ozk-line-2);padding-top:8px}
.ozkv-chips{display:flex;flex-wrap:nowrap;gap:6px;list-style:none;margin:0;padding:0;
  flex:0 1 auto;min-width:0;overflow:hidden}
/* фишка ужимается, а не вылезает за строку: min-width:0 + троеточие */
.ozkv-chips li{margin:0;font:400 11.5px/1 var(--ozk-ui);letter-spacing:.04em;color:var(--ozk-ink-2);
  border:1px solid var(--ozk-line);background:var(--ozk-paper);padding:5px 9px;white-space:nowrap;
  min-width:0;overflow:hidden;text-overflow:ellipsis}
.ozkv-chips li.ozkv-geo{border-color:var(--ozk-acc);color:var(--ozk-acc);font-weight:700}
.ozkv-pc{font-size:12.5px;line-height:1.5;color:var(--ozk-ink-2);flex:0 1 auto;min-width:0;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-left:auto}
/* ⛔ на 1024 «за/против» в одну строку с фишками уже не влезает: текст обрезается многоточием,
   а gate_padding меряет рект ТЕКСТОВОГО узла и обрезку не видит — насчитывает зазор 8 px
   при норме 16. Ниже 1100 отпускаем вторую строку карточки на перенос: фишки сверху,
   «за/против» отдельной строкой во всю ширину, без многоточия. */
@media (max-width:1100px){
  .ozkv-meta{flex-wrap:wrap;gap:8px 14px}
  .ozkv-pc{margin-left:0;white-space:normal;overflow:visible;flex:1 1 100%}
}
/* ⛔ на 375 px в строку встают две фишки, и обе обрезаются многоточием: «Established
   bra…», «Known to Australian play…». Ужимать фишку до нечитаемости смысла нет —
   на узком экране она переносится на свою строку целиком */
@media (max-width:640px){
  .ozkv-chips{flex-wrap:wrap;overflow:visible}
  .ozkv-chips li{overflow:visible;text-overflow:clip}
}
.ozkv-pc i{font-style:normal;font-weight:700;color:var(--ozk-acc)}
.ozkv-pc s{text-decoration:none;font-weight:700;color:var(--ozk-cta)}
.ozkv-cta{display:block;text-align:center;padding:12px 10px;min-height:44px;background:var(--ozk-cta);
  color:#fff!important;text-decoration:none;font:700 13.5px/1.3 var(--ozk-ui);letter-spacing:.08em;text-transform:uppercase}
.ozkv-cta:hover{background:var(--ozk-cta-dk)}
.ozkv-rev{display:block;text-align:center;font-size:12.5px;color:var(--ozk-ink-2)}
.ozkv-list>li.ozkv-hid{display:none}
/* чекбокс стоит у своей метки, ниже списка — раскрываем через :has() на контейнере,
   иначе браузер уводит экран к сфокусированному input */
.ozkv-wrap:has(.ozkv-more:checked) .ozkv-list>li.ozkv-hid{display:grid}
.ozkv-moreLbl{display:block;margin:0 var(--ozk-pad);padding:13px;min-height:44px;text-align:center;cursor:pointer;
  border-top:1px solid var(--ozk-line);font:700 12.5px/1.4 var(--ozk-ui);letter-spacing:.14em;
  text-transform:uppercase;color:var(--ozk-acc)}
.ozkv-moreLbl:hover{background:var(--ozk-acc-soft)}
.ozkv-l-shut{display:none}
.ozkv-wrap:has(.ozkv-more:checked) .ozkv-l-open{display:none}
.ozkv-wrap:has(.ozkv-more:checked) .ozkv-l-shut{display:inline}
.ozkv-disc{margin:0;padding:12px var(--ozk-pad) 16px;font-size:12.5px;line-height:1.55;color:var(--ozk-ink-2);border-top:1px solid var(--ozk-line-2)}
/* ⛔ витрина в УЗКОЙ колонке (страница с сайдбаром: гайд, обзор, /banking/*): шесть полос
   требуют 30+80+150+160+124+152 + пять зазоров = 766 px, а колонка отдаёт 730 — кнопка
   «Visit site» и «за/против» вылезали на 31 px за рамку блока, поверх жёлоба сайдбара.
   Медиазапросом это не ловится: экран широкий, узкая только колонка. Полосу «скорость
   выплаты» здесь снимаем — она есть в обзоре бренда и во второй строке карточки */
/* ⛔ только там, где сайдбар реально стоит рядом (≥1001, см. .ozk-cols): у правила два
   класса против одного у мобильного, и без рамки запроса оно перебило бы мобильную
   раскладку, где колонка и так одна */
@media (min-width:1001px){
  .ozk-cols .ozkv-list>li{
    grid-template-columns:28px 72px minmax(0,1.25fr) minmax(0,1.5fr) 144px;
    grid-template-areas:"r l n o a" ". . m m m"}
  .ozk-cols .ozkv-logo{width:72px;height:72px}
  .ozk-cols .ozkv-hl{display:none}
  /* ⛔ вторая строка карточки в УЗКОЙ колонке не влезает в одну линию и на широком экране:
     ниже 1100 её отпускает запрос выше, а на 1440 колонка всё те же 714 px — фишки и
     «за/против» резались многоточием (gate_padding: SECTION.ozkv-wrap зазор справа −89).
     Ширина экрана тут ни при чём, поэтому правило идёт по .ozk-cols, а не по медиазапросу */
  .ozk-cols .ozkv-meta{flex-wrap:wrap;gap:8px 14px}
  .ozk-cols .ozkv-pc{margin-left:0;white-space:normal;overflow:visible;flex:1 1 100%}
}

/* мобилка: четыре полосы вместо шести, второстепенное прячем (showcase-row-must-be-compact:
   «в мобилке прятать длинное — 4-й+ чип, второстепенные факты») */
@media (max-width:860px){
  .ozkv-list>li{grid-template-columns:26px 64px minmax(0,1fr);
    grid-template-areas:"r l n" "o o o" "m m m" "a a a";gap:8px 11px;padding:12px 0}
  .ozkv-logo{width:64px;height:64px;padding:5px}
  .ozkv-name{font-size:15.5px}
  .ozkv-offer{font-size:14px}
  .ozkv-offer b{font-size:14.5px;line-height:1.34}
  .ozkv-hl{display:none}                       /* скорость выплаты — в обзоре и на карточке */
  .ozkv-act{flex-direction:row;align-items:center;gap:12px}
  .ozkv-cta{flex:1 1 auto;padding:11px 10px}
  .ozkv-rev{flex:0 0 auto;font-size:11.5px}
  .ozkv-meta{gap:6px;padding-top:7px}
  .ozkv-chips li:nth-child(n+3){display:none}  /* 3-й+ чип прячем */
  .ozkv-pc{display:none}
}

/* ---------- ozk:cluster (блок карточек хаба) ---------- */
.ozk-clu{margin-top:30px}
.ozk-clu-h{font:700 11.5px/1.2 var(--ozk-ui);letter-spacing:.22em;text-transform:uppercase;color:var(--ozk-acc)}
.ozk-clu-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:14px;margin-top:14px}
.ozk-clu-card{display:flex;gap:12px;padding:14px;border:1px solid var(--ozk-line);background:var(--ozk-paper);text-decoration:none;color:var(--ozk-ink)}
.ozk-clu-card:hover{border-color:var(--ozk-acc);background:#FCFBF8}
.ozk-clu-card img{width:56px;height:56px;object-fit:cover;flex:0 0 56px;border:1px solid var(--ozk-line-2)}
/* ⛔ заголовок и описание карточки — `span`: без display:block они идут ОДНОЙ строкой,
   и на /guides/ читалось «…What's Allowed and HoFrom 11 June 2024, Australian…»
   (margin-top у строчного элемента тоже ничего не делает) */
.ozk-clu-card>span{display:flex;flex-direction:column;min-width:0}
.ozk-clu-t{display:block;font:700 15px/1.3 var(--ozk-ui)}
.ozk-clu-d{display:block;font-size:13px;line-height:1.45;color:var(--ozk-ink-2);margin-top:5px}

/* ---------- ozk:cards / chips / idx / links (плитки донора, потерявшие обёртку) ----
   Голая ссылка-блок в потоке рисовалась подчёркнутой строкой во всю колонку: на
   главной так шли 10 названий игр и 8 описаний целыми абзацами внутри `<a>`.       */
.ozk-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));
  gap:14px;margin:22px 0}
.ozk-card{display:flex;flex-direction:column;padding:16px 18px;border:1px solid var(--ozk-line);
  background:var(--ozk-paper);text-decoration:none;color:var(--ozk-ink)}
.ozk-card:hover{border-color:var(--ozk-acc);background:#FCFBF8}
.ozk-card-t{font:700 16px/1.3 var(--ozk-ui)}
.ozk-card-d{font-size:14px;line-height:1.5;color:var(--ozk-ink-2);margin-top:7px}
.ozk-card-m{margin-top:auto;padding-top:11px;font:700 11.5px/1 var(--ozk-ui);
  letter-spacing:.14em;text-transform:uppercase;color:var(--ozk-acc)}
.ozk-card-m::after{content:" \2192"}

.ozk-chips{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0}
.ozk-chips a{display:inline-flex;align-items:center;min-height:40px;padding:9px 15px;
  border:1px solid var(--ozk-line);background:var(--ozk-paper);color:var(--ozk-ink);
  text-decoration:none;font:700 14.5px/1.2 var(--ozk-ui)}
.ozk-chips a:hover{border-color:var(--ozk-acc);color:var(--ozk-acc)}

/* тизеры архива — СПИСОК-ИНДЕКС, а не карточки: линейка и строки, без рамок */
.ozk-idx{margin:20px 0;border-top:1px solid var(--ozk-line)}
.ozk-idx-i{display:block;padding:15px 0;border-bottom:1px solid var(--ozk-line-2);
  text-decoration:none;color:var(--ozk-ink)}
.ozk-idx-i:hover .ozk-idx-t{color:var(--ozk-acc)}
.ozk-idx-t{display:block;font:700 18px/1.35 var(--ozk-ui)}
a.ozk-idx-t{color:var(--ozk-ink);text-decoration:none}
a.ozk-idx-t:hover{color:var(--ozk-acc)}
p.ozk-idx-d{margin:6px 0 0}
.ozk-idx-dt{display:block;margin-top:4px;font:700 12px/1.2 var(--ozk-ui);
  letter-spacing:.08em;text-transform:uppercase;color:var(--ozk-ink-3,var(--ozk-ink-2))}
.ozk-idx-d{display:block;margin-top:6px;font-size:15px;line-height:1.55;color:var(--ozk-ink-2)}
/* анонс автопостинга: робот кладёт в архив свой блок БЕЗ классов —
   `<div style='margin-bottom:20px'><h4><a href>заголовок</a></h4><p>дата</p></div>`.
   Правила по структуре, а не по классу, иначе строка робота встанет чужой вёрсткой
   посреди списка. `margin-bottom` из его атрибута гасим своим отступом строки */
.ozk-idx>div[style]{margin:0 !important;padding:15px 0;
  border-bottom:1px solid var(--ozk-line-2)}
.ozk-idx>div[style]>h4{margin:0;font:700 18px/1.35 var(--ozk-ui)}
.ozk-idx>div[style]>h4>a{color:var(--ozk-ink);text-decoration:none}
.ozk-idx>div[style]>h4>a:hover{color:var(--ozk-acc)}
.ozk-idx>div[style]>p{margin:4px 0 0;font:700 12px/1.2 var(--ozk-ui);
  letter-spacing:.08em;text-transform:uppercase;color:var(--ozk-ink-3,var(--ozk-ink-2))}
/* дата внутри самой статьи робота */
.ozk-page .pbn-published-date{margin:0 0 14px;font:700 12px/1.2 var(--ozk-ui);
  letter-spacing:.08em;text-transform:uppercase;color:var(--ozk-ink-3,var(--ozk-ink-2))}

ul.ozk-links{list-style:none;margin:18px 0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0 22px}
ul.ozk-links li{margin:0;padding:10px 0;border-top:1px solid var(--ozk-line-2)}
ul.ozk-links li a{color:var(--ozk-ink);text-decoration:none;font-weight:700;font-size:15px}
ul.ozk-links li a:hover{color:var(--ozk-acc)}
@media (max-width:520px){.ozk-cards{grid-template-columns:1fr}.ozk-idx-t{font-size:17px}}

/* ---------- ozk:hpanel (табло в герое главной) ---------- */
.ozk-hero-2{display:grid;grid-template-columns:minmax(0,1fr) 316px;gap:40px;align-items:start}
.ozk-hero-2 .ozk-hero-in{max-width:none}
.ozk-hpanel{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05)}
.ozk-hp-i{padding:14px 18px;border-top:1px solid rgba(255,255,255,.12)}
.ozk-hp-i:first-child{border-top:0}
.ozk-hp-n{display:block;font:700 26px/1.1 var(--ozk-disp);color:#fff}
.ozk-hp-l{display:block;margin-top:3px;font:700 11.5px/1.2 var(--ozk-ui);
  letter-spacing:.18em;text-transform:uppercase;color:#96C6B7}
.ozk-hp-s{display:block;margin-top:5px;font-size:13.5px;line-height:1.45;color:#CFD3DA}
@media (max-width:1000px){.ozk-hero-2{grid-template-columns:minmax(0,1fr);gap:24px}
  .ozk-hpanel{display:grid;grid-template-columns:1fr 1fr}
  .ozk-hp-i:nth-child(2){border-top:0}}
/* ⛔ в одну колонку табло выходило на 390 столбиком из четырёх плашек и доводило геро
   главной до 997 px: правило про треть экрана его не трогает, но четыре экрана цифр
   перед первым блоком контента — это не первый экран портала. Держим два на два */
@media (max-width:520px){
  .ozk-hp-i{padding:11px 13px}
  .ozk-hp-n{font-size:22px}
  .ozk-hp-l{font-size:10.5px;letter-spacing:.14em}
  .ozk-hp-s{font-size:12.5px;line-height:1.4}
  .ozk-hpanel .ozk-hp-i:nth-child(2n){border-left:1px solid rgba(255,255,255,.12)}
}

/* ---------- ozk:value (блок ценности) ---------- */
.ozk-val{margin-top:30px;background:var(--ozk-ink);color:#E6E3DC;padding:22px var(--ozk-pad)}
.ozk-val h2{color:#fff;border:0;padding:0;margin:0;font:400 24px/1.25 var(--ozk-disp)}
.ozk-val ul{list-style:none;padding:0;margin:14px 0 0;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.ozk-val li{margin:0;font-size:14.5px;line-height:1.5;border-top:1px solid rgba(255,255,255,.18);padding-top:11px}
.ozk-val li b{display:block;font:700 11px/1.2 var(--ozk-ui);letter-spacing:.16em;text-transform:uppercase;color:#9FC9BC;margin-bottom:5px}

/* ---------- ozk:pull (врезка вокруг уже написанного абзаца, 09.30) ---------- */
.ozk-pull{margin:28px 0;padding:18px 22px;border-left:3px solid var(--ozk-acc);
  background:var(--ozk-acc-soft)}
.ozk-pull>p{margin:0;font-size:18px;line-height:1.6;color:var(--ozk-ink)}
.ozk-pull>p+p{margin-top:10px}
@media (max-width:520px){.ozk-pull{padding:15px 16px}.ozk-pull>p{font-size:17px}}

/* ---------- ozk:glossary (словарь терминов, собранный из аккордеона донора) ---------- */
.ozk-prose dl{margin:22px 0 0;border-top:1px solid var(--ozk-line-2)}
.ozk-prose dt{font:700 17px/1.35 var(--ozk-ui);margin:0;padding:15px 0 0}
.ozk-prose dd{margin:5px 0 0;padding:0 0 15px;border-bottom:1px solid var(--ozk-line-2);
  display:flow-root}
.ozk-prose dd p{margin:0 0 8px}
.ozk-prose dd p:last-child{margin-bottom:0}
.ozk-prose dd img{float:right;max-width:150px;height:auto;margin:0 0 10px 18px;
  border:1px solid var(--ozk-line-2)}
@media (max-width:520px){.ozk-prose dd img{float:none;display:block;margin:10px 0 0}}

/* ---------- ozk:checked (проверено по N пунктам) ---------- */
.ozk-chk{margin-top:30px;border:1px solid var(--ozk-line);background:var(--ozk-paper);
  padding:22px var(--ozk-pad)}
.ozk-chk h2{margin:0;border:0;padding:0}
.ozk-chk>p{margin-top:10px;color:var(--ozk-ink-2)}
.ozk-chk-l{list-style:none;counter-reset:chk;padding:0;margin:16px 0 0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:0 26px}
.ozk-chk-l li{counter-increment:chk;margin:0;padding:12px 0 12px 34px;position:relative;
  border-top:1px solid var(--ozk-line-2)}
.ozk-chk-l li::before{content:counter(chk);position:absolute;left:0;top:12px;
  width:22px;height:22px;border:1px solid var(--ozk-acc);color:var(--ozk-acc);
  font:700 11px/21px var(--ozk-ui);text-align:center}
.ozk-chk-l b{display:block;font:700 12px/1.35 var(--ozk-ui);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ozk-ink-2)}
.ozk-chk-l span{display:block;margin-top:4px;font-size:16px;line-height:1.5}

/* ---------- ozk:faq ---------- */
.ozk-faq{margin-top:30px}
.ozk-faq-i{border-top:1px solid var(--ozk-line-2);padding:16px 0}
.ozk-faq-q{font:700 17px/1.35 var(--ozk-ui);margin:0}
.ozk-faq-a{margin-top:8px}
.ozk-faq-a>*:first-child{margin-top:0}

/* ---------- ozk:toc (своё, свёрнутое) ---------- */
.ozk-toc{margin-top:22px;border:1px solid var(--ozk-line);background:#FBF9F5}
.ozk-toc-tgl{position:absolute;opacity:0;width:0;height:0}
.ozk-toc-lbl{display:block;padding:13px var(--ozk-pad);min-height:44px;cursor:pointer;
  font:700 11.5px/1.4 var(--ozk-ui);letter-spacing:.18em;text-transform:uppercase;color:var(--ozk-acc)}
.ozk-toc-lbl:after{content:"+";float:right;font-size:16px;line-height:1}
.ozk-toc-tgl:checked ~ .ozk-toc-lbl:after{content:"–"}
.ozk-toc-body{display:none;padding:0 var(--ozk-pad) 14px}
.ozk-toc-tgl:checked ~ .ozk-toc-body{display:block}
.ozk-toc-body ol{margin:0;padding-left:20px;font-size:15px;columns:2;column-gap:26px}
@media (max-width:640px){.ozk-toc-body ol{columns:1}}
.ozk-toc-body li{margin:5px 0;break-inside:avoid}

/* ---------- ozk:rail (полоса «читать дальше») ---------- */
.ozk-rail{margin-top:30px}
.ozk-rail-h{font:700 11.5px/1.2 var(--ozk-ui);letter-spacing:.22em;text-transform:uppercase;color:var(--ozk-acc)}
.ozk-rail-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin-top:13px}
.ozk-rail-c{display:block;padding:13px 14px;border:1px solid var(--ozk-line);background:var(--ozk-paper);
  text-decoration:none;color:var(--ozk-ink);font:700 14.5px/1.35 var(--ozk-ui)}
.ozk-rail-c:hover{border-color:var(--ozk-acc)}
.ozk-rail-c span{display:block;font:400 12.5px/1.45 var(--ozk-ui);color:var(--ozk-ink-2);margin-top:6px}

/* ---------- ozk:note / warn ---------- */
.ozk-note{margin-top:22px;padding:15px var(--ozk-pad);background:var(--ozk-acc-soft);border-left:3px solid var(--ozk-acc);font-size:15px;line-height:1.6}
.ozk-note>*:first-child{margin-top:0}

/* ---------- ozk:footer ---------- */
.ozk-ft{background:var(--ozk-ink);color:#B9BEC7;margin-top:48px;font-size:14.5px}
.ozk-ft-top{padding:34px 0 26px}
.ozk-ft-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.1fr;gap:26px}
@media (max-width:860px){.ozk-ft-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.ozk-ft-grid{grid-template-columns:1fr}}
.ozk-ft h3{font:700 11.5px/1.2 var(--ozk-ui);letter-spacing:.2em;text-transform:uppercase;color:#fff;margin:0 0 12px}
.ozk-ft p{margin:0 0 12px;line-height:1.6;color:#A6ACB6}
.ozk-ft ul{list-style:none;margin:0;padding:0}
.ozk-ft li{margin:0 0 9px}
.ozk-ft a{color:#DDE1E6;text-decoration:none}
.ozk-ft a:hover{color:#fff;text-decoration:underline}
.ozk-ft-brand{font:400 21px/1 var(--ozk-disp);color:#fff;display:block;margin-bottom:12px}
.ozk-ft-help{border-top:1px solid rgba(255,255,255,.14);padding:18px 0;font-size:13.5px;line-height:1.6;color:#A6ACB6}
.ozk-ft-help b{color:#fff}
.ozk-ft-18{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;
  border:2px solid #fff;border-radius:50%;color:#fff;font:900 13px/1 var(--ozk-ui);margin-right:12px;vertical-align:middle}
.ozk-ft-badges{border-top:1px solid rgba(255,255,255,.14);padding:15px 0;display:flex;align-items:center;
  gap:18px;flex-wrap:wrap;font-size:12.5px;color:#868D97}
.ozk-ft-badges img{display:block;height:auto;opacity:.92}
.ozk-ft-badges img[width="44"]{width:40px}
.ozk-ft-badges img[width="180"]{width:164px}
.ozk-ft-bot{border-top:1px solid rgba(255,255,255,.14);padding:16px 0 26px;font-size:12.5px;color:#868D97;
  display:flex;gap:14px;justify-content:space-between;flex-wrap:wrap}

/* ---------- ozk:донорские блоки, оставшиеся в теле ---------- */
.ozk-page .wpfaq-question{font-weight:700}
.ozk-page .su-box,.ozk-page .su-note{border:1px solid var(--ozk-line);padding:14px var(--ozk-pad);margin-top:20px;background:#FBF9F5}
.ozk-page picture{display:inline-block;max-width:100%}
.ozk-page .aligncenter{display:block;margin-left:auto;margin-right:auto}
.ozk-page .alignright{float:right;margin:6px 0 16px 20px;max-width:46%}
.ozk-page .alignleft{float:left;margin:6px 20px 16px 0;max-width:46%}
@media (max-width:640px){.ozk-page .alignright,.ozk-page .alignleft{float:none;margin:16px 0 0;max-width:100%}}
.ozk-clear{clear:both}

/* ---------- ozk:nav-edge — панели последних пунктов не уезжают за край ---------- */
.ozk-nav>ul>li:nth-last-child(1)>ul,
.ozk-nav>ul>li:nth-last-child(2)>ul,
.ozk-nav>ul>li:nth-last-child(3)>ul{left:auto;right:0}
@media (max-width:900px){
  .ozk-nav>ul>li:nth-last-child(1)>ul,
  .ozk-nav>ul>li:nth-last-child(2)>ul,
  .ozk-nav>ul>li:nth-last-child(3)>ul{right:auto}
}

/* ---------- ozk:hero (первый экран главной и хабов) ---------- */
.ozk-hero{position:relative;background:var(--ozk-ink);color:#fff;overflow:hidden}
.ozk-hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3;z-index:1}
.ozk-hero .ozk-wrap{position:relative;z-index:2;padding-top:44px;padding-bottom:40px;max-width:var(--ozk-w-frame)}
.ozk-hero-in{max-width:700px}
/* ⛔ кикер тоже `<p>`, и правило ниже (0,1,1) раздувало его до 18 px с разрядкой .22em:
   вместо надписи над заголовком выходила вторая строка заголовка. Держим своим (0,2,0) */
.ozk-hero .ozk-eyebrow{font:700 11.5px/1.2 var(--ozk-ui);letter-spacing:.22em;color:#96C6B7}
.ozk-hero h1{color:#fff;margin-top:10px}
.ozk-hero p{color:#D8DBE0;font-size:18px;line-height:1.6;max-width:620px}
/* подпись автора и своя дата обновления: строка под лидом, не отдельная плашка —
   плашку сразу после </h1> накрывает карточка контента с отрицательным полем */
.ozk-hero .ozk-by{margin-top:14px;font:400 13.5px/1.5 var(--ozk-ui);color:#CFD3DA;
  padding-top:12px;border-top:1px solid rgba(255,255,255,.14);max-width:620px}
.ozk-hero .ozk-by a{color:#96C6B7;text-decoration:none;border-bottom:1px solid rgba(150,198,183,.45)}
.ozk-hero .ozk-by a:hover{color:#fff;border-bottom-color:#fff}
.ozk-hero-facts{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:22px;padding:0;list-style:none}
.ozk-hero-facts li{margin:0;display:flex;align-items:center;gap:8px;font-size:14px;color:#E6E3DC}
.ozk-hero-facts svg{flex:0 0 18px;width:18px;height:18px;fill:none;stroke:#96C6B7;stroke-width:1.8}
@media (max-width:640px){.ozk-hero .ozk-wrap{padding-top:28px;padding-bottom:26px}}

/* ---------- ozk:band (полоса заголовка внутренней страницы) ----------
   ⛔⛔ владелец 20.09.2026, пункт плана 05.0ш: крошки, кикер и H1 информативности
   не несут и не имеют права занимать больше трети первого экрана. Лид, подпись и
   факты стоят ниже, в листе (.ozk-open). Замер — band5.js: верх листа ÷ высоту
   экрана на 1440×900 и 390×844, норма ≤ 33 % */
.ozk-hero-s .ozk-wrap{padding-top:16px;padding-bottom:18px}
.ozk-hero-s .ozk-hero-in{max-width:880px}
.ozk-hero-s h1{font:400 clamp(24px,2.6vw,35px)/1.16 var(--ozk-disp);margin-top:4px}
.ozk-hero-s .ozk-crumb{margin-bottom:9px;color:#AEB5BF}
.ozk-hero-s .ozk-crumb a{color:#CFD3DA;border-bottom-color:rgba(255,255,255,.26)}
.ozk-hero-s .ozk-crumb a:hover{color:#fff;border-bottom-color:#fff}
.ozk-hero-s .ozk-crumb span{color:#96C6B7}
@media (max-width:640px){
  .ozk-hero-s .ozk-wrap{padding-top:10px;padding-bottom:10px}
  /* заголовок из четырнадцати слов («Australia’s 2024 Credit Card Gambling Ban…»)
     ложится на 390 в четыре строки — на них и рассчитан кегль */
  .ozk-hero-s h1{font-size:22.5px;line-height:1.15}
  .ozk-hero-s .ozk-crumb{font-size:12px;margin-bottom:6px}
  .ozk-hero-s .ozk-eyebrow{font-size:10.5px;letter-spacing:.16em}
}

/* верх листа: лид, подпись и факты, которые ушли из полосы */
.ozk-open{margin:0 0 26px}
.ozk-open-l{font:400 19px/1.62 var(--ozk-ui);color:var(--ozk-ink);margin:0}
.ozk-open .ozk-by{margin:12px 0 0;font:400 13.5px/1.5 var(--ozk-ui);color:var(--ozk-ink-2)}
.ozk-open .ozk-by a{color:var(--ozk-acc);text-decoration:none;border-bottom:1px solid var(--ozk-line)}
.ozk-open .ozk-by a:hover{color:var(--ozk-ink)}
.ozk-open-f{display:flex;flex-wrap:wrap;gap:8px 24px;margin:14px 0 0;padding:12px 0 0;
  list-style:none;border-top:1px solid var(--ozk-line)}
.ozk-open-f li{margin:0;display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--ozk-ink-2)}
.ozk-open-f svg{flex:0 0 17px;width:17px;height:17px;fill:none;stroke:var(--ozk-acc);stroke-width:1.8}
@media (max-width:640px){.ozk-open{margin-bottom:20px}.ozk-open-l{font-size:17px}}

/* ---------- ozk:ico (свои иконки) ---------- */
.ozk-ico{flex:0 0 20px;width:20px;height:20px;fill:none;stroke:var(--ozk-acc);stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;vertical-align:-4px}
ul.ozk-tick{list-style:none;padding:0;margin:16px 0 0}
ul.ozk-tick li{display:flex;gap:11px;align-items:flex-start;margin:11px 0;line-height:1.55}
ul.ozk-tick .ozk-ico{margin-top:2px}

/* ---------- ozk:rail (рельс обзорной страницы) ---------- */
.ozk-cols{display:grid;grid-template-columns:minmax(0,1fr) 296px;gap:var(--ozk-gap);align-items:start;
  max-width:var(--ozk-w-frame);margin:0 auto}
.ozk-cols>.ozk-sheet{max-width:none;margin:0}
@media (max-width:1000px){.ozk-cols{grid-template-columns:minmax(0,1fr)}}
.ozk-rl{display:flex;flex-direction:column;gap:16px;min-width:0}
.ozk-rl-b{border:1px solid var(--ozk-line);background:var(--ozk-paper);padding:16px var(--ozk-pad)}
.ozk-rl-b h3{margin:0 0 12px;font:700 11.5px/1.2 var(--ozk-ui);letter-spacing:.2em;text-transform:uppercase;color:var(--ozk-acc)}
.ozk-rl-top{list-style:none;margin:0;padding:0;counter-reset:rl}
.ozk-rl-top li{display:grid;grid-template-columns:18px 34px 1fr auto;gap:9px;align-items:center;
  margin:0;padding:9px 0;border-top:1px solid var(--ozk-line-2);font-size:14px}
.ozk-rl-top li:first-child{border-top:0}
.ozk-rl-top .n{color:var(--ozk-ink-3);font-weight:700}
.ozk-rl-top img{width:34px;height:34px;object-fit:contain}
.ozk-rl-top a.nm{color:var(--ozk-ink);text-decoration:none;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ozk-rl-top a.go{font:700 11px/1 var(--ozk-ui);letter-spacing:.08em;text-transform:uppercase;
  color:#fff!important;background:var(--ozk-cta);padding:9px 10px;text-decoration:none;min-height:34px;
  display:flex;align-items:center}
.ozk-rl-top a.go:hover{background:var(--ozk-cta-dk)}
.ozk-rl-lnk{list-style:none;margin:0;padding:0}
.ozk-rl-lnk li{margin:0;padding:8px 0;border-top:1px solid var(--ozk-line-2);font-size:14.5px;line-height:1.45}
.ozk-rl-lnk li:first-child{border-top:0}
.ozk-rl-lnk a{display:flex;gap:9px;align-items:flex-start;color:var(--ozk-ink);text-decoration:none}
.ozk-rl-lnk a:hover{color:var(--ozk-acc)}
.ozk-rl-lnk .ozk-ico{width:17px;height:17px;flex:0 0 17px;margin-top:2px}
.ozk-rl-help{background:var(--ozk-ink);border-color:var(--ozk-ink);color:#C3C8D0;font-size:13.5px;line-height:1.6}
.ozk-rl-help h3{color:#96C6B7}
.ozk-rl-help b{color:#fff}
.ozk-rl-help a{color:#fff}

/* ---------- ozk:verdict (шапка обзора) ---------- */
/* три ребёнка в двухколоночной сетке = кнопка падает в колонку логотипа и сыплется
   по букве в столбик на мобиле — раскладка задаётся ОБЛАСТЯМИ, не потоком */
.ozk-vd{display:grid;grid-template-columns:96px minmax(0,1fr);grid-template-areas:"l t" "c c";
  gap:16px 18px;align-items:center;padding-bottom:20px;border-bottom:1px solid var(--ozk-line)}
.ozk-vd-logo{grid-area:l;display:flex;width:96px;height:96px;align-items:center;justify-content:center;
  background:var(--ozk-paper);border:1px solid var(--ozk-line-2);padding:8px}
.ozk-vd-logo img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.ozk-vd>div{grid-area:t;min-width:0}
.ozk-vd-cta{grid-area:c;justify-self:start;display:inline-block;margin-top:0;padding:13px 26px;
  min-height:44px;white-space:nowrap;background:var(--ozk-cta);
  color:#fff!important;text-decoration:none;font:700 13.5px/1.3 var(--ozk-ui);letter-spacing:.08em;text-transform:uppercase}
.ozk-vd-cta:hover{background:var(--ozk-cta-dk)}
@media (max-width:560px){
  /* колонка текста на 390 высокая: по центру логотип уезжает к середине списка */
  .ozk-vd{grid-template-columns:64px minmax(0,1fr);gap:12px;align-items:start}
  .ozk-vd-logo{width:64px;height:64px;padding:5px}
  .ozk-vd-cta{justify-self:stretch;text-align:center;padding:13px 12px}}

/* ---------- ozk:prose — правила донорского тела по ГОЛОМУ тегу ----------
   :where() даёт специфичность (0,0,1) и не мешает своим классам;
   наш лист грузится последним, поэтому побеждает без !important       */
:where(.ozk-page) nav{position:static;background:none;width:auto;height:auto;z-index:auto;transform:none}
:where(.ozk-page) header,:where(.ozk-page) footer{background:none;width:auto;max-width:none;position:static}
:where(.ozk-page) figcaption{color:var(--ozk-ink-2)}
body.ozk-page::before,body.ozk-page::after{content:none}
.ozk-prose{min-width:0}
.ozk-prose>*:first-child{margin-top:0}
/* типографика статьи не заходит внутрь витрины: там свои размеры строки */
.ozk-prose :is(p,li,dd,dt,td,th):not(.ozkv-wrap *,.ozk-clu *,.ozk-vd *){
  font-family:var(--ozk-ui);font-size:17px;line-height:1.68}
.ozk-prose td,.ozk-prose th{font-size:15.5px;line-height:1.5}
.ozk-prose div{max-width:100%}
.ozk-prose a{word-break:break-word}
.ozk-prose [style*="color:#fff"],.ozk-prose [style*="color: #fff"],
.ozk-prose [style*="color:#ffffff"]{color:var(--ozk-ink)!important}