/* LightningBetAU — independent review portal
   Palette: electric storm on near-black. */
:root{
  --bg:#07090f;
  --bg-2:#0d1119;
  --bg-3:#131925;
  --line:#1f2836;
  --line-2:#3a4555;
  --ink:#eef2f8;
  --ink-2:#aab6c8;
  --ink-3:#7b8798;
  --bolt:#ffd027;
  --bolt-2:#ffb300;
  --volt:#3da5ff;
  --good:#37d399;
  --warn:#ff8a4c;
  --bad:#ff5f6d;
  --radius:14px;
  --radius-s:9px;
  --wrap:1140px;
  --shadow:0 18px 50px -24px rgba(0,0,0,.95);
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);
  font-size:17px;line-height:1.72;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--bolt);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{line-height:1.22;margin:0 0 .6em;font-weight:800;letter-spacing:-.02em}
h1{font-size:clamp(1.85rem,4.6vw,3.05rem)}
h2{font-size:clamp(1.45rem,3vw,2.1rem);margin-top:0}
h3{font-size:clamp(1.12rem,2vw,1.35rem)}
h4{font-size:1.02rem;margin-bottom:.35em}
p{margin:0 0 1.05em}
ul,ol{margin:0 0 1.15em;padding-left:1.25em}
li{margin-bottom:.5em}
strong{color:#fff}
small{font-size:.86rem}
hr{border:0;border-top:1px solid var(--line);margin:2.4rem 0}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 20px}
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- skip link ---------- */
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--bolt);color:#000;padding:10px 16px;border-radius:0 0 8px 0;font-weight:700}
.skip:focus{left:0}

/* ---------- 18+ gate: a panel inside the first block ----------
   Not an overlay and not a scroll lock. The whole site stays readable and
   scrollable; only the first block's own content is swapped for this panel
   until the visitor confirms. On the homepage it sits inside the hero, over
   the background photograph.

   Default (no JS, or storage unavailable): the panel is hidden and the page
   reads normally, which also keeps it fully crawlable. The inline script in
   <head> adds .age-pending to <html> when the visitor has not confirmed. */
.gatebox{display:none}
.age-pending .gatebox{display:block}
.age-pending .hero__in{display:none}

