/* =====================================================================
   STAY CASINO  —  stay-casino-au-go.com
   Dark premium theme · chartreuse lime accent
   Fonts: Bricolage Grotesque (display) + Sora (body)
   ===================================================================== */

:root{
  --c-bg:        #0a0c08;
  --c-bg-2:      #10130c;
  --c-surface:   #14180f;
  --c-surface-2: #1b2014;
  --c-pri:       #b6ff3d;   /* chartreuse lime */
  --c-pri-dim:   #9be02f;
  --c-sec:       #5ce0a8;   /* mint */
  --c-gold:      #e9c46a;   /* warm highlight */
  --c-text:      #f2f5ec;
  --c-muted:     #9aa491;
  --c-faint:     #6b7563;
  --c-border:    rgba(182,255,61,.14);
  --c-border-2:  rgba(255,255,255,.07);
  --c-danger:    #ff6b5e;

  --radius:   16px;
  --radius-sm:10px;
  --radius-lg:26px;
  --maxw: 1200px;
  --shadow: 0 18px 50px rgba(0,0,0,.55);
  --shadow-pri: 0 12px 34px rgba(182,255,61,.22);

  --f-display: "Bricolage Grotesque", "Arial Black", sans-serif;
  --f-body: "Sora", system-ui, sans-serif;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  font-family:var(--f-body);
  background:
    radial-gradient(1100px 620px at 80% -8%, rgba(182,255,61,.10), transparent 60%),
    radial-gradient(900px 560px at -5% 12%, rgba(92,224,168,.07), transparent 55%),
    var(--c-bg);
  color:var(--c-text);
  line-height:1.65;
  font-size:16px;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
.wrap{ width:100%; max-width:var(--maxw); margin:0 auto; padding:0 22px; }

/* faint grid texture overlay */
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0; opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
                   linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size:54px 54px;
}
main, header, footer{ position:relative; z-index:1; }

