/* ============================================================
   MythosWin (mythos-win.casino) - site overrides
   Noto Serif Display headings, Commissioner text, Cinzel in the logo.
   Night navy ground, MW crest gold, the cyan of Register and JOIN NOW,
   marble white panels and the violet gem of the VIP crown, all taken
   from the supplied MythosWin screens.
   Centred column capped at 1120 px.
   ============================================================ */
:root {
  --font-display: "Noto Serif Display", Georgia, "Times New Roman", serif;
  --font-body: "Commissioner", "Segoe UI", Arial, sans-serif;
  --mw-gold: #d4a64a;
  --mw-gold-2: #e7c27a;
  --mw-gold-deep: #8c6a26;
  --mw-cyan: #19c8ee;
  --mw-cyan-2: #5cdaf5;
  --mw-cyan-deep: #0b8fb0;
  --mw-violet: #8a5cd6;
  --mw-marble: #f3efe7;
  --mw-marble-2: #ddd6c8;
  --mw-ink: #0b1426;
  --mw-panel: #101c33;
  --mw-panel-2: #16243f;
  --mw-line: #2a3858;
  --mw-text: #d8d2c4;
  --mw-faint: #a49f9a;
  --mw-key: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='12' viewBox='0 0 24 12'%3E%3Cpath d='M0 11h22V1H6v6h10V5H8V3h12v6H2v2' fill='none' stroke='%23d4a64a' stroke-width='1.6'/%3E%3C/svg%3E");
}

body {
  font-family: var(--font-body);
  font-size: 1.02rem;
  line-height: 1.72;
  color: var(--mw-text);
  background:
    radial-gradient(1000px 560px at 50% -240px, rgba(138, 92, 214, 0.20), transparent 70%),
    radial-gradient(800px 480px at -10% 40%, rgba(25, 200, 238, 0.06), transparent 70%),
    var(--color-bg);
}
.container { max-width: 1120px; }

