:root {
  --blue:#2146f3;
  --blue2:#142fc4;
  --ink:#07101f;
  --panel:#101d35;
  --panel2:#152541;
  --text:#f8faff;
  --muted:#b2bdd3;
  --line:#2b3b59;
  --orange:#ff5b35;
  --mint:#54d4b0;
  --max:1240px;
  --radius:18px
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:92px
}
body {
  margin:0;
  background:var(--ink);
  color:var(--text);
  font:16px/1.68 Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  overflow-wrap:break-word
}
img {
  display:block;
  max-width:100%;
  height:auto
}
.header {
  position:sticky;
  top:0;
  z-index:50;
  height:82px;
  background:var(--blue);
  box-shadow:0 10px 35px #0005
}
.header-inner {
  max-width:var(--max);
  height:100%;
  margin:auto;
  padding:0 22px;
  display:flex;
  align-items:center;
  gap:30px
}
.brand {
  display:flex;
  align-items:center;
  flex:0 0 auto
}
.brand svg {
  width:194px;
  height:auto
}
.main-nav {
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:auto
}
.main-nav>a {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 18px;
  border-radius:12px;
  color:#fff;
  text-decoration:none;
  font-weight:800
}
.main-nav>a:hover,.main-nav>a:focus-visible {
  background:#ffffff18
}
.flags {
  position:relative
}
.flag-toggle {
  min-width:48px;
  min-height:48px;
  padding:8px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:transparent;
  border:0;
  border-radius:12px;
  font-size:23px;
  cursor:pointer
}
.flag-menu {
  position:absolute;
  top:58px;
  right:0;
  width:244px;
  padding:10px;
  display:none;
  grid-template-columns:repeat(3,1fr);
  gap:8px;
  background:#fff;
  border-radius:16px;
  box-shadow:0 22px 60px #0008
}
.flags.open .flag-menu {
  display:grid
}
.flag-menu a {
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  background:#f1f4ff;
  font-size:23px;
  text-decoration:none
}
.flag-menu a:hover,.flag-menu a:focus-visible {
  outline:3px solid #9cadff
}
.mobile-toggle {
  display:none;
  width:48px;
  height:48px;
  border:0;
  border-radius:12px;
  background:#fff;
  color:#14214a;
  font-size:26px
}
.hero {
  min-height:620px;
  display:flex;
  align-items:center;
  background:#081228 url('../img/fs-casino-hero.webp') center/cover no-repeat
}
.hero-inner {
  width:100%;
  max-width:var(--max);
  margin:auto;
  padding:82px 22px;
  display:grid;
  grid-template-columns:minmax(0,690px) 1fr
}
.hero-copy {
  padding:34px;
  border-radius:24px;
  background:linear-gradient(120deg,#071224ed,#071224b8);
  backdrop-filter:blur(8px)
}
.eyebrow {
  font-weight:850;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:#aebdff
}
.hero h1 {
  font-size:clamp(42px,6vw,74px);
  line-height:.98;
  letter-spacing:-.045em;
  margin:14px 0 24px
}
.hero p {
  font-size:18px;
  color:#e8ecf7;
  margin:0 0 26px
}
.actions {
  display:flex;
  gap:12px;
  flex-wrap:wrap
}
.button {
  min-height:50px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 20px;
  border-radius:12px;
  text-decoration:none;
  font-weight:850;
  border:1px solid transparent
}
.button-primary {
  background:var(--orange);
  color:#fff
}
.button-secondary {
  background:#fff;
  color:#101b31
}
.button:hover {
  transform:translateY(-1px)
}
.wrap {
  max-width:var(--max);
  margin:auto;
  padding:34px 22px 80px
}
.section {
  padding:62px 0;
  border-bottom:1px solid var(--line)
}
.section:last-child {
  border-bottom:0
}
.section>h2,.policy-section>h2 {
  font-size:clamp(29px,4vw,43px);
  line-height:1.15;
  letter-spacing:-.025em;
  margin:0 0 24px
}
.section>h3,.policy-section>h3 {
  font-size:22px;
  line-height:1.3;
  margin:36px 0 14px
}
.section p,.policy-section p {
  color:#d8dfec;
  max-width:920px;
  margin:0 0 18px
}
.lead {
  font-size:19px
}
.grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
  margin-top:24px
}
.card {
  padding:24px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:var(--panel)
}
.card h3,.card strong {
  display:block;
  margin:0 0 10px;
  font-size:20px
}
.pros-cons {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px
}
.pros {
  border-top:4px solid var(--mint)
}
.cons {
  border-top:4px solid var(--orange)
}
ul,ol {
  padding-left:24px;
  color:#d8dfec
}
li+li {
  margin-top:8px
}
.table-shell {
  overflow-x:auto;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:16px;
  margin:24px 0
}
table {
  width:100%;
  min-width:760px;
  border-collapse:collapse
}
th,td {
  padding:15px 17px;
  text-align:left;
  vertical-align:top;
  border-bottom:1px solid var(--line)
}
th {
  background:#1b2d53;
  color:#fff
}
tbody tr:last-child td {
  border-bottom:0
}
.article-image {
  margin:38px 0;
  border-radius:22px;
  overflow:hidden;
  background:var(--panel)
}
.article-image img {
  width:100%;
  max-height:500px;
  object-fit:cover
}
.article-image figcaption {
  padding:12px 16px;
  color:var(--muted);
  font-size:14px
}
.banner {
  margin:44px 0;
  padding:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  border-radius:22px;
  background:linear-gradient(120deg,var(--blue),#4324b4)
}
.banner strong {
  font-size:clamp(26px,4vw,42px);
  line-height:1.08
}
.faq details {
  margin:12px 0;
  padding:18px 20px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:13px
}
.faq summary {
  font-weight:850;
  cursor:pointer
}
.policy {
  max-width:980px;
  margin:auto;
  padding:72px 22px
}
.policy h1 {
  font-size:clamp(40px,6vw,64px);
  line-height:1.02;
  margin:0 0 22px
}
.policy-section {
  padding:38px 0;
  border-bottom:1px solid var(--line)
}
.footer {
  padding:52px max(22px,calc((100% - var(--max))/2));
  background:#030816;
  border-top:1px solid var(--line)
}
.footer-grid {
  display:grid;
  grid-template-columns:2fr repeat(3,1fr);
  gap:34px
}
.footer .brand svg {
  width:178px
}
.footer a {
  display:block;
  color:#b7c1d5;
  text-decoration:none;
  margin:9px 0
}
.footer-note {
  margin-top:32px;
  padding-top:22px;
  border-top:1px solid var(--line);
  color:#8995ab;
  font-size:13px
}
.skip {
  position:absolute;
  left:-9999px
}
.skip:focus {
  left:12px;
  top:12px;
  z-index:100;
  background:#fff;
  color:#000;
  padding:12px
}
.focusable:focus-visible,a:focus-visible,button:focus-visible {
  outline:3px solid #fff;
  outline-offset:3px
}
@media(max-width:900px) {
  .header-inner {
    padding:0 14px;
    gap:12px
  }
  .brand svg {
    width:160px
  }
  .mobile-toggle {
    display:block;
    margin-left:auto
  }
  .main-nav {
    position:fixed;
    top:82px;
    left:0;
    right:0;
    display:none;
    flex-direction:column;
    align-items:stretch;
    padding:16px;
    background:var(--blue2);
    box-shadow:0 20px 40px #0008
  }
  .header.menu-open .main-nav {
    display:flex
  }
  .main-nav>a {
    justify-content:flex-start;
    background:#ffffff0c
  }
  .flags {
    margin-left:0
  }
  .flag-menu {
    position:fixed;
    top:82px;
    left:14px;
    right:14px;
    width:auto;
    grid-template-columns:repeat(6,1fr)
  }
  .hero {
    min-height:560px;
    background-position:62% center
  }
  .hero-inner {
    padding:54px 18px
  }
  .hero-copy {
    max-width:620px
  }
  .grid {
    grid-template-columns:1fr 1fr
  }
  .footer-grid {
    grid-template-columns:1fr 1fr
  }
}
@media(max-width:600px) {
  .header {
    height:72px
  }
  .header-inner {
    height:72px
  }
  .brand svg {
    width:136px
  }
  .main-nav {
    top:72px
  }
  .flag-menu {
    top:72px;
    grid-template-columns:repeat(4,1fr)
  }
  .hero {
    min-height:620px;
    background-position:68% center
  }
  .hero-inner {
    padding:30px 14px
  }
  .hero-copy {
    padding:24px 20px
  }
  .hero h1 {
    font-size:43px
  }
  .actions {
    display:grid
  }
  .button {
    width:100%
  }
  .wrap {
    padding:18px 16px 60px
  }
  .section {
    padding:46px 0
  }
  .grid,.pros-cons,.footer-grid {
    grid-template-columns:1fr
  }
  .banner {
    align-items:flex-start;
    flex-direction:column;
    padding:27px
  }
  .article-image {
    margin:30px 0
  }
  .policy {
    padding:52px 16px
  }
  .policy-section {
    padding:32px 0
  }
  .footer {
    padding:40px 18px
  }
}