:root {
  --m758j-night: #10111a;
  --m758j-night-soft: #1a1c2a;
  --m758j-paper: #f5f1e8;
  --m758j-paper-deep: #e3ddcf;
  --m758j-blue: #4575ff;
  --m758j-yellow: #ffcf45;
  --m758j-violet: #8e70ff;
  --m758j-line-dark: rgba(16, 17, 26, .22);
  --m758j-line-light: rgba(245, 241, 232, .18);
  --m758j-max: 1200px;
  --m758j-display: "Bahnschrift Condensed", "Aptos Display", "Arial Narrow", sans-serif;
  --m758j-body: "Trebuchet MS", "Segoe UI", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  overflow-x: hidden;
  background: var(--m758j-night);
  color: var(--m758j-paper);
  font-family: var(--m758j-body);
  font-size: 17px;
  line-height: 1.66;
  font-synthesis: none;
}
a { color: inherit; }
svg { display: block; }
.m758j-frame { width: min(calc(100% - 44px), var(--m758j-max)); margin-inline: auto; }
.m758j-skip {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 100;
  padding: 10px 14px;
  background: var(--m758j-yellow);
  color: var(--m758j-night);
  transform: translateY(-170%);
}
.m758j-skip:focus { transform: none; }

.m758j-header {
  position: relative;
  z-index: 30;
  border-bottom: 1px solid var(--m758j-line-light);
  background: rgba(16, 17, 26, .96);
}
.m758j-header__row { display: flex; min-height: 84px; align-items: center; gap: 30px; }
.m758j-brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.m758j-brand__mark { width: 43px; height: 43px; color: var(--m758j-blue); }
.m758j-brand span {
  font-family: var(--m758j-display);
  font-size: 29px;
  font-weight: 900;
  letter-spacing: .045em;
  line-height: 1;
  text-transform: uppercase;
}
.m758j-nav { display: flex; align-items: center; gap: 26px; margin-left: auto; }
.m758j-nav a { font-size: 12px; font-weight: 800; letter-spacing: .12em; text-decoration: none; text-transform: uppercase; }
.m758j-nav a:hover { color: var(--m758j-yellow); }
.m758j-cta {
  display: inline-flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  padding: 13px 22px;
  border: 1px solid var(--m758j-blue);
  border-radius: 2px;
  background: var(--m758j-blue);
  color: #fff;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .1em;
  line-height: 1.1;
  text-decoration: none;
  text-transform: uppercase;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.m758j-cta:hover { transform: translateY(-2px); background: var(--m758j-violet); border-color: var(--m758j-violet); }
.m758j-cta--small { min-height: 44px; padding: 10px 18px; }
.m758j-cta--ghost { border-color: var(--m758j-line-light); background: transparent; color: var(--m758j-paper); }
.m758j-cta--ghost:hover { border-color: var(--m758j-paper); background: var(--m758j-paper); color: var(--m758j-night); }
.m758j-cta--wide { width: 100%; margin-top: 28px; }
.m758j-cta--ink { margin-top: 26px; background: var(--m758j-night); border-color: var(--m758j-night); }

.m758j-hero {
  position: relative;
  display: grid;
  min-height: calc(100vh - 84px);
  align-content: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 74% 38%, rgba(69, 117, 255, .2), transparent 27%),
    repeating-linear-gradient(90deg, transparent 0 89px, rgba(245, 241, 232, .035) 90px),
    repeating-linear-gradient(0deg, transparent 0 89px, rgba(245, 241, 232, .035) 90px),
    var(--m758j-night);
}
.m758j-hero::before {
  content: "758J";
  position: absolute;
  right: -1vw;
  bottom: 8%;
  color: rgba(245, 241, 232, .035);
  font-family: var(--m758j-display);
  font-size: clamp(120px, 21vw, 320px);
  font-weight: 900;
  letter-spacing: -.08em;
  line-height: .7;
}
.m758j-hero__layout {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(330px, .75fr);
  align-items: center;
  gap: clamp(48px, 8vw, 112px);
  padding-block: 78px 118px;
}
.m758j-hero__copy, .m758j-section-head, .m758j-faq__intro { min-width: 0; }
.m758j-eyebrow {
  margin: 0 0 18px;
  color: var(--m758j-yellow);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.m758j-hero h1 {
  max-width: 840px;
  margin: 0;
  font-family: var(--m758j-display);
  font-size: clamp(42px, 5.6vw, 78px);
  font-weight: 900;
  letter-spacing: -.045em;
  line-height: .9;
  text-transform: uppercase;
}
.m758j-lead { max-width: 760px; margin: 27px 0 0; color: #c7cad6; font-size: 18px; }
.m758j-hero__actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 33px; }
.m758j-facts { display: grid; grid-template-columns: repeat(3, 1fr); margin: 40px 0 0; border-top: 1px solid var(--m758j-line-light); border-bottom: 1px solid var(--m758j-line-light); }
.m758j-facts div { padding: 13px 16px 15px 0; }
.m758j-facts dt { color: #878b9e; font-size: 10px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.m758j-facts dd { margin: 2px 0 0; font-family: var(--m758j-display); font-size: 19px; font-weight: 800; text-transform: uppercase; }

.m758j-console {
  position: relative;
  width: min(100%, 390px);
  min-height: 480px;
  justify-self: end;
  padding: 24px;
  border: 1px solid #676a7a;
  background: #252838;
  box-shadow: 18px 18px 0 var(--m758j-yellow);
}
.m758j-console::before {
  content: "";
  position: absolute;
  inset: 10px;
  pointer-events: none;
  border: 1px solid rgba(245, 241, 232, .11);
}
.m758j-console__top, .m758j-console__status { position: relative; display: flex; justify-content: space-between; font-size: 10px; font-weight: 900; letter-spacing: .14em; }
.m758j-console__top i { color: var(--m758j-yellow); font-style: normal; }
.m758j-console__dial {
  position: relative;
  display: grid;
  width: 210px;
  height: 210px;
  margin: 54px auto 34px;
  place-items: center;
  border: 2px solid var(--m758j-blue);
  border-radius: 50%;
  box-shadow: inset 0 0 0 16px #252838, inset 0 0 0 18px rgba(245, 241, 232, .16);
}
.m758j-console__dial::before, .m758j-console__dial::after { content: ""; position: absolute; background: var(--m758j-yellow); }
.m758j-console__dial::before { width: 2px; height: 226px; }
.m758j-console__dial::after { width: 226px; height: 2px; }
.m758j-console__digit { position: relative; z-index: 2; font-family: var(--m758j-display); font-size: 116px; font-weight: 900; line-height: 1; }
.m758j-console__orbit { position: absolute; bottom: 18px; z-index: 2; font-size: 9px; font-weight: 900; letter-spacing: .2em; }
.m758j-console__channels { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.m758j-console__channels span { padding: 8px 10px; border: 1px solid var(--m758j-line-light); color: #cfd2dc; font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.m758j-console__status { margin-top: 27px; padding-top: 14px; border-top: 1px solid var(--m758j-line-light); }
.m758j-ticker {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: space-around;
  gap: 30px;
  padding: 12px 20px;
  overflow: hidden;
  background: var(--m758j-blue);
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .22em;
}

.m758j-catalog { padding: 112px 0 120px; background: var(--m758j-paper); color: var(--m758j-night); }
.m758j-section-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .62fr); column-gap: 72px; align-items: end; margin-bottom: 34px; }
.m758j-section-head .m758j-eyebrow { grid-column: 1 / -1; color: var(--m758j-blue); }
.m758j-section-head h2 {
  margin: 0;
  font-family: var(--m758j-display);
  font-size: clamp(36px, 4.4vw, 60px);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: .93;
  text-transform: uppercase;
}
.m758j-section-head > p:last-child { margin: 0; color: #4d4e58; }
.m758j-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.m758j-tabs a { min-height: 44px; padding: 10px 16px; border: 1px solid #a8a399; font-size: 11px; font-weight: 900; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }
.m758j-tabs a:first-child, .m758j-tabs a:hover { background: var(--m758j-night); color: var(--m758j-paper); }
.m758j-games { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid #a8a399; border-left: 1px solid #a8a399; }
.m758j-game { min-width: 0; padding: 14px 14px 20px; border-right: 1px solid #a8a399; border-bottom: 1px solid #a8a399; }
.m758j-game__art { display: flex; height: 152px; align-items: flex-start; justify-content: space-between; padding: 14px; background: var(--m758j-night); color: var(--m758j-paper); }
.m758j-game--blue .m758j-game__art { background: var(--m758j-blue); color: #fff; }
.m758j-game--yellow .m758j-game__art { background: var(--m758j-yellow); color: var(--m758j-night); }
.m758j-game--violet .m758j-game__art { background: var(--m758j-violet); color: #fff; }
.m758j-game--cream .m758j-game__art { background: var(--m758j-paper-deep); color: var(--m758j-night); }
.m758j-game__art span { font-family: var(--m758j-display); font-size: 50px; font-weight: 900; line-height: 1; }
.m758j-game__art i { align-self: flex-end; font-size: 10px; font-style: normal; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.m758j-game > p { min-height: 38px; margin: 15px 0 4px; color: #62626b; font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.m758j-game h3 { min-height: 46px; margin: 0; font-family: var(--m758j-display); font-size: 22px; line-height: 1.02; text-transform: uppercase; }
.m758j-game > a { display: inline-block; margin-top: 14px; border-bottom: 1px solid; font-size: 11px; font-weight: 900; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
.m758j-providers { display: flex; flex-wrap: wrap; gap: 9px 22px; margin-top: 27px; color: #60606a; font-size: 11px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.m758j-providers span::before { content: "◆"; margin-right: 9px; color: var(--m758j-blue); font-size: 8px; }

.m758j-overview { padding: 118px 0; background: var(--m758j-paper-deep); color: var(--m758j-night); }
.m758j-overview__layout { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: clamp(38px, 7vw, 100px); align-items: start; }
.m758j-overview__index { position: sticky; top: 28px; display: flex; flex-direction: column; gap: 12px; padding-top: 5px; color: var(--m758j-blue); font-size: 10px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.m758j-overview__index::after { content: ""; width: 100%; height: 2px; margin-top: 8px; background: var(--m758j-blue); }
.m758j-overview__index i { color: #5d5d67; font-style: normal; }
.m758j-overview__copy { width: 100%; max-width: 980px; }
.m758j-overview__copy h2 {
  margin: 76px 0 24px;
  padding-top: 21px;
  border-top: 1px solid #9b978e;
  font-family: var(--m758j-display);
  font-size: clamp(30px, 3.3vw, 46px);
  font-weight: 900;
  letter-spacing: -.035em;
  line-height: .96;
  text-transform: uppercase;
}
.m758j-overview__copy h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.m758j-overview__copy p { margin: 0 0 17px; color: #30313b; }
.m758j-overview__copy h2 + p { font-size: 19px; color: var(--m758j-night); }

.m758j-cashier { padding: 78px 0 82px; background: var(--m758j-yellow); color: var(--m758j-night); }
.m758j-section-head--compact { margin-bottom: 24px; }
.m758j-section-head--compact .m758j-eyebrow { color: var(--m758j-night); }
.m758j-section-head--compact h2 { font-size: clamp(32px, 3.7vw, 50px); }
.m758j-section-head--compact > p:last-child { color: #48453b; }
.m758j-cashier__grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 2px solid var(--m758j-night); border-left: 1px solid rgba(16, 17, 26, .36); }
.m758j-cashier__grid article { min-height: 210px; padding: 22px; border-right: 1px solid rgba(16, 17, 26, .36); border-bottom: 1px solid rgba(16, 17, 26, .36); }
.m758j-cashier__grid span { color: var(--m758j-blue); font-family: var(--m758j-display); font-size: 34px; font-weight: 900; }
.m758j-cashier__grid h3 { margin: 23px 0 9px; font-family: var(--m758j-display); font-size: 23px; line-height: 1; text-transform: uppercase; }
.m758j-cashier__grid p { margin: 0; color: #48453b; }

.m758j-faq { padding: 112px 0 120px; background: var(--m758j-night-soft); }
.m758j-faq__layout { display: grid; grid-template-columns: minmax(280px, .72fr) minmax(0, 1.28fr); gap: clamp(48px, 8vw, 112px); align-items: start; }
.m758j-faq__intro h2 { margin: 0; font-family: var(--m758j-display); font-size: clamp(38px, 4.2vw, 58px); font-weight: 900; letter-spacing: -.04em; line-height: .93; text-transform: uppercase; }
.m758j-faq__intro > p:last-of-type { margin: 22px 0 30px; color: #b9bdcb; }
.m758j-faq__list { border-top: 1px solid var(--m758j-line-light); }
.m758j-faq details { border-bottom: 1px solid var(--m758j-line-light); }
.m758j-faq summary { position: relative; min-height: 66px; padding: 21px 54px 17px 0; cursor: pointer; font-family: var(--m758j-display); font-size: 19px; font-weight: 800; line-height: 1.16; list-style: none; text-transform: uppercase; }
.m758j-faq summary::-webkit-details-marker { display: none; }
.m758j-faq summary::after { content: "+"; position: absolute; top: 17px; right: 2px; color: var(--m758j-yellow); font-size: 31px; font-weight: 400; }
.m758j-faq details[open] summary::after { content: "−"; }
.m758j-faq details p { margin: 0; padding: 0 54px 24px 0; color: #b9bdcb; }

.m758j-footer { padding: 70px 0 24px; border-top: 1px solid var(--m758j-line-light); background: #0a0b11; }
.m758j-footer__grid { display: grid; grid-template-columns: 1.6fr repeat(3, .7fr); gap: 52px; }
.m758j-brand--footer { margin-bottom: 21px; }
.m758j-footer__about p { max-width: 440px; color: #979bab; }
.m758j-footer h3 { margin: 8px 0 14px; font-family: var(--m758j-display); font-size: 16px; letter-spacing: .09em; text-transform: uppercase; }
.m758j-footer__grid > div:not(:first-child) { display: flex; flex-direction: column; align-items: flex-start; }
.m758j-footer__grid > div:not(:first-child) a { min-height: 38px; color: #b1b5c2; font-size: 14px; text-decoration: none; }
.m758j-footer__grid a:hover { color: var(--m758j-yellow); }
.m758j-footer__bottom { display: flex; justify-content: space-between; gap: 20px; margin-top: 46px; padding-top: 18px; border-top: 1px solid var(--m758j-line-light); color: #777b8c; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }

@media (max-width: 980px) {
  .m758j-nav { display: none; }
  .m758j-header__row { justify-content: space-between; }
  .m758j-hero { min-height: auto; }
  .m758j-hero__layout { grid-template-columns: 1fr; padding-block: 72px 120px; }
  .m758j-console { justify-self: start; }
  .m758j-games { grid-template-columns: repeat(2, 1fr); }
  .m758j-section-head { grid-template-columns: 1fr; gap: 18px; }
  .m758j-footer__grid { grid-template-columns: 1.4fr repeat(3, 1fr); gap: 27px; }
}

@media (max-width: 760px) {
  body { font-size: 16px; }
  .m758j-frame { width: min(calc(100% - 28px), var(--m758j-max)); }
  .m758j-header__row { min-height: 70px; gap: 13px; }
  .m758j-brand__mark { width: 36px; height: 36px; }
  .m758j-brand span { font-size: 23px; }
  .m758j-cta--small { min-height: 44px; padding-inline: 14px; }
  .m758j-hero h1 { max-width: 100%; font-size: clamp(32px, 8.7vw, 42px); overflow-wrap: anywhere; }
  .m758j-eyebrow, .m758j-lead { max-width: 100%; overflow-wrap: anywhere; }
  .m758j-lead { font-size: 17px; }
  .m758j-hero__actions .m758j-cta { width: 100%; flex: 1 1 100%; }
  .m758j-facts { grid-template-columns: 1fr; }
  .m758j-facts div { border-bottom: 1px solid var(--m758j-line-light); }
  .m758j-facts div:last-child { border-bottom: 0; }
  .m758j-console { min-height: 430px; box-shadow: 9px 9px 0 var(--m758j-yellow); }
  .m758j-console__dial { width: 174px; height: 174px; margin-top: 44px; }
  .m758j-console__dial::before { height: 188px; }
  .m758j-console__dial::after { width: 188px; }
  .m758j-console__digit { font-size: 96px; }
  .m758j-ticker { justify-content: flex-start; }
  .m758j-catalog, .m758j-overview, .m758j-faq { padding-block: 82px; }
  .m758j-cashier { padding-block: 58px; }
  .m758j-section-head h2, .m758j-overview__copy h2, .m758j-faq__intro h2 { overflow-wrap: anywhere; }
  .m758j-games { grid-template-columns: 1fr; }
  .m758j-game h3 { min-height: auto; }
  .m758j-overview__layout { grid-template-columns: 1fr; gap: 28px; }
  .m758j-overview__index { position: static; }
  .m758j-overview__index::after { width: 72px; }
  .m758j-overview__copy h2 { margin-top: 58px; }
  .m758j-cashier__grid { grid-template-columns: 1fr; }
  .m758j-cashier__grid article { min-height: 0; }
  .m758j-faq__layout { grid-template-columns: 1fr; }
  .m758j-footer__grid { grid-template-columns: 1fr 1fr; }
  .m758j-footer__about { grid-column: 1 / -1; }
}

@media (max-width: 460px) {
  .m758j-header .m758j-cta { display: none; }
  .m758j-tabs a { flex: 1 1 calc(50% - 8px); text-align: center; }
  .m758j-footer__grid { grid-template-columns: 1fr; }
  .m758j-footer__about { grid-column: auto; }
  .m758j-footer__bottom { flex-direction: column; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}

/* Dark rail layout — martin758j.fun */
:root {
  --m758j-deep: #05090b;
  --m758j-panel: #0c1518;
  --m758j-panel-2: #111f24;
  --m758j-text: #eaf4f3;
  --m758j-muted: #9fb4b5;
  --m758j-cyan: #5ce1e6;
  --m758j-coral: #ff7557;
  --m758j-peri: #8da2ff;
}

body { background: var(--m758j-deep); color: var(--m758j-text); }
.m758j-frame { width: min(calc(100% - 72px), 1240px); }

@media (min-width: 981px) {
  .m758j-header {
    position: fixed;
    inset: 0 auto 0 0;
    width: 132px;
    height: 100vh;
    border-right: 1px solid rgba(92, 225, 230, .18);
    border-bottom: 0;
    background: rgba(5, 9, 11, .97);
  }
  .m758j-header__row {
    width: 100%;
    height: 100%;
    min-height: 0;
    flex-direction: column;
    gap: 24px;
    padding: 22px 14px;
  }
  .m758j-brand span { display: none; }
  .m758j-brand__mark { width: 54px; height: 54px; color: var(--m758j-cyan); }
  .m758j-nav {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-self: stretch;
    justify-content: flex-start;
    gap: 22px;
    margin: 0;
    padding-top: 94px;
  }
  .m758j-nav a {
    width: 100%;
    writing-mode: horizontal-tb;
    transform: none;
    color: #a9babb;
    font-size: 10px;
    text-align: left;
  }
  .m758j-cta--small {
    width: 100%;
    min-height: 44px;
    padding: 10px 8px;
    writing-mode: horizontal-tb;
    transform: none;
  }
  .m758j-cta--small:hover { transform: translateY(-2px); }
  main, .m758j-footer { margin-left: 132px; }
}

.m758j-header { border-color: rgba(92, 225, 230, .18); background-color: rgba(5, 9, 11, .96); }
.m758j-brand__mark { color: var(--m758j-cyan); }
.m758j-nav a:hover { color: var(--m758j-coral); }
.m758j-cta { border-color: var(--m758j-cyan); background: var(--m758j-cyan); color: #071013; }
.m758j-cta:hover { border-color: var(--m758j-coral); background: var(--m758j-coral); color: #100906; }
.m758j-cta--ghost { border-color: rgba(234, 244, 243, .28); background: transparent; color: var(--m758j-text); }
.m758j-cta--ghost:hover { border-color: var(--m758j-text); background: var(--m758j-text); color: var(--m758j-deep); }
.m758j-eyebrow { color: var(--m758j-coral); }

.m758j-hero {
  min-height: 100vh;
  background:
    linear-gradient(120deg, rgba(92, 225, 230, .08), transparent 32%),
    radial-gradient(circle at 82% 24%, rgba(141, 162, 255, .17), transparent 24%),
    repeating-linear-gradient(90deg, transparent 0 119px, rgba(234, 244, 243, .026) 120px),
    repeating-linear-gradient(0deg, transparent 0 119px, rgba(234, 244, 243, .026) 120px),
    var(--m758j-deep);
}
.m758j-hero::before {
  right: -3vw;
  bottom: 2%;
  color: rgba(92, 225, 230, .045);
  font-size: clamp(160px, 26vw, 430px);
  transform: rotate(-90deg) translateX(22%);
  transform-origin: right bottom;
}
.m758j-hero__layout {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 18px;
  padding-block: 76px 102px;
}
.m758j-hero__copy { grid-column: 1 / 9; align-self: center; }
.m758j-hero h1 { font-size: clamp(46px, 5vw, 76px); }
.m758j-lead { color: var(--m758j-muted); }
.m758j-facts { border-color: rgba(234, 244, 243, .16); }
.m758j-facts dt { color: #708789; }
.m758j-console {
  grid-column: 9 / 13;
  align-self: end;
  width: 100%;
  min-height: 510px;
  border-color: rgba(92, 225, 230, .36);
  border-radius: 28px 2px 28px 2px;
  background: linear-gradient(145deg, #142329, #0a1114);
  box-shadow: 16px 16px 0 rgba(255, 117, 87, .92);
}
.m758j-console::before { border-color: rgba(234, 244, 243, .1); border-radius: 20px 0 20px 0; }
.m758j-console__top i { color: var(--m758j-coral); }
.m758j-console__dial { border-color: var(--m758j-cyan); box-shadow: inset 0 0 0 16px #0d181c, inset 0 0 0 18px rgba(234, 244, 243, .12), 0 0 55px rgba(92, 225, 230, .12); }
.m758j-console__dial::before, .m758j-console__dial::after { background: var(--m758j-coral); }
.m758j-console__channels span { border-color: rgba(234, 244, 243, .14); color: #c9d9d9; }
.m758j-console__status { border-color: rgba(234, 244, 243, .14); }
.m758j-ticker { background: var(--m758j-cyan); color: #071013; }

.m758j-catalog { padding-block: 126px; background: var(--m758j-panel); color: var(--m758j-text); }
.m758j-section-head { grid-template-columns: minmax(0, 1.55fr) minmax(280px, .45fr); }
.m758j-catalog .m758j-section-head { grid-template-columns: minmax(0, 1.15fr) minmax(420px, .85fr); }
.m758j-section-head .m758j-eyebrow { color: var(--m758j-coral); }
.m758j-section-head > p:last-child { color: var(--m758j-muted); }
.m758j-tabs a { border-color: rgba(234, 244, 243, .2); color: #c8d8d8; }
.m758j-tabs a:first-child, .m758j-tabs a:hover { background: var(--m758j-cyan); color: #071013; }
.m758j-games {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-flow: dense;
  gap: 14px;
  border: 0;
}
.m758j-game {
  grid-column: span 3;
  padding: 14px 14px 20px;
  border: 1px solid rgba(234, 244, 243, .14);
  border-radius: 18px 2px 18px 2px;
  background: #101c20;
}
.m758j-game:nth-child(1) { grid-column: span 6; }
.m758j-game:nth-child(2), .m758j-game:nth-child(3) { grid-column: span 3; }
.m758j-game:nth-child(4), .m758j-game:nth-child(5), .m758j-game:nth-child(6) { grid-column: span 4; }
.m758j-game:nth-child(7), .m758j-game:nth-child(8) { grid-column: span 6; }
.m758j-game:nth-child(1) .m758j-game__art { height: 238px; }
.m758j-game:nth-child(7) .m758j-game__art, .m758j-game:nth-child(8) .m758j-game__art { height: 190px; }
.m758j-game__art { border-radius: 12px 0 12px 0; background: #16262b; }
.m758j-game--blue .m758j-game__art { background: linear-gradient(135deg, #183b43, #246775); color: var(--m758j-text); }
.m758j-game--yellow .m758j-game__art { background: linear-gradient(135deg, #4c241e, #9d4534); color: #fff1ed; }
.m758j-game--violet .m758j-game__art { background: linear-gradient(135deg, #242c52, #4d5eaa); color: #f1f3ff; }
.m758j-game--cream .m758j-game__art { background: linear-gradient(135deg, #233136, #34474d); color: var(--m758j-text); }
.m758j-game > p { color: #7f9899; }
.m758j-game > a { color: var(--m758j-cyan); }
.m758j-providers { color: #8ca2a3; }
.m758j-providers span::before { color: var(--m758j-coral); }

.m758j-overview { padding-block: 130px; background: var(--m758j-deep); color: var(--m758j-text); }
.m758j-overview__layout { grid-template-columns: 210px minmax(0, 1fr); gap: clamp(44px, 8vw, 118px); }
.m758j-overview__index { top: 38px; color: var(--m758j-cyan); }
.m758j-overview__index::after { background: linear-gradient(90deg, var(--m758j-cyan), transparent); }
.m758j-overview__index i { color: #63797b; }
.m758j-overview__copy { max-width: 940px; counter-reset: overview-title; }
.m758j-overview__copy h2 {
  position: relative;
  max-width: 880px;
  border-color: rgba(92, 225, 230, .28);
  color: var(--m758j-text);
  counter-increment: overview-title;
}
.m758j-overview__copy h2::before {
  content: "0" counter(overview-title);
  display: block;
  margin-bottom: 12px;
  color: var(--m758j-coral);
  font-family: var(--m758j-body);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .18em;
}
.m758j-overview__copy h2:nth-of-type(even) { margin-left: 7%; }
.m758j-overview__copy p { color: #aabdbd; }
.m758j-overview__copy h2 + p { color: #d9e6e5; }
.m758j-overview__copy h2:first-child + p { color: #aabdbd; font-size: inherit; }

.m758j-cashier { padding-block: 104px 148px; background: #0d131c; color: var(--m758j-text); }
.m758j-section-head--compact .m758j-eyebrow { color: var(--m758j-coral); }
.m758j-section-head--compact > p:last-child { color: var(--m758j-muted); }
.m758j-cashier__grid { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; border: 0; }
.m758j-cashier__grid article {
  grid-column: span 4;
  min-height: 250px;
  padding: 28px;
  border: 1px solid rgba(141, 162, 255, .24);
  border-radius: 2px 28px 2px 28px;
  background: linear-gradient(155deg, #141e2c, #0b1119);
}
.m758j-cashier__grid article:nth-child(2) { transform: translateY(34px); }
.m758j-cashier__grid article:nth-child(3) { transform: translateY(68px); }
.m758j-cashier__grid span { color: var(--m758j-coral); }
.m758j-cashier__grid p { color: var(--m758j-muted); }
.m758j-cta--ink { margin-top: 94px; border-color: var(--m758j-cyan); background: transparent; color: var(--m758j-cyan); }

.m758j-faq { padding-block: 126px; background: #071012; }
.m758j-faq__layout { grid-template-columns: minmax(300px, .72fr) minmax(0, 1.28fr); }
.m758j-faq__intro { position: sticky; top: 42px; }
.m758j-faq__intro > p:last-of-type, .m758j-faq details p { color: var(--m758j-muted); }
.m758j-faq__list { border-color: rgba(234, 244, 243, .16); }
.m758j-faq details { margin-bottom: 10px; padding-inline: 18px; border: 1px solid rgba(234, 244, 243, .13); border-radius: 2px 16px 2px 16px; background: rgba(17, 31, 36, .58); }
.m758j-faq summary::after { color: var(--m758j-coral); }

.m758j-footer { border-color: rgba(92, 225, 230, .14); background: #030607; }
.m758j-footer__about p, .m758j-footer__grid > div:not(:first-child) a { color: #829899; }
.m758j-footer__grid a:hover { color: var(--m758j-cyan); }

@media (max-width: 980px) {
  .m758j-frame { width: min(calc(100% - 36px), 1240px); }
  .m758j-header { position: relative; width: auto; height: auto; border-right: 0; border-bottom: 1px solid rgba(92, 225, 230, .18); }
  .m758j-header__row { width: min(calc(100% - 36px), 1240px); height: auto; flex-direction: row; padding: 0; }
  .m758j-brand span { display: inline; }
  .m758j-brand__mark { width: 42px; height: 42px; }
  .m758j-cta--small { width: auto; min-height: 44px; padding: 10px 18px; writing-mode: initial; transform: none; }
  main, .m758j-footer { margin-left: 0; }
  .m758j-hero__layout { grid-template-columns: 1fr; }
  .m758j-hero__copy, .m758j-console { grid-column: 1; }
  .m758j-console { width: min(100%, 430px); }
  .m758j-games { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .m758j-game, .m758j-game:nth-child(n) { grid-column: span 1; }
  .m758j-game:nth-child(1) .m758j-game__art, .m758j-game:nth-child(7) .m758j-game__art, .m758j-game:nth-child(8) .m758j-game__art { height: 180px; }
}

@media (max-width: 760px) {
  .m758j-frame, .m758j-header__row { width: min(calc(100% - 28px), 1240px); }
  .m758j-hero h1 { font-size: clamp(32px, 8.7vw, 42px); }
  .m758j-catalog, .m758j-overview, .m758j-faq { padding-block: 86px; }
  .m758j-games { grid-template-columns: 1fr; }
  .m758j-overview__layout { grid-template-columns: 1fr; }
  .m758j-overview__index { position: static; }
  .m758j-overview__copy h2:nth-of-type(even) { margin-left: 0; }
  .m758j-cashier { padding-block: 68px 84px; }
  .m758j-cashier__grid { grid-template-columns: 1fr; }
  .m758j-cashier__grid article { grid-column: 1; min-height: 0; }
  .m758j-cashier__grid article:nth-child(n) { transform: none; }
  .m758j-cta--ink { margin-top: 26px; }
  .m758j-faq__layout { grid-template-columns: 1fr; }
  .m758j-faq__intro { position: static; }
}