/* ---------- Header: navy bar on a gold meander edge ---------- */
.site-header.mw-header {
  background: rgba(11, 20, 38, 0.96);
  border-bottom: 0;
  backdrop-filter: blur(10px);
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.35);
}
.site-header.mw-header::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 6px;
  background: var(--mw-key) repeat-x center / 18px 6px, #0b1426;
  border-top: 1px solid var(--mw-gold-deep);
  pointer-events: none;
}
.site-header .site-logo img { height: 46px; width: auto; }
.nav-main--desktop { gap: 0; }
.nav-main--desktop a {
  font-family: var(--font-body); font-weight: 600; font-size: 0.86rem;
  letter-spacing: 0.08em; text-transform: uppercase;
  padding: 0.5rem 0.8rem; border-radius: 0; color: #ece6d8;
  border-bottom: 2px solid transparent;
}
.nav-main--desktop a:hover { color: var(--mw-gold-2); background: transparent; border-bottom-color: var(--mw-gold); }
.btn { font-family: var(--font-body); font-weight: 700; letter-spacing: 0.04em; border-radius: 8px; }
.btn--primary, main a.btn--primary, .mw-register {
  background: linear-gradient(180deg, var(--mw-cyan-2), var(--mw-cyan) 55%, var(--mw-cyan-deep));
  color: #04121d !important; border: 1px solid var(--mw-gold);
  box-shadow: 0 0 0 2px rgba(212, 166, 74, 0.35), 0 8px 20px rgba(25, 200, 238, 0.22);
  text-transform: uppercase;
}
.btn--primary:hover, main a.btn--primary:hover { background: linear-gradient(180deg, #8ae6f8, var(--mw-cyan-2)); color: #04121d !important; }
.btn--outline {
  background: transparent; color: var(--mw-gold-2); border: 1px solid var(--mw-gold); text-transform: uppercase;
}
.btn--outline:hover { background: rgba(212, 166, 74, 0.12); color: #fff; border-color: var(--mw-gold-2); }

/* ---------- Language switcher ---------- */
.lang-switcher__toggle { border-radius: 8px; border-color: var(--mw-line); }
.mw-code {
  display: inline-grid; place-items: center; min-width: 32px; height: 22px; padding: 0 6px;
  border-radius: 4px; border: 1px solid var(--mw-gold-deep); background: #0e1930;
  font-family: var(--font-body); font-size: 0.68rem; font-weight: 700; letter-spacing: 0.06em; color: var(--mw-gold-2);
}
.lang-switcher__toggle .lang-switcher__code { display: none; }
.lang-switcher__menu {
  width: 240px; max-width: 92vw; display: grid !important; grid-template-columns: 1fr; gap: 2px;
  padding: 8px; max-height: 70vh; overflow-y: auto;
  background: #0e1930; border: 1px solid var(--mw-gold-deep); border-radius: 10px;
}
.lang-switcher:not(.is-open) .lang-switcher__menu { display: none !important; }
.lang-switcher__menu a { display: flex; align-items: center; gap: 10px; border-radius: 6px; padding: 7px 10px; }
.lang-switcher__menu li[aria-selected="true"] a { background: rgba(212, 166, 74, 0.14); }
.lang-switcher__menu li[aria-selected="true"] .mw-code { background: var(--mw-gold); color: var(--mw-ink); border-color: var(--mw-gold); }
.nav-mobile__langs { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; }
.nav-mobile__lang { display: flex; align-items: center; gap: 8px; font-size: 0.86rem; padding: 6px 8px; border-radius: 6px; }
.nav-mobile__lang.is-active { background: rgba(212, 166, 74, 0.14); }

/* ---------- Hero: copy left, pool tablets right ---------- */
.mw-hero {
  padding: 70px 0 40px; text-align: left; border-bottom: 0;
  background:
    linear-gradient(90deg, rgba(11, 20, 38, 0.96) 0%, rgba(11, 20, 38, 0.80) 55%, rgba(11, 20, 38, 0.55) 100%),
    url("/assets/img/hero-bg.jpg") center / cover no-repeat,
    var(--color-bg);
}
.mw-hero__grid { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 46px; align-items: center; }
.mw-hero .hero__content { max-width: none; margin: 0; text-align: left; align-items: flex-start; display: block; }
.mw-eyebrow {
  display: inline-block; margin: 0 0 16px; padding: 5px 14px;
  font-size: 0.78rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--mw-gold-2); border: 1px solid var(--mw-gold-deep); border-left: 4px solid var(--mw-gold); background: rgba(16, 28, 51, 0.8);
}
.mw-hero h1 {
  margin: 0 0 18px; font-family: var(--font-display); font-weight: 700;
  font-size: clamp(1.95rem, 3.3vw, 2.9rem); line-height: 1.14; color: #fbf7ee; letter-spacing: 0;
}
.mw-gold { color: var(--mw-gold-2); background: linear-gradient(180deg, #f3d891, #c9952f); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.mw-hero__lead p { margin: 0; max-width: 62ch; color: #ddd6c6; font-size: 1.05rem; }
.mw-hero__ctas { margin-top: 26px; display: flex; gap: 12px; flex-wrap: wrap; justify-content: flex-start; }
.mw-pools {
  position: relative; padding: 22px 22px 18px; border-radius: 14px;
  background: linear-gradient(180deg, rgba(243, 239, 231, 0.10), rgba(243, 239, 231, 0.03));
  border: 1px solid var(--mw-gold-deep); box-shadow: inset 0 0 0 4px rgba(11, 20, 38, 0.7), 0 22px 50px rgba(0, 0, 0, 0.45);
}
.mw-pools__title { margin: 0 0 14px; text-align: center; font-size: 0.76rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--mw-gold-2); }
.mw-pool {
  display: grid; grid-template-columns: 1fr auto; grid-template-areas: "tag value" "note value";
  align-items: center; gap: 2px 14px; padding: 14px 16px; margin-bottom: 10px; border-radius: 10px;
  background: linear-gradient(180deg, var(--mw-marble), var(--mw-marble-2)); color: var(--mw-ink);
  border: 2px solid var(--mw-gold);
}
.mw-pool:last-child { margin-bottom: 0; }
.mw-pool__tag { grid-area: tag; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: #6b5220; }
.mw-pool__note { grid-area: note; font-size: 0.84rem; color: #4a4f5c; }
.mw-pool__value { grid-area: value; font-family: var(--font-display); font-weight: 700; font-size: 1.6rem; line-height: 1; color: var(--mw-ink); white-space: nowrap; }
.mw-pool--0 { background: linear-gradient(180deg, #f7e2a8, #d4a64a); }
.mw-pool--0 .mw-pool__value { font-size: 1.95rem; }
@media (max-width: 920px) {
  .mw-hero { padding: 42px 0 28px; }
  .mw-hero__grid { grid-template-columns: 1fr; gap: 28px; }
}

/* ---------- Figure plaques ---------- */
.mw-plaques { padding: 26px 0 18px; }
.mw-plaques__row { display: grid; grid-template-columns: repeat(6, 1fr); gap: 0; border: 1px solid var(--mw-gold-deep); border-radius: 12px; overflow: hidden; background: var(--mw-panel); }
.mw-plaque { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; padding: 16px 10px; border-right: 1px solid var(--mw-line); }
.mw-plaque:last-child { border-right: 0; }
.mw-plaque__v { font-family: var(--font-display); font-weight: 700; font-size: 1.3rem; line-height: 1.1; color: var(--mw-gold-2); white-space: nowrap; }
.mw-plaque__l { font-size: 0.8rem; line-height: 1.35; color: var(--mw-faint); }
@media (max-width: 1060px) {
  .mw-plaques__row { grid-template-columns: repeat(3, 1fr); }
  .mw-plaque:nth-child(3) { border-right: 0; }
  .mw-plaque:nth-child(-n+3) { border-bottom: 1px solid var(--mw-line); }
}
@media (max-width: 560px) {
  .mw-plaques__row { grid-template-columns: repeat(2, 1fr); }
  .mw-plaque { border-right: 1px solid var(--mw-line) !important; border-bottom: 1px solid var(--mw-line); }
  .mw-plaque:nth-child(2n) { border-right: 0 !important; }
  .mw-plaque:nth-last-child(-n+2) { border-bottom: 0; }
  .mw-plaque__v { font-size: 1.12rem; }
}

/* ---------- Sections: open bands, gold rule under h2 ---------- */
.content-section { padding: 58px 0 40px; background: transparent; border: 0; }
.content-section--alt { background: linear-gradient(180deg, rgba(22, 36, 63, 0.75), rgba(16, 28, 51, 0.55)); border-top: 1px solid var(--mw-line); border-bottom: 1px solid var(--mw-line); }
.content-section > .container { max-width: 1120px; }
.content-section h2 {
  font-family: var(--font-display); font-weight: 700; font-size: clamp(1.65rem, 2.5vw, 2.2rem); line-height: 1.2;
  color: #fbf7ee; margin: 0 0 24px; padding: 0 0 16px; border: 0; max-width: none; position: relative;
}
.content-section h2::before { display: none !important; }
.content-section h2::after {
  content: ""; display: block !important; position: absolute; left: 0; bottom: 0; width: 132px; height: 7px;
  background: var(--mw-key) repeat-x left center / 14px 7px;
}
.content-section h3 {
  font-family: var(--font-display); font-weight: 600; font-size: 1.28rem; line-height: 1.35;
  color: var(--mw-gold-2); margin: 34px 0 12px; padding: 0; border: 0; text-transform: none;
}
.content-section h3::before { display: none; }
.content-section p { margin-bottom: 1rem; color: var(--mw-text); }
.content-section ul, .content-section ol { margin: 0 0 1.2rem 1.2rem; }
.content-section li { margin-bottom: 0.45rem; color: var(--mw-text); }
.content-section ul li::marker { color: var(--mw-cyan); content: "\25C6  "; font-size: 0.8em; }
.content-section a:not(.btn) { color: var(--mw-cyan-2); }
@media (max-width: 900px) { .content-section { padding: 40px 0 26px; } }

/* ---------- Supplied artwork beside the text ---------- */
.content-section .section-illus--transparent {
  width: 360px; max-width: 360px; height: auto; background: transparent; box-shadow: none; border-radius: 0;
  filter: drop-shadow(0 0 30px rgba(212, 166, 74, 0.20));
}
.content-section .section-illus--right { float: right; margin: -16px -10px 10px 28px; }
.content-section .section-illus--left { float: left; margin: -16px 28px 10px -10px; }
.mw-clear { clear: both; }
@media (max-width: 900px) {
  .content-section .section-illus--transparent,
  .content-section .section-illus--right,
  .content-section .section-illus--left { float: none; display: block; width: 310px; max-width: 84%; margin: 0 auto 12px; }
}

/* ---------- Tables: gold header band, marble rows ---------- */
.mw-table-wrap { clear: none; display: flow-root; margin: 26px 0 30px; border: 1px solid var(--mw-gold-deep); border-radius: 12px; overflow: hidden; background: #0d172b; }
.mw-table-wrap .mw-table-title {
  margin: 0; padding: 12px 20px; max-width: none;
  font-family: var(--font-display); font-weight: 700; font-size: 1.04rem; color: var(--mw-ink);
  background: linear-gradient(90deg, #e7c27a, #d4a64a 60%, #b58a35);
}
.mw-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.content-section .mw-table-wrap table { width: 100%; min-width: 540px; border-collapse: collapse; margin: 0; border: 0; display: table; font-size: 0.95rem; }
.content-section .mw-table-wrap th, .content-section .mw-table-wrap td { padding: 11px 18px; text-align: left; vertical-align: top; border: 0; border-bottom: 1px solid var(--mw-line); white-space: normal; }
.content-section .mw-table-wrap thead th { font-size: 0.74rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--mw-gold-2); background: #101c33; }
.content-section .mw-table-wrap tbody tr:nth-child(odd) td { background: rgba(243, 239, 231, 0.035); }
.content-section .mw-table-wrap tbody tr:last-child td { border-bottom: 0; }
.content-section .mw-table-wrap td:first-child { color: #fbf7ee; font-weight: 600; }
.mw-table-note { font-size: 0.86rem; color: var(--mw-faint); padding: 12px 20px; margin: 0 !important; border-top: 1px solid var(--mw-line); max-width: none !important; }
@media (max-width: 600px) {
  .content-section .mw-table-wrap table { min-width: 0; table-layout: fixed; font-size: 0.86rem; }
  .content-section .mw-table-wrap th, .content-section .mw-table-wrap td { padding: 9px 10px; overflow-wrap: break-word; hyphens: auto; }
  .content-section .mw-table-wrap th:first-child, .content-section .mw-table-wrap td:first-child { width: 36%; }
}

/* ---------- Numbered steps: Roman numerals on gold medallions ---------- */
.mw-steps { display: flow-root; counter-reset: mwstep; list-style: none; margin: 18px 0 24px !important; padding: 0; }
.mw-steps li { counter-increment: mwstep; position: relative; padding: 5px 0 5px 54px; margin-bottom: 14px; }
.mw-steps li::before {
  content: counter(mwstep, upper-roman); position: absolute; left: 0; top: 0; width: 38px; height: 38px;
  display: grid; place-items: center; border-radius: 50%;
  font-family: var(--font-display); font-weight: 700; font-size: 0.86rem; color: var(--mw-ink);
  background: radial-gradient(circle at 35% 30%, #f7e2a8, #c9952f); border: 1px solid #8c6a26;
}

/* ---------- FAQ ---------- */
.mw-faq { clear: both; margin: 20px 0 8px; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-items: start; }
.mw-faq details { border: 1px solid var(--mw-line); border-left: 3px solid var(--mw-gold); border-radius: 8px; background: #0d172b; }
.mw-faq summary { cursor: pointer; list-style: none; padding: 14px 46px 14px 18px; position: relative; font-weight: 600; font-size: 0.98rem; color: #fbf7ee; }
.mw-faq summary::-webkit-details-marker { display: none; }
.mw-faq summary::after { content: "+"; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-size: 1.3rem; line-height: 1; color: var(--mw-cyan); }
.mw-faq details[open] summary::after { content: "\2212"; }
.mw-faq details[open] summary { color: var(--mw-gold-2); }
.mw-faq details p { padding: 0 18px 16px; margin: 0; }
@media (max-width: 760px) { .mw-faq { grid-template-columns: 1fr; } }

/* ---------- Join panel, footer, sticky bar ---------- */
.mw-join { padding: 54px 0 56px; }
.mw-join__panel {
  display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 34px 40px; border-radius: 14px;
  background: radial-gradient(420px 220px at 0% 0%, rgba(138, 92, 214, 0.28), transparent 70%), linear-gradient(180deg, #172748, #101c33);
  border: 1px solid var(--mw-gold);
  box-shadow: inset 0 0 0 5px #0b1426, inset 0 0 0 6px rgba(212, 166, 74, 0.45);
}
.mw-join__text h2 { margin: 0 0 8px; font-family: var(--font-display); font-weight: 700; font-size: clamp(1.4rem, 2.2vw, 1.85rem); color: #fbf7ee; border: 0; padding: 0; }
.mw-join__text p { margin: 0; max-width: 62ch; color: var(--mw-text); }
.mw-join .btn { flex-shrink: 0; }
@media (max-width: 760px) { .mw-join__panel { flex-direction: column; align-items: flex-start; padding: 26px 20px; } }
.site-footer.mw-footer { background: #070e1c; border-top: 0; position: relative; }
.site-footer.mw-footer { padding-top: 0; }
.site-footer.mw-footer > .container { padding-top: 46px; }
.site-footer.mw-footer::before { content: ""; display: block; height: 7px; background: var(--mw-key) repeat-x center / 14px 7px; opacity: 0.85; }
.site-footer h5 { font-family: var(--font-body); font-weight: 700; font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--mw-gold-2); }
.site-footer .site-logo img { height: 44px; width: auto; }
.footer-badge { border-color: var(--mw-gold-deep); border-radius: 4px; color: var(--mw-gold-2); }
.sticky-cta { border-top: 1px solid var(--mw-gold); background: rgba(11, 20, 38, 0.97); }
.sticky-cta__text span:first-child { font-family: var(--font-display); font-weight: 700; color: #fbf7ee; }
.sticky-cta__bonus { color: var(--mw-gold-2); font-weight: 600; }

/* ---------- Anchors, mobile header ---------- */
.content-section[id] { scroll-margin-top: 84px; }
@media (max-width: 640px) {
  .site-header .container { gap: 8px; padding-left: 14px; padding-right: 14px; }
  .site-header .site-logo img { height: 34px; }
  .site-header .site-logo { flex-shrink: 0; margin-right: 6px; }
  .nav-toggle { flex-shrink: 0; margin-left: 6px; }
  .btn--mobile-cta { margin-left: auto; font-size: 0.72rem !important; padding: 0.5rem 0.75rem !important; white-space: nowrap; max-width: 46vw; overflow: hidden; text-overflow: ellipsis; }
  .sticky-cta__text span:first-child { display: none; }
  .sticky-cta__bonus { font-size: 0.9rem; line-height: 1.3; }
  .sticky-cta .btn { white-space: nowrap; }
  .mw-pool__value { font-size: 1.35rem; }
  .mw-pool--0 .mw-pool__value { font-size: 1.6rem; }
}
@media (max-width: 380px) { .btn--mobile-cta { font-size: 0.64rem !important; padding: 0.45rem 0.55rem !important; } }

.content-section p, .content-section li, .content-section ul, .content-section ol { max-width: none; }
.content-section h2 { clear: none; overflow: visible; }
.content-section h3 { clear: none; }
.content-section ul, .content-section ol.mw-steps { display: flow-root; padding-left: 1.2rem; margin-left: 0; }
.content-section .mw-clear + h2 { margin-top: 60px; }
.hero h1, .content-section h2, .content-section h3, .mw-join h2, .mw-table-wrap .mw-table-title { text-transform: none; }