/* stay-casinosau.com — Payout Rail (mockup C) */
*{box-sizing:border-box;margin:0;padding:0}
:root{--bg:#0C0D0F;--surf:#16181C;--surf2:#1E2126;--gold:#FFC824;--g1:#FFC549;--g2:#FF9317;--mut:#8A8F98;--bd:#282C33;--txt:#EDEFF2}
html,body{overflow-x:clip;max-width:100%}
body{background:var(--bg);color:var(--txt);font:400 16px/1.66 Barlow,system-ui,-apple-system,"Segoe UI",sans-serif}
img,video,table,iframe{max-width:100%}
img{height:auto}
.wrap{width:100%;max-width:1220px;margin:0 auto;padding:0 20px}
h1,h2,h3,h4,.cd{font-family:"Barlow Condensed",Barlow,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.01em;line-height:1.1}
a{color:var(--gold);text-decoration:none}
a:hover{text-decoration:underline}

/* ── HEADER: desktop строго 1 ряд ── */
.site-header{position:sticky;top:0;z-index:99;background:rgba(12,13,15,.95);backdrop-filter:blur(10px);border-bottom:1px solid var(--bd)}
.hrow{display:flex;flex-wrap:nowrap;align-items:center;gap:22px;height:68px}
.logo{flex:0 0 auto;display:flex;align-items:center;gap:10px;font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:22px;color:#fff;letter-spacing:.03em;text-transform:uppercase}
.logo:hover{text-decoration:none}
.logo img{height:38px;width:auto;display:block}
.logo i{width:36px;height:36px;background:linear-gradient(135deg,var(--g1),var(--g2));display:grid;place-items:center;color:#0C0D0F;font-style:normal;font-size:20px;font-weight:700;clip-path:polygon(14% 0,100% 0,86% 100%,0 100%)}
.nav{flex:1 1 auto;min-width:0;display:flex;flex-wrap:nowrap;gap:20px;justify-content:center;align-items:center;list-style:none}
.nav li{list-style:none}
.nav a,.nav-more>span{color:#C6CAD1;font-size:15px;font-weight:600;white-space:nowrap;font-family:"Barlow Condensed",sans-serif;text-transform:uppercase;letter-spacing:.05em}
.nav a:hover{color:var(--gold);text-decoration:none}
.nav-more{position:relative}
.nav-more>span{cursor:pointer}
.nav-more:hover .dropdown,.nav-more:focus-within .dropdown{display:block}
.dropdown{display:none;position:absolute;top:24px;left:-14px;background:var(--surf2);border:1px solid var(--bd);border-radius:6px;padding:8px;min-width:196px;list-style:none;z-index:100}
.dropdown li{list-style:none}
.dropdown a{display:block;padding:7px 12px;font-size:14px;font-family:Barlow,sans-serif;text-transform:none;letter-spacing:0;color:#C6CAD1;white-space:nowrap}
.hdr-cta{flex:0 0 auto;display:flex;gap:10px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 22px;font-family:"Barlow Condensed",sans-serif;font-weight:700;font-size:16px;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;border:0;cursor:pointer;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%)}
.btn:hover{text-decoration:none;filter:brightness(1.08)}
.btn-primary{background:linear-gradient(135deg,var(--g1),var(--g2));color:#0C0D0F}
.btn-outline{background:var(--surf2);border:1px solid var(--gold);color:var(--gold)}
.burger{display:none;flex:0 0 auto;width:41px;height:41px;border:1px solid var(--bd);background:var(--surf2);color:#fff;font-size:19px;cursor:pointer}

/* ── HERO ── */
.hero{padding:50px 0 0;background:linear-gradient(180deg,rgba(255,180,60,.09),transparent 62%)}
.kick{font-family:"Barlow Condensed",sans-serif;font-size:14px;letter-spacing:.22em;color:var(--gold);margin-bottom:12px;text-transform:uppercase}
.hero h1{font-size:clamp(30px,5.4vw,58px);margin-bottom:14px;max-width:980px}
.hero .lead{color:#B3B8C0;font-size:17.5px;max-width:720px;margin-bottom:24px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:30px}
.hero-cta .btn{padding:16px 30px;font-size:18px}
.rail{border-top:1px solid var(--bd);border-bottom:1px solid var(--bd);background:var(--surf);overflow-x:auto;padding:12px 0}
.rail-in{display:flex;gap:26px;min-width:max-content;padding:0 20px;font-size:14px;color:#B3B8C0;white-space:nowrap}
.rail-in b{color:var(--gold);font-weight:700}
.strip{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--bd);border:1px solid var(--bd);margin-top:-1px}
.strip>*{min-width:0}
.strip .st{background:var(--surf);padding:20px 18px}
.strip .v{font-family:"Barlow Condensed",sans-serif;font-size:34px;font-weight:700;color:#fff;line-height:1}
.strip .v em{font-style:normal;color:var(--gold)}
.strip .l{font-size:13px;color:var(--mut);margin-top:5px}

/* ── CONTENT ── */
.main{padding:40px 0}
.content h2{font-size:clamp(24px,3.6vw,36px);margin:34px 0 12px}
.content h3{font-size:clamp(19px,2.4vw,24px);margin:24px 0 9px;color:#fff}
.content h2:first-child,.content h3:first-child{margin-top:0}
.content p{margin-bottom:15px}
.content ul,.content ol{margin:0 0 16px 22px}
.content li{margin-bottom:7px}
.content blockquote{border-left:3px solid var(--gold);background:var(--surf);padding:14px 18px;margin:18px 0;color:#C6CAD1;font-size:15.5px}
.content strong{color:#fff}
.byline{color:var(--mut);font-size:14px;margin-bottom:18px;border-bottom:1px solid var(--bd);padding-bottom:14px}
.content-img,.content img{display:block;max-width:800px;width:100%;height:auto;margin:22px auto;aspect-ratio:16/9;object-fit:cover}

/* ── TABLES ── */
.table-wrap{width:100%;overflow-x:auto;border:1px solid var(--bd);margin:20px 0}
.content table{width:100%;border-collapse:collapse;min-width:560px;font-size:14.5px;margin:0}
.content th{background:var(--surf2);text-align:left;padding:13px 16px;font-family:"Barlow Condensed",sans-serif;font-size:14px;text-transform:uppercase;letter-spacing:.07em;color:var(--gold);font-weight:700}
.content td{padding:13px 16px;border-top:1px solid var(--bd);color:#C6CAD1;vertical-align:top}

/* ── SHORTCODES ── */
.cta-wrap{margin:24px 0;display:flex;flex-wrap:wrap;gap:12px}
.cta-wrap .btn{padding:15px 30px;font-size:17px}
.review-block{background:var(--surf);border:1px solid var(--bd);border-left:3px solid var(--gold);padding:22px;margin:26px 0}
.review-block .rb-top{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:12px}
.review-block .rb-score{font-family:"Barlow Condensed",sans-serif;font-size:42px;font-weight:700;color:var(--gold);line-height:1}
.review-block .stars{color:var(--gold);letter-spacing:3px;font-size:17px}
.review-block .rb-meta{font-size:13.5px;color:var(--mut)}
.review-block blockquote{border-left:0;background:transparent;padding:0;margin:10px 0 0;font-size:15.5px;color:#C6CAD1}
.chart-card{background:var(--surf);border:1px solid var(--bd);padding:22px;margin:24px 0}
.chart-card .ct,.chart-card h4{font-size:20px;margin-bottom:3px;color:#fff}
.chart-card .cs{color:var(--mut);font-size:13px;margin-bottom:14px}
.chart-card svg{display:block;width:100%;height:auto;max-width:100%}
.game-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin:24px 0}
.game-gallery>*{min-width:0}
.game-card{background:var(--surf);border:1px solid var(--bd);overflow:hidden}
.game-card .gi{aspect-ratio:4/3;background:linear-gradient(140deg,#23262B,#101215);display:grid;place-items:center;font-size:30px;color:#4E535B}
.game-card .gb{padding:11px 13px}
.game-card .gt,.game-card h4{font-size:17px;margin-bottom:2px;color:#fff}
.game-card small{color:var(--mut);font-size:12.5px}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:24px 0}
.steps>*{min-width:0}
.steps .sp{background:var(--surf);border:1px solid var(--bd);border-left:3px solid var(--gold);padding:18px}
.steps .sp .n{font-family:"Barlow Condensed",sans-serif;font-size:13px;letter-spacing:.16em;color:var(--gold);margin-bottom:7px}
.steps .sp h4{font-size:19px;margin-bottom:6px;color:#fff}
.steps .sp p{font-size:14px;color:#A7ACB5;line-height:1.55;margin:0}
.editorial{background:var(--surf);border:1px solid var(--bd);padding:20px;margin:32px 0 0;font-size:14.5px;color:#A7ACB5}
.editorial h4{font-size:18px;color:#fff;margin-bottom:8px}

/* ── FOOTER ── */
.site-footer{background:var(--surf);border-top:1px solid var(--bd);padding:36px 0 28px;margin-top:34px;font-size:14px;color:var(--mut)}
.rg-note{background:rgba(255,200,36,.07);border-left:3px solid var(--gold);padding:13px 16px;font-size:13px;color:#C6CAD1;margin-bottom:18px}
.rg-note b{color:var(--gold)}
.foot-nav{display:flex;flex-wrap:wrap;gap:18px;margin-bottom:16px;list-style:none;padding:0}
.foot-nav li{list-style:none}
.foot-nav a{color:#C6CAD1;font-size:14px}
.legal-line{font-size:13px;line-height:1.6}

/* ── COOKIE NOTICE ── */
.cookie-notice{position:fixed;left:0;right:0;bottom:0;z-index:9999;background:var(--surf2);border-top:1px solid var(--bd);padding:14px 0;display:none}
.cookie-notice.on{display:block}
.cookie-in{display:flex;flex-wrap:wrap;align-items:center;gap:14px;font-size:14px;color:#C6CAD1}
.cookie-in p{flex:1 1 320px;margin:0}
.cookie-in .btn{padding:10px 20px;font-size:15px}

@media(max-width:900px){
 .hrow{height:auto;padding:11px 0;flex-wrap:wrap;gap:11px}
 .nav{display:none;order:4;flex:1 0 100%;flex-wrap:wrap;justify-content:flex-start;gap:14px;padding:10px 0 4px;border-top:1px solid var(--bd)}
 .nav.open{display:flex}
 .burger{display:block;order:2;margin-left:auto}
 .logo{order:1}
 .hdr-cta{order:3;flex:1 0 100%;gap:9px}
 .hdr-cta .btn{flex:1;padding:14px 8px;font-size:15px}
 .nav-more{flex:1 0 100%}
 .dropdown{display:block;position:static;border:0;background:transparent;padding:6px 0 0;min-width:0}
 .dropdown a{padding:6px 0}
 .strip{grid-template-columns:1fr 1fr}
 .steps{grid-template-columns:1fr 1fr}
 .game-gallery{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
 .content-img,.content img{aspect-ratio:16/10}
 [style*="grid-template-columns"]{grid-template-columns:1fr!important}
 /* Длинные CTA не влезают в узкий экран: разрешаем перенос и тянем на всю ширину */
 .hero-cta{flex-direction:column;align-items:stretch}
 .hero-cta .btn,.cta-wrap .btn{width:100%;white-space:normal;text-align:center;padding:14px 14px;font-size:16px;line-height:1.25}
 .cta-wrap{display:block}
 .hero h1{font-size:clamp(26px,7.4vw,40px)}
}
@media(max-width:520px){.steps{grid-template-columns:1fr}.strip{grid-template-columns:1fr}}