:root{
--bg:#0f0f14;
--bg-1:#10151c;
--bg-2:#1c202b;
--bg-3:#262b3a;
--line:rgba(255,255,255,.08);
--text:#fff;
--text-2:rgba(255,255,255,.65);
--text-3:rgba(255,255,255,.45);
--brand:#25ea56;
--brand-hover:#9ae125;
--sidebar-w:300px;
--header-h:64px;
--font:-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
background:var(--bg);
color:var(--text);
font-family:var(--font);
font-size:14px;
line-height:1.4;
-webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}
h1,h2,h3{margin:0;font-weight:700}

.layout{display:flex;min-height:100vh}

.sidebar{
width:var(--sidebar-w);
flex:0 0 var(--sidebar-w);
background:var(--bg-2);
border-right:1px solid var(--line);
position:sticky;top:0;height:100vh;overflow-y:auto;
scrollbar-width:none;-ms-overflow-style:none;
transition:flex-basis .2s,width .2s;
}
.sidebar::-webkit-scrollbar{display:none;width:0;height:0}
body.nav-on .sidebar{flex:0 0 0;width:0;min-width:0;overflow:hidden;border-right:0}
.sidebar__inner{padding:12px 8px;display:flex;flex-direction:column;gap:2px;width:var(--sidebar-w)}
.snav__item{
display:flex;align-items:center;gap:12px;
padding:9px 12px;border-radius:10px;color:var(--text-2);
font-weight:500;white-space:nowrap;
}
.snav__item:hover{background:var(--bg-2);color:var(--text)}
.snav__head{padding:14px 12px 6px;font-size:11px;font-weight:700;letter-spacing:.06em;
text-transform:uppercase;color:var(--text-3)}
.snav__icon{width:20px;height:20px;object-fit:contain;flex:0 0 20px}
.snav__dot{width:6px;height:6px;border-radius:50%;background:var(--text-3);margin:0 7px;flex:0 0 6px}
.snav__label{overflow:hidden;text-overflow:ellipsis}
.snav__bottom{margin-top:12px;padding:12px 4px 4px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:10px}
.snav__lang{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:10px;color:var(--text-2);font-weight:600}
.snav__lang:hover{background:var(--bg-2);color:var(--text)}
.snav__flag{width:20px;height:20px;border-radius:50%;object-fit:cover;flex:0 0 20px}
.snav__app{justify-content:center;text-align:center}

.main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column}

