/* extra-betting.com — хабы главной (этап 08b). Подключается только на «/». Префикс exb-hb. */
.exb-jump{margin:14px 0 0}
.exb-jump a{display:inline-flex;align-items:center;gap:8px;background:var(--acc);color:#fff;font-family:var(--disp);font-weight:700;font-size:17px;letter-spacing:.02em;text-transform:uppercase;text-decoration:none;padding:9px 16px;border-radius:var(--r)}
.exb-jump a:hover{background:var(--acc-d);color:#fff}
#exbv-top{scroll-margin-top:16px}

/* общий каркас хаба: сбросы пишутся с префиксом листа, иначе .content-area img/h3 побеждают */
.content-area .exb-hb{margin:30px 0 34px;padding:0;max-width:100%}
.content-area .exb-hb ul,.content-area .exb-hb ol{list-style:none;margin:0;padding:0}
.content-area .exb-hb li{margin:0;padding-left:0;text-indent:0}
.content-area .exb-hb li::before{content:none}
.content-area .exb-hb a{text-decoration:none;color:inherit;overflow-wrap:normal}
.content-area .exb-hb img{border:0;border-radius:0;display:block;max-width:100%}
.content-area .exb-hb h3.exb-hb-h{font-family:var(--disp);font-size:26px;line-height:1.1;margin:0 0 6px;letter-spacing:.01em}
.exb-hb-k{display:inline-block;font-family:var(--disp);font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--acc-d);margin:0 0 4px}
.content-area .exb-hb p.exb-hb-i{font-size:15.5px;line-height:1.6;color:var(--ink2);margin:0 0 16px;max-width:var(--txt)}
.content-area .exb-hb p.exb-hb-i a{color:var(--acc-d);text-decoration:underline;text-underline-offset:2px}
.exb-hb-t{display:block;font-family:var(--disp);font-weight:700;font-size:19px;line-height:1.15;color:var(--ink)}
.exb-hb-c{display:block;font-size:14px;line-height:1.5;color:var(--ink2);margin-top:4px}
.content-area .exb-hb p.exb-hb-all{margin:14px 0 0;font-size:15px}
.content-area .exb-hb p.exb-hb-all a{color:var(--acc-d);font-weight:500;border-bottom:1px solid currentColor}
.exb-hb a:hover .exb-hb-t{color:var(--acc-d)}
.exb-hb a:focus-visible{outline:2px solid var(--acc);outline-offset:2px}

/* 1. ведущая карточка + строки (крикет) */
.exb-hb--lead .exb-hb-g{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:18px}
.exb-hb--lead .exb-hb-big a{display:block;background:var(--canvas);border-radius:var(--r);overflow:hidden;height:100%}
.exb-hb--lead .exb-hb-big img{width:100%;aspect-ratio:760/470;object-fit:cover}
.exb-hb--lead .exb-hb-big span.exb-hb-b{display:block;padding:14px 16px 16px}
.exb-hb--lead .exb-hb-big .exb-hb-t{color:#fff;font-size:24px}
.exb-hb--lead .exb-hb-big .exb-hb-c{color:var(--onDark)}
.exb-hb--lead .exb-hb-big a:hover .exb-hb-t{color:var(--accOn)}
.exb-hb--lead .exb-hb-rows li+li{border-top:1px solid var(--line)}
.exb-hb--lead .exb-hb-rows a{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:center;padding:8px 0}
.exb-hb--lead .exb-hb-rows img{width:96px;height:68px;object-fit:cover;border-radius:var(--r)}
.exb-hb--lead .exb-hb-rows .exb-hb-t{font-size:17px}
.exb-hb--lead .exb-hb-rows .exb-hb-c{font-size:13.5px;margin-top:2px}

/* 2. папка документов (право) */
.exb-hb--file{background:var(--sand);border-left:4px solid var(--acc2);padding:22px 22px 18px}
.content-area .exb-hb.exb-hb--file{padding:22px 22px 18px}
.exb-hb--file .exb-hb-k{color:var(--acc2)}
.exb-hb--file ol{counter-reset:exbdoc}
.exb-hb--file ol li{counter-increment:exbdoc;position:relative;border-top:1px dashed var(--line2)}
.exb-hb--file ol a{display:grid;grid-template-columns:34px 130px minmax(0,1fr);gap:14px;align-items:center;padding:12px 0}
.exb-hb--file ol a::before{content:counter(exbdoc,decimal-leading-zero);font-family:var(--disp);font-weight:700;font-size:22px;color:var(--acc2)}
.exb-hb--file img{width:130px;height:85px;object-fit:cover;border-radius:var(--r);filter:saturate(.85)}
.exb-hb--file .exb-hb-tag{display:inline-block;font-size:11.5px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:#fff;background:var(--acc2);border-radius:2px;padding:2px 7px;margin-bottom:4px}

/* 3. купоны (бонусы) */
.exb-hb--coupon .exb-hb-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.exb-hb--coupon li a{display:flex;flex-direction:column;height:100%;background:#fff;border:1px solid var(--line2);border-radius:6px;position:relative;overflow:hidden}
.exb-hb--coupon li a::after{content:"";position:absolute;left:-1px;right:-1px;top:146px;border-top:2px dashed var(--line2)}
.exb-hb--coupon .exb-hb-ph{height:146px;display:block;background:var(--sand2)}
.exb-hb--coupon .exb-hb-ph img{width:100%;height:146px;object-fit:cover}
.exb-hb--coupon .exb-hb-b{display:block;padding:16px 16px 18px}
.exb-hb--coupon .exb-hb-tag{display:inline-block;font-family:var(--disp);font-weight:700;font-size:15px;color:var(--acc-d);border:1.5px solid var(--acc);border-radius:2px;padding:1px 8px;margin-bottom:8px}
.exb-hb--coupon li a:hover{border-color:var(--acc)}

/* 4. расчёт (коэффициенты) */
.exb-hb--calc ul{border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.exb-hb--calc li+li{border-top:1px solid var(--line)}
.exb-hb--calc a{display:grid;grid-template-columns:52px 190px minmax(0,1fr);gap:16px;align-items:center;padding:14px 16px;background:#fff}
.exb-hb--calc li:nth-child(even) a{background:#fdfbf7}
.exb-hb--calc a:hover{background:var(--sand)}
.exb-hb--calc svg{width:52px;height:52px;display:block}
.exb-hb--calc .exb-hb-n{font-family:var(--disp);font-weight:700;font-size:24px;line-height:1.05;color:var(--acc-d);font-variant-numeric:tabular-nums}

/* 5. мозаика спорта (подпись поверх кадра без текста) */
.exb-hb--mosaic .exb-hb-g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:150px;gap:8px}
.exb-hb--mosaic li:nth-child(1){grid-column:span 2;grid-row:span 2}
.exb-hb--mosaic li:nth-child(6){grid-column:span 2}
.exb-hb--mosaic a{display:block;position:relative;height:100%;border-radius:var(--r);overflow:hidden;background:var(--canvas)}
.exb-hb--mosaic img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.exb-hb--mosaic a:hover img{transform:scale(1.04)}
.exb-hb--mosaic .exb-hb-b{position:absolute;left:0;right:0;bottom:0;padding:26px 12px 10px;background:linear-gradient(transparent,rgba(20,18,16,.88))}
.exb-hb--mosaic .exb-hb-t{color:#fff;font-size:19px;text-transform:uppercase;letter-spacing:.03em}
.exb-hb--mosaic li:nth-child(1) .exb-hb-t{font-size:28px}
.exb-hb--mosaic .exb-hb-c{color:var(--onDark);font-size:13px;margin-top:1px}
.exb-hb--mosaic a:hover .exb-hb-t{color:var(--accOn)}

/* 6. разворот (приложения) */
.exb-hb--spread .exb-hb-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;border:1px solid var(--line2);border-radius:var(--r);overflow:hidden;background:#fff}
.exb-hb--spread .exb-hb-big a{display:block;height:100%;position:relative}
.exb-hb--spread .exb-hb-big img{width:100%;height:100%;min-height:330px;object-fit:cover}
.exb-hb--spread .exb-hb-big .exb-hb-b{position:absolute;left:14px;right:14px;bottom:14px;background:#fff;border-radius:var(--r);padding:12px 14px;box-shadow:var(--sh)}
.exb-hb--spread .exb-hb-side{display:flex;flex-direction:column}
.exb-hb--spread .exb-hb-side li{flex:1;border-bottom:1px solid var(--line)}
.exb-hb--spread .exb-hb-side li:last-child{border-bottom:0}
.exb-hb--spread .exb-hb-side a{display:grid;grid-template-columns:minmax(0,1fr) 112px;gap:14px;align-items:center;padding:14px 16px;height:100%}
.exb-hb--spread .exb-hb-side img{width:112px;height:76px;object-fit:cover;border-radius:var(--r)}
.exb-hb--spread .exb-hb-duo{display:flex;gap:6px;width:112px;height:76px;align-items:center;justify-content:center;background:var(--sand);border-radius:var(--r)}
.content-area .exb-hb--spread .exb-hb-duo img{width:50px;height:auto;object-fit:contain;border-radius:0}
.exb-hb--spread .exb-hb-side a:hover{background:var(--sand)}

/* 7. лента с прокруткой (правила расчёта) */
.exb-hb--strip .exb-hb-g{display:flex;flex-wrap:nowrap;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 0 12px;scrollbar-width:thin}
.exb-hb--strip li{flex:0 0 238px;scroll-snap-align:start}
.exb-hb--strip li a{display:block;height:100%;background:var(--canvas);border-radius:var(--r);overflow:hidden}
.exb-hb--strip img{width:100%;height:150px;object-fit:cover}
.exb-hb--strip .exb-hb-b{display:block;padding:12px 14px 14px;border-top:3px solid var(--acc)}
.exb-hb--strip .exb-hb-t{color:#fff;font-size:18px}
.exb-hb--strip .exb-hb-c{color:var(--onDark2);font-size:13.5px}
.exb-hb--strip li a:hover .exb-hb-t{color:var(--accOn)}

/* 8. фото-сетка с подписью под кадром (прогнозы) */
.exb-hb--grid .exb-hb-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 16px}
.exb-hb--grid a{display:block}
.exb-hb--grid img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:var(--r)}
.exb-hb--grid .exb-hb-b{display:block;padding:10px 0 0;border-bottom:2px solid var(--line);padding-bottom:10px}
.exb-hb--grid a:hover .exb-hb-b{border-bottom-color:var(--acc)}

/* 9. касса (платёжные методы) */
.exb-hb--cash ul{display:grid;gap:8px}
.exb-hb--cash a{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:16px;align-items:center;padding:10px 16px 10px 10px;background:#fff;border:1px solid var(--line);border-radius:var(--r)}
.exb-hb--cash a:hover{border-color:var(--acc)}
.exb-hb--cash .exb-hb-lg{display:flex;align-items:center;justify-content:center;width:120px;height:64px;background:var(--sand);border-radius:var(--r)}
.content-area .exb-hb--cash .exb-hb-lg img{max-width:92px;max-height:44px;width:auto;height:auto}
.exb-hb--cash .exb-hb-lg svg{width:44px;height:44px}
.exb-hb--cash .exb-hb-tag{font-size:12px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--ink2);border:1px solid var(--line2);border-radius:20px;padding:3px 10px;white-space:nowrap}

/* авторы фото Commons */
.content-area details.exb-hb-cr{margin:0 0 30px;max-width:var(--txt);font-size:12.5px;background:transparent}
.content-area details.exb-hb-cr summary{font-size:13px;padding:7px 12px;color:var(--ink2)}
.content-area details.exb-hb-cr p{font-size:12.5px;line-height:1.55;color:var(--ink3);padding:0 12px 10px;margin:0}

/* донорский промо-блок бренда в тексте главной (08b.9б): разметка донора не меняется */
.content-area #featured-container{display:grid;grid-template-columns:120px minmax(0,1fr) auto;grid-template-areas:"lg t b" "lg s b";gap:2px 18px;align-items:center;background:var(--canvas);border-left:4px solid var(--acc);border-radius:var(--r);padding:14px 18px;margin:0 0 1.2em;max-width:var(--txt)}
.content-area #featured-logo{grid-area:lg;width:120px;height:52px;object-fit:contain;background:#fff;border:0;border-radius:var(--r);padding:6px}
.content-area #featured-text{grid-area:t;font-family:var(--disp);font-weight:700;font-size:20px;color:#fff;line-height:1.1}
.content-area #featured-subtitle{grid-area:s;font-size:13.5px;color:var(--onDark2)}
.content-area #featured-bono{grid-area:b;font-family:var(--disp);font-weight:700;font-size:22px;color:var(--accOn);white-space:nowrap}

@media (max-width:900px){
.exb-hb--coupon .exb-hb-g{grid-template-columns:repeat(2,minmax(0,1fr))}
.exb-hb--calc a{grid-template-columns:44px 150px minmax(0,1fr)}
.exb-hb--calc svg{width:44px;height:44px}
}
@media (max-width:640px){
.content-area .exb-hb h3.exb-hb-h{font-size:22px}
.exb-hb--lead .exb-hb-g,.exb-hb--spread .exb-hb-g{grid-template-columns:1fr}
.exb-hb--lead .exb-hb-big .exb-hb-t{font-size:21px}
.content-area .exb-hb.exb-hb--file{padding:16px 14px 12px}
.exb-hb--file ol a{grid-template-columns:88px minmax(0,1fr);gap:12px}
.exb-hb--file ol a::before{display:none}
.exb-hb--file img{width:88px;height:64px}
.exb-hb--coupon .exb-hb-g{grid-template-columns:1fr}
.exb-hb--coupon li a{flex-direction:row}
.exb-hb--coupon li a::after{display:none}
.exb-hb--coupon .exb-hb-ph,.exb-hb--coupon .exb-hb-ph img{width:104px;height:auto;min-height:100%;flex:0 0 104px}
.exb-hb--coupon .exb-hb-ph{border-right:2px dashed var(--line2)}
.exb-hb--coupon .exb-hb-b{padding:12px 14px}
.exb-hb--calc a{grid-template-columns:40px minmax(0,1fr);gap:4px 12px;padding:12px}
.exb-hb--calc svg{width:40px;height:40px;grid-row:span 2}
.exb-hb--calc .exb-hb-n{font-size:20px}
.exb-hb--mosaic .exb-hb-g{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:132px}
.exb-hb--mosaic li:nth-child(1){grid-column:span 2;grid-row:span 2}
.exb-hb--mosaic li:nth-child(6){grid-column:auto}
.exb-hb--mosaic li:nth-child(8){grid-column:span 2}
.exb-hb--mosaic li:nth-child(1) .exb-hb-t{font-size:23px}
.exb-hb--mosaic .exb-hb-t{font-size:17px}
.exb-hb--spread .exb-hb-big img{min-height:240px;max-height:300px}
.exb-hb--spread .exb-hb-side a{grid-template-columns:minmax(0,1fr) 88px;padding:12px}
.exb-hb--spread .exb-hb-side img,.exb-hb--spread .exb-hb-duo{width:88px;height:62px}
.content-area .exb-hb--spread .exb-hb-duo img{width:38px}
.exb-hb--strip li{flex-basis:216px}
.exb-hb--grid .exb-hb-g{grid-template-columns:1fr 1fr;gap:16px 12px}
.exb-hb--grid .exb-hb-t{font-size:16.5px}
.exb-hb--grid .exb-hb-c{font-size:13px}
.exb-hb--cash a{grid-template-columns:84px minmax(0,1fr);gap:12px;padding:8px 12px 8px 8px}
.exb-hb--cash .exb-hb-lg{width:84px;height:56px}
.content-area .exb-hb--cash .exb-hb-lg img{max-width:68px;max-height:36px}
.exb-hb--cash .exb-hb-tag{display:none}
.content-area #featured-container{grid-template-columns:96px minmax(0,1fr);grid-template-areas:"lg t" "lg s" "b b";padding:12px 14px}
.content-area #featured-logo{width:96px;height:44px}
}