.gatebox__in{max-width:780px}
.gatebox__badge{
  display:inline-grid;place-items:center;
  width:84px;height:84px;border-radius:50%;
  border:3px solid var(--bad);color:var(--bad);
  font-weight:900;font-size:1.75rem;letter-spacing:-.04em;
  background:rgba(255,95,109,.08);
  margin-bottom:22px;
}
/* Styled as a heading but kept a <p>, so each page keeps a single h1. */
.gatebox__h{
  font-size:clamp(1.5rem,3.6vw,2.2rem);font-weight:800;line-height:1.2;
  letter-spacing:-.02em;color:#fff;margin:0 0 .5em;
  text-shadow:0 2px 26px rgba(0,0,0,.55);
}
.gatebox__lead{font-size:1.04rem;color:#c5cfdd;max-width:56ch;margin:0 0 10px}
.gatebox__warn{font-size:.93rem;color:#98a6b8;max-width:62ch;margin:0}
.gatebox__actions{display:flex;gap:14px;flex-wrap:wrap;margin:28px 0 0}
.gatebox__actions .btn{min-width:210px;padding:14px 26px;font-size:1rem}
.gatebox__rules{
  list-style:none;padding:22px 0 0;margin:28px 0 0;
  border-top:1px solid rgba(255,255,255,.12);
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;
  font-size:.85rem;color:#8f9db0;
}
.gatebox__rules li{margin:0;padding-left:22px;position:relative}
.gatebox__rules li::before{content:"\2713";position:absolute;left:0;top:0;color:var(--bolt);font-weight:900}
.gatebox__rules b{color:#d3dbe6;display:block;font-weight:700}
.gatebox__rules a{color:var(--bolt)}

/* Homepage: inside the hero, sharing its background photo and scrim. */
.gatebox--hero{position:relative;z-index:2}

/* Inner pages: a self-contained panel at the top of the content. */
.gatebox--plain{
  position:relative;
  padding:46px 0 48px;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(760px 340px at 12% 0%,rgba(255,208,39,.11),transparent 62%),
    var(--bg-2);
}

@media(max-width:760px){
  .gatebox__rules{grid-template-columns:1fr;gap:12px}
  .gatebox__actions .btn{min-width:0;width:100%}
  .gatebox__badge{width:70px;height:70px;font-size:1.5rem;margin-bottom:18px}
  .gatebox--plain{padding:36px 0 38px}
}

/* ---------- top warning strip ---------- */
.strip{background:linear-gradient(90deg,#1a1205,#231a06);border-bottom:1px solid #3a2d08;color:#ffdf85;font-size:.82rem;text-align:center;padding:8px 20px;font-weight:600;letter-spacing:.01em}
.strip a{color:#fff;text-decoration:underline}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:50;background:rgba(7,9,15,.9);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.hdr__in{display:flex;align-items:center;gap:18px;min-height:68px}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;font-size:1.12rem;color:#fff;letter-spacing:-.03em}
.brand:hover{text-decoration:none}
.brand__bolt{width:30px;height:30px;flex:0 0 30px;display:grid;place-items:center;background:linear-gradient(145deg,var(--bolt),var(--bolt-2));border-radius:8px;color:#0a0a0a;font-size:1.05rem;font-weight:900}
.brand i{color:var(--bolt);font-style:normal}
.nav{margin-left:auto;display:flex;align-items:center;gap:4px}
.nav a{color:var(--ink-2);font-size:.92rem;font-weight:600;padding:9px 12px;border-radius:8px}
.nav a:hover,.nav a[aria-current="page"]{color:#fff;background:var(--bg-3);text-decoration:none}
.nav a[aria-current="page"]{color:var(--bolt)}
.burger{margin-left:auto;display:none;background:var(--bg-3);border:1px solid var(--line);color:var(--ink);border-radius:9px;padding:9px 11px;font-size:1rem;cursor:pointer}
@media(max-width:940px){
  .nav{position:fixed;inset:68px 0 auto;flex-direction:column;align-items:stretch;gap:2px;background:var(--bg-2);border-bottom:1px solid var(--line);padding:12px 20px 20px;margin:0;display:none;max-height:calc(100vh - 68px);overflow-y:auto}
  .nav.open{display:flex}
  .nav a{padding:12px}
  .burger{display:block}
}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:10px;font-weight:700;font-size:.95rem;border:1px solid transparent;cursor:pointer;transition:transform .12s ease,opacity .12s ease;text-align:center}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn--p{background:linear-gradient(145deg,var(--bolt),var(--bolt-2));color:#0a0a0a}
.btn--g{background:var(--bg-3);border-color:var(--line);color:var(--ink)}
.btn--o{background:transparent;border-color:var(--bolt);color:var(--bolt)}
.btn--sm{padding:9px 16px;font-size:.88rem}

/* ---------- hero with photographic background ---------- */
.hero{
  position:relative;
  padding:96px 0 84px;
  overflow:hidden;
  border-bottom:1px solid var(--line);
  background:var(--bg);
}
/* The photo sits in an <img> rather than a CSS background so it can be
   served responsively (srcset) and prioritised as the LCP element. */
.hero__bg{
  position:absolute;inset:0;z-index:0;
  width:100%;height:100%;
  object-fit:cover;object-position:62% 50%;
}
/* Scrim: dark on the left for text contrast, lighter on the right so the
   photograph still reads. Works wherever the subject sits in the crop. */
.hero__scrim{
  position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(100deg,
      rgba(7,9,15,.97) 0%,
      rgba(7,9,15,.92) 34%,
      rgba(7,9,15,.74) 60%,
      rgba(7,9,15,.56) 100%),
    linear-gradient(to top,rgba(7,9,15,.88) 0%,rgba(7,9,15,0) 46%),
    radial-gradient(760px 340px at 10% 0%,rgba(255,208,39,.13),transparent 62%);
}
.hero__in{position:relative;z-index:2;max-width:760px}
.hero h1{text-shadow:0 2px 26px rgba(0,0,0,.55)}
@media(max-width:900px){
  .hero{padding:66px 0 60px}
  .hero__scrim{background:
    linear-gradient(180deg,rgba(7,9,15,.9) 0%,rgba(7,9,15,.87) 45%,rgba(7,9,15,.96) 100%),
    radial-gradient(600px 300px at 20% 0%,rgba(255,208,39,.12),transparent 62%)}
}
@media(max-width:620px){
  .hero{padding:52px 0 48px}
}
.pill{display:inline-flex;align-items:center;gap:8px;font-size:.8rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--bolt);background:rgba(255,208,39,.08);border:1px solid rgba(255,208,39,.28);padding:6px 13px;border-radius:999px;margin-bottom:20px}
.hero p.lead{font-size:1.07rem;color:#c5cfdd;max-width:62ch}
.hero__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.hero__meta{display:flex;gap:22px;flex-wrap:wrap;margin-top:30px;font-size:.84rem;color:#92a0b3}
.hero__meta b{color:#fff;display:block;font-size:.97rem}
@media(max-width:620px){.hero__meta{gap:16px}}

/* ---------- quick facts strip ---------- */
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
@media(max-width:900px){.facts{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.facts{grid-template-columns:1fr}}
.facts div{background:var(--bg-2);padding:18px 20px}
.sec--alt .facts div{background:var(--bg-3)}
.facts dt{font-size:.74rem;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3);font-weight:800;margin-bottom:5px}
.facts dd{margin:0;font-size:.98rem;color:#fff;font-weight:700;line-height:1.4;letter-spacing:-.01em}
.facts dd small{display:block;font-weight:500;font-size:.8rem;color:var(--ink-3);letter-spacing:0;margin-top:3px}

/* ---------- score card ---------- */
.score{background:linear-gradient(170deg,var(--bg-2),var(--bg-3));border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:var(--shadow)}
.score__top{display:flex;align-items:center;gap:16px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.score__num{font-size:2.5rem;font-weight:900;color:var(--bolt);line-height:1;letter-spacing:-.04em}
.score__num small{font-size:.9rem;color:var(--ink-3);font-weight:600}
.score__lbl{font-size:.78rem;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3);font-weight:700}
.score__rows{list-style:none;padding:0;margin:18px 0 0}
.score__rows li{display:flex;justify-content:space-between;gap:12px;font-size:.9rem;padding:7px 0;margin:0;border-bottom:1px dashed var(--line)}
.score__rows li:last-child{border:0}
.score__rows span:first-child{color:var(--ink-3)}
.score__rows span:last-child{color:var(--ink);font-weight:600;text-align:right}

/* ---------- sections ---------- */
.sec{padding:58px 0;border-bottom:1px solid var(--line)}
.sec--alt{background:var(--bg-2)}
.sec__head{max-width:74ch;margin-bottom:34px}
.sec__head p{color:var(--ink-2);margin-bottom:0}
.eyebrow{font-size:.78rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--volt);margin-bottom:10px}

/* ---------- grids & cards ---------- */
.grid{display:grid;gap:18px}
.grid--2{grid-template-columns:repeat(2,1fr)}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.grid--3,.grid--4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.grid--2,.grid--3,.grid--4{grid-template-columns:1fr}}
.card{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.sec--alt .card{background:var(--bg-3)}
.card h3,.card h4{color:#fff}
.card p:last-child,.card ul:last-child{margin-bottom:0}
.card p{font-size:.95rem;color:var(--ink-2)}
.card ul{font-size:.94rem;color:var(--ink-2)}
.card__ico{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;background:rgba(61,165,255,.1);border:1px solid rgba(61,165,255,.25);font-size:1.15rem;margin-bottom:14px}
.card--bolt .card__ico{background:rgba(255,208,39,.1);border-color:rgba(255,208,39,.28)}

/* ---------- tables ---------- */
.tblwrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-2)}
table{width:100%;border-collapse:collapse;font-size:.93rem;min-width:520px}
caption{text-align:left;padding:14px 18px;font-size:.85rem;color:var(--ink-3);border-bottom:1px solid var(--line)}
th,td{padding:13px 18px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--bolt);font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;font-weight:800;background:var(--bg-3)}
tbody tr:last-child td{border-bottom:0}
td strong{color:#fff}

/* ---------- callouts ---------- */
.note{border:1px solid var(--line);border-left:3px solid var(--volt);background:var(--bg-2);border-radius:var(--radius-s);padding:20px 22px;margin:0 0 22px}
.note h3,.note h4{margin-bottom:.4em;color:#fff}
.note p:last-child,.note ul:last-child{margin-bottom:0}
.note p,.note li{font-size:.94rem;color:var(--ink-2)}
.note--warn{border-left-color:var(--warn);background:linear-gradient(110deg,rgba(255,138,76,.07),var(--bg-2))}
.note--bad{border-left-color:var(--bad);background:linear-gradient(110deg,rgba(255,95,109,.07),var(--bg-2))}
.note--bolt{border-left-color:var(--bolt);background:linear-gradient(110deg,rgba(255,208,39,.07),var(--bg-2))}
.note--good{border-left-color:var(--good);background:linear-gradient(110deg,rgba(55,211,153,.06),var(--bg-2))}

/* ---------- pros / cons ---------- */
.pc{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:700px){.pc{grid-template-columns:1fr}}
.pc ul{list-style:none;padding:0;margin:0}
.pc li{position:relative;padding-left:28px;font-size:.95rem;color:var(--ink-2)}
.pc li::before{position:absolute;left:0;top:0;font-weight:900}
.pc__yes li::before{content:"+";color:var(--good)}
.pc__no li::before{content:"\2212";color:var(--bad)}
.pc__yes{border-top:3px solid var(--good)}
.pc__no{border-top:3px solid var(--bad)}

/* ---------- faq ---------- */
.faq{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--bg-2)}
.faq details{border-bottom:1px solid var(--line)}
.faq details:last-child{border-bottom:0}
.faq summary{cursor:pointer;padding:17px 22px;font-weight:700;font-size:.99rem;color:#fff;list-style:none;display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--bolt);font-weight:900;font-size:1.2rem;line-height:1;flex:0 0 auto}
.faq details[open] summary::after{content:"\2212"}
.faq summary:hover{background:var(--bg-3)}
.faq__body{padding:0 22px 20px;font-size:.94rem;color:var(--ink-2)}
.faq__body p:last-child,.faq__body ul:last-child{margin-bottom:0}

/* ---------- help contacts ---------- */
.help{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media(max-width:700px){.help{grid-template-columns:1fr}}
.help__item{background:var(--bg-3);border:1px solid var(--line);border-radius:var(--radius-s);padding:18px 20px}
.sec--alt .help__item{background:var(--bg-2)}
.help__item h4{margin-bottom:.2em}
.help__item .tel{display:block;font-size:1.3rem;font-weight:900;color:var(--bolt);letter-spacing:-.02em;margin:4px 0 6px}
.help__item .tel:hover{text-decoration:none;color:var(--bolt-2)}
.help__item p{font-size:.88rem;color:var(--ink-3);margin:0}
.help__item p a{color:var(--volt)}

/* ---------- breadcrumbs ---------- */
.crumbs{font-size:.84rem;color:var(--ink-3);padding:16px 0 0}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;padding:0;margin:0}
.crumbs li{margin:0}
.crumbs li+li::before{content:"/";margin-right:8px;color:var(--line-2)}
.crumbs a{color:var(--ink-2)}

/* ---------- page head ---------- */
.phead{padding:34px 0 40px;border-bottom:1px solid var(--line);background:radial-gradient(900px 300px at 20% -20%,rgba(255,208,39,.09),transparent 60%),var(--bg)}
.phead p{color:var(--ink-2);max-width:72ch;margin-bottom:0;font-size:1.03rem}
.phead .upd{font-size:.82rem;color:var(--ink-3);margin-top:14px}

/* ---------- prose ---------- */
.prose{max-width:80ch}
.prose h2{margin-top:2.2em}
.prose h3{margin-top:1.7em}
.prose>:first-child{margin-top:0}
.prose li,.prose p{color:var(--ink-2)}
.prose strong{color:#fff}

/* ---------- toc ---------- */
.toc{background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius);padding:20px 24px;margin:0 0 34px}
.toc h2{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-3);margin-bottom:.8em}
.toc ol{columns:2;column-gap:28px;margin:0;padding-left:1.1em;font-size:.92rem}
@media(max-width:620px){.toc ol{columns:1}}
.toc a{color:var(--ink-2)}
.toc a:hover{color:var(--bolt)}

/* ---------- tagline band ---------- */
.band{background:linear-gradient(100deg,#1b1406,#0f1118);border-top:1px solid #35290a;border-bottom:1px solid #35290a;padding:30px 0;text-align:center}
.band p{font-size:1.1rem;font-weight:800;color:#ffdf85;margin:0 0 6px;letter-spacing:-.01em}
.band small{color:var(--ink-3);display:block;font-size:.87rem}
.band small a{color:#fff;text-decoration:underline}

/* ---------- footer ---------- */
.ftr{background:#04060b;border-top:1px solid var(--line);padding:50px 0 28px;font-size:.9rem;color:var(--ink-3)}
.ftr__top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:32px;padding-bottom:34px;border-bottom:1px solid var(--line)}
@media(max-width:900px){.ftr__top{grid-template-columns:1fr 1fr;gap:26px}}
@media(max-width:560px){.ftr__top{grid-template-columns:1fr}}
.ftr h4{color:#fff;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:1em}
.ftr ul{list-style:none;padding:0;margin:0}
.ftr li{margin-bottom:.55em}
.ftr a{color:var(--ink-2)}
.ftr a:hover{color:var(--bolt)}
.ftr__about p{font-size:.88rem;line-height:1.65}
.ftr__18{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;border:2px solid var(--bad);color:var(--bad);font-weight:900;font-size:.95rem;margin-bottom:14px}
.legal{padding:28px 0 0;font-size:.8rem;line-height:1.62;color:#6b7788}
.legal h4{color:var(--warn);font-size:.78rem}
.legal p{margin-bottom:.9em}
.legal strong{color:#9aa6b8}
.ftr__btm{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:20px;border-top:1px solid var(--line);font-size:.82rem}
.ftr__btm ul{display:flex;gap:16px;flex-wrap:wrap}