/**
 * style.css — тільки те, чого немає в дизайні ipu.bet.
 * -------------------------------------------------------------------------
 * Базу (шрифти Gilroy, типографіка, .wrap/.btn/.hdr/.ftr/.cta/.lang-box, кольори)
 * дає css/site.min.css — копія з ipu.bet (public/landing/css/site.min.css),
 * тому ленд виглядає як сторінки сайту. Оновити = скопіювати файл знову.
 * Тут лишаються: смуга довіри в hero, шапка секції рейтингу з дропдауном країни
 * і вкладками, картки рейтингу (wcard / pr-card — теж з проду) і блок
 * відповідальної гри.
 */

/* На ipu.bet при ≤860px CSS підміняє логотип на квадратний знак (content:url).
   Нам він не потрібен: у шапці ленда лише «Грати» і мова, повний логотип вміщається,
   а зайва картинка ставала LCP-елементом на телефоні. */
@media (max-width:860px){.hdr .logo img{content:normal}}

/* На головній ipu.bet H1 зібраний із трьох рядків-<span>, тому там `.hero h1 span{display:block}`.
   У нас H1 — одне речення, у якому <span class="gr"> підсвічує лише тип («казино»), і від
   блочного span воно рвалося на рядки: «Рейтинг лучших / казино / : Албания, Сентябрь 2026». */
.hero h1 span{display:inline}

/* до першого render() з JS (див. index.html) — місце зарезервоване, текст невидимий */
.js-pending .hero,.js-pending #rating{visibility:hidden}
#rating{scroll-margin-top:80px}
.flag{font-size:17px;line-height:1}