/* ---------- Typography ---------- */
h1,h2,h3,h4{ font-family:var(--f-display); font-weight:800; line-height:1.08; letter-spacing:-.01em; }
h1{ font-size:clamp(2.1rem, 5vw, 3.5rem); }
h2{ font-size:clamp(1.6rem, 3.4vw, 2.5rem); }
h3{ font-size:clamp(1.1rem, 2vw, 1.35rem); }
p{ color:var(--c-text); }
.lead{ color:var(--c-muted); font-size:1.05rem; max-width:62ch; }
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--f-body); font-weight:700; font-size:.72rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--c-pri);
  padding:7px 14px; border:1px solid var(--c-border); border-radius:999px;
  background:rgba(182,255,61,.05);
}
.section{ padding:74px 0; }
.section-head{ max-width:720px; margin-bottom:38px; }
.section-head h2{ margin:16px 0 12px; }
.accent{ color:var(--c-pri); }
.mint{ color:var(--c-sec); }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--f-body); font-weight:700; font-size:.95rem; cursor:pointer;
  padding:13px 26px; border-radius:999px; border:1px solid transparent;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s;
  white-space:nowrap;
}
.btn-primary{ background:var(--c-pri); color:#0a0c08; box-shadow:var(--shadow-pri); }
.btn-primary:hover{ transform:translateY(-2px); background:var(--c-pri-dim); box-shadow:0 16px 40px rgba(182,255,61,.34); }
.btn-ghost{ background:transparent; color:var(--c-text); border-color:var(--c-border); }
.btn-ghost:hover{ border-color:var(--c-pri); color:var(--c-pri); transform:translateY(-2px); }
.btn-sm{ padding:9px 18px; font-size:.85rem; }
.btn-lg{ padding:16px 34px; font-size:1.02rem; }

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:60;
  backdrop-filter:blur(14px);
  background:rgba(10,12,8,.78);
  border-bottom:1px solid var(--c-border-2);
}
.nav{ display:flex; align-items:center; gap:28px; height:74px; }
.brand{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.brand img{ height:40px; width:auto; }
.nav-links{ display:flex; gap:26px; margin-left:14px; }
.nav-links a{ font-size:.92rem; color:var(--c-muted); font-weight:600; transition:color .15s; position:relative; }
.nav-links a:hover{ color:var(--c-text); }
.nav-links a::after{ content:""; position:absolute; left:0; bottom:-6px; height:2px; width:0; background:var(--c-pri); transition:width .2s; }
.nav-links a:hover::after{ width:100%; }
.nav-spacer{ flex:1; }
.lang{ font-size:.82rem; color:var(--c-faint); font-weight:600; border:1px solid var(--c-border-2); padding:7px 12px; border-radius:999px; }
.nav-cta{ display:flex; gap:10px; align-items:center; }
.hamb{ display:none; background:none; border:1px solid var(--c-border-2); border-radius:10px; padding:8px 10px; cursor:pointer; }
.hamb span{ display:block; width:20px; height:2px; background:var(--c-text); margin:4px 0; }

/* ---------- Hero promo grid ---------- */
.hero{ padding:48px 0 28px; }
.promo-grid{
  display:grid; gap:18px;
  grid-template-columns:1.3fr 1fr; grid-template-rows:auto auto;
}
.promo{
  position:relative; overflow:hidden;
  border:1px solid var(--c-border); border-radius:var(--radius-lg);
  background:linear-gradient(160deg, var(--c-surface-2), var(--c-surface));
  padding:30px; min-height:200px; display:flex; flex-direction:column; justify-content:space-between;
  transition:transform .2s, border-color .2s;
}
.promo:hover{ transform:translateY(-3px); border-color:var(--c-pri); }
.promo::after{
  content:""; position:absolute; right:-60px; top:-60px; width:200px; height:200px; border-radius:50%;
  background:radial-gradient(circle, rgba(182,255,61,.18), transparent 70%); pointer-events:none;
}
.promo.feature{ grid-row:span 2; background:linear-gradient(155deg, #1c2613, var(--c-surface)); }
.promo .tag{ font-size:.7rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--c-pri); }
.promo .promo-title{ font-family:var(--f-display); font-weight:800; line-height:1.08; font-size:clamp(1.3rem,2.4vw,2rem); margin:10px 0; }
.promo.feature .promo-title{ font-size:clamp(1.8rem,3.2vw,2.6rem); }
.promo p{ color:var(--c-muted); font-size:.95rem; margin-bottom:18px; }
.promo .big{ font-family:var(--f-display); font-size:clamp(2.4rem,6vw,4rem); color:var(--c-pri); line-height:1; margin:6px 0; }

/* ---------- Games ---------- */
.games-head{ display:flex; align-items:flex-end; justify-content:space-between; flex-wrap:wrap; gap:16px; margin-bottom:24px; }
.tabs{ display:flex; gap:8px; flex-wrap:wrap; }
.tab{ font-size:.82rem; font-weight:600; color:var(--c-muted); padding:8px 16px; border-radius:999px; border:1px solid var(--c-border-2); cursor:pointer; background:none; font-family:var(--f-body); transition:.15s; }
.tab.active, .tab:hover{ color:#0a0c08; background:var(--c-pri); border-color:var(--c-pri); }
.games-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:16px; }
.game{
  position:relative; border-radius:var(--radius); overflow:hidden; border:1px solid var(--c-border-2);
  background:var(--c-surface); aspect-ratio:1/1; transition:.2s;
}
.game img{ width:100%; height:100%; object-fit:cover; transition:transform .3s; }
.game:hover{ border-color:var(--c-pri); transform:translateY(-3px); }
.game:hover img{ transform:scale(1.05); }
.game .badge{ position:absolute; top:9px; left:9px; font-size:.62rem; font-weight:700; letter-spacing:.08em; padding:4px 8px; border-radius:6px; background:var(--c-pri); color:#0a0c08; }
.game .ov{
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  background:linear-gradient(0deg, rgba(10,12,8,.92), rgba(10,12,8,.35));
  opacity:0; transition:opacity .2s;
}
.game:hover .ov{ opacity:1; }
.game .ov .gname{ font-family:var(--f-display); font-weight:700; font-size:.85rem; text-align:center; padding:0 8px; }
.game .ov .gprov{ font-size:.68rem; color:var(--c-muted); }

/* ---------- Intro / about ---------- */
.intro{ display:grid; grid-template-columns:1fr 1fr; gap:46px; align-items:center; }
.intro .copy p{ margin-top:16px; color:var(--c-muted); }
.intro .copy p:first-of-type{ color:var(--c-text); font-size:1.06rem; }
.quote-card{
  border:1px solid var(--c-border); border-radius:var(--radius-lg); padding:34px;
  background:linear-gradient(160deg, var(--c-surface-2), var(--c-surface)); position:relative;
}
.quote-card .qmark{ font-family:var(--f-display); font-size:4rem; color:var(--c-pri); line-height:.6; }
.quote-card p{ font-size:1.15rem; margin:14px 0; }
.quote-card .cite{ color:var(--c-pri); font-weight:600; font-size:.9rem; }

/* ---------- Pros / cons ---------- */
.pc-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:22px; }
.pc-col{ border:1px solid var(--c-border-2); border-radius:var(--radius); padding:26px; background:var(--c-surface); }
.pc-col h3{ display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.pc-col .count{ font-size:.72rem; color:var(--c-faint); }
.pc-item{ padding:14px 0; border-top:1px solid var(--c-border-2); }
.pc-item:first-of-type{ border-top:none; }
.pc-item b{ display:block; font-weight:700; margin-bottom:4px; }
.pc-item.pro b::before{ content:"+  "; color:var(--c-pri); }
.pc-item.con b::before{ content:"!  "; color:var(--c-gold); }
.pc-item span{ color:var(--c-muted); font-size:.9rem; }
.verdict{ grid-column:1 / -1; border:1px dashed var(--c-border); border-radius:var(--radius); padding:22px 26px; background:rgba(182,255,61,.04); }
.verdict b{ color:var(--c-pri); }

/* ---------- App section ---------- */
.app{ display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
.app .phone{ display:flex; justify-content:center; }
.app .phone img{ width:280px; border-radius:34px; border:8px solid #1b2014; box-shadow:var(--shadow); }
.app-feats{ list-style:none; display:grid; gap:12px; margin:22px 0; }
.app-feats li{ padding-left:28px; position:relative; color:var(--c-muted); }
.app-feats li::before{ content:"●"; position:absolute; left:0; color:var(--c-pri); font-size:.7rem; top:5px; }
.app-stats{ display:flex; gap:30px; margin:22px 0; flex-wrap:wrap; }
.app-stats .stat b{ font-family:var(--f-display); font-size:1.6rem; color:var(--c-pri); display:block; }
.app-stats .stat span{ font-size:.78rem; color:var(--c-muted); }
.store-row{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-top:18px; }
.store-badge{ border:1px solid var(--c-border); border-radius:12px; padding:10px 18px; font-size:.82rem; color:var(--c-muted); }

/* ---------- Steps (login / register) ---------- */
.steps-wrap{ display:grid; grid-template-columns:1fr 1fr; gap:34px; }
.steps-col h3{ margin-bottom:6px; }
.steps-col .meta{ font-size:.78rem; color:var(--c-faint); margin-bottom:18px; }
.step{ display:flex; gap:16px; padding:14px 0; border-top:1px solid var(--c-border-2); }
.step:first-of-type{ border-top:none; }
.step .num{ flex-shrink:0; width:36px; height:36px; border-radius:10px; background:var(--c-surface-2); border:1px solid var(--c-border); display:flex; align-items:center; justify-content:center; font-family:var(--f-display); font-weight:700; color:var(--c-pri); }
.step b{ display:block; margin-bottom:3px; }
.step span{ color:var(--c-muted); font-size:.9rem; }

/* ---------- Bonus banner ---------- */
.bonus-banner{
  border:1px solid var(--c-border); border-radius:var(--radius-lg); overflow:hidden;
  background:linear-gradient(135deg, #1d2914, var(--c-surface));
  display:grid; grid-template-columns:1.2fr 1fr; gap:30px; padding:42px; align-items:center;
}
.bonus-banner .pct{ font-family:var(--f-display); font-size:clamp(3.4rem,9vw,6rem); color:var(--c-pri); line-height:1; }
.bonus-stats{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.bonus-stats div{ border:1px solid var(--c-border-2); border-radius:var(--radius-sm); padding:14px; }
.bonus-stats b{ display:block; font-family:var(--f-display); font-size:1.3rem; color:var(--c-text); }
.bonus-stats span{ font-size:.75rem; color:var(--c-muted); }

/* ---------- Reviews ---------- */
.rev-top{ display:flex; gap:26px; align-items:center; flex-wrap:wrap; margin-bottom:28px; }
.rev-score{ font-family:var(--f-display); font-size:3rem; color:var(--c-pri); }
.rev-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.review{ border:1px solid var(--c-border-2); border-radius:var(--radius); padding:24px; background:var(--c-surface); }
.review .who{ display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.review .av{ width:42px; height:42px; border-radius:50%; background:var(--c-surface-2); border:1px solid var(--c-border); display:flex; align-items:center; justify-content:center; font-family:var(--f-display); font-weight:700; color:var(--c-pri); }
.review .who b{ font-size:.95rem; }
.review .who small{ display:block; color:var(--c-faint); font-size:.72rem; }
.stars{ color:var(--c-gold); letter-spacing:2px; font-size:.85rem; }
.review h3{ font-size:1.02rem; margin:6px 0 8px; }
.review p{ color:var(--c-muted); font-size:.9rem; }

/* ---------- Overview table ---------- */
.facts{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:1px; background:var(--c-border-2); border:1px solid var(--c-border-2); border-radius:var(--radius); overflow:hidden; }
.fact{ background:var(--c-surface); padding:20px; }
.fact .k{ font-size:.74rem; color:var(--c-faint); text-transform:uppercase; letter-spacing:.08em; }
.fact .sub{ font-size:.72rem; color:var(--c-faint); margin-bottom:8px; }
.fact .v{ font-family:var(--f-display); font-weight:700; font-size:1.05rem; color:var(--c-text); }
.chips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.chips span{ font-size:.72rem; padding:4px 9px; border-radius:7px; background:var(--c-surface-2); border:1px solid var(--c-border-2); color:var(--c-muted); }

/* ---------- Banking ---------- */
.bank-stats{ display:flex; gap:34px; flex-wrap:wrap; margin:22px 0 34px; }
.bank-stats .stat b{ font-family:var(--f-display); font-size:2rem; color:var(--c-pri); display:block; }
.bank-stats .stat span{ font-size:.8rem; color:var(--c-muted); }
.bank-block{ border:1px solid var(--c-border-2); border-radius:var(--radius); padding:26px; background:var(--c-surface); margin-bottom:18px; }
.bank-block h3{ color:var(--c-pri); font-size:1.1rem; margin-bottom:4px; }
.bank-block .methods{ color:var(--c-muted); font-size:.85rem; margin-bottom:14px; }
.bank-block p{ color:var(--c-muted); font-size:.92rem; }
.bank-table{ width:100%; border-collapse:collapse; margin-top:16px; font-size:.85rem; }
.bank-table th{ text-align:left; color:var(--c-faint); font-weight:600; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; padding:8px 10px; border-bottom:1px solid var(--c-border-2); }
.bank-table td{ padding:10px; border-bottom:1px solid var(--c-border-2); color:var(--c-text); }
.bank-table td:first-child{ color:var(--c-text); font-weight:600; }
.bank-note{ color:var(--c-faint); font-size:.82rem; margin-top:18px; border-top:1px solid var(--c-border-2); padding-top:16px; }

/* ---------- Trust checklist ---------- */
.checks{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.check{ border:1px solid var(--c-border-2); border-radius:var(--radius); padding:24px; background:var(--c-surface); }
.check .n{ font-family:var(--f-display); font-size:2rem; color:var(--c-border); line-height:1; }
.check h3{ margin:8px 0 8px; font-size:1.1rem; }
.check p{ color:var(--c-muted); font-size:.9rem; }
.checks-outro{ margin-top:26px; color:var(--c-muted); }
.checks-outro a{ color:var(--c-pri); font-weight:600; text-decoration:underline; text-underline-offset:3px; }

/* ---------- Responsible gaming ---------- */
.rg-alert{ border:1px solid var(--c-gold); border-radius:var(--radius); padding:18px 22px; background:rgba(233,196,106,.07); margin-bottom:30px; }
.rg-alert b{ color:var(--c-gold); }
.rg-principles{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:16px; margin:24px 0; }
.rg-principle{ border:1px solid var(--c-border-2); border-radius:var(--radius); padding:20px; background:var(--c-surface); }
.rg-principle .n{ font-family:var(--f-display); color:var(--c-pri); font-size:1.1rem; }
.rg-principle b{ display:block; margin:6px 0; }
.rg-principle span{ color:var(--c-muted); font-size:.88rem; }
.rg-list{ list-style:none; display:grid; gap:10px; margin:18px 0; }
.rg-list li{ padding-left:26px; position:relative; color:var(--c-muted); font-size:.92rem; }
.rg-list li::before{ content:"▸"; position:absolute; left:0; color:var(--c-gold); }
.rg-tools{ display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:16px; margin-top:18px; }
.rg-tool{ border:1px solid var(--c-border-2); border-radius:var(--radius-sm); padding:18px; background:var(--c-surface); }
.rg-tool b{ color:var(--c-pri); display:block; margin-bottom:5px; }
.rg-tool span{ color:var(--c-muted); font-size:.86rem; }
.help-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; margin-top:20px; }
.help{ border:1px solid var(--c-border-2); border-radius:var(--radius); padding:20px; background:var(--c-surface); }
.help b{ display:block; font-size:1rem; }
.help .hrs{ font-size:.72rem; color:var(--c-pri); }
.help .num{ font-family:var(--f-display); font-size:1.2rem; color:var(--c-text); margin:6px 0; }
.help .site{ font-size:.8rem; color:var(--c-sec); }
.help p{ color:var(--c-muted); font-size:.84rem; margin-top:8px; }

/* ---------- FAQ ---------- */
.faq{ display:grid; gap:12px; }
.faq details{ border:1px solid var(--c-border-2); border-radius:var(--radius); background:var(--c-surface); overflow:hidden; }
.faq summary{ cursor:pointer; padding:20px 24px; font-family:var(--f-display); font-weight:700; font-size:1.02rem; list-style:none; display:flex; justify-content:space-between; gap:14px; align-items:center; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; color:var(--c-pri); font-size:1.4rem; transition:transform .2s; }
.faq details[open] summary::after{ transform:rotate(45deg); }
.faq details p{ padding:0 24px 22px; color:var(--c-muted); font-size:.92rem; }
.faq-cta{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; margin-top:26px; border:1px solid var(--c-border); border-radius:var(--radius); padding:22px 26px; background:rgba(182,255,61,.04); }
.faq-cta span{ color:var(--c-muted); font-size:.92rem; }

/* ---------- Footer ---------- */
.site-footer{ border-top:1px solid var(--c-border-2); background:var(--c-bg-2); padding:54px 0 30px; margin-top:30px; }
.foot-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:34px; }
.foot-brand img{ height:42px; margin-bottom:14px; }
.foot-brand p{ color:var(--c-muted); font-size:.88rem; max-width:34ch; }
.foot-col .foot-h{ font-family:var(--f-body); font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--c-faint); margin-bottom:14px; }
.foot-col ul{ list-style:none; display:grid; gap:9px; }
.foot-col a{ color:var(--c-muted); font-size:.88rem; transition:color .15s; }
.foot-col a:hover{ color:var(--c-pri); }
.foot-badges{ display:flex; gap:10px; flex-wrap:wrap; margin-top:12px; }
.foot-badges span{ font-size:.7rem; padding:5px 10px; border:1px solid var(--c-border-2); border-radius:7px; color:var(--c-muted); }
.foot-license{ font-size:.82rem; color:var(--c-muted); }
.foot-bottom{ border-top:1px solid var(--c-border-2); margin-top:34px; padding-top:22px; display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; color:var(--c-faint); font-size:.8rem; }
.age{ display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border:2px solid var(--c-gold); border-radius:50%; color:var(--c-gold); font-weight:700; font-size:.8rem; font-family:var(--f-display); }

/* ---------- Reveal animation ---------- */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:none; }

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .promo-grid{ grid-template-columns:1fr 1fr; }
  .promo.feature{ grid-row:auto; grid-column:1 / -1; }
  .intro, .app, .steps-wrap, .pc-grid, .checks, .rev-grid, .bonus-banner{ grid-template-columns:1fr; }
  .bonus-banner{ text-align:left; }
  .foot-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:680px){
  .nav-links, .lang{ display:none; }
  .hamb{ display:block; }
  .nav-links.open{ display:flex; flex-direction:column; position:absolute; top:74px; left:0; right:0; background:var(--c-bg-2); padding:18px 22px; gap:14px; border-bottom:1px solid var(--c-border-2); }
  .promo-grid{ grid-template-columns:1fr; }
  .foot-grid{ grid-template-columns:1fr; }
  .section{ padding:54px 0; }
  .rev-grid{ grid-template-columns:1fr; }
}
