:root{
    --bg:#ffffff; /* site background should be white like the screenshot */
    --card:#f5f7fb;
    --text:#111318;
    --muted:#5b6573;
    --brand:#f7c600;
    --brand-contrast:#16120a;
    --border:rgba(10,12,14,.08);
    --maxw:1200px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font:16px/1.5 Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}



/* HERO BANNER */
.hero{background:#0b0f16}
.hero--banner{position:relative;isolation:isolate;}
.hero--banner .wrap{max-width:none;padding:0}
.hero__media{position:relative;height:min(34vw,360px);min-height:220px;overflow:hidden;border-bottom:1px solid rgba(0,0,0,.08)}
.hero__img{position:absolute;inset:0;filter:saturate(1.05);transform:scale(1.02);background:var(--hero-image) center/cover no-repeat}
.hero__veil{position:absolute;inset:0;background:linear-gradient(0deg, rgba(0,0,0,.55), rgba(0,0,0,.55))}
.hero__content{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:0 16px}
.hero__title{color:#fff;font-weight:800;line-height:1.15;font-size:clamp(22px,4.2vw,34px);text-shadow:0 2px 12px rgba(0,0,0,.45)}
@media (max-width:560px){.hero__title{font-size:22px}}

/* ensure visible spacing under hero with same background color */
.hero--banner::after{content:"";display:block;height:0}

/* Secondary text block under banner (like original layout spacing) */
.intro{background:#f4f7fb}
.intro .wrap{padding:36px 16px}
.kicker{font-size:13px;letter-spacing:.2em;color:var(--muted);text-transform:uppercase}
h1{font-size:32px;margin:.4em 0 .6em;color:#0b1320}
.lead{color:#4b5563;max-width:720px}
.dropdown{position:relative}
.dropdown__menu{position:absolute;display:none;top:calc(100% + 8px);left:0;background:#1b2029;color:#fff;border:1px solid rgba(255,255,255,.06);border-radius:12px;min-width:220px;overflow:hidden}
.dropdown__menu a{display:block;padding:10px 12px;color:#d0d6e2}
.dropdown__menu a:hover{background:#232a35;color:#fff}
.dropdown:hover .dropdown__menu{display:block}
.flag{display:inline-flex;width:20px;height:14px}
.flag svg{width:20px;height:14px;display:block;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.2) inset}

.lang__menu{padding:6px 0;min-width:54px;width:54px}
.lang__menu a{padding:6px 6px;display:flex;align-items:center;justify-content:center}
.lang__menu a:hover{background:#232a35}
.review{background:#eef3f8}
.review .wrap{padding:28px 16px} .article{padding:24px} .article > .grid{padding:0} .article .article-continue{margin-top:20px}
.card{background:#ffffff;border:1px solid var(--border);border-radius:14px;box-shadow:0 4px 24px rgba(15,23,42,.04)}
.grid{display:grid;grid-template-columns:1.2fr 0.8fr;gap:32px;padding:32px}
.media{padding-top:14px;display:flex;align-items:flex-start;justify-content:center;align-self:stretch}
.h2{font-size:28px;line-height:1.2;margin:6px 0 16px;color:#0b1320}
.text p{margin:16px 0;color:#111318}
.mockup{margin:0}
.mockup img{border-radius:8px;display:block}
.mockup .ph{border-radius:8px;overflow:hidden;width:100%;max-width:540px;aspect-ratio:16/10;min-height:360px}
.mockup .ph svg{display:block;width:100%;height:100%}
@media (max-width: 980px){.grid{grid-template-columns:1fr;}.media{order:-1;padding-top:0}.mockup img{width:100%;height:auto}}
.company .wrap{padding:18px 16px 46px}
.company .introtext{color:#4b5563;margin:0 0 16px}
.table{border:1px solid var(--border);border-radius:8px;overflow:hidden}
.table .rowt{display:grid;grid-template-columns:220px 1fr;border-top:1px solid var(--border)}
.table .rowt:first-child{border-top:0}
.table .cell{padding:14px 16px}
.table .cell--key{background:#f8fafc;font-weight:600;color:#374151}
@media (max-width: 720px){
    .table .rowt{grid-template-columns:1fr}
    .table .cell--key{border-bottom:1px solid var(--border)}
}
.company .wrap{padding:18px 16px 46px}
.company .introtext{color:#4b5563;margin:0 0 16px}
/* Table like on the screenshot */
.ctable{width:100%;border-collapse:collapse;border:1px solid var(--border);background:#fff;border-radius:8px;overflow:hidden}
.ctable th,.ctable td{padding:12px 14px;border-top:1px solid var(--border);vertical-align:top}
.ctable tr:first-child th,.ctable tr:first-child td{border-top:0}
.ctable th{width:220px;background:#f8fafc;color:#374151;font-weight:600;text-align:left}
@media (max-width:720px){
    .ctable th{display:block;width:auto;border-right:0;border-bottom:1px solid var(--border)}
    .ctable td{display:block}
}
.company .h2{margin:0 0 10px;font-size:26px}
/* Screenshot-like table tuning */
.ctable{width:100%;border-collapse:collapse;border:1px solid #d6dee9;background:#fff;border-radius:6px;overflow:hidden}
.ctable th,.ctable td{padding:14px 16px;border-top:1px solid #d6dee9;vertical-align:top;font-size:15px;line-height:1.55}
.ctable tr:first-child th,.ctable tr:first-child td{border-top:0}
.ctable th{width:200px;background:#f2f6fb;color:#2f3a4a;font-weight:600;text-align:left}
@media (max-width:720px){
    .ctable th{display:block;width:auto;border-right:0;border-bottom:1px solid #d6dee9}
    .ctable td{display:block}
}
/* ===== FAQ – bigger, neater, consistent ===== */
#faq { margin-top: 40px; }

#faq .h2{
    margin: 0 0 14px;
    font-size: clamp(26px, 2.6vw, 32px);
    line-height: 1.2;
}

#faq details{
    background: #fff;
    border: 1px solid rgba(15,23,42,.12);
    border-radius: 14px;
    box-shadow: 0 4px 18px rgba(15,23,42,.05);
    overflow: hidden;
    margin: 14px 0;
    transition: box-shadow .2s ease, border-color .2s ease, transform .02s;
}

#faq details:hover{
    box-shadow: 0 6px 26px rgba(15,23,42,.07);
    border-color: rgba(15,23,42,.16);
}

#faq summary{
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 22px;
    font-weight: 800;
    font-size: clamp(16px, 1.8vw, 18px);
    line-height: 1.4;
    cursor: pointer;
    list-style: none;
    user-select: none;
}

#faq summary::-webkit-details-marker{ display:none; }

/* Chevron */
#faq summary::after{
    content:"";
    margin-left: auto;
    width: 10px; height: 10px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(-45deg);
    transition: transform .2s ease;
    opacity: .75;
}

/* Open state */
#faq details[open] summary::after{
    transform: rotate(45deg);
    opacity: 1;
}

/* Answer body */
#faq .article-continue{
    padding: 16px 22px 20px;
    border-top: 1px solid rgba(15,23,42,.1);
    font-size: clamp(15px, 1.6vw, 17px);
    line-height: 1.75;
    color: #4b5563;
    background: #fff;
}

/* Subtle focus for keyboard users */
#faq summary:focus{
    outline: 2px solid #16c65333;
    outline-offset: 2px;
    border-radius: 8px;
}

/* Mobile tweaks */
@media (max-width: 720px){
    #faq details{ border-radius: 12px; }
    #faq summary{ padding: 16px 18px; }
    #faq .article-continue{ padding: 14px 18px 18px; }
}

.article-continue{margin-top:28px}
.article-continue .introtext{color:#5b6573;margin:0 0 16px}
.subsec{margin-top:36px}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
/* wider media layout for sections like casino screenshot */
.two-col--mediaRight{grid-template-columns:0.95fr 1.05fr}
#casino-games .h2{font-size:32px;margin:6px 0 14px}
#casino-games p{line-height:1.7}
#casino-games ul{margin:8px 0 0 18px}
#casino-games li{margin:6px 0}
#casino-games .subsec__media .ph--wide{max-width:720px}
.subsec__media{display:flex;justify-content:center}
.ph--wide{width:100%;max-width:640px;border-radius:10px;overflow:hidden}
.mockimg{width:100%;max-width:720px;height:auto;border-radius:10px;display:block}
.ph--wide svg{display:block;width:100%;height:auto}
@media (max-width:980px){.two-col{grid-template-columns:1fr}.subsec__media{order:-1}}

.proscons{width:100%;border-collapse:collapse;border:1px solid #d6dee9;background:#fff;border-radius:6px;overflow:hidden}
.proscons th,.proscons td{padding:12px 14px;border-top:1px solid #d6dee9;font-size:15px}
.proscons tr:first-child th,.proscons tr:first-child td{border-top:0}
.proscons thead th{text-align:center;background:#f2f6fb;color:#2f3a4a;font-weight:700}
.proscons tbody td{width:50%}
.ctable{border-collapse:separate;border-spacing:0}
.ctable th,.ctable td{border-right:1px solid #d6dee9}
.ctable tr th:last-child,.ctable tr td:last-child{border-right:0}
@media (max-width:720px){.ctable th,.ctable td{border-right:0}}
.proscons thead th+th,.proscons tbody td+td{border-left:1px solid #d6dee9}
.steps{margin:10px 0 14px;padding-left:20px}
.steps li{margin:6px 0}
.steps{margin:10px 0 14px;padding-left:20px}
.steps li{margin:6px 0}
.steps{margin:10px 0 14px;padding-left:20px}
.steps li{margin:6px 0}
.steps{margin:10px 0 14px;padding-left:20px}
.steps li{margin:6px 0}
.steps{margin:10px 0 14px;padding-left:20px}
.steps li{margin:6px 0}








.site-footer{
    background:#0f1116;
    color:#d7dbe3;
    border-top:1px solid rgba(255,255,255,.06);
}
.site-footer__wrap{
    max-width:1200px;
    margin:0 auto;
    padding:22px 16px 28px;
    text-align:center;
}
.site-footer__title{
    letter-spacing:.22em;
    font-size:12px;
    color: #ffffff;
    margin:0 0 12px;
}
.site-footer__nav{
    display:flex;
    flex-wrap:wrap;
    gap:18px 26px;
    justify-content:center;
    align-items:center;
    padding-bottom:12px;
}
.site-footer__nav a{
    color:#d7dbe3;
    font-size:14px;
    opacity:.9;
}
.site-footer__nav a:hover{ opacity:1 }

.site-footer__meta{
    display:grid;
    grid-template-columns: 1fr auto 1fr;
    align-items:center;
    gap:16px;
    padding-top:8px;
}


.badges{
    display:flex;
    align-items:center;
    gap:18px;
    min-width:0;
}
.badges--left{ justify-content:flex-start }
.badges--right{ justify-content:flex-end }


.badge{ line-height:0; display:inline-flex; align-items:center; }
.badge img{
    height: var(--h, 24px);
    width: auto;
    display:block;
    object-fit:contain;
    image-rendering:auto;
}


.site-footer__meta .copyright{
    white-space:nowrap;
    font-size:16px;
    color: #ffffff;
    margin:0 8px;
}


@media (max-width:640px){
    .site-footer__meta{
        grid-template-columns: 1fr;
        gap:10px;
    }
    .badges{ justify-content:center; flex-wrap:wrap; }
    .site-footer__meta .copyright{ order:-1; }
}


.top-actions{display:none;align-items:center;gap:10px}


.hide-mobile{display:inline-flex}
.show-mobile{display:none}


.burger{display:flex;flex-direction:column;gap:4px}
.burger span{width:22px;height:2px;background:#fff;border-radius:2px}


.cta-mobile{padding:8px 14px;font-size:14px;line-height:1}


@media (max-width: 980px){
    nav.main{display:none;}
    .show-mobile{display:flex;}
    .hide-mobile{display:none;}
}
.sheet{
    display:none;
    position:fixed;
    inset:0;
    z-index:1000;
    background:rgba(0,0,0,.6);
}


























html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

*,
*::before,
*::after { box-sizing: border-box; }

img, svg, video, canvas { max-width: 100%; height: auto; }

.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 16px; }
.row { margin: 0; }

.grid, .two-col, .ctable, .proscons, .table, .article { max-width: 100%; }


.ctable, .proscons { table-layout: auto; width: 100%; }
@media (max-width: 720px) {
    .ctable th, .ctable td { display: block; width: 100%; }
}

body.no-scroll {
    overflow: hidden;
    touch-action: none;
}


.lang { position: relative; }
.lang__menu {
    position: absolute;
    right: 0; top: calc(100% + 8px);
    background: #1b2029;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
    min-width: 54px; width: 54px;
    padding: 6px 0;
    display: none;
}
.lang.open .lang__menu { display: block; }
.lang__menu a { display: flex; justify-content: center; padding: 6px 6px; }
.flag svg { width: 20px; height: 14px; display: block; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0,0,0,.2) inset; }


.hero__media { overflow: hidden; }
.hero__img { transform: scale(1.02); }

.sheet nav { display: flex; flex-direction: column; gap: 12px; }
.sheet .nav__link { color: #d7dbe3; padding: 10px 0; }
.sheet .nav__link:hover { color: #fff; }
.sheet .btn.btn--brand { margin-top: 10px; align-self: flex-start; }


[class*="ph"], .mockup, .subsec__media, .media { max-width: 100%; overflow: hidden; }



html, body {
    width: 100%;
    overflow-x: hidden;
}
img, svg, video, canvas {
    max-width: 100%;
    height: auto;
}



body.menu-lock { overflow: hidden; touch-action: none; }


















/* ========== foundation ========== */
.sb-topbar{position:sticky;top:0;z-index:1000;background:#171b22;border-bottom:1px solid rgba(255,255,255,.06);color:#e9eef7}
.sb-wrap{max-width:1200px;margin:0 auto;padding:0 16px}
.sb-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;height:80px}

/* logo */
.sb-brand{display:inline-flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.sb-wordmark{font-weight:800;letter-spacing:.5px;font-size:18px}
.sb-logo{filter:drop-shadow(0 2px 6px rgba(22,163,74,.25))}

/* center menu (always centered) */
.sb-center{display:flex;justify-self:center;gap:22px;align-items:center}
.sb-link{padding:10px 6px;border-radius:10px;color:#d7dbe3;text-decoration:none}
.sb-link:hover,[aria-current="page"].sb-link{color:#fff}

/* dropdown */
.sb-dropdown{position:relative}
.sb-dropbtn{display:flex;gap:6px;align-items:center;background:none;border:0;color:#d7dbe3;padding:10px 6px;border-radius:10px;cursor:pointer}
.sb-dropdown:hover .sb-menu{display:block}
.sb-menu{display:none;position:absolute;top:100%;left:0;background:#1b2029;border:1px solid rgba(255,255,255,.08);border-radius:12px;min-width:200px;overflow:hidden}
.sb-menuitem{display:block;padding:10px 12px;color:#d0d6e2;text-decoration:none}
.sb-menuitem:hover{background:#232a35;color:#fff}

/* right actions */
.sb-actions{display:flex;align-items:center;gap:12px;justify-self:end}
.sb-btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;border-radius:12px;font-weight:700;border:1px solid rgba(255,255,255,.12);background:transparent;color:#e9eef7;cursor:pointer}
.sb-btn--brand{background:#22c55e;border-color:transparent;color:#fff}
.sb-btn--brand:hover{filter:brightness(.95)}
.sb-btn--ghost:hover{background:#0f131a}
.sb-flag svg{width:20px;height:14px;display:block;border-radius:2px;box-shadow:0 0 0 1px rgba(0,0,0,.25) inset}

/* lang dropdown (desktop) */
.sb-lang{position:relative}
.sb-langmenu{position:absolute;right:0;top:calc(100% + 8px);background:#1b2029;border:1px solid rgba(255,255,255,.08);border-radius:12px;min-width:60px;padding:6px 0;display:none}
.sb-lang.open .sb-langmenu{display:block}
.sb-langmenu a{display:flex;justify-content:center;padding:6px}
.sb-langmenu a:hover{background:#232a35}


.sb-burger{display:none;align-items:center;justify-content:center;width:42px;height:42px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#1a2029;gap:6px}
.sb-burger span{width:20px;height:2px;border-radius:2px;background:#fff;transition:.25s}
.sb-burger.is-open span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.sb-burger.is-open span:nth-child(2){opacity:0}
.sb-burger.is-open span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}


.sb-sheet{position:fixed;inset:0;background:rgba(0,0,0,.55);display:none;opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:999}
.sb-sheet.open{display:block;opacity:1;pointer-events:auto}
.sb-sheet__panel{position:absolute;right:0;top:0;bottom:0;width:min(420px,92vw);background:#14171d;color:#fff;border-left:1px solid rgba(255,255,255,.08);overflow:auto;transform:translateX(100%);transition:transform .25s ease}
.sb-sheet.open .sb-sheet__panel{transform:translateX(0)}
.sb-sheet__hdr{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;position:sticky;top:0;background:#14171d}
.sb-sheet__close{width:36px;height:36px;border:1px solid rgba(255,255,255,.18);border-radius:10px;background:transparent;position:relative}
.sb-sheet__close:before,.sb-sheet__close:after{content:"";position:absolute;left:9px;right:9px;top:17px;height:2px;background:#fff}
.sb-sheet__close:before{transform:rotate(45deg)} .sb-sheet__close:after{transform:rotate(-45deg)}
.sb-sheet__nav{display:flex;flex-direction:column;padding:6px 10px 14px}
.sb-sheet__item{display:block;padding:12px 10px;border-radius:10px;color:#d0d6e2;text-decoration:none}
.sb-sheet__item:hover{background:#232a35;color:#fff}
.sb-sheet__sep{height:1px;background:rgba(255,255,255,.08);margin:8px 0}
.sb-sheet__lang{padding:10px 12px 20px}
.sb-sheet__title{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#94a0b2;margin:6px 0 8px}
.sb-pills{display:flex;gap:8px}
.sb-pill{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#1a2029}
.sb-pill .sb-flag svg{width:24px;height:16px}
.sb-sheet__ftr{padding:10px 12px 18px;position:sticky;bottom:0;background:linear-gradient(180deg,rgba(20,23,29,0) 0%, #14171d 40%)}
.sb-btn--xl{width:100%;padding:14px 16px;border-radius:14px;font-size:16px}


@media (max-width: 980px){
    .sb-center{display:none}
    .sb-burger{display:flex}
}

.sb-dropbtn{
    padding: 10px 6px;
    border: 0;
    background: transparent;
    color: #d7dbe3;
    border-radius: 10px;
    font: inherit;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.sb-dropdown:hover .sb-dropbtn,
.sb-dropdown:focus-within .sb-dropbtn{
    color:#fff;
}
.sb-dropbtn svg{ margin-top: 1px; opacity:.9 }



.sb-burger{
    display:flex;
    align-items:center;
    justify-content:center;
    width:48px;
    height:48px;
    border-radius:14px;
    border:1px solid rgba(255,255,255,.14);
    background:#141922;
    box-shadow: 0 2px 10px rgba(0,0,0,.25), 0 0 0 1px rgba(255,255,255,.04) inset;
    position:relative;
    cursor:pointer;
    -webkit-tap-highlight-color: transparent;
    transition: background .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.sb-burger:hover{ background:#1a2130; border-color: rgba(255,255,255,.22); }
.sb-burger:active{ transform: translateY(1px); }
.sb-burger:focus-visible{
    outline: none;
    box-shadow: 0 0 0 3px rgba(34,197,94,.35), 0 2px 10px rgba(0,0,0,.25);
}


.sb-burger span{
    position:absolute;
    display:block;
    width:24px;
    height:3px;
    background:#ffffff;
    border-radius:3px;
    transition: transform .24s ease, opacity .18s ease, width .18s ease;
}


.sb-burger span:nth-child(1){ transform: translateY(-7px); }
.sb-burger span:nth-child(2){ transform: translateY(0); }
.sb-burger span:nth-child(3){ transform: translateY(7px); }


.sb-burger.is-open span:nth-child(1){
    transform: translateY(0) rotate(45deg);
}
.sb-burger.is-open span:nth-child(2){
    opacity: 0; width: 0;
}
.sb-burger.is-open span:nth-child(3){
    transform: translateY(0) rotate(-45deg);
}


@media (min-width: 600px) and (max-width: 980px){
    .sb-burger{ width:52px; height:52px; border-radius:16px; }
    .sb-burger span{ width:26px; height:3.25px; }
    .sb-burger span:nth-child(1){ transform: translateY(-8px); }
    .sb-burger span:nth-child(3){ transform: translateY(8px); }
}


@media (max-width: 980px){
    .sb-burger{ display:flex !important; }
}
@media (min-width: 981px){
    .sb-burger{ display:none !important; }
}


@media (prefers-reduced-motion: reduce){
    .sb-burger, .sb-burger span{ transition: none !important; }
}

@media (max-width: 980px){
    .sb-topbar .sb-actions .sb-lang{
        display: none !important;
    }
}


@media (min-width: 981px){
    .sb-topbar .sb-actions .sb-lang{
        display: inline-flex !important;
    }
}

.site-footer__meta{
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
}
.site-footer .copyright{
    justify-self: center;
    text-align: center;
}


@media (max-width: 640px){
    .site-footer__wrap{ padding-bottom: 14px; }

    .site-footer__meta{
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 12px;
    }

    .site-footer__meta .badges--left{  order: 1; }
    .site-footer__meta .badges--right{ order: 2; }
    .site-footer__meta .copyright{
        order: 3;
        margin-top: 4px;
        width: 100%;
        text-align: center;
        opacity: .9;
    }
}





.subsec.two-col.two-col--vcenter {
    align-items: center;
}


.subsec__media {
    display: grid;
    place-items: center;
}

.subsec__media .mockimg,
.subsec__media picture,
.subsec__media img {
    max-width: 100%;
    height: auto;
    display: block;
    border-radius: 10px;
}


.two-col--mediaRight .subsec__media { margin-left: auto; }


@media (max-width: 980px) {
    .subsec.two-col {
        grid-template-columns: 1fr !important;
        align-items: start;
    }
    .subsec.two-col .subsec__text { order: 1; }
    .subsec.two-col .subsec__media {
        order: 2;
        margin: 16px auto 0;
        max-width: 520px;
    }
}


@media (min-width: 1200px) {
    .subsec.two-col .subsec__media {
        max-width: 560px;
    }
}





@media (max-width: 1200px) {
    .subsec.two-col,
    .subsec.two-col.two-col--mediaRight,
    .subsec.two-col.two-col--vcenter {
        display: flex !important;
        flex-direction: column;
    }

    .subsec.two-col .subsec__media {
        order: 1;
        margin: 10px auto 14px;
        display: flex;
        justify-content: center;
        align-items: center;
        max-width: 560px;
        width: 100%;
    }
    .subsec.two-col .subsec__media img,
    .subsec.two-col .subsec__media picture {
        max-width: 100%;
        height: auto;
        display: block;
    }


    .subsec.two-col .subsec__text {
        order: 2;
    }


    .subsec.two-col .subsec__text > h2,
    .subsec.two-col .subsec__text > .h2 {
        margin-top: 0;
    }
}


@media (min-width: 1201px) {
    .subsec.two-col.two-col--vcenter {
        align-items: center;
    }
}



@media (max-width: 1200px) {

    .subsec.two-col,
    .subsec.two-col.two-col--mediaRight,
    .subsec.two-col.two-col--vcenter {
        display: flex !important;
        flex-direction: column;
    }


    .subsec.two-col .subsec__text {
        display: contents;
    }


    .subsec.two-col .subsec__text > h2,
    .subsec.two-col .subsec__text > .h2 {
        order: 1;
        margin-top: 0;
    }


    .subsec.two-col .subsec__media {
        order: 2;
        margin: 10px auto 14px;
        display: flex;
        justify-content: center;
        align-items: center;
        max-width: 560px;
        width: 100%;
    }
    .subsec.two-col .subsec__media img,
    .subsec.two-col .subsec__media picture {
        max-width: 100%;
        height: auto;
        display: block;
    }


    .subsec.two-col .subsec__text > *:not(h2):not(.h2) {
        order: 3;
    }
}

@media (max-width: 1200px) {

    .subsec.two-col,
    .subsec.two-col.two-col--mediaRight,
    .subsec.two-col.two-col--vcenter {
        display: flex !important;
        flex-direction: column;
    }

    .subsec.two-col .col.text {
        display: contents;
    }

    .subsec.two-col .col.text > h2,
    .subsec.two-col .col.text > .h2 {
        order: 1;
        margin-top: 0;
    }

    .subsec.two-col .subsec__media {
        order: 2;
        margin: 10px auto 14px;
        display: flex;
        justify-content: center;
        align-items: center;
        max-width: 560px;
        width: 100%;
    }
    .subsec.two-col .subsec__media img,
    .subsec.two-col .subsec__media picture {
        max-width: 100%;
        height: auto;
        display: block;
    }

    .subsec.two-col .col.text > *:not(h2):not(.h2) {
        order: 3;
    }
}







.steps a.link-accent{
    color: var(--brand, #22c55e);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 2px;
    font-weight: 600;
}
.steps a.link-accent:hover{
    filter: brightness(1.15);
}
.steps a.link-accent:focus{
    outline: 2px solid color-mix(in oklab, var(--brand,#22c55e) 60%, white);
    outline-offset: 2px;
    border-radius: 4px;
}


.link-accent,
.subsec p a.link-accent {
    color: var(--brand, #22c55e);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 2px;
    font-weight: 600;
}

.link-accent:hover,
.subsec p a.link-accent:hover {
    filter: brightness(1.15);
    text-decoration-thickness: 2px;
}



.crumbs { margin-top: 8px; font-size: 14px; opacity: .9; }
.crumbs ol { list-style: none; margin: 0; padding: 0; display: inline-flex; align-items: center; gap: .35rem; }
.crumbs li+li::before { content: "»"; opacity: .7; margin: 0 .25rem; }
.crumbs a { text-decoration: none; }


.hero--banner .hero__veil { background: rgba(0,0,0,.45); }



.hero--banner .crumbs,
.hero--banner .crumbs a {
    color: #fff !important;
}

.hero--banner .crumbs li+li::before {
    color: #fff;
    opacity: .65;
}

.hero--banner .crumbs a:hover {
    text-decoration: underline;
    opacity: .95;
}


.hero--banner .crumbs,
.hero--banner .crumbs a,
.hero--banner .hero__title {
    text-shadow: 0 1px 2px rgba(0,0,0,.35);
}

.hero--banner .hero__veil{

    background: linear-gradient(to bottom, rgba(0,0,0,.45), rgba(0,0,0,.45));
}

.hero--banner .hero__content{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding: 18px 12px 16px;
    gap: 6px;
}

.hero--banner .hero__title{
    margin: 0;
    line-height: 1.12;
    font-weight: 800;
    font-size: clamp(22px, 3.2vw, 36px);
    max-width: min(1100px, 92vw);
    text-align: center;
    text-shadow: 0 2px 8px rgba(0,0,0,.35);
}

.hero--banner .crumbs{
    order: 2;
    margin: 0;
    color: #fff;
    opacity: .95;
    font-size: clamp(12px, 1.4vw, 14px);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.hero--banner .crumbs a{ color:#fff; }
.hero--banner .crumbs .sep{ opacity:.7; }


@media (max-width: 640px){
    .hero--banner .hero__content{ padding:14px 10px 12px; gap:4px; }
    .hero--banner .hero__title{ font-size: clamp(20px, 5.4vw, 30px); }
    .hero--banner .crumbs{ font-size: 12px; gap:6px; }
}



.promo-code{
    padding: .15rem .4rem;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: .4rem;
    background: rgba(255,255,255,.06);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    letter-spacing: .02em;
}

.ctable { width:100%; border-collapse: collapse; table-layout: fixed; }
.ctable th, .ctable td { padding:12px 14px; border-bottom:1px solid rgba(255,255,255,.12); }


@media (max-width: 680px) {
    .ctable--responsive thead { display:none; }

    .ctable--responsive tbody tr {
        display:block;
        background: rgba(255,255,255,.04);
        border:1px solid rgba(255,255,255,.08);
        border-radius:12px;
        padding:8px 10px;
        margin-bottom:10px;
    }

    .ctable--responsive tbody td {
        display:block;
        border:0;
        padding:8px 10px;
    }


    .ctable--responsive tbody td::before {
        content: attr(data-label);
        display:block;
        font-size:.8rem;
        opacity:.7;
        margin-bottom:4px;
    }


    .ctable--responsive tbody td:first-child {
        font-weight:600;
        margin-top:4px;
    }


    .ctable--responsive tbody tr {
      display:grid;
      grid-template-columns: 1fr 1fr;
      gap:6px 10px;
    }
    .ctable--responsive tbody td { padding:8px; }

}

.ctable--lined th,
.ctable--lined td {
    border-bottom: 1px solid var(--tbl-line, rgba(255,255,255,.12));
}

.ctable--lined thead th {
    border-bottom: 1px solid var(--tbl-head-line, rgba(255,255,255,.18));
}


@media (min-width: 681px) {
    .ctable--lined tbody td + td {
        border-left: 1px solid var(--tbl-line, rgba(255,255,255,.08));
    }
}


@media (max-width: 680px) {
    .ctable--responsive.ctable--lined tbody tr {
        border: 1px solid var(--tbl-line, rgba(255,255,255,.16));
        border-radius: 12px;
        background: rgba(255,255,255,.04);
        padding: 8px 10px;
        margin-bottom: 10px;
    }

    .ctable--responsive.ctable--lined tbody td {
        border-top: 1px solid var(--tbl-line, rgba(255,255,255,.10));
    }
    .ctable--responsive.ctable--lined tbody td:first-child {
        border-top: 0;
    }

    .ctable--responsive tbody td::before {
        content: attr(data-label);
        display: block;
        font-size: .8rem;
        opacity: .7;
        margin-bottom: 4px;
    }
}




:root{
    --brand: #f7c600;
}

.sb-center .sb-link,
.sb-menu .sb-menuitem,
.sheet__nav .sheet__item{
    transition: color .15s ease;
}

.sb-center .sb-link:hover,
.sb-center .sb-link:focus-visible,
.sb-menu .sb-menuitem:hover,
.sb-menu .sb-menuitem:focus-visible,
.sheet__nav .sheet__item:hover,
.sheet__nav .sheet__item:focus-visible{
    color: var(--brand);
}

.sb-center .sb-link.is-active,
.sb-menu .sb-menuitem.is-active,
.sheet__nav .sheet__item.is-active{
    color: var(--brand);
}

/* Rabona brand refresh */
.sb-topbar{background:#141414;border-bottom-color:rgba(247,198,0,.24)}
.sb-wordmark{color:#f7c600}
.sb-logo{filter:drop-shadow(0 2px 8px rgba(247,198,0,.3))}
.sb-btn--brand{background:#f7c600;border-color:#f7c600;color:#16120a;font-weight:800}
.sb-btn--brand:hover{filter:brightness(1.03)}
.sb-link:hover,.sb-link.is-active,.sb-link[aria-current="page"]{color:#f7c600}
.hero{background:#141414}
.hero__veil{background:linear-gradient(90deg,rgba(0,0,0,.76),rgba(0,0,0,.4))}
.hero__media--rabona{background:
    radial-gradient(circle at 18% 20%,rgba(247,198,0,.34),transparent 28%),
    linear-gradient(135deg,#17110a 0%,#141414 48%,#312400 100%)}
.hero__media--rabona .hero__img{background:
    linear-gradient(90deg,rgba(247,198,0,.2) 1px,transparent 1px),
    linear-gradient(0deg,rgba(247,198,0,.12) 1px,transparent 1px);
    background-size:42px 42px;opacity:.8}
.link-accent{color:#b88f00}
.info-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.info-card{border:1px solid #d6dee9;border-radius:8px;background:#fff;padding:18px}
.info-card h3{font-size:18px;margin:0 0 8px;color:#111318}
.info-card p{margin:0;color:#5b6573;line-height:1.65}
.rabona-visual{width:100%;max-width:560px;min-height:320px;border-radius:10px;background:linear-gradient(145deg,#141414,#2b2105);border:1px solid rgba(247,198,0,.32);box-shadow:0 18px 38px rgba(20,20,20,.18);padding:28px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;position:relative}
.rabona-visual::before{content:"";position:absolute;inset:auto -18% -30% 28%;height:180px;background:radial-gradient(circle,rgba(247,198,0,.26),transparent 68%)}
.rabona-visual__brand{position:relative;color:#f7c600;font-size:clamp(36px,5vw,64px);font-weight:900;letter-spacing:0}
.rabona-visual__grid{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rabona-visual__grid span{border:1px solid rgba(247,198,0,.35);border-radius:8px;padding:14px 16px;color:#fff;background:rgba(255,255,255,.06);font-weight:800}
@media (max-width:900px){.info-grid{grid-template-columns:1fr}}