/* смуга довіри під кнопками hero */
.trust{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px;margin-top:38px}
.trust__item{display:flex;align-items:center;gap:13px;background:var(--surf);border:1px solid var(--line-2);border-radius:18px;padding:14px 16px}
.trust__ico{width:38px;height:38px;border-radius:12px;background:#ffffff0d;border:1px solid var(--line-2);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.trust__title{font-weight:600;font-size:14.5px;letter-spacing:-.01em}
.trust__sub{font-size:12.5px;color:var(--mut)}

/* шапка секції рейтингу: заголовок ліворуч, країна + вкладки праворуч */
.rating__head{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-end;justify-content:space-between;margin-bottom:clamp(22px,2.4vw,34px)}
.rating__head .lbl{margin-bottom:14px}
.rating__ctl{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.tabs{display:flex;gap:4px;background:#ffffff0a;border:1px solid var(--line-2);border-radius:16px;padding:4px}
.tab{border:0;border-radius:12px;padding:10px 16px;font:inherit;font-size:13.5px;font-weight:500;background:transparent;color:#a9a9b4;cursor:pointer;white-space:nowrap;transition:.2s}
.tab:hover{color:#fff}
.tab.is-active{background:#54a7ff1a;color:var(--blue)}

/* дропдаун країни — у стилі .lang-box з ipu.bet, плюс пошук */
.dd{position:relative}
.dd__btn{display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border-radius:14px;background:#ffffff0d;border:1px solid var(--line);color:#e8e8ee;font:inherit;font-size:13.5px;font-weight:500;cursor:pointer;white-space:nowrap;transition:.2s}
.dd__btn:hover,.dd.open .dd__btn{border-color:#54a7ff66}
.dd__btn svg{opacity:.55;transition:transform .25s}
.dd.open .dd__btn svg{transform:rotate(180deg)}
.dd__list{position:absolute;top:calc(100% + 8px);left:0;min-width:280px;padding:8px;border-radius:18px;background:#0c0c10;border:1px solid var(--line);box-shadow:0 26px 60px #0009;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.22s;z-index:60}
.dd.open .dd__list{opacity:1;visibility:visible;transform:none}
.dd__search{width:100%;padding:10px 12px;margin-bottom:6px;border-radius:12px;border:1px solid var(--line-2);background:#ffffff0a;color:#e8e8ee;font:inherit;font-size:13.5px;outline:none}
.dd__search:focus{border-color:#54a7ff66}
.dd__scroll{max-height:min(60vh,340px);overflow-y:auto;overscroll-behavior:contain}
.dd__opt{display:flex;width:100%;align-items:center;gap:10px;padding:9px 12px;border:0;border-radius:12px;background:transparent;color:#a9a9b4;font:inherit;font-size:13.5px;font-weight:500;text-align:left;cursor:pointer;transition:.18s}
.dd__opt:hover{background:#ffffff0d;color:#fff}
.dd__opt.on{color:var(--blue);background:#54a7ff1a}
.dd__empty{padding:12px;color:var(--mut-2);font-size:13.5px}
.lang-menu a b{display:inline-block;width:26px;color:var(--mut-2);font-weight:600}

/* список карток */
.list{display:flex;flex-direction:column}
.empty{color:var(--mut);text-align:center;padding:40px 0}

/* operator card — 1:1 з ipu.bet (resources/views/partials/casino-rating-card-styles.blade.php, режим wcard--list) */
.wcard{--wc-bg:#141c2e;--wc-bg-2:#172035;--wc-border:rgba(255,255,255,.07);--wc-text:#eaeef7;--wc-muted:#8b95ab;--wc-muted-2:#64708a;--wc-blue:#3b82f6;--wc-blue-2:#2563eb;--wc-green:#22c55e;--wc-gold-1:#fbbf24;--wc-gold-2:#f59e0b;--wc-gold-3:#f97316;--wc-accent:rgba(255,255,255,.14);
  position:relative;background:linear-gradient(180deg,var(--wc-bg-2) 0%,var(--wc-bg) 100%);border:1px solid var(--wc-border);border-radius:20px;box-shadow:0 18px 44px -18px rgba(0,0,0,.55);margin-bottom:12px;width:100%;color:var(--wc-text);overflow:hidden}
.wcard::before{content:'';position:absolute;top:14px;bottom:14px;left:0;width:4px;border-radius:0 4px 4px 0;background:var(--wc-accent)}
.wcard--exclusive{--wc-accent:linear-gradient(180deg,#34d399,#16a34a)}
.wcard--new{--wc-accent:linear-gradient(180deg,#60a5fa,#2563eb)}
.wcard-inner{padding:18px 24px 18px 42px}
.wcard-body{display:flex;align-items:center;gap:14px;min-width:0}
.wcard-col-left{flex:0 0 264px;display:flex;flex-direction:row;align-items:center;gap:16px;min-width:0}
.wcard-logo{flex:0 0 92px;width:92px;aspect-ratio:92/58;background:#0a0f1a;border:1px solid rgba(255,255,255,.06);border-radius:12px;display:flex;align-items:center;justify-content:center;overflow:hidden;font-size:28px;font-weight:800;color:#5b6680;text-decoration:none;transition:border-color .2s,filter .2s}
.wcard-logo:hover{border-color:rgba(255,255,255,.18);filter:brightness(1.08)}
.wcard-logo img{width:100%;height:100%;object-fit:cover;display:block}
.wcard-ident{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.wcard-name{display:flex;align-items:center;gap:7px;font-size:20px;font-weight:800;color:#fff;line-height:1.1;min-width:0;overflow-wrap:anywhere}
.wcard-name__link{color:inherit;text-decoration:none;transition:color .2s}
.wcard-name__link:hover{color:#FFD52F}
.wcard-verified{width:17px;height:17px;color:var(--wc-blue);flex-shrink:0}
.wcard-meta{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;min-width:0}
.wcard-payment{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--wc-muted)}
.wcard-payment__dot{width:6px;height:6px;border-radius:50%;background:var(--wc-gold-2);flex-shrink:0}
.wcard-payment+.wcard-rating::before{content:'·';margin-right:4px;color:var(--wc-muted-2)}
.wcard-rating{display:flex;align-items:center;gap:6px;font-size:13px}
.wcard-rating__star{color:var(--wc-gold-2);font-size:14px}
.wcard-rating__val{font-weight:800;color:#fff}
.wcard-col-mid{flex:1;min-width:0;display:flex;flex-direction:row;align-items:center;gap:16px;border-left:1px solid var(--wc-border);padding-left:14px}
.wbonus{position:relative;overflow:hidden;min-width:0}
.wbonus--welcome{flex:1;min-width:0;padding:2px 12px 2px 0;background:none;border:none}
.wbonus--promo{flex:0 0 238px;background:none;border:none}
.wbonus--nopromo{flex:0 0 238px;display:flex;flex-direction:column;gap:6px;padding-left:2px;min-width:0}
.wbonus__nopromo-t{font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--wc-muted-2)}
.wbonus__nopromo-d{font-size:13px;line-height:1.45;color:var(--wc-muted)}
.wbonus__media{position:absolute;top:0;right:0;bottom:0;width:46%;border-radius:0 14px 14px 0;background-image:var(--wbonus-art);background-size:cover;background-position:center right;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.7) 45%,#000 100%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.7) 45%,#000 100%);opacity:.72;pointer-events:none}
.wbonus--welcome .wbonus__content{min-width:0}
.wbonus--welcome .wbonus__headline{max-width:62%}
.wbonus--welcome .wbonus__sub{max-width:56%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wbonus__content{position:relative;z-index:1;flex:1;min-width:0}
.wbonus__head{display:flex;align-items:center;gap:8px;margin-bottom:5px}
.wbonus__num{flex-shrink:0;width:19px;height:19px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:800;line-height:1;color:var(--wc-gold-1);border:1.5px solid rgba(251,191,36,.55)}
.wbonus__num--blue{color:#5cc8ee;border-color:rgba(64,205,240,.6)}
.wbonus__label{font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:rgba(251,191,36,.9)}
.wbonus__label--blue{color:rgba(96,180,235,.95)}
.wbonus__headline{font-size:23px;font-weight:900;line-height:1.12;margin-bottom:0;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.wbonus__headline--gold{background:linear-gradient(92deg,#fde68a,#f59e0b 70%,#f97316);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--wc-gold-2)}
.wbonus__sub{margin-top:4px;font-size:12.5px;line-height:1.4;color:var(--wc-muted);overflow-wrap:anywhere}
.wcard--list .wbonus--promo .wbonus__head{display:none}
.wbonus--promo .wcard-promo{margin:0}
.wcard-promo{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;background:rgba(0,0,0,.3);border:1.5px dashed rgba(96,165,250,.35);border-radius:11px}
.wcard-promo__body{min-width:0}
.wcard-promo__lbl{font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--wc-muted);margin-bottom:3px}
.wcard-promo__val{font-size:16px;font-weight:800;color:#fff;letter-spacing:1.5px;overflow-wrap:anywhere}
.wcard-copy{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:9px;background:rgba(59,130,246,.16);border:1px solid rgba(59,130,246,.4);color:#93c5fd;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap;font-family:inherit;transition:all .15s}
.wcard-copy:hover{background:rgba(59,130,246,.26);color:#bfdbfe}
.wcard-copy__ico{display:none;width:17px;height:17px}
.wcard-copy__check{display:none}
.wcard-copy.copied{background:rgba(34,197,94,.15);border-color:rgba(34,197,94,.4);color:#86efac}
.wcard-copy.copied .wcard-copy__label{display:none}
.wcard-copy.copied .wcard-copy__check{display:inline}
.wcard-col-right{flex:0 0 252px;display:flex;flex-direction:column;justify-content:center;gap:12px;padding-left:14px;border-left:1px solid var(--wc-border)}
.wcard-side__bottom{display:flex;flex-direction:column;gap:7px}
.wcard-badge{position:absolute;top:0;bottom:0;left:0;width:21px;display:flex;align-items:center;justify-content:flex-end;padding:16px 0;writing-mode:vertical-rl;transform:rotate(180deg);font-size:10px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase;white-space:nowrap;text-align:center}
.wcard--exclusive::before,.wcard--new::before{display:none}
.wcard-badge--exclusive{background:linear-gradient(180deg,#34d399,#16a34a);color:#05261a}
.wcard-badge--new{background:linear-gradient(180deg,#60a5fa,#2563eb);color:#04162e}
.wcard-cashback{margin-top:-6px;text-align:center;font-size:12px;font-weight:800;line-height:1.3;letter-spacing:.2px;text-transform:uppercase;color:#ffd60a;padding:0 2px;text-shadow:0 0 10px rgba(255,214,10,.45);animation:wc-cashback-blink 1.1s ease-in-out infinite}
@keyframes wc-cashback-blink{0%,100%{opacity:1}50%{opacity:.55}}
.wcard-cta{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:14px 18px;border-radius:12px;background:linear-gradient(95deg,#F88030 0%,#FFD52F 55%,#F8A030 100%);color:#231405;text-decoration:none;font-size:14px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;border:none;cursor:pointer;font-family:inherit;white-space:nowrap;box-shadow:0 10px 26px -8px rgba(248,160,48,.5),inset 0 1px 0 rgba(255,255,255,.5);transition:transform .15s,box-shadow .15s,filter .15s}
.wcard-cta:hover{color:#231405;transform:translateY(-1px);filter:brightness(1.05);box-shadow:0 14px 32px -8px rgba(248,160,48,.65),inset 0 1px 0 rgba(255,255,255,.55)}
.wcard-cta:active{transform:translateY(0) scale(.99)}
.wcard-cta__arrow{width:16px;height:16px}
.wcard-detail-btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 16px;border-radius:12px;background:linear-gradient(135deg,#2563eb,#3b82f6);border:none;color:#fff;font-size:13px;font-weight:800;letter-spacing:.4px;cursor:pointer;font-family:inherit;white-space:nowrap;width:100%;box-shadow:0 8px 20px -8px rgba(37,99,235,.6);transition:transform .15s,filter .15s;text-decoration:none}
.wcard-detail-btn:hover{color:#fff;filter:brightness(1.08);transform:translateY(-1px)}
@media (max-width:980px){
  .wcard-body{flex-wrap:wrap}
  .wcard-col-left{flex:0 0 260px}
  .wcard-col-mid{flex:1 1 340px;flex-wrap:wrap}
  .wbonus--welcome{flex:1 1 260px}
  .wcard-col-right{flex:1 1 100%;border-left:none;padding-left:0;border-top:1px solid var(--wc-border);padding-top:18px;flex-direction:row;flex-wrap:wrap;align-items:flex-start;gap:12px 16px}
  .wcard-side__bottom{flex:1 1 100%;flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px}
  .wcard-cashback{flex:1 1 100%;order:2;margin-top:0}
  .wcard-side__bottom .wcard-cta{flex:1 1 220px}
  .wcard-detail-btn{flex:1 1 180px;width:auto}
}
@media (max-width:860px){
  .wcard--list .wbonus--welcome .wbonus__media,.wcard--list .wbonus--welcome .wbonus__sub{display:none}
  .wcard--list .wbonus__headline{max-width:none}
  .wcard--list .wbonus--welcome .wbonus__headline{margin:0;font-size:15px;line-height:1.3}
}
@media (max-width:620px){
  .wcard{border-radius:16px;margin-bottom:10px}
  .wcard--list .wcard-inner{padding:10px}
  .wcard::before{top:10px;bottom:10px;width:3px}
  .wcard-body{display:grid;grid-template-columns:52px repeat(7,minmax(0,1fr));column-gap:10px;row-gap:3px;align-items:start}
  .wcard-col-left,.wcard-ident,.wcard-col-right,.wcard-side__bottom{display:contents}
  .wcard-col-right{padding-top:0;border-top:none}
  .wcard-logo{grid-column:1;grid-row:1/span 2;width:52px;aspect-ratio:1/1;align-self:start;border-radius:12px;font-size:20px}
  .wcard-logo img{object-fit:contain}
  .wcard-name{grid-column:2/-1;grid-row:1;font-size:17px;gap:5px;min-width:0;overflow-wrap:anywhere;line-height:1.05;align-self:end}
  .wcard-verified{width:16px;height:16px}
  .wcard--exclusive .wcard-name,.wcard--new .wcard-name{grid-column:2/6}
  .wcard--exclusive::before,.wcard--new::before{display:block}
  .wcard-badge{position:static;writing-mode:horizontal-tb;transform:none;width:auto;top:auto;bottom:auto;left:auto;grid-column:6/-1;grid-row:1;justify-self:end;align-self:end;max-width:132px;padding:4px 8px;border-radius:8px;font-size:9px;letter-spacing:.2px;line-height:1.25;white-space:normal;box-shadow:none}
  .wcard-meta{grid-column:2/-1;grid-row:2;display:flex;flex-wrap:wrap;align-items:center;gap:2px 7px;min-width:0;align-self:start;margin-top:3px}
  .wcard-payment{gap:5px;font-size:12px}
  .wcard-rating{font-size:12.5px;gap:5px}
  .wcard-col-mid{grid-column:1/-1;grid-row:3;flex-direction:column;align-items:stretch;gap:7px;margin-top:10px;border-left:none;padding-left:0}
  .wcard--list .wbonus--welcome{flex:0 0 auto;padding:9px 12px;border-radius:12px;background:linear-gradient(120deg,#1b1408 0%,#120d06 55%,#0c0a07 100%);border:1px solid rgba(251,191,36,.26);display:block}
  .wcard--list .wbonus--promo,.wbonus--nopromo{flex:0 0 auto;padding:0}
  .wbonus__sub{display:none}
  .wbonus__head{gap:7px;margin-bottom:3px}
  .wbonus__num{display:none}
  .wbonus__label{font-size:9.5px;letter-spacing:.9px}
  .wbonus__headline{font-size:clamp(15px,4.4vw,17px);line-height:1.25;margin-bottom:0}
  .wbonus__media{display:none}
  .wbonus--welcome .wbonus__headline{max-width:none}
  .wcard-promo{flex-direction:row;align-items:center;gap:10px;padding:7px 10px;border-radius:10px}
  .wcard-promo__body{display:flex;align-items:baseline;gap:8px;min-width:0}
  .wcard-promo__lbl{font-size:9.5px;letter-spacing:.5px;margin-bottom:0;flex-shrink:0}
  .wcard-promo__val{font-size:15px;letter-spacing:1.2px}
  .wcard-copy{align-self:auto;justify-content:center;min-width:32px;padding:5px 10px;font-size:11px}
  .wcard-copy__ico{display:block}
  .wcard-copy__label{display:none}
  .wcard-copy__check-txt{display:none}
  .wcard-copy.copied .wcard-copy__ico{display:none}
  .wcard-copy.copied .wcard-copy__check{font-size:15px;line-height:17px}
  .wcard-cashback{grid-column:1/-1;grid-row:6;width:auto;margin-top:7px;padding:0 2px;font-size:11px;line-height:1.25;letter-spacing:.2px}
  .wcard-cta{grid-column:1/5;grid-row:5;width:100%;margin-top:9px;padding:12px 10px;font-size:13px;gap:7px}
  .wcard-detail-btn{grid-column:5/-1;grid-row:5;width:100%;margin-top:9px;padding:12px 10px;font-size:12.5px}
}
@media (max-width:430px){
  .wcard-inner{padding:12px}
  .wcard-body{grid-template-columns:48px repeat(7,minmax(0,1fr));column-gap:8px}
  .wcard-logo{width:48px}
  .wcard-name{font-size:15.5px}
  .wcard-badge{font-size:8px;padding:4px 6px;letter-spacing:0;overflow-wrap:anywhere}
  .wbonus--welcome{padding:9px 11px}
  .wbonus__headline{font-size:clamp(14px,4.2vw,16px)}
}
@media (max-width:345px){
  .wcard-badge{grid-column:1/-1;grid-row:1;justify-self:start;margin-bottom:5px;font-size:8.5px;overflow-wrap:normal}
  .wcard-logo{grid-row:2/span 2}
  .wcard-name,.wcard--exclusive .wcard-name,.wcard--new .wcard-name{grid-column:2/-1;grid-row:2}
  .wcard-meta{grid-row:3}
  .wcard-col-mid{grid-row:4}
  .wcard-cashback{grid-row:5}
  .wcard-cta,.wcard-detail-btn{grid-row:6}
}
@media (prefers-reduced-motion:reduce){.wcard-cashback{animation:none!important}}

/* provider card — 1:1 з ipu.bet (resources/views/landing/provider-rating.blade.php, .pr-card «Полка») */
.pr-card{position:relative;background:linear-gradient(180deg,#172035,#141c2e);border:1px solid rgba(255,255,255,.07);border-radius:20px;margin-bottom:16px;overflow:hidden;box-shadow:0 18px 44px -18px rgba(0,0,0,.55)}
.pr-card__accent{position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#fbbf24,#f59e0b)}
.pr-card__head{display:flex;align-items:center;gap:16px;width:100%;padding:14px 22px 14px 26px;background:none;border:none;cursor:pointer;text-align:left;font-family:inherit;color:inherit;transition:background .18s}
.pr-card__head:hover{background:rgba(255,255,255,.02)}
.pr-card__rank{font-size:17px;font-weight:800;letter-spacing:-.01em;color:#fbbf24;flex-shrink:0}
.pr-card__logo{width:44px;height:44px;border-radius:11px;flex-shrink:0;background:#0a0f1a;border:1px solid rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;color:#5b6680;font-weight:800;font-size:19px;overflow:hidden}
.pr-card__logo img{width:100%;height:100%;object-fit:cover}
.pr-card__name{font-size:19px;font-weight:800;letter-spacing:-.01em;color:#fff}
.pr-card__meta{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;color:#64708a}
.pr-card__meta::before{content:'';width:4px;height:4px;border-radius:50%;background:#3b4457;flex-shrink:0}
.pr-card__chev{margin-left:auto;width:16px;height:16px;color:#64708a;flex-shrink:0;transition:transform .25s ease}
.pr-card[data-open="true"] .pr-card__chev{transform:rotate(180deg)}
.pr-card__body{display:none;padding:0 22px 16px 26px}
.pr-card[data-open="true"] .pr-card__body{display:flex;flex-direction:column;gap:12px}
.pr-card__desc{margin:0;font-size:13px;line-height:1.55;color:#8b95ab;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pr-card__more{display:inline-block;margin:2px 0 0;font-size:12.5px;font-weight:800;color:#c4ccdc;text-decoration:none}
.pr-card__more:hover{color:#fff}
.pr-badge{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.pr-badge--metric{padding:5px 10px;border-radius:8px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);font-size:11.5px;font-weight:700;color:#8b95ab}
.pr-badge--metric .pr-badge__k{color:#8b95ab;font-weight:700}
.pr-badge--metric .pr-badge__v{font-weight:800}
.pr-badge__v--green{color:#4ade80}
.pr-badge__v--vol{color:var(--pr-vol,#94a3b8)}
.pr-badge__k--short{display:none}
.pr-btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;border-radius:11px;border:none;cursor:pointer;font-family:inherit;font-weight:800;text-decoration:none}
.pr-btn--gold{padding:13px 16px;font-size:14px;letter-spacing:.07em;text-transform:uppercase;background:linear-gradient(135deg,#fbbf24 0%,#f59e0b 55%,#f97316 100%);color:#3a2407;box-shadow:0 10px 24px -8px rgba(245,158,11,.6),inset 0 1px 0 rgba(255,255,255,.5);transition:filter .18s}
.pr-btn--gold:hover{filter:brightness(1.06);color:#3a2407}
.pr-btn--ghost{padding:10px 16px;font-size:12.5px;color:#c4ccdc;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);transition:background .18s,color .18s}
.pr-btn--ghost:hover{background:rgba(255,255,255,.09);color:#fff}
.pr-featured{display:flex;align-items:stretch;gap:16px;padding:12px;border-radius:16px;background:linear-gradient(115deg,#1b1408 0%,#121a2b 42%,#131a2a 100%);border:1px solid rgba(251,191,36,.22)}
.pr-featured__thumb{position:relative;display:block;align-self:center;width:96px;min-width:96px;height:96px;border-radius:12px;overflow:hidden;background:#0a0f1a;border:1px solid rgba(255,255,255,.07)}
.pr-featured__thumb--img::before{content:'';position:absolute;inset:-16px;z-index:0;background-image:var(--pr-thumb-img);background-size:cover;background-position:center;filter:blur(14px);opacity:.55}
.pr-featured__thumb img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;display:block}
.pr-thumb-ph{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#5b6680;font-weight:800;font-size:30px}
.pr-featured__main{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:7px}
.pr-featured__head{display:flex;align-items:center;gap:10px;min-width:0}
.pr-featured__tag{flex-shrink:0;padding:3px 8px;border-radius:6px;background:rgba(251,191,36,.14);border:1px solid rgba(251,191,36,.3);font-size:9.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:#fbbf24;white-space:nowrap}
.pr-featured__title{min-width:0;font-size:19px;font-weight:800;letter-spacing:-.01em;color:#fff;text-decoration:none}
.pr-featured__title:hover{color:#fde68a}
.pr-featured__badges{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pr-featured__cta{display:flex;flex-direction:column;justify-content:center;gap:7px;width:196px;flex-shrink:0}
.pr-offer{display:flex;align-items:center;gap:11px;min-width:0}
.pr-offer__partner{position:relative;width:72px;min-width:72px;height:46px;border-radius:9px;overflow:hidden;background:#0a0f1a;border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:#c4ccdc;font-size:10px;font-weight:800;line-height:1.1;text-align:center;padding:0 4px}
.pr-offer__partner img{width:100%;height:100%;object-fit:cover}
.pr-offer__label{flex-shrink:0;padding:3px 8px;border-radius:6px;background:rgba(59,130,246,.16);border:1px solid rgba(59,130,246,.34);font-size:9.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#93c5fd;white-space:nowrap}
.pr-offer__text{min-width:0;font-size:13px;font-weight:700;color:#c4ccdc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pr-offer__site{display:none}
.pr-shelf{display:flex;flex-direction:column;gap:8px}
.pr-shelf__head{display:flex;align-items:center;gap:10px}
.pr-shelf__label{font-size:10.5px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:#64708a}
.pr-shelf__label--short{display:none}
.pr-shelf__rule{flex:1;height:1px;background:rgba(255,255,255,.07)}
.pr-shelf__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.pr-tile{display:flex;align-items:center;gap:10px;min-width:0;padding:9px 11px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);text-decoration:none;transition:background .15s,border-color .15s}
.pr-tile:hover{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12)}
.pr-tile__thumb{position:relative;width:44px;min-width:44px;height:44px;border-radius:9px;overflow:hidden;background:#0a0f1a;border:1px solid rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center}
.pr-tile__thumb img{width:100%;height:100%;object-fit:cover}
.pr-tile__thumb .pr-thumb-ph{font-size:17px}
.pr-tile__body{min-width:0;display:flex;flex-direction:column;gap:3px}
.pr-tile__name{font-size:13px;font-weight:800;color:#eaeef7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pr-tile__meta{display:flex;align-items:center;gap:6px;min-width:0;font-size:11px;font-weight:700;color:#64708a}
.pr-tile__cat{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pr-tile__sep{color:#3b4457}
.pr-tile__rtp{min-width:48px;color:#4ade80;font-weight:800}
.pr-seeall{flex-shrink:0;font-size:12px;font-weight:800;color:#8b95ab;white-space:nowrap;transition:color .15s;text-decoration:none}
.pr-seeall:hover{color:#fff}
@media (max-width:1100px){
  .pr-featured{flex-wrap:wrap}
  .pr-featured__cta{width:100%;flex-direction:row}
  .pr-featured__cta .pr-btn{flex:1}
  .pr-shelf__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:860px){.pr-shelf__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
  .pr-card{border-radius:16px;margin-bottom:14px}
  .pr-card__accent{width:3px}
  .pr-card__head{display:grid;grid-template-columns:min-content min-content minmax(0,1fr) min-content;align-items:center;column-gap:10px;row-gap:1px;padding:11px 12px 11px 14px}
  .pr-card__rank{grid-row:1/span 2;grid-column:1;font-size:14px}
  .pr-card__logo{grid-row:1/span 2;grid-column:2;width:34px;height:34px;border-radius:9px;font-size:15px}
  .pr-card__name{grid-row:1;grid-column:3;font-size:15px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pr-card__meta{grid-row:2;grid-column:3;font-size:10.5px;gap:5px}
  .pr-card__meta::before{display:none}
  .pr-card__chev{grid-row:1/span 2;grid-column:4;width:14px;height:14px}
  .pr-card__body{padding:0 12px 12px 14px}
  .pr-card[data-open="true"] .pr-card__body{gap:9px}
  .pr-card__desc{font-size:11.5px;line-height:1.45}
  .pr-featured{display:grid;grid-template-columns:86px minmax(0,1fr);grid-template-areas:"thumb head" "thumb badges" "offer offer" "cta cta";align-items:start;column-gap:10px;row-gap:8px;padding:9px;border-radius:13px}
  .pr-featured__thumb{grid-area:thumb;width:86px;min-width:86px;height:86px;border-radius:10px}
  .pr-featured__thumb--img::before{inset:-12px;filter:blur(12px)}
  .pr-thumb-ph{font-size:22px}
  .pr-featured__main{display:contents}
  .pr-featured__head{grid-area:head;flex-direction:column;align-items:flex-start;gap:3px}
  .pr-featured__tag{padding:0;background:none;border:none;font-size:9px;letter-spacing:.08em}
  .pr-featured__title{font-size:14px;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .pr-featured__badges{grid-area:badges;display:block;font-size:10.5px;line-height:1.4}
  .pr-badge--metric{display:inline;gap:0;padding:0;border:none;background:none;font-size:10.5px;white-space:normal}
  .pr-badge--metric .pr-badge__k{color:rgba(255,255,255,.42);font-weight:700}
  .pr-badge--metric+.pr-badge--metric::before{content:'·';margin:0 4px;color:rgba(255,255,255,.28)}
  .pr-badge__k--full{display:none}
  .pr-badge__k--short{display:inline}
  .pr-badge--m-vol .pr-badge__k{display:none}
  .pr-offer{grid-area:offer;gap:8px;padding:7px 9px;border-radius:10px;background:rgba(0,0,0,.32);border:1px solid rgba(59,130,246,.26)}
  .pr-offer__partner{display:none}
  .pr-offer__label{padding:0;background:none;border:none;font-size:9px;letter-spacing:.06em}
  .pr-offer__text{font-size:11px}
  .pr-offer__site{display:inline;margin-left:auto;flex-shrink:0;font-size:11px;font-weight:800;color:#93c5fd;text-decoration:none}
  .pr-featured__cta{grid-area:cta;width:auto;flex-direction:column}
  .pr-btn--gold{padding:13px;font-size:13.5px;box-shadow:0 8px 20px -8px rgba(245,158,11,.6),inset 0 1px 0 rgba(255,255,255,.5)}
  .pr-btn--ghost{display:none}
  .pr-shelf{gap:6px}
  .pr-shelf__label--full{display:none}
  .pr-shelf__label--short{display:inline;font-size:9.5px}
  .pr-shelf__grid{display:flex;gap:8px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .pr-shelf__grid::-webkit-scrollbar{display:none}
  .pr-tile{flex:0 0 96px;width:96px;flex-direction:column;align-items:stretch;gap:5px;padding:0;background:none;border:none}
  .pr-tile:hover{background:none;border:none}
  .pr-tile__thumb{width:96px;min-width:96px;height:96px;border-radius:9px}
  .pr-tile__thumb .pr-thumb-ph{font-size:19px}
  .pr-tile__body{gap:2px}
  .pr-tile__name{font-size:11px}
  .pr-tile__meta{font-size:10px}
  .pr-tile__cat,.pr-tile__sep{display:none}
  .pr-tile__rtp{min-width:0}
}

/* відповідальна гра + ліцензія */
.calm{display:flex;gap:20px;align-items:center;flex-wrap:wrap;border-radius:var(--r);border:1px solid var(--line-2);background:var(--surf);padding:24px 28px}
.calm__ico{width:52px;height:52px;border-radius:16px;background:#54a7ff14;border:1px solid rgba(84,167,255,.28);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.calm__body{flex:1;min-width:240px}
.calm h3{margin:0 0 6px;font-size:20px}
.calm p{margin:0;color:var(--mut);font-size:14.5px;line-height:1.6}
.calm__cta{display:flex;flex-direction:column;align-items:center;gap:7px}
.calm__note{font-size:12px;color:var(--mut-2)}
.license{display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding:18px 4px 0;font-size:13px;color:var(--mut)}
.license span:not(.age){flex:1;min-width:240px}
.license a{font-weight:600;color:var(--blue)}
.age i{font-style:normal;border:1.5px solid var(--mut-2);border-radius:7px;padding:1px 6px;font-size:11.5px;font-weight:700;color:#c4c4ce}

/* футер: колонки посилань як на ipu.bet. Сітка на проді розрахована на 5 колонок,
   у нас їх три (опис + документи + допомога), тому опис не має розтягуватись на пів екрана. */
.ftr-g{grid-template-columns:1.4fr 1fr 1fr;max-width:1100px}
.ftr-g a{display:block;padding:5px 0;font-size:13.5px;color:#a9a9b4}
.ftr .ab{margin:18px 0 0;max-width:320px;font-size:13px;line-height:1.6;color:var(--mut)}

@media (max-width:860px){
  /* Арт лишається тільки на десктопі: на телефоні він займав цілий екран перед рейтингом,
     а до списку треба дійти одразу. Саму картинку відсікає <picture> в index.html. */
  .hero-art{display:none}
  .rating__head{flex-direction:column;align-items:stretch}
  .rating__ctl{flex-direction:column;align-items:stretch}
  .dd__btn{width:100%;justify-content:flex-start}
  .dd__btn svg{margin-left:auto}
  .dd__list{left:0;right:0;min-width:0}
  .tabs{overflow-x:auto;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tab{flex:1 0 auto;justify-content:center}
  .calm{padding:20px}
  .calm__cta{align-items:stretch;width:100%}
}
@media (max-width:860px){
  .ftr-g{grid-template-columns:1fr 1fr;max-width:none}
}
@media (max-width:760px){
  /* Кнопка входу зникає, «Грати» лишається: на ipu.bet її ховає бургер із мобільним
     меню, а в реклами інших точок входу немає. */
  .hdr-r>.btn-ghost{display:none}
  .trust{margin-top:26px}
}
@media (max-width:560px){
  .hdr-r>.btn-main{display:inline-flex}
}