:root { --bg:#08090e; --surface:#191c25; --surface-2:#252934; --surface-3:#343740; --line:#4b5160; --text:#f3f4f7; --muted:#afb4c0; --yellow:#ffb426; --yellow-dark:#dd9510; --max:1188px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--text); background:var(--bg); font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size:16px; line-height:1.62; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
.site-shell { min-width:320px; overflow:hidden; }
.container { width:min(calc(100% - 32px), var(--max)); margin-inline:auto; }
.header { height:72px; border-bottom:1px solid #282c36; background:#101219; position:sticky; top:0; z-index:20; }
.header__inner { height:100%; display:flex; align-items:center; gap:42px; }
.logo img { width:132px; height:auto; }
.nav { display:flex; align-items:center; gap:28px; margin-left:auto; }
.nav__link { font-size:14px; font-weight:700; color:var(--muted); transition:color .2s; }
.nav__link:hover,.nav__link.is-active { color:var(--yellow); }
.button { display:inline-flex; justify-content:center; align-items:center; min-height:44px; padding:10px 22px; border:0; border-radius:6px; background:var(--yellow); color:#17120a; font-size:14px; font-weight:800; line-height:1; transition:background .2s,transform .2s; cursor:pointer; }
.button:hover { background:#ffc34a; transform:translateY(-1px); }
.button--small { min-height:34px; padding:9px 19px; font-size:12px; }
.button--outline { color:var(--yellow); background:transparent; border:1px solid var(--yellow); }
.button--outline:hover { color:#1a1407; background:var(--yellow); }
main { padding:25px 0 48px; }
.card,.content-section,.image-card { margin-top:22px; border-radius:8px; background:var(--surface); }
.hero { min-height:240px; display:grid; grid-template-columns:1.05fr .95fr; overflow:hidden; }
.hero__copy { display:flex; align-items:flex-start; justify-content:center; flex-direction:column; padding:36px 46px; }
.eyebrow { margin:0 0 6px; color:var(--yellow); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.12em; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:14px; font-size:30px; line-height:1.17; letter-spacing:-.035em; }
h2 { margin-bottom:13px; font-size:23px; line-height:1.25; letter-spacing:-.025em; }
h3 { margin-bottom:9px; font-size:18px; line-height:1.25; }
p { color:var(--muted); }
.hero__copy p:not(.eyebrow) { max-width:590px; margin-bottom:22px; }
.hero__image { width:100%; height:100%; min-height:240px; object-fit:cover; object-position:center; }
.content-section { padding:30px 34px; }
.content-section > *:last-child { margin-bottom:0; }
.table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:5px; }
table { width:100%; min-width:680px; border-collapse:collapse; font-size:13px; }
caption { padding:10px 14px; color:#e8e9ed; font-weight:800; text-align:left; background:#20242f; }
th,td { padding:9px 12px; text-align:left; border:1px solid var(--line); }
th { color:#f1f2f6; font-weight:700; background:#2a2e3a; }
td { color:#c6cad3; }
.steps,.check-list { display:grid; gap:10px; margin:20px 0 0; padding:0; list-style:none; }
.steps li,.check-list li { position:relative; padding:11px 14px 11px 45px; border-radius:5px; color:#d0d3db; background:#20242e; }
.steps span { position:absolute; left:12px; top:10px; display:grid; place-items:center; width:22px; height:22px; border-radius:50%; color:#17120a; font-size:12px; font-weight:900; background:var(--yellow); }
.check-list li::before { content:"✓"; position:absolute; left:16px; color:var(--yellow); font-weight:900; }
.image-card { overflow:hidden; display:grid; grid-template-columns:1.2fr .8fr; }
.image-card--reverse { grid-template-columns:.8fr 1.2fr; }
.image-card--reverse img { order:2; }
.image-card > img { width:100%; height:310px; object-fit:cover; }
.image-card__body { padding:40px 34px; align-self:center; }
.section-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:26px; }
.section-heading .button { flex:0 0 auto; margin-top:4px; }
.game-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:23px; }
.game-card { min-height:154px; padding:19px; border:1px solid #424854; border-radius:6px; background:linear-gradient(135deg,#252934,#1e222c); }
.game-card:hover { border-color:#a77821; }
.game-card__provider { display:inline-block; margin-bottom:16px; color:var(--yellow); font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.game-card h3 { font-size:17px; }
.game-card p { margin-bottom:0; font-size:13px; line-height:1.45; }
.notice { margin-top:18px; padding:16px 18px; border-left:3px solid var(--yellow); border-radius:0 5px 5px 0; color:#dadce3; background:#272b35; }
.notice strong { color:var(--yellow); }
.bonus-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:22px; }
.bonus-card { display:flex; min-height:224px; padding:21px; flex-direction:column; border:1px solid #404652; border-radius:6px; background:#20242e; }
.bonus-card__tag { align-self:flex-start; padding:3px 8px; margin-bottom:18px; border-radius:3px; color:#201709; font-size:11px; font-weight:800; background:var(--yellow); }
.bonus-card p { font-size:14px; line-height:1.45; }
.bonus-card .button { margin-top:auto; }
.wide-banner { margin-top:22px; overflow:hidden; border-radius:8px; background:#201724; }
.wide-banner img { width:100%; }
.two-column { display:grid; grid-template-columns:1.2fr .8fr; gap:32px; align-items:start; }
.category-list { display:grid; gap:8px; margin:0; padding:0; list-style:none; }
.category-list li { padding:10px 13px; border-bottom:1px solid var(--line); color:#d3d5db; }
.category-list li::before { content:"•"; margin-right:10px; color:var(--yellow); }
.faq { margin:7px -20px -12px; }
.faq__item { border-top:1px solid #dee0e5; }
.faq__toggle { width:100%; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px 20px; border:0; color:var(--text); text-align:left; font:700 16px/1.35 inherit; background:transparent; cursor:pointer; }
.faq__toggle b { flex:0 0 auto; display:grid; place-items:center; width:32px; height:32px; border-radius:50%; color:white; font-size:24px; font-weight:400; background:var(--yellow); }
.faq__item.is-open .faq__toggle { color:var(--yellow); }
.faq__item.is-open .faq__toggle b { font-size:0; }
.faq__item.is-open .faq__toggle b::after { content:"−"; font-size:24px; }
.faq__panel { display:grid; grid-template-rows:0fr; transition:grid-template-rows .25s ease; }
.faq__panel p { overflow:hidden; margin:0; }
.faq__item.is-open .faq__panel { grid-template-rows:1fr; }
.faq__item.is-open .faq__panel p { padding:0 20px 20px; }
.footer { border-top:1px solid #353946; background:#20232d; }
.footer__inner { min-height:130px; display:flex; align-items:center; gap:30px; }
.footer__inner img { width:104px; height:auto; }
.footer p { margin:0 auto 0 0; font-size:13px; }
.footer a { color:var(--yellow); font-size:14px; font-weight:800; }
@media (max-width:760px) { .header { height:60px; }.header__inner { gap:14px; }.logo img { width:102px; }.nav { display:none; }.button--small { margin-left:auto; }.hero,.image-card,.image-card--reverse,.two-column { grid-template-columns:1fr; }.hero__copy { padding:28px 23px; }.hero__image { min-height:0; height:auto; }.image-card--reverse img { order:0; }.image-card > img { height:auto; }.image-card__body { padding:26px 23px; }.content-section { padding:26px 20px; }.bonus-grid,.game-grid { grid-template-columns:1fr; }.bonus-card { min-height:0; }.section-heading { align-items:stretch; flex-direction:column; }.section-heading .button { width:100%; }.footer__inner { padding:25px 0; align-items:flex-start; flex-direction:column; gap:12px; }.footer p { margin:0; } h1 { font-size:26px; } h2 { font-size:21px; } }