.header{
height:var(--header-h);
display:flex;align-items:center;gap:16px;
padding:0 16px;
background:var(--bg-1);
border-bottom:1px solid var(--line);
position:sticky;top:0;z-index:30;
}
.header__left{display:flex;align-items:center;gap:14px}
.burger{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;
flex:0 0 auto;width:44px;height:44px;border-radius:12px;background:var(--bg-3);transition:background .3s ease}
.burger:hover{background:#394156}
.burger span{width:22px;height:2px;background:var(--text);border-radius:2px}
.logo img{height:30px;width:auto}
.header__tabs{display:flex;align-items:center;gap:6px;flex:1 1 auto;overflow:hidden}
.htab{padding:8px 14px;border-radius:10px;color:var(--text-2);font-weight:600;white-space:nowrap}
.htab:hover{background:var(--bg-2);color:var(--text)}
.htab--active{background:var(--bg-3);color:var(--text)}
.header__right{display:flex;align-items:center;gap:10px}
.hsearch{width:38px;height:38px;border-radius:10px;background:var(--bg-2)}
.hsearch:before{content:"";display:block;width:16px;height:16px;margin:auto;
border:2px solid var(--text-2);border-radius:50%;
box-shadow:7px 7px 0 -5px var(--text-2)}
.lang{width:38px;height:38px;border-radius:10px;background:var(--bg-2);display:flex;align-items:center;justify-content:center}
.lang__flag{width:20px;height:20px;border-radius:50%;object-fit:cover}
.btn{padding:9px 16px;border-radius:10px;font-weight:700;white-space:nowrap}
.btn--ghost{background:transparent;color:var(--text);box-shadow:inset 0 0 0 1px var(--line)}
.btn--ghost:hover{background:var(--bg-2)}
.btn--primary{background:var(--brand);color:#0a1a0d}
.btn--primary:hover{background:var(--brand-hover)}

.content{width:calc(100% - 32px);max-width:1616px;margin:0 auto;padding:20px 0;display:flex;flex-direction:column;gap:28px}

.promo-card{flex:0 0 470px;scroll-snap-align:start;position:relative;
border-radius:16px;overflow:hidden;aspect-ratio:470/260;background:var(--bg-2)}
.promo-card__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.promo-card__content{position:absolute;inset:0;display:flex;flex-direction:column;
align-items:flex-start;justify-content:flex-end;gap:8px;padding:20px;
background:linear-gradient(90deg,rgba(8,10,16,.75) 0%,rgba(8,10,16,.15) 55%,rgba(8,10,16,0) 100%)}
.promo-card__title{font-size:22px;line-height:1.15;max-width:62%;text-shadow:0 2px 8px rgba(0,0,0,.5)}
.promo-card__sub{color:var(--text);font-size:14px;font-weight:600;max-width:62%}
.promo-card__btn{margin-top:4px}

.widget{display:flex;align-items:center;gap:24px;background:var(--bg-2);
border:1px solid var(--line);border-radius:18px;padding:24px;overflow:hidden}
.widget__img{width:300px;height:auto;border-radius:12px;flex:0 0 auto}
.widget__body{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.widget__title{font-size:24px}
.widget__sub{color:var(--text-2);font-size:15px;margin:0}
.widget__cta{display:flex;align-items:center;gap:16px;margin-top:6px}
.widget__trust{height:34px;width:auto}

.prov-scroller .prov{flex:0 0 calc((100% - 56px)/5)}
.prov{display:flex;align-items:center;justify-content:center;height:78px;
background:var(--bg-2);border:1px solid var(--line);border-radius:12px;scroll-snap-align:start;
transition:border-color .15s,background .15s}
.prov:hover{border-color:var(--brand);background:var(--bg-3)}
.prov img{max-width:104px;max-height:40px;width:auto;height:auto;opacity:.85}
.prov:hover img{opacity:1}

.row{display:flex;flex-direction:column;gap:12px}
.row__head{display:flex;align-items:center;justify-content:space-between}
.row__title{font-size:24px;font-weight:700;line-height:32px}
.row__nav{display:flex;gap:8px}
.row__arrow{width:34px;height:34px;border-radius:10px;background:var(--bg-2);position:relative}
.row__arrow:hover{background:var(--bg-3)}
.row__arrow:before{content:"";position:absolute;inset:0;margin:auto;width:8px;height:8px;
border-top:2px solid var(--text);border-right:2px solid var(--text)}
.row__arrow--prev:before{transform:rotate(-135deg);margin-left:14px}
.row__arrow--next:before{transform:rotate(45deg);margin-right:14px}
.row__arrow.is-disabled{opacity:.35;pointer-events:none}
.promo-slider{position:relative}
.promo-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;
width:44px;height:44px;border-radius:50%;background:rgba(0,0,0,.55);
opacity:0;pointer-events:none;transition:opacity .2s,background .2s}
.promo-arrow:hover{background:rgba(0,0,0,.75)}
.promo-arrow--prev{left:10px}
.promo-arrow--next{right:10px}
.promo-arrow--prev:before{margin:auto}
.promo-arrow--next:before{margin:auto}
@media(min-width:1024px){.promo-arrow{opacity:1;pointer-events:auto}}
.row__scroller{display:flex;gap:14px;overflow-x:auto;scrollbar-width:none;
scroll-snap-type:x proximity;padding-bottom:2px}
.row__scroller::-webkit-scrollbar{display:none}

.tile{flex:0 0 calc((100% - 70px)/6);min-width:0;scroll-snap-align:start;display:flex;flex-direction:column;gap:8px}
.tile__media{position:relative;border-radius:12px;overflow:hidden;background:var(--bg-2);aspect-ratio:1/1}
.tile__img{width:100%;height:100%;object-fit:cover;transition:transform .2s}
.tile:hover .tile__img{transform:scale(1.05)}
.tile__label{position:absolute;top:8px;left:8px;z-index:2;
background:var(--brand);color:#0a1a0d;font-weight:700;font-size:11px;
padding:3px 8px;border-radius:6px}
.tile__play{position:absolute;inset:0;margin:auto;width:46px;height:46px;border-radius:50%;
background:var(--brand);opacity:0;transition:opacity .2s}
.tile__play:before{content:"";position:absolute;inset:0;margin:auto;width:0;height:0;
border-left:14px solid #0a1a0d;border-top:9px solid transparent;border-bottom:9px solid transparent;margin-left:18px}
.tile:hover .tile__play{opacity:1}
.tile:hover .tile__media:after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.35)}
.tile__body{display:flex;flex-direction:column;gap:2px;min-width:0}
.tile__title{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tile__provider{margin:0;color:var(--text-3);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.see-all{flex:0 0 calc((100% - 70px)/6);scroll-snap-align:start;align-self:flex-start;align-items:center;justify-content:center;
text-align:center;gap:10px;background:var(--bg-2);border:1px solid var(--line);border-radius:12px;
aspect-ratio:1/1;color:var(--text);font-weight:700;transition:border-color .15s,background .15s}
.see-all:hover{border-color:var(--brand);background:var(--bg-3)}
.see-all__arrow{width:34px;height:34px;border-radius:50%;background:var(--brand);position:relative}
.see-all__arrow:before{content:"";position:absolute;inset:0;margin:auto;width:8px;height:8px;
border-top:2px solid #0a1a0d;border-right:2px solid #0a1a0d;transform:rotate(45deg);margin-right:3px}

.row__scroller--coll .coll-card{flex:0 0 calc((100% - 42px)/4)}
.coll-card{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:400/320;scroll-snap-align:start}
.coll-card img{width:100%;height:100%;object-fit:cover;transition:transform .2s}
.coll-card:hover img{transform:scale(1.05)}
.coll-card__title{position:absolute;left:14px;bottom:12px;font-weight:700;font-size:16px;
text-shadow:0 2px 8px rgba(0,0,0,.6)}

.seo:empty{display:none}
.seo{color:var(--text-2);line-height:1.7;width:100%}
.seo__h1{color:var(--text);font-size:30px;line-height:1.2;margin:0 0 8px}
.seo h2{color:var(--text);font-size:23px;line-height:1.3;margin:34px 0 12px}
.seo h2[id]{scroll-margin-top:80px}
.seo-toc{background:var(--bg-2);border:1px solid var(--line);border-radius:12px;padding:18px 22px;margin:0 0 26px}
.seo-toc__title{font-size:17px;font-weight:800;color:var(--brand);margin-bottom:12px}
.seo-toc__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:2px 26px}
.seo-toc__list a{display:block;color:var(--text-2);text-decoration:none;font-size:14px;line-height:1.4;padding:7px 0;border-bottom:1px solid var(--line);transition:color .15s ease}
.seo-toc__list a:hover{color:var(--brand)}
@media(max-width:680px){.seo-toc__list{grid-template-columns:1fr}}
.seo h3{color:var(--text);font-size:18px;line-height:1.35;margin:22px 0 8px}
.seo p{margin:0 0 14px}
.seo ul,.seo ol{margin:0 0 16px;padding-left:22px;display:flex;flex-direction:column;gap:7px}
.seo li{padding-left:2px}
.seo strong{color:var(--text)}
.seo .pros,.seo .cons{list-style:none;padding-left:0}
.seo .pros li,.seo .cons li{padding:9px 12px;border-radius:10px;background:var(--bg-2);
border:1px solid var(--line)}
.seo .pros li{border-left:3px solid var(--brand)}
.seo .cons li{border-left:3px solid #e2553c}
.seo-tw{overflow-x:auto;margin:6px 0 20px;-webkit-overflow-scrolling:touch}
.seo-table{width:100%;border-collapse:collapse;font-size:13px;
background:var(--bg-1);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.seo-table th,.seo-table td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}
.seo-table th{background:var(--bg-2);color:var(--text);font-weight:700}
.seo-table tr:last-child td{border-bottom:0}
.seo-table td{vertical-align:top}

.foot{margin-top:20px;padding:28px 20px;background:var(--bg-1);border-top:1px solid var(--line);
display:flex;flex-direction:column;gap:24px}
.foot__pay{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.foot__pay-label{color:var(--text-2);font-weight:600}
.foot__pay-icons{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.foot__pay-icons img{height:26px;width:auto}
.foot__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:760px}
.foot__head{font-size:14px;font-weight:700;color:#fff;margin-bottom:12px}
.foot__col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.foot__col a{color:var(--text-2)}
.foot__col a:hover{color:var(--text)}
.foot__providers{display:flex;gap:18px;flex-wrap:wrap;align-items:center;opacity:.7}
.foot__providers img{height:24px;width:auto}
.foot__bottom{display:flex;flex-direction:column;gap:14px;border-top:1px solid var(--line);padding-top:20px}
.foot__social{display:flex;gap:12px}
.foot__social img{height:26px;width:auto}
.foot__rg{display:flex;gap:14px;align-items:center;flex-wrap:wrap;opacity:.7}
.foot__rg img{height:28px;width:auto}
.foot__legal{margin:0;color:var(--text-3);font-size:12px;max-width:900px}

.scrim{display:none;position:fixed;inset:0;background:rgba(0,0,0,.8);z-index:40}

@media(max-width:1279px){
.sidebar{position:fixed;left:0;top:0;z-index:50;flex-basis:var(--sidebar-w);width:var(--sidebar-w);
transform:translateX(-100%);transition:transform .3s ease;border-right:1px solid var(--line)}
body.nav-on .sidebar{flex-basis:var(--sidebar-w);width:var(--sidebar-w);overflow-y:auto;
transform:translateX(0);border-right:1px solid var(--line)}
body.nav-on .scrim{display:block}
.header__tabs{display:none}
.tile,.prov-scroller .prov{flex-basis:calc(20vw - 18px)}
.widget__img{width:220px}
}
@media(min-width:768px){
.content{width:calc(100% - 48px)}
.header{padding:0 24px}
}
@media(min-width:1280px){
.content{width:calc(100% - 64px)}
.header{padding:0 32px}
}
@media(max-width:959px){
.row__scroller{gap:12px}
.tile{flex-basis:calc(25vw - 20px)}
.prov-scroller .prov{flex-basis:calc(33.33vw - 16px)}
}
@media(max-width:767px){
.row__scroller{gap:8px}
.tile{flex-basis:calc(33.33vw - 16px)}
.prov-scroller .prov{flex-basis:calc(50vw - 20px)}
.promo-card{flex-basis:88vw}
.promo-card__title{font-size:18px}
.widget{flex-direction:column;align-items:flex-start;text-align:left}
.widget__img{width:100%}
.foot__cols{grid-template-columns:1fr 1fr}
.btn--ghost{display:inline-flex;padding:8px 12px;font-size:13px;white-space:nowrap}
.btn--primary{padding:8px 12px;font-size:13px;white-space:nowrap}
.header__right{gap:6px}
}
@media(min-width:1440px){
.tile,.see-all{flex-basis:calc((100% - 84px)/7)}
.prov-scroller .prov{flex-basis:calc((100% - 70px)/6)}
}
@media(min-width:1680px){
.tile,.see-all{flex-basis:calc((100% - 98px)/8)}
.prov-scroller .prov{flex-basis:calc((100% - 84px)/7)}
.row__scroller--coll .coll-card{flex-basis:calc((100% - 56px)/5)}
}
@media(max-width:767px){
.row__title{font-size:20px;line-height:30px}
}

/* footer centering fix */
.foot{align-items:center}
.foot__pay,.foot__cols,.foot__bottom,.foot__legal{width:100%;max-width:1000px}
.foot__pay{justify-content:center}


/* ─── A11Y focus styles ─── */
:focus-visible {
    outline: 2px solid #4fc3f7;
    outline-offset: 2px;
}
a:focus-visible, button:focus-visible {
    outline: 2px solid #4fc3f7;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(79,195,247,.25);
}
.skip-link {
    position: absolute; left: -9999px; top: 0;
    background: #4fc3f7; color: #062435;
    padding: 8px 16px; z-index: 9999;
    text-decoration: none; font-weight: 700;
}
.skip-link:focus {
    left: 8px; top: 8px;
}

/* ─── Reduced motion respect ─── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ─── Print stylesheet ─── */
@media print {
    header, footer, nav, .sticky-cta, .cta-button, .needs-js { display: none !important; }
    body { color: #000; background: #fff; font-size: 12pt; }
    a { color: #000; text-decoration: underline; }
    a[href]::after { content: " (" attr(href) ")"; font-size: 10pt; }
    h1, h2, h3 { page-break-after: avoid; }
    img { max-width: 100% !important; page-break-inside: avoid; }
}


/* ─── FAQ accordion ─── */
.faq-accordion { margin: 16px 0 24px; display: flex; flex-direction: column; gap: 8px; }
.faq-item {
    background: rgba(79,195,247,.05);
    border: 1px solid rgba(79,195,247,.2);
    border-radius: 8px;
    overflow: hidden;
    transition: background .2s ease;
}
.faq-item[open] {
    background: rgba(79,195,247,.09);
    border-color: rgba(79,195,247,.35);
}
.faq-item summary {
    list-style: none;
    cursor: pointer;
    padding: 14px 20px 14px 44px;
    font-weight: 600;
    color: #e7eefc;
    position: relative;
    user-select: none;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::before {
    content: "+";
    position: absolute;
    left: 16px; top: 50%;
    transform: translateY(-50%);
    color: #4fc3f7;
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
    transition: transform .2s ease;
}
.faq-item[open] summary::before { content: "-"; }
.faq-item summary:hover { color: #4fc3f7; }
.faq-item summary:focus-visible {
    outline: 2px solid #4fc3f7;
    outline-offset: -2px;
}
.faq-answer {
    padding: 0 20px 16px;
    color: #aab8d4;
    line-height: 1.65;
}
.faq-answer p { margin: 0; }