/* FOUNDATION START */

:root {
  --page-ink: #071728;
  --page-text: #fff4df;
  --page-gold: #edc575;
  --header-size: 82px;
  --mobile-dock: 76px;

  --tone-home: #071728;
  --tone-about: #12382d;
  --tone-games: #182c52;
  --tone-offers: #481f32;
  --tone-rewards: #362342;
  --tone-dining: #422c20;
  --tone-stay: #123d42;
  --tone-online: #29204f;
  --tone-faq: #2a3e50;

  color-scheme: dark;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--page-text);
  background: var(--page-ink);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  min-width: 320px;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

button {
  font: inherit;
  color: inherit;
  cursor: pointer;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  display: block;
  max-width: 100%;
}

[hidden] {
  display: none !important;
}

:focus-visible {
  outline: 3px solid #ffe8ac;
  outline-offset: 4px;
}

.mca-skip {
  position: fixed;
  z-index: 100;
  top: -90px;
  left: 12px;
  padding: 12px;
  background: #fff;
  color: #111;
}

.mca-skip:focus {
  top: 10px;
}

.mca-play {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 28px;
  border: 1px solid #ffe7ad;
  border-radius: 12px;
  background: linear-gradient(155deg, #ffe5a6, #e8ba63);
  color: #2b1e0d;
  box-shadow: 0 3px 0 #956923, 0 7px 18px #0003;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}

.mca-play:hover {
  background: linear-gradient(155deg, #fff0c9, #f3ca7e);
}

.mca-no-script {
  padding: 20px;
  background: #ffe3a4;
  color: #1c2730;
}

/* FOUNDATION END */


/* HEADER START */

.mca-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  gap: 24px;
  min-height: var(--header-size);
  padding: 14px clamp(20px, 3.5vw, 68px);
  border-bottom: 1px solid #b68c493b;
  background: #061322;
}

.mca-brand {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  gap: 12px;
}

.mca-brand-mark {
  color: var(--page-gold);
  font: 54px/.9 Georgia, serif;
}

.mca-brand-name {
  font: 17px Georgia, serif;
  letter-spacing: .17em;
}

.mca-brand-name small {
  display: block;
  margin-top: 5px;
  color: var(--page-gold);
  font: 8px Arial, sans-serif;
  letter-spacing: .5em;
}

.mca-navigation {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(12px, 1.3vw, 22px);
  margin-left: auto;
}

.mca-navigation a {
  padding: 10px 0;
  border-bottom: 2px solid transparent;
  color: #d8e0e7;
  font-size: 12px;
}

.mca-navigation a:hover,
.mca-navigation a[aria-current="page"] {
  color: #ffe0a0;
  border-color: #e8bd6b;
}

.mca-header-tools {
  display: flex;
  align-items: center;
  gap: 10px;
}

.mca-menu-toggle {
  display: none;
  width: 40px;
  height: 40px;
  padding: 8px;
  border: 1px solid #647d94;
  border-radius: 8px;
  background: #153047;
}

.mca-menu-toggle svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: #fff1d7;
  stroke-width: 1.8;
  stroke-linecap: round;
}

/* HEADER END */


/* HOME START */

.mca-home {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(350px, .95fr);
  grid-template-rows: 1fr auto auto auto 1fr;
  column-gap: clamp(30px, 6vw, 100px);
  min-height: calc(100svh - var(--header-size));
  padding: 28px clamp(28px, 6vw, 100px) 34px;
  overflow: hidden;
}

.mca-home::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    url("../images/manitoba-casino-home-background.webp")
    center / cover;
}

.mca-home::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(90deg, #03101fe0, #05152855 70%),
    linear-gradient(0deg, #071728, transparent 38%);
}

.mca-kicker {
  grid-column: 1;
  grid-row: 1;
  align-self: end;
  margin: 0 0 24px;
  color: #f3ce88;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .23em;
}

.mca-title {
  grid-column: 1;
  grid-row: 2;
  margin: 0 0 24px;
  font: 400 clamp(66px, 7.2vw, 108px)/.98 Georgia, serif;
  letter-spacing: -.04em;
}

.mca-title span {
  display: block;
  color: var(--page-gold);
}

.mca-home-copy {
  grid-column: 1;
  grid-row: 3;
  max-width: 490px;
}

.mca-home-copy h2 {
  margin: 0 0 14px;
  font: 400 clamp(24px, 2.3vw, 32px)/1.25 Georgia, serif;
}

.mca-home-copy p {
  margin: 0;
  color: #e0e5ec;
  font-size: 15px;
  line-height: 1.8;
}

.mca-home-action {
  grid-column: 1;
  grid-row: 4;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px;
  margin-top: 26px;
}

.mca-home-action .mca-play {
  min-height: 53px;
  padding-inline: 40px;
  font-size: 16px;
}

.mca-home-action small {
  color: #d1c3a8;
  font-size: 10px;
}

/* HOME END */


/* HOME MACHINE START */

.mca-machine {
  --photo-height: 272px;
  grid-column: 2;
  grid-row: 1 / 6;
  align-self: center;
  justify-self: center;
  position: relative;
  width: min(100%, 490px);
  padding-top: 110px;
  filter: drop-shadow(0 20px 26px #000a);
}

.mca-machine-sign {
  position: absolute;
  z-index: 4;
  top: 0;
  left: 11%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 78%;
  height: 145px;
  padding: 20px 12px;
  border: 4px ridge #e6b965;
  border-radius: 50% 50% 10% 10% / 75% 75% 14% 14%;
  background: radial-gradient(ellipse at bottom, #28476a, #061527 75%);
  box-shadow:
    inset 0 0 0 3px #483012,
    0 3px 0 #ffe8a5,
    0 8px 12px #0009;
}

.mca-machine-sign strong {
  color: #ffe1a0;
  font: 700 clamp(25px, 2.5vw, 32px)/1.15 Georgia, serif;
  letter-spacing: .1em;
  text-align: center;
  text-shadow: 0 2px 2px #6c430b;
}

.mca-machine-sign small {
  display: block;
  margin-top: 5px;
  font-size: .78em;
  letter-spacing: .23em;
}

.mca-sign-star {
  color: #e7b86b;
  font-size: 17px;
}

.mca-machine-body {
  position: relative;
  padding: 23px 30px 0;
  border: 6px ridge #d9a655;
  border-radius: 60px 60px 26px 26px;
  background:
    linear-gradient(
      90deg,
      #04101c,
      #234b72 5%,
      #081b2e 13%,
      #071524 80%,
      #25476b 95%,
      #020a14
    );
  box-shadow:
    inset 0 0 0 3px #261b0d,
    inset 0 0 0 5px #b8863b,
    0 0 0 2px #7c96a7;
}

.mca-window {
  position: relative;
  height: 420px;
  margin-top: 7px;
  overflow: hidden;
  border: 4px solid #130e08;
  border-radius: 26px 26px 14px 14px;
  background: #03090f;
  box-shadow: 0 0 0 2px #dda95b, 0 0 0 5px #3c2c19;
  cursor: grab;
  touch-action: pan-x pinch-zoom;
  user-select: none;
  -webkit-user-select: none;
}

.mca-window.is-held,
.mca-window.is-held * {
  cursor: grabbing;
}

.mca-reel {
  position: absolute;
  inset: 0;
}

.mca-photo {
  position: absolute;
  top: 50%;
  left: 7px;
  width: calc(100% - 14px);
  height: var(--photo-height);
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #e0bb77;
  border-radius: 16px;
  background: #142b3d;
  color: #fff6e4;
  text-align: left;
  cursor: inherit;
  will-change: transform;
}

.mca-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  -webkit-user-drag: none;
}

.mca-photo-copy {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 26px 17px 22px;
  background: linear-gradient(transparent 24%, #020a17eb);
  pointer-events: none;
}

.mca-photo-copy strong {
  font: 400 clamp(25px, 2.5vw, 34px)/1.1 Georgia, serif;
  text-shadow: 0 2px 8px #000;
}

.mca-photo-copy small {
  margin-top: 9px;
  color: #f7e2b7;
  font-size: 11px;
}

.mca-window-sheen {
  position: absolute;
  z-index: 5;
  inset: 0;
  border-radius: inherit;
  background:
    linear-gradient(#000c, transparent 17%, transparent 83%, #000c),
    linear-gradient(115deg, #ffffff12, transparent 30%);
  box-shadow: inset 0 0 20px #000a;
  pointer-events: none;
}

.mca-direction {
  position: absolute;
  z-index: 6;
  right: 9px;
  top: 46%;
  width: 24px;
  height: 40px;
  padding: 5px;
  border-radius: 15px;
  background: #061424aa;
  stroke: #ffe6b2;
  fill: none;
  stroke-width: 1.6;
  pointer-events: none;
}

.mca-bulbs {
  position: absolute;
  z-index: 2;
  top: 42px;
  bottom: 142px;
  width: 13px;
  background:
    radial-gradient(
      ellipse,
      #fffde1 15%,
      #ffe29a 30%,
      #dca03c 40%,
      #624010 50%,
      transparent 57%
    )
    top center / 13px 39px repeat-y;
  filter: drop-shadow(0 0 5px #ffd16d);
}

.mca-bulbs-left {
  left: 8px;
}

.mca-bulbs-right {
  right: 8px;
}

.mca-control-deck {
  position: relative;
  margin: 14px -35px -2px;
  padding: 8px 12px 12px;
  border: 4px ridge #d6a455;
  border-radius: 22% 22% 22px 22px / 22% 22% 18px 18px;
  background:
    linear-gradient(
      110deg,
      #254b70,
      #081a2d 32%,
      #152f4b 70%,
      #051120
    );
  box-shadow:
    inset 0 4px 8px #ffffff1a,
    0 5px 0 #38250e,
    0 7px 0 #ad7e3b;
  text-align: center;
}

.mca-button-ring {
  display: inline-flex;
  padding: 5px;
  border: 2px solid #d7a150;
  border-radius: 50%;
  background: #30200b;
  box-shadow: 0 5px 5px #0009;
}

.mca-browse {
  min-width: 136px;
  min-height: 60px;
  padding: 10px 25px;
  border: 3px ridge #ffe8b3;
  border-radius: 50%;
  color: #3d270d;
  background:
    radial-gradient(
      ellipse at 50% 15%,
      #fff8db,
      #ffd271 55%,
      #df9826
    );
  box-shadow: 0 4px 0 #996018, 0 0 18px #ffc85b55;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.mca-browse:active {
  transform: translateY(3px);
  box-shadow: 0 1px 0 #996018;
}

.mca-help {
  margin: 12px 0 5px;
  color: #e0d9cd;
  font-size: 10px;
  line-height: 1.4;
}

.mca-mobile-help {
  display: none;
}

.mca-status {
  min-height: 12px;
  margin: 0;
  color: #ffdc92;
  font-size: 10px;
}

.mca-machine-foot {
  width: 90%;
  height: 18px;
  margin: 5px auto 0;
  border-bottom: 3px ridge #c4934b;
  border-radius: 0 0 16px 16px;
  background: #051322;
}

/* HOME MACHINE END */


/* FUTURE SECTIONS START */

.mca-section {
  min-height: calc(100svh - var(--header-size));
  padding: 60px max(24px, calc((100vw - 1000px) / 2));
  background: var(--section-tone);
}

.mca-section h1 {
  margin: 15px 0 20px;
  font: 400 clamp(40px, 6vw, 70px)/1.1 Georgia, serif;
}

.mca-section p {
  max-width: 620px;
  color: #e3e7ea;
  line-height: 1.75;
}

.mca-section img {
  width: min(100%, 650px);
  max-height: 340px;
  margin: 24px 0;
  border-radius: 18px;
  object-fit: cover;
}

.mca-return {
  display: inline-flex;
  padding: 13px 22px;
  border: 1px solid #ffe2a3;
  border-radius: 10px;
  background: #f2cb7c;
  color: #2c200e;
  font-weight: 700;
}

/* FUTURE SECTIONS END */


/* FOOTER START */

.mca-footer {
  position: relative;
  z-index: 20;
  overflow: hidden;
  border-top: 1px solid rgba(100, 226, 203, 0.24);
  color: #d7e7e5;
  background:
    radial-gradient(
      circle at 8% 15%,
      rgba(45, 163, 147, 0.17),
      transparent 25%
    ),
    radial-gradient(
      circle at 92% 100%,
      rgba(39, 109, 130, 0.19),
      transparent 29%
    ),
    linear-gradient(
      145deg,
      #06161c,
      #082229 52%,
      #071722
    );
}

.mca-footer::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 28%;
  height: 2px;
  background: linear-gradient(
    90deg,
    #5fe0bd,
    rgba(95, 224, 189, 0)
  );
}

.mca-footer-shell {
  display: grid;
  grid-template-columns:
    minmax(240px, 1.35fr)
    repeat(4, minmax(130px, 1fr));
  gap: clamp(24px, 3vw, 52px);
  width: min(100%, 1720px);
  margin-inline: auto;
  padding:
    clamp(34px, 4vw, 58px)
    clamp(22px, 4vw, 72px)
    30px;
}

.mca-footer-brand {
  max-width: 330px;
}

.mca-footer-logo {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  width: fit-content;
  margin-bottom: 18px;
}

.mca-footer-logo:hover .mca-footer-name {
  color: #ffffff;
}

.mca-footer-mark {
  color: #efc66d;
  font: 54px/.85 Georgia, serif;
}

.mca-footer-name {
  color: #fff3dc;
  font: 17px/1 Georgia, serif;
  letter-spacing: 0.17em;
  transition: color 0.18s ease;
}

.mca-footer-name small {
  display: block;
  margin-top: 6px;
  color: #65dfc1;
  font: 700 8px/1 Arial, sans-serif;
  letter-spacing: 0.5em;
}

.mca-footer-brand p {
  max-width: 310px;
  margin: 0 0 17px;
  color: #aebfbe;
  font: 400 13px/1.7 Arial, sans-serif;
}

.mca-footer-age {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 6px 12px;
  border: 1px solid rgba(101, 223, 193, 0.33);
  border-radius: 999px;
  color: #a8ebda;
  background: rgba(37, 130, 119, 0.12);
  font: 700 10px/1 Arial, sans-serif;
  letter-spacing: 0.06em;
}

.mca-footer-column {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
}

.mca-footer-column h2 {
  position: relative;
  margin: 4px 0 18px;
  padding-bottom: 11px;
  color: #fff0ce;
  font: 700 12px/1 Arial, sans-serif;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.mca-footer-column h2::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 28px;
  height: 2px;
  border-radius: 999px;
  background: #5fe0bd;
}

.mca-footer-column a {
  position: relative;
  margin: 0 0 5px;
  padding: 5px 0 5px 14px;
  color: #aebfbe;
  font: 600 12px/1.35 Arial, sans-serif;
  transition:
    color 0.18s ease,
    transform 0.18s ease;
}

.mca-footer-column a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 5px;
  height: 5px;
  border: 1px solid #54bea8;
  border-radius: 50%;
  transform: translateY(-50%);
  transition:
    border-color 0.18s ease,
    background 0.18s ease;
}

.mca-footer-column a:hover {
  color: #ffffff;
  transform: translateX(3px);
}

.mca-footer-column a:hover::before {
  border-color: #8ff5dc;
  background: #5fe0bd;
}

.mca-footer-column a:focus-visible,
.mca-footer-logo:focus-visible {
  outline: 3px solid #8ff5dc;
  outline-offset: 4px;
}

.mca-footer-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  width: min(100%, 1720px);
  margin-inline: auto;
  padding:
    16px
    clamp(22px, 4vw, 72px)
    18px;
  border-top: 1px solid rgba(123, 194, 185, 0.14);
  color: #7f9998;
  font: 600 10px/1.5 Arial, sans-serif;
  letter-spacing: 0.03em;
}

:is(
  #gmsSlots,
  #gmsTables,
  #gmsElectronic,
  #gmsBingo,
  #onlineSlots,
  #onlineLiveCasino,
  #onlineTableGames,
  #onlineJackpots,
  #onlinePoker,
  #onlineBingo
) {
  scroll-margin-top: calc(var(--header-size) + 18px);
}


@media (max-width: 1100px) {
  .mca-footer-shell {
    grid-template-columns:
      minmax(230px, 1.35fr)
      repeat(2, minmax(150px, 1fr));
  }

  .mca-footer-brand {
    grid-row: span 2;
  }
}

@media (max-width: 700px) {
  .mca-footer-shell {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 24px;
    padding: 31px 20px 25px;
  }

  .mca-footer-brand {
    grid-column: 1 / -1;
    grid-row: auto;
    max-width: none;
    padding-bottom: 22px;
    border-bottom: 1px solid rgba(123, 194, 185, 0.14);
  }

  .mca-footer-brand p {
    max-width: 34rem;
    margin-bottom: 14px;
    font-size: 12px;
  }

  .mca-footer-logo {
    margin-bottom: 14px;
  }

  .mca-footer-mark {
    font-size: 46px;
  }

  .mca-footer-name {
    font-size: 15px;
  }

  .mca-footer-column h2 {
    margin-bottom: 13px;
    font-size: 10px;
  }

  .mca-footer-column a {
    margin-bottom: 3px;
    padding-block: 6px;
    font-size: 11px;
  }

  .mca-footer-meta {
    align-items: flex-start;
    flex-direction: column;
    padding: 15px 20px 22px;
  }
}

@media (max-width: 380px) {
  .mca-footer-shell {
    gap: 25px 15px;
    padding-inline: 16px;
  }

  .mca-footer-column a {
    font-size: 10px;
  }

  .mca-footer-meta {
    padding-inline: 16px;
  }
}

/* FOOTER END */


/* MOBILE NAVIGATION START */

.mca-mobile-nav {
  display: none;
}

/* MOBILE NAVIGATION END */


/* RESPONSIVE START */

@media (min-width: 901px) and (max-width: 1150px) {
  .mca-header {
    gap: 14px;
    padding-inline: 20px;
  }

  .mca-brand-name { font-size: 13px; }
  .mca-brand-mark { font-size: 43px; }
  .mca-navigation { gap: 10px; }
  .mca-navigation a { font-size: 11px; }

  .mca-header .mca-play {
    padding-inline: 18px;
    font-size: 12px;
  }

  .mca-home {
    column-gap: 25px;
    padding-inline: 30px;
  }
}

@media (max-width: 900px) {
  :root {
    --header-size: 64px;
    --mobile-dock: 76px;
  }

  body {
    padding-bottom:
      calc(
        var(--mobile-dock) +
        env(safe-area-inset-bottom, 0px)
      );
  }

  /* MOBILE HEADER START */

  .mca-header {
    min-height: var(--header-size);
    justify-content: space-between;
    gap: 8px;
    padding: 10px 14px;
  }

  .mca-brand { gap: 9px; }
  .mca-brand-mark { font-size: 39px; }

  .mca-brand-name {
    font-size: 12px;
    letter-spacing: .1em;
  }

  .mca-brand-name small { font-size: 7px; }
  .mca-header-tools { gap: 8px; }

  .mca-header .mca-play {
    min-height: 38px;
    padding-inline: 17px;
    border-radius: 9px;
    box-shadow: none;
    font-size: 12px;
  }

  .mca-menu-toggle {
    display: block;
  }

  .mca-navigation {
    position: absolute;
    top: calc(100% + 6px);
    left: 12px;
    right: 12px;
    display: none;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    max-height: 65dvh;
    margin: 0;
    padding: 12px;
    overflow: auto;
    border: 1px solid #b58a4e;
    border-radius: 12px;
    background: #0a2137;
    box-shadow: 0 20px 50px #000a;
  }

  .mca-navigation.is-open {
    display: grid;
  }

  .mca-navigation a {
    padding: 13px 12px;
    border: 1px solid #5c738a;
    border-radius: 7px;
    background: #173650;
    font-size: 13px;
  }

  /* MOBILE HEADER END */


  /* MOBILE HOME START */

  .mca-home {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    min-height: auto;
    padding: 20px 20px 26px;
  }

  .mca-home::after {
    background:
      linear-gradient(
        #07172855,
        #071728cc 58%,
        #071728
      );
  }

  .mca-kicker {
    display: none;
  }

  .mca-title {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .mca-home-action {
    order: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin: 24px 0 0;
    padding: 0;
    background: none;
    box-shadow: none;
  }

  .mca-home-action .mca-play {
    width: min(100%, 260px);
    min-height: 50px;
    padding: 12px 28px;
    border: 1px solid #ffe5a4;
    border-radius: 12px;
    background: linear-gradient(135deg, #ffe7ac, #f0c36e);
    box-shadow: none;
    color: #30200c;
    font-size: 16px;
  }

  .mca-home-action small {
    color: #c5d0dc;
    font-size: 10px;
    line-height: 1.4;
    text-align: center;
  }

  .mca-home-copy {
    order: 3;
    max-width: 350px;
    margin-top: 22px;
    text-align: center;
  }

  .mca-home-copy h2 {
    margin: 0 0 10px;
    color: #fff0d3;
    font-size: 23px;
    line-height: 1.2;
  }

  .mca-home-copy p {
    margin: 0;
    color: #d2dce7;
    font-size: 13px;
    line-height: 1.65;
  }

  /* MOBILE HOME END */


  /* MOBILE MACHINE START */

  .mca-machine {
    --photo-height:
      clamp(155px, calc(100svh - 575px), 220px);

    order: 1;
    flex: none;
    width: min(100%, 330px);
    margin: 0;
    padding-top: 62px;
    filter: drop-shadow(0 12px 16px #0005);
  }

  .mca-machine-sign {
    left: 10%;
    width: 80%;
    height: 88px;
    padding: 12px 10px;
    gap: 7px;
    border-width: 3px;
    box-shadow:
      inset 0 0 0 2px #553a17,
      0 3px 8px #0007;
  }

  .mca-machine-sign strong {
    font-size: 23px;
    line-height: 1.1;
  }

  .mca-machine-sign small {
    margin-top: 4px;
    font-size: 16px;
    letter-spacing: .2em;
  }

  .mca-sign-star {
    font-size: 12px;
  }

  .mca-machine-body {
    padding: 18px 21px 0;
    border: 3px solid #cda158;
    border-radius: 36px 36px 23px 23px;
    box-shadow:
      inset 0 0 0 2px #132b43,
      0 14px 24px #0004;
  }

  .mca-window {
    height:
      clamp(225px, calc(100svh - 505px), 290px);
    margin-top: 4px;
    border: 3px solid #101315;
    border-radius: 20px 20px 12px 12px;
    box-shadow: 0 0 0 1px #dcaf69;
  }

  .mca-photo {
    left: 5px;
    width: calc(100% - 10px);
    border-radius: 12px;
  }

  .mca-photo-copy {
    padding: 22px 14px 18px;
  }

  .mca-photo-copy strong {
    font-size: 27px;
    line-height: 1.08;
  }

  .mca-photo-copy small {
    margin-top: 8px;
    font-size: 11px;
  }

  .mca-bulbs {
    bottom: 118px;
    width: 10px;
    background-size: 10px 33px;
  }

  .mca-bulbs-left { left: 5px; }
  .mca-bulbs-right { right: 5px; }

  .mca-control-deck {
    margin: 13px -21px 0;
    padding: 13px 12px 15px;
    border: 0;
    border-top: 1px solid #b58c4c;
    border-radius: 0 0 19px 19px;
    background: linear-gradient(135deg, #183b5b, #0a2036 70%);
    box-shadow: none;
  }

  .mca-button-ring {
    padding: 3px;
    border: 1px solid #d9b16b;
    box-shadow: none;
  }

  .mca-browse {
    min-width: 128px;
    min-height: 46px;
    border: 2px solid #ffe2a1;
    font-size: 13px;
    box-shadow:
      inset 0 1px 5px #fff7d2,
      0 2px 0 #956325;
  }

  .mca-help {
    max-width: 245px;
    margin: 12px auto 0;
    color: #d8e2ed;
    font-size: 10px;
    line-height: 1.5;
  }

  .mca-desktop-help { display: none; }
  .mca-mobile-help { display: inline; }

  .mca-status {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .mca-machine-foot {
    display: none;
  }

  /* MOBILE MACHINE END */


  /* MOBILE HORIZONTAL NAVIGATION START */

  .mca-mobile-nav {
    position: fixed;
    z-index: 25;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: stretch;
    gap: 8px;
    min-height: var(--mobile-dock);
    padding:
      9px 12px
      calc(9px + env(safe-area-inset-bottom, 0px));
    overflow-x: auto;
    overflow-y: hidden;
    border-top: 1px solid #d1aa62;
    background: #081b2ef5;
    box-shadow: 0 -5px 20px #0003;
    scrollbar-width: none;
    scroll-snap-type: x proximity;
    scroll-padding-inline: 12px;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
  }

  .mca-mobile-nav::-webkit-scrollbar {
    display: none;
  }

  .mca-mobile-nav a {
    display: flex;
    flex: 0 0 72px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 72px;
    min-height: 55px;
    padding: 8px 9px;
    border: 1px solid #53738f;
    border-radius: 11px;
    background: #193b58;
    color: #f5f0e4;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.1;
    white-space: nowrap;
    scroll-snap-align: start;
  }

  .mca-mobile-nav a > span {
    display: block;
    font-size: inherit;
    line-height: inherit;
    white-space: nowrap;
  }

  .mca-mobile-nav a[aria-current="page"] {
    border-color: #ffe2a0;
    background: linear-gradient(135deg, #ffe2a0, #e9b85f);
    color: #2e210f;
  }

  .mca-mobile-nav svg {
    display: block;
    flex: none;
    width: 21px;
    height: 21px;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .mca-mobile-nav a:focus-visible {
    outline-offset: -3px;
  }

  /* MOBILE HORIZONTAL NAVIGATION END */

  .mca-footer {
    padding: 16px;
    font-size: 9px;
  }

  .mca-section {
    padding: 35px 22px;
  }
}

@media (max-width: 360px) {
  .mca-header { padding-inline: 10px; }
  .mca-brand-name { font-size: 10px; }
  .mca-header .mca-play { padding-inline: 13px; }
  .mca-home { padding-inline: 16px; }
  .mca-machine-sign strong { font-size: 21px; }
  .mca-photo-copy strong { font-size: 25px; }
  .mca-home-copy h2 { font-size: 21px; }
}

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

/* RESPONSIVE END */
/* ABOUT START */

.mba-about {
  --mba-gold: #efc66d;
  --mba-cream: #fff3dc;
  --mba-green: #58dfbd;
  --mba-green-dark: #168f84;
  --mba-green-soft: #a5f5df;
  --mba-line: rgba(116, 190, 187, 0.22);

  min-height: calc(100svh - var(--header-size, 82px));
  padding: 34px clamp(18px, 3vw, 54px) 64px;
  overflow: clip;

  color: #edf3f1;

  background:
    radial-gradient(
      circle at 88% 4%,
      rgba(45, 132, 145, 0.25),
      transparent 30%
    ),
    radial-gradient(
      circle at 20% 92%,
      rgba(48, 101, 123, 0.18),
      transparent 30%
    ),
    linear-gradient(
      145deg,
      #071722,
      #0d202b 54%,
      #101a28
    );
}

.mba-about[hidden],
.mba-profile[hidden] {
  display: none !important;
}

.mba-layout {
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr);
  gap: clamp(30px, 3vw, 54px);

  width: 100%;
  max-width: 1640px;
  margin-inline: auto;
}

.mba-main {
  min-width: 0;
}

.mba-about button,
.mba-about a {
  -webkit-tap-highlight-color: transparent;
}

.mba-about :is(button, a):focus-visible {
  outline: 3px solid var(--mba-green-soft);
  outline-offset: 4px;
}

/* ABOUT SIDEBAR START */

.mba-sidebar {
  position: sticky;
  top: calc(50svh - 235px);
  align-self: start;
  z-index: 5;
}

.mba-sidebar > p:first-child {
  margin: 0 0 12px;

  color: #91b6b2;
  text-align: center;

  font: 700 9px/1 system-ui, sans-serif;
  letter-spacing: 0.17em;
}

.mba-side-links {
  display: grid;
  gap: 7px;
}

.mba-side-links a {
  display: flex;
  align-items: center;
  justify-content: center;

  min-height: 42px;
  padding: 8px 10px;

  border: 1px solid rgba(59, 218, 181, 0.42);
  border-radius: 999px;

  color: #b9d8d2;

  background:
    linear-gradient(
      135deg,
      rgba(15, 57, 65, 0.95),
      rgba(7, 31, 42, 0.98)
    );

  box-shadow:
    inset 0 0 0 1px rgba(118, 242, 211, 0.04),
    0 7px 18px rgba(0, 0, 0, 0.2);

  text-decoration: none;
  font: 700 10px/1 system-ui, sans-serif;

  transition:
    transform 0.18s ease,
    color 0.18s ease,
    border-color 0.18s ease,
    background 0.18s ease,
    box-shadow 0.18s ease;
}

.mba-side-links a:hover {
  transform: translateX(3px);

  color: #ffffff;
  border-color: #62e3c2;

  background:
    linear-gradient(
      135deg,
      #196f70,
      #104958
    );

  box-shadow:
    0 0 0 2px rgba(98, 227, 194, 0.1),
    0 10px 25px rgba(0, 0, 0, 0.3);
}

.mba-side-links a[aria-current="page"] {
  color: #041d21;
  border-color: #a1ffe5;

  background:
    linear-gradient(
      135deg,
      #77efc9,
      #32bfa8
    );

  box-shadow:
    0 0 0 2px rgba(84, 227, 190, 0.16),
    0 10px 27px rgba(0, 0, 0, 0.3);
}

.mba-side-links a[aria-disabled="true"] {
  color: #799093;
  border-color: rgba(68, 139, 139, 0.25);
  background: rgba(6, 24, 33, 0.72);
  box-shadow: none;

  opacity: 0.58;
  cursor: default;
  transform: none;
}

.mba-status {
  margin: 10px 0 0;

  color: #96d9ca;
  text-align: center;

  font: 500 9px/1.4 system-ui, sans-serif;
}

/* ABOUT SIDEBAR END */

/* ABOUT INTRO START */

.mba-intro {
  padding: 10px 0 30px;
  border-bottom: 1px solid var(--mba-line);
}

.mba-kicker {
  margin: 0 0 13px;

  color: var(--mba-green);

  font: 800 10px/1.2 system-ui, sans-serif;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.mba-intro h1 {
  max-width: 1050px;
  margin: 0 0 25px;

  color: var(--mba-cream);

  font:
    400 clamp(43px, 5.3vw, 76px) / 1
    Georgia,
    serif;

  letter-spacing: -0.045em;
}

.mba-intro h1 span {
  color: var(--mba-gold);
}

.mba-intro-grid {
  display: grid;
  grid-template-columns:
    minmax(0, 1.08fr)
    minmax(360px, 0.92fr);

  gap: clamp(38px, 6vw, 96px);
  max-width: 1370px;
}

.mba-intro-grid p {
  margin: 0;
}

.mba-lead {
  color: #fff7e9;

  font:
    400 clamp(19px, 1.55vw, 24px) / 1.65
    Georgia,
    serif;
}

.mba-desktop-copy {
  display: grid;
  align-content: center;
  gap: 15px;
}

.mba-desktop-copy p {
  color: #c1cfd2;
  font: 400 15px/1.75 system-ui, sans-serif;
}

.mba-mobile-intro {
  display: none;
}

.mba-moods {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;

  margin-top: 24px;
}

.mba-moods span {
  padding: 8px 13px;

  border: 1px solid rgba(85, 199, 176, 0.32);
  border-radius: 999px;

  color: #bce7dd;
  background: rgba(6, 27, 35, 0.72);

  font: 700 10px/1 system-ui, sans-serif;
}

/* ABOUT INTRO END */

/* ABOUT CHOICES START */

.mba-picker {
  padding-top: 27px;
}

.mba-picker > h2 {
  margin: 0 0 6px;

  color: #ffffff;
  font: 700 22px/1.2 system-ui, sans-serif;
}

.mba-picker > p {
  margin: 0 0 18px;

  color: #a9b9bd;
  font: 400 13px/1.5 system-ui, sans-serif;
}

.mba-choices {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;

  scroll-margin-top: 20px;
}

.mba-choice {
  position: relative;

  display: grid;
  grid-template-rows: minmax(128px, 10vw) auto;

  min-width: 0;
  padding: 0;
  overflow: hidden;

  border: 1px solid rgba(122, 171, 179, 0.3);
  border-radius: 17px;

  color: #ffffff;
  background: #0b1d27;

  box-shadow:
    0 12px 30px rgba(0, 0, 0, 0.22);

  text-align: left;
  cursor: pointer;

  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

.mba-choice:nth-child(n + 5) {
  transform: translateX(calc(50% + 7px));
}

.mba-choice img {
  display: block;

  width: 100%;
  height: 100%;
  min-height: 128px;

  object-fit: cover;

  transition:
    transform 0.35s ease,
    filter 0.35s ease;
}

.mba-choice > span {
  position: relative;

  display: block;
  min-width: 0;
  padding: 14px 42px 14px 14px;

  background:
    linear-gradient(
      135deg,
      #10333c,
      #09222c
    );
}

.mba-choice > span::after {
  content: "›";

  position: absolute;
  right: 13px;
  top: 50%;

  display: grid;
  place-items: center;

  width: 26px;
  height: 26px;

  border: 1px solid rgba(85, 223, 189, 0.62);
  border-radius: 50%;

  color: var(--mba-green);

  font: 700 20px/1 Georgia, serif;

  transform: translateY(-50%);
}

.mba-choice strong {
  display: block;

  color: #ffffff;

  font:
    700 clamp(12px, 0.92vw, 15px) / 1.3
    system-ui,
    sans-serif;

  text-wrap: balance;
}

.mba-choice small {
  display: block;
  margin-top: 5px;

  color: #9fb4b7;
  font: 500 9px/1.35 system-ui, sans-serif;
}

.mba-choice i {
  display: none;
}

.mba-choice:hover {
  transform: translateY(-4px);

  border-color: var(--mba-green);

  box-shadow:
    0 0 0 2px rgba(85, 223, 189, 0.08),
    0 18px 40px rgba(0, 0, 0, 0.38);
}

.mba-choice:nth-child(n + 5):hover {
  transform:
    translateX(calc(50% + 7px))
    translateY(-4px);
}

.mba-choice:hover img {
  transform: scale(1.04);
  filter: saturate(1.08);
}

.mba-choice[aria-expanded="true"] {
  border-color: #88f3d5;

  box-shadow:
    0 0 0 2px rgba(85, 223, 189, 0.2),
    0 18px 40px rgba(0, 0, 0, 0.36);
}

.mba-choice[aria-expanded="true"] > span {
  background:
    linear-gradient(
      135deg,
      #17655f,
      #0d4248
    );
}

.mba-choice[aria-expanded="true"] > span::after {
  color: #062b2c;
  border-color: #a7ffe6;
  background: #78e8c9;
}

/* ABOUT CHOICES END */

/* ABOUT PROFILE START */

.mba-profile {
  position: relative;

  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;

  margin-top: 34px;
  padding: clamp(22px, 3vw, 46px);
  overflow: hidden;

  border: 1px solid rgba(85, 199, 176, 0.22);
  border-radius: 28px;

  color: #edf4f1;

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(47, 132, 141, 0.2),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      #102732,
      #0a1a25 68%
    );

  box-shadow:
    0 28px 70px rgba(0, 0, 0, 0.34);

  scroll-margin-top: 20px;
}

.mba-profile > :not(.mba-topic) {
  grid-column: 1 / -1;
}

.mba-close {
  justify-self: start;

  display: inline-flex;
  align-items: center;

  min-height: 38px;
  padding: 8px 14px;
  margin: 0 0 7px;

  border: 1px solid rgba(85, 223, 189, 0.48);
  border-radius: 999px;

  color: #9ff1dc;
  background: rgba(5, 31, 38, 0.78);

  font: 700 11px/1 system-ui, sans-serif;
  cursor: pointer;
}

.mba-close::before {
  content: "←";

  margin-right: 8px;
  font-size: 15px;
}

.mba-close:hover {
  color: #062528;
  border-color: #adffe9;
  background: #68dcbd;
}

.mba-profile-heading h2 {
  max-width: 1080px;
  margin: 0 0 10px;

  color: var(--mba-cream);

  font:
    400 clamp(35px, 4vw, 58px) / 1.05
    Georgia,
    serif;

  letter-spacing: -0.03em;
}

.mba-summary {
  display: grid;

  grid-template-columns:
    minmax(250px, 0.72fr)
    minmax(0, 1.28fr);

  grid-template-rows: auto 1fr;
  gap: 7px 24px;

  padding: 22px;

  border: 1px solid rgba(85, 223, 189, 0.28);
  border-radius: 19px;

  color: #eff7f4;

  background:
    linear-gradient(
      125deg,
      rgba(23, 102, 96, 0.92),
      rgba(20, 68, 77, 0.96)
    );
}

.mba-summary h3 {
  grid-column: 1;
  grid-row: 1;

  margin: 0;

  color: #a7ffe6;

  font: 800 9px/1 system-ui, sans-serif;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.mba-summary address {
  grid-column: 1;
  grid-row: 2;

  color: #ffffff;

  font: 600 15px/1.55 system-ui, sans-serif;
  font-style: normal;

  overflow-wrap: anywhere;
}

.mba-summary ul {
  grid-column: 2;
  grid-row: 1 / 3;

  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;

  margin: 0;
  padding: 0;

  list-style: none;
}

.mba-summary li {
  position: relative;

  display: flex;
  align-items: center;

  min-height: 48px;
  padding: 10px 12px 10px 34px;

  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 12px;

  color: #f3f7f5;
  background: rgba(4, 21, 28, 0.28);

  font: 600 12px/1.4 system-ui, sans-serif;
}

.mba-summary li::before {
  content: "";

  position: absolute;
  left: 14px;

  width: 8px;
  height: 8px;

  border: 2px solid #8df0d4;
  border-radius: 50%;
}

.mba-introduction {
  max-width: 1220px;
  margin: 12px 0 7px;
  padding: 20px 22px;

  border-left: 3px solid var(--mba-green);
  border-radius: 0 16px 16px 0;

  color: #f7f1e6;
  background: rgba(4, 18, 26, 0.34);

  font:
    400 clamp(17px, 1.25vw, 20px) / 1.72
    Georgia,
    serif;
}

.mba-topic {
  min-width: 0;
  padding: 22px;

  border: 1px solid rgba(126, 178, 186, 0.17);
  border-radius: 18px;

  background:
    linear-gradient(
      145deg,
      rgba(7, 25, 34, 0.9),
      rgba(12, 34, 44, 0.76)
    );
}

.mba-topic:nth-of-type(3n) {
  border-color: rgba(85, 223, 189, 0.22);

  background:
    linear-gradient(
      145deg,
      rgba(17, 61, 61, 0.92),
      rgba(9, 34, 42, 0.8)
    );
}

.mba-topic h3 {
  margin: 0 0 12px;

  color: #76e1c3;
  font: 700 18px/1.3 system-ui, sans-serif;
}

.mba-topic p {
  margin: 0;

  color: #c6d3d5;
  font: 400 14px/1.75 system-ui, sans-serif;
}

.mba-terms {
  margin: 4px 0 0;
  padding: 15px 18px;

  border: 1px solid rgba(85, 223, 189, 0.14);
  border-radius: 13px;

  color: #9fb0b3;
  background: rgba(85, 223, 189, 0.05);

  font: 400 11px/1.65 system-ui, sans-serif;
}

/* ABOUT PROFILE END */

/* ABOUT TABLET START */

@media (max-width: 1100px) {
  .mba-choices {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .mba-choice:nth-child(n + 5),
  .mba-choice:nth-child(n + 5):hover {
    transform: none;
  }
}

/* ABOUT TABLET END */

/* ABOUT MOBILE START */

@media (max-width: 760px) {
  .mba-about {
    padding: 20px 14px 34px;
  }

  .mba-layout {
    display: block;
  }

  .mba-sidebar {
    display: none;
  }

  .mba-intro {
    padding: 3px 1px 19px;
  }

  .mba-kicker {
    margin-bottom: 9px;
    font-size: 9px;
    letter-spacing: 0.14em;
  }

  .mba-intro h1 {
    margin-bottom: 13px;
    font-size: clamp(34px, 10.5vw, 47px);
  }

  .mba-intro-grid,
  .mba-moods {
    display: none;
  }

  .mba-mobile-intro {
    display: block;

    max-width: 36rem;
    margin: 0;

    color: #d2dddc;
    font: 400 14px/1.6 system-ui, sans-serif;
  }

  .mba-picker {
    padding-top: 18px;
  }

  .mba-picker > h2 {
    font-size: 18px;
  }

  .mba-picker > p {
    margin-bottom: 13px;
    font-size: 12px;
  }

  .mba-choices {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .mba-choice,
  .mba-choice:nth-child(n + 5) {
    display: grid;

    grid-template-columns:
      39%
      minmax(0, 1fr);

    grid-template-rows: 96px;

    width: 100%;
    min-height: 96px;

    transform: none;
    border-radius: 14px;
  }

  .mba-choice:hover,
  .mba-choice:nth-child(n + 5):hover {
    transform: none;
  }

  .mba-choice img {
    grid-column: 1;
    grid-row: 1;

    width: 100%;
    height: 96px;
    min-height: 0;
  }

  .mba-choice > span {
    grid-column: 2;
    grid-row: 1;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 13px 42px 13px 13px;
  }

  .mba-choice > span::after {
    right: 12px;
    top: 50%;
    bottom: auto;
  }

  .mba-choice strong {
    font-size: 13px;
  }

  .mba-choice small {
    font-size: 9px;
  }

  .mba-choices > .mba-profile {
    grid-column: 1 / -1;

    width: 100%;
    margin: 2px 0 10px;
  }

  .mba-profile {
    grid-template-columns: 1fr;
    gap: 11px;

    padding: 19px 14px;

    border-radius: 19px;
  }

  .mba-profile > :not(.mba-topic) {
    grid-column: 1;
  }

  .mba-choices > .mba-profile .mba-close {
    position: sticky;
    top: calc(var(--header-size, 70px) + 8px);
    z-index: 4;

    margin-bottom: 8px;

    background: rgba(7, 29, 38, 0.96);
    backdrop-filter: blur(12px);
  }

  .mba-profile-heading h2 {
    margin-bottom: 9px;
    font-size: 33px;
  }

  .mba-summary {
    grid-template-columns: 1fr;
    grid-template-rows: auto;

    gap: 8px;
    padding: 16px;
  }

  .mba-summary h3,
  .mba-summary address,
  .mba-summary ul {
    grid-column: 1;
    grid-row: auto;
  }

  .mba-summary address {
    margin-bottom: 6px;
    font-size: 13px;
  }

  .mba-summary ul {
    grid-template-columns: 1fr 1fr;
  }

  .mba-summary li {
    min-height: 51px;
    padding-left: 29px;
    font-size: 10px;
  }

  .mba-introduction {
    margin: 3px 0;
    padding: 16px;

    font-size: 15px;
    line-height: 1.65;
  }

  .mba-topic {
    padding: 17px;
    border-radius: 15px;
  }

  .mba-topic h3 {
    font-size: 16px;
  }

  .mba-topic p {
    font-size: 13px;
    line-height: 1.7;
  }

  .mba-terms {
    font-size: 10px;
  }
}

@media (max-width: 390px) {
  .mba-summary ul {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mba-side-links a,
  .mba-choice,
  .mba-choice img {
    transition: none;
  }
}

/* ABOUT MOBILE END */
/* ABOUT END */
/* GAMES START */

.gms-section {
  --gms-cyan: #63e2e7;
  --gms-violet: #9e8cff;
  --gms-lilac: #d6ceff;
  --gms-white: #f6f4ff;
  --gms-line: rgba(124, 180, 221, 0.22);

  min-height: calc(100svh - var(--header-size, 82px));
  padding: 34px clamp(18px, 3vw, 54px) 64px;
  overflow: clip;

  color: #edf1fb;

  background:
    radial-gradient(
      circle at 87% 7%,
      rgba(83, 79, 177, 0.28),
      transparent 32%
    ),
    radial-gradient(
      circle at 18% 82%,
      rgba(37, 128, 159, 0.18),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      #080f20,
      #11172c 54%,
      #17142b
    );
}

.gms-section[hidden],
.gms-profile[hidden] {
  display: none !important;
}

.gms-layout {
  display: grid;
  grid-template-columns: 100px minmax(0, 1fr);
  gap: clamp(30px, 3vw, 54px);

  max-width: 1640px;
  margin-inline: auto;
}

.gms-main {
  min-width: 0;
}

.gms-section :is(button, a):focus-visible {
  outline: 3px solid #b9fbff;
  outline-offset: 4px;
}

/* GAMES SIDEBAR START */

.gms-sidebar {
  position: sticky;
  top: calc(50svh - 235px);
  align-self: start;
  z-index: 5;
}

.gms-sidebar > p:first-child {
  margin: 0 0 12px;

  color: #94b6c9;
  text-align: center;

  font: 700 9px/1 system-ui, sans-serif;
  letter-spacing: 0.17em;
}

.gms-side-links {
  display: grid;
  gap: 7px;
}

.gms-side-links a {
  display: flex;
  align-items: center;
  justify-content: center;

  min-height: 42px;
  padding: 8px 10px;

  border: 1px solid rgba(103, 182, 211, 0.3);
  border-radius: 999px;

  color: #a8bacb;
  background: rgba(7, 17, 37, 0.78);

  text-decoration: none;
  font: 700 10px/1 system-ui, sans-serif;

  transition: 0.18s ease;
}

.gms-side-links a:hover {
  transform: translateX(3px);

  color: #ffffff;
  border-color: var(--gms-cyan);

  background:
    linear-gradient(
      135deg,
      #155b75,
      #293b7e
    );
}

.gms-side-links a[aria-current="page"] {
  color: #071c2a;
  border-color: #c8fbff;

  background:
    linear-gradient(
      135deg,
      #79eef1,
      #61bddd
    );

  box-shadow:
    0 0 0 2px rgba(99, 226, 231, 0.14),
    0 10px 26px rgba(0, 0, 0, 0.28);
}

.gms-side-links a[aria-disabled="true"] {
  color: #687887;
  border-color: rgba(83, 121, 145, 0.2);
  background: rgba(7, 16, 31, 0.62);

  opacity: 0.6;
  cursor: default;
  transform: none;
}

.gms-status {
  color: #a9dfe3;
  text-align: center;
  font: 500 9px/1.4 system-ui, sans-serif;
}

/* GAMES SIDEBAR END */

/* GAMES INTRO START */

.gms-intro {
  padding: 10px 0 30px;
  border-bottom: 1px solid var(--gms-line);
}

.gms-kicker {
  margin: 0 0 13px;

  color: var(--gms-cyan);

  font: 800 10px/1.2 system-ui, sans-serif;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.gms-intro h1 {
  max-width: 1100px;
  margin: 0 0 25px;

  color: var(--gms-white);

  font:
    400 clamp(43px, 5.3vw, 76px) / 1
    Georgia,
    serif;

  letter-spacing: -0.045em;
}

.gms-intro h1 span {
  color: var(--gms-violet);
}

.gms-intro-grid {
  display: grid;

  grid-template-columns:
    minmax(0, 1.08fr)
    minmax(360px, 0.92fr);

  gap: clamp(38px, 6vw, 96px);
  max-width: 1370px;
}

.gms-intro-grid p {
  margin: 0;
}

.gms-lead {
  color: #f7f4ff;

  font:
    400 clamp(19px, 1.55vw, 24px) / 1.65
    Georgia,
    serif;
}

.gms-intro-copy {
  display: grid;
  align-content: center;
  gap: 15px;
}

.gms-intro-copy p {
  color: #c2cadc;
  font: 400 15px/1.75 system-ui, sans-serif;
}

.gms-mobile-intro {
  display: none;
}

.gms-highlights {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;

  margin-top: 24px;
}

.gms-highlights span {
  padding: 8px 13px;

  border: 1px solid rgba(99, 226, 231, 0.28);
  border-radius: 999px;

  color: #c4f6f7;
  background: rgba(9, 28, 52, 0.72);

  font: 700 10px/1 system-ui, sans-serif;
}

/* GAMES INTRO END */

/* GAME CHOICES START */

.gms-picker {
  padding-top: 27px;
}

.gms-picker > h2 {
  margin: 0 0 6px;
  color: #ffffff;
  font: 700 22px/1.2 system-ui, sans-serif;
}

.gms-picker > p {
  margin: 0 0 18px;
  color: #aeb8ca;
  font: 400 13px/1.5 system-ui, sans-serif;
}

.gms-choices {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;

  scroll-margin-top: 20px;
}

.gms-choice {
  position: relative;

  display: grid;
  grid-template-rows: minmax(150px, 11vw) auto;

  min-width: 0;
  padding: 0;
  overflow: hidden;

  border: 1px solid rgba(121, 169, 205, 0.3);
  border-radius: 18px;

  color: #ffffff;
  background: #0b172a;

  box-shadow:
    0 12px 30px rgba(0, 0, 0, 0.24);

  text-align: left;
  cursor: pointer;

  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

.gms-choice img {
  display: block;

  width: 100%;
  height: 100%;
  min-height: 150px;

  object-fit: cover;

  transition:
    transform 0.35s ease,
    filter 0.35s ease;
}

.gms-choice > span {
  position: relative;

  display: block;
  min-width: 0;
  padding: 15px 43px 15px 15px;

  background:
    linear-gradient(
      135deg,
      #15284a,
      #101a34
    );
}

.gms-choice > span::after {
  content: "›";

  position: absolute;
  right: 13px;
  top: 50%;

  display: grid;
  place-items: center;

  width: 27px;
  height: 27px;

  border: 1px solid rgba(99, 226, 231, 0.65);
  border-radius: 50%;

  color: var(--gms-cyan);

  font: 700 20px/1 Georgia, serif;

  transform: translateY(-50%);
}

.gms-choice strong {
  display: block;
  color: #ffffff;
  font: 700 15px/1.3 system-ui, sans-serif;
}

.gms-choice small {
  display: block;
  margin-top: 5px;

  color: #aebbd0;
  font: 500 9px/1.4 system-ui, sans-serif;
}

.gms-choice:hover {
  transform: translateY(-4px);
  border-color: var(--gms-cyan);

  box-shadow:
    0 0 0 2px rgba(99, 226, 231, 0.08),
    0 18px 40px rgba(0, 0, 0, 0.4);
}

.gms-choice:hover img {
  transform: scale(1.04);
  filter: saturate(1.08);
}

.gms-choice[aria-expanded="true"] {
  border-color: #b9f9ff;

  box-shadow:
    0 0 0 2px rgba(99, 226, 231, 0.2),
    0 18px 40px rgba(0, 0, 0, 0.38);
}

.gms-choice[aria-expanded="true"] > span {
  background:
    linear-gradient(
      135deg,
      #254e84,
      #34346e
    );
}

/* GAME CHOICES END */

/* GAME PROFILE START */

.gms-profile {
  display: grid;
  gap: 16px;

  margin-top: 34px;
  padding: clamp(22px, 3vw, 46px);

  border: 1px solid rgba(99, 226, 231, 0.2);
  border-radius: 28px;

  color: #edf2fb;

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(92, 78, 177, 0.22),
      transparent 28%
    ),
    linear-gradient(
      145deg,
      #101c35,
      #0a1428 68%
    );

  box-shadow:
    0 28px 70px rgba(0, 0, 0, 0.35);

  scroll-margin-top: 20px;
}

.gms-close {
  justify-self: start;

  display: inline-flex;
  align-items: center;

  min-height: 38px;
  padding: 8px 14px;

  border: 1px solid rgba(99, 226, 231, 0.46);
  border-radius: 999px;

  color: #a9f5f4;
  background: rgba(7, 24, 44, 0.8);

  font: 700 11px/1 system-ui, sans-serif;
  cursor: pointer;
}

.gms-close::before {
  content: "←";
  margin-right: 8px;
  font-size: 15px;
}

.gms-close:hover {
  color: #071d29;
  border-color: #c8fcff;
  background: #72e5e9;
}

.gms-profile-heading {
  max-width: 1250px;
}

.gms-profile-heading h2 {
  margin: 0 0 17px;

  color: #f2efff;

  font:
    400 clamp(35px, 4vw, 58px) / 1.05
    Georgia,
    serif;

  letter-spacing: -0.03em;
}

.gms-profile-heading > p:last-child {
  max-width: 1150px;
  margin: 0;

  color: #ced4e3;

  font:
    400 clamp(16px, 1.2vw, 19px) / 1.75
    system-ui,
    sans-serif;
}

.gms-fact-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;

  padding: 10px;

  border: 1px solid rgba(99, 226, 231, 0.2);
  border-radius: 18px;

  background:
    linear-gradient(
      135deg,
      rgba(31, 75, 107, 0.88),
      rgba(47, 43, 104, 0.88)
    );
}

.gms-fact-row div {
  min-width: 0;
  padding: 14px;

  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;

  background: rgba(6, 17, 35, 0.24);
}

.gms-fact-row small {
  display: block;
  margin-bottom: 6px;

  color: #8feef1;

  font: 800 8px/1 system-ui, sans-serif;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.gms-fact-row strong {
  display: block;
  color: #ffffff;
  font: 700 12px/1.45 system-ui, sans-serif;
}

.gms-content-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.gms-block {
  min-width: 0;
  padding: 22px;

  border: 1px solid rgba(125, 164, 201, 0.16);
  border-radius: 18px;

  background:
    linear-gradient(
      145deg,
      rgba(9, 24, 46, 0.94),
      rgba(14, 27, 51, 0.82)
    );
}

.gms-block-wide,
.gms-block-comparison {
  grid-column: 1 / -1;
}

.gms-block-accent {
  border-color: rgba(158, 140, 255, 0.3);

  background:
    linear-gradient(
      145deg,
      rgba(45, 43, 97, 0.9),
      rgba(20, 31, 66, 0.88)
    );
}

.gms-block-label {
  margin: 0 0 9px;

  color: var(--gms-cyan);

  font: 800 9px/1 system-ui, sans-serif;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.gms-block h3 {
  margin: 0 0 13px;

  color: var(--gms-lilac);
  font: 700 20px/1.3 system-ui, sans-serif;
}

.gms-block > p:not(.gms-block-label) {
  margin: 0;

  color: #c6cfdd;
  font: 400 14px/1.78 system-ui, sans-serif;
}

.gms-block > p + p {
  margin-top: 13px !important;
}

.gms-comparison {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

.gms-comparison div {
  padding: 15px;

  border: 1px solid rgba(99, 226, 231, 0.15);
  border-radius: 13px;

  background: rgba(6, 20, 39, 0.42);
}

.gms-comparison strong {
  display: block;
  margin-bottom: 7px;

  color: #8feef1;
  font: 700 13px/1.35 system-ui, sans-serif;
}

.gms-comparison span {
  display: block;

  color: #bac5d5;
  font: 400 12px/1.55 system-ui, sans-serif;
}

.gms-terms {
  margin: 0;
  padding: 15px 18px;

  border: 1px solid rgba(99, 226, 231, 0.13);
  border-radius: 13px;

  color: #9faabd;
  background: rgba(99, 226, 231, 0.04);

  font: 400 11px/1.65 system-ui, sans-serif;
}

/* GAME PROFILE END */

/* GAMES TABLET START */

@media (max-width: 1100px) {
  .gms-choices {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .gms-fact-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .gms-comparison {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* GAMES TABLET END */

/* GAMES MOBILE START */

@media (max-width: 760px) {
  .gms-section {
    padding: 20px 14px 34px;
  }

  .gms-layout {
    display: block;
  }

  .gms-sidebar {
    display: none;
  }

  .gms-intro {
    padding: 3px 1px 19px;
  }

  .gms-kicker {
    margin-bottom: 9px;
    font-size: 9px;
    letter-spacing: 0.14em;
  }

  .gms-intro h1 {
    margin-bottom: 13px;
    font-size: clamp(34px, 10.5vw, 47px);
  }

  .gms-intro-grid,
  .gms-highlights {
    display: none;
  }

  .gms-mobile-intro {
    display: block;
    margin: 0;

    color: #d2d7e5;
    font: 400 14px/1.6 system-ui, sans-serif;
  }

  .gms-picker {
    padding-top: 18px;
  }

  .gms-picker > h2 {
    font-size: 18px;
  }

  .gms-picker > p {
    margin-bottom: 13px;
    font-size: 12px;
  }

  .gms-choices {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .gms-choice {
    display: grid;

    grid-template-columns:
      39%
      minmax(0, 1fr);

    grid-template-rows: 98px;

    min-height: 98px;
    border-radius: 14px;
  }

  .gms-choice:hover {
    transform: none;
  }

  .gms-choice img {
    grid-column: 1;
    grid-row: 1;

    width: 100%;
    height: 98px;
    min-height: 0;
  }

  .gms-choice > span {
    grid-column: 2;
    grid-row: 1;

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 13px 42px 13px 13px;
  }

  .gms-choice strong {
    font-size: 13px;
  }

  .gms-choice small {
    font-size: 9px;
  }

  .gms-choices > .gms-profile {
    grid-column: 1;

    width: 100%;
    margin: 2px 0 10px;
  }

  .gms-profile {
    gap: 11px;
    padding: 19px 14px;
    border-radius: 19px;
  }

  .gms-choices > .gms-profile .gms-close {
    position: sticky;
    top: calc(var(--header-size, 70px) + 8px);
    z-index: 4;

    background: rgba(7, 24, 44, 0.96);
    backdrop-filter: blur(12px);
  }

  .gms-profile-heading h2 {
    font-size: 32px;
  }

  .gms-profile-heading > p:last-child {
    font-size: 14px;
    line-height: 1.65;
  }

  .gms-fact-row {
    grid-template-columns: 1fr 1fr;
    gap: 7px;
    padding: 8px;
  }

  .gms-fact-row div {
    padding: 11px;
  }

  .gms-fact-row strong {
    font-size: 10px;
  }

  .gms-content-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .gms-block,
  .gms-block-wide,
  .gms-block-comparison {
    grid-column: 1;
  }

  .gms-block {
    padding: 17px;
    border-radius: 15px;
  }

  .gms-block h3 {
    font-size: 17px;
  }

  .gms-block > p:not(.gms-block-label) {
    font-size: 13px;
    line-height: 1.7;
  }

  .gms-comparison {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 390px) {
  .gms-fact-row {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .gms-side-links a,
  .gms-choice,
  .gms-choice img {
    transition: none;
  }
}

/* GAMES MOBILE END */
/* GAMES END */
/* OFFERS START */
.ofs-section {
  --ofs-bg: #091b24;
  --ofs-surface: #102b34;
  --ofs-surface-strong: #143944;
  --ofs-line: rgba(119, 231, 205, 0.22);
  --ofs-text: #f8f4e9;
  --ofs-muted: #b6c8ca;
  --ofs-mint: #70e5c5;
  --ofs-cyan: #43c8db;
  --ofs-lime: #b9ef72;
  --ofs-coral: #ff866b;
  --ofs-dark: #041116;

  min-height: 100vh;
  color: var(--ofs-text);
  background:
    radial-gradient(circle at 82% 10%, rgba(67, 200, 219, 0.13), transparent 31%),
    radial-gradient(circle at 18% 72%, rgba(112, 229, 197, 0.09), transparent 28%),
    linear-gradient(145deg, #071720 0%, #0b2029 52%, #07161f 100%);
}

.ofs-section[hidden] {
  display: none;
}

.ofs-section button,
.ofs-section a {
  font: inherit;
}

.ofs-shell {
  position: relative;
  display: grid;
  grid-template-columns: 126px minmax(0, 1fr);
  max-width: 1880px;
  min-height: 100vh;
  margin: 0 auto;
}

.ofs-rail {
  position: sticky;
  top: 50%;
  align-self: start;
  z-index: 6;
  display: flex;
  flex-direction: column;
  gap: 18px;
  width: 112px;
  max-height: calc(100vh - 40px);
  padding: 18px 10px;
  transform: translateY(-50%);
}

.ofs-rail-label {
  color: #87aaa9;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.2em;
  text-align: center;
  text-transform: uppercase;
}

.ofs-rail-nav {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ofs-rail-nav a {
  display: grid;
  min-height: 44px;
  padding: 9px 8px;
  place-items: center;
  border: 1px solid rgba(112, 229, 197, 0.16);
  border-radius: 15px;
  color: #738f95;
  background: rgba(3, 15, 21, 0.55);
  font-size: 11px;
  font-weight: 800;
  text-align: center;
  text-decoration: none;
  transition:
    color 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    transform 180ms ease;
}

.ofs-rail-nav a:hover,
.ofs-rail-nav a:focus-visible {
  color: var(--ofs-text);
  border-color: rgba(112, 229, 197, 0.5);
  background: rgba(16, 43, 52, 0.94);
  transform: translateX(3px);
}

.ofs-rail-nav a[aria-current="page"] {
  color: #031513;
  border-color: var(--ofs-mint);
  background: linear-gradient(135deg, var(--ofs-lime), var(--ofs-mint));
  box-shadow: 0 10px 30px rgba(112, 229, 197, 0.19);
}

.ofs-content {
  min-width: 0;
  padding: clamp(54px, 6vw, 105px) clamp(24px, 5vw, 88px) 90px;
}

.ofs-intro,
.ofs-selector-heading,
.ofs-card-grid,
.ofs-profile-region,
.ofs-notice {
  width: min(100%, 1540px);
  margin-inline: auto;
}

.ofs-eyebrow,
.ofs-kicker,
.ofs-profile-label,
.ofs-block-tag {
  margin: 0;
  color: var(--ofs-mint);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.ofs-intro h1 {
  max-width: 1060px;
  margin: 14px 0 34px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(52px, 6.7vw, 112px);
  font-weight: 400;
  line-height: 0.92;
  letter-spacing: -0.045em;
}

.ofs-intro h1 span {
  display: block;
  color: var(--ofs-mint);
}

.ofs-intro-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(340px, 0.8fr);
  gap: clamp(35px, 6vw, 110px);
  align-items: start;
}

.ofs-lead {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(25px, 2.35vw, 40px);
  line-height: 1.38;
}

.ofs-intro-copy {
  color: var(--ofs-muted);
  font-size: 17px;
  line-height: 1.8;
}

.ofs-intro-copy p {
  margin: 0 0 18px;
}

.ofs-mobile-intro {
  display: none;
}

.ofs-principles {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 32px;
}

.ofs-principles span {
  padding: 9px 16px;
  border: 1px solid rgba(112, 229, 197, 0.34);
  border-radius: 999px;
  color: #c4f6e7;
  background: rgba(5, 24, 30, 0.7);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.05em;
}

.ofs-selector-heading {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  align-items: end;
  margin-top: 66px;
  padding-top: 34px;
  border-top: 1px solid var(--ofs-line);
}

.ofs-selector-heading h2 {
  margin: 8px 0 0;
  font-size: clamp(27px, 3vw, 43px);
  line-height: 1.1;
}

.ofs-selector-heading > p {
  max-width: 390px;
  margin: 0;
  color: var(--ofs-muted);
  line-height: 1.6;
  text-align: right;
}

.ofs-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 26px;
}

.ofs-card {
  position: relative;
  isolation: isolate;
  min-height: 285px;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(112, 229, 197, 0.25);
  border-radius: 25px;
  color: var(--ofs-text);
  background: var(--ofs-surface);
  cursor: pointer;
  text-align: left;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.2);
  transition:
    transform 220ms ease,
    border-color 220ms ease,
    box-shadow 220ms ease;
}

.ofs-card:hover,
.ofs-card:focus-visible {
  z-index: 2;
  border-color: var(--ofs-mint);
  transform: translateY(-6px);
  box-shadow: 0 25px 55px rgba(0, 0, 0, 0.32);
}

.ofs-card:focus-visible {
  outline: 3px solid rgba(185, 239, 114, 0.9);
  outline-offset: 4px;
}

.ofs-card[aria-expanded="true"] {
  border-color: var(--ofs-lime);
  box-shadow:
    0 0 0 2px rgba(185, 239, 114, 0.2),
    0 25px 60px rgba(0, 0, 0, 0.34);
}

.ofs-card img {
  position: absolute;
  inset: 0;
  z-index: -3;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 500ms ease;
}

.ofs-card:hover img,
.ofs-card[aria-expanded="true"] img {
  transform: scale(1.045);
}

.ofs-card-shade {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(180deg, rgba(1, 10, 14, 0.08) 10%, rgba(1, 11, 15, 0.94) 88%),
    linear-gradient(120deg, rgba(2, 15, 20, 0.5), transparent 68%);
}

.ofs-card-value {
  position: absolute;
  top: 17px;
  left: 17px;
  padding: 8px 12px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: 999px;
  color: #051513;
  background: linear-gradient(135deg, var(--ofs-lime), var(--ofs-mint));
  font-size: 13px;
  font-weight: 900;
  box-shadow: 0 8px 24px rgba(3, 16, 20, 0.3);
}

.ofs-card-copy {
  position: absolute;
  right: 82px;
  bottom: 20px;
  left: 20px;
  display: grid;
  gap: 6px;
}

.ofs-card-copy strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(23px, 2vw, 31px);
  line-height: 1.05;
}

.ofs-card-copy small {
  color: #c6d6d7;
  font-size: 12px;
  line-height: 1.35;
}

.ofs-card-action {
  position: absolute;
  right: 17px;
  bottom: 17px;
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  color: #061712;
  background: var(--ofs-mint);
  font-size: 0;
  font-weight: 900;
}

.ofs-card-action::before {
  content: "+";
  font-size: 25px;
  line-height: 1;
}

.ofs-card[aria-expanded="true"] .ofs-card-action::before {
  content: "−";
}

.ofs-profile-region {
  margin-top: 32px;
}

.ofs-profile {
  padding: clamp(28px, 4.6vw, 70px);
  border: 1px solid rgba(112, 229, 197, 0.25);
  border-radius: 32px;
  background:
    linear-gradient(145deg, rgba(20, 57, 68, 0.94), rgba(7, 24, 31, 0.98)),
    var(--ofs-surface);
  box-shadow: 0 34px 80px rgba(0, 0, 0, 0.28);
  animation: ofsReveal 300ms ease both;
}

.ofs-profile[hidden] {
  display: none;
}

@keyframes ofsReveal {
  from {
    opacity: 0;
    transform: translateY(15px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ofs-back {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  margin: 0 0 28px;
  padding: 10px 16px;
  border: 1px solid rgba(112, 229, 197, 0.38);
  border-radius: 999px;
  color: #d5f9ef;
  background: rgba(3, 17, 22, 0.56);
  font-weight: 800;
  cursor: pointer;
}

.ofs-back:hover,
.ofs-back:focus-visible {
  color: #051512;
  background: var(--ofs-mint);
}

.ofs-profile-top h2 {
  max-width: 1050px;
  margin: 12px 0 22px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(38px, 5vw, 76px);
  font-weight: 400;
  line-height: 0.98;
  letter-spacing: -0.035em;
}

.ofs-profile-top h2 span {
  display: block;
  color: var(--ofs-lime);
}

.ofs-profile-lead {
  max-width: 1160px;
  margin: 0;
  color: #dce8e6;
  font-size: clamp(18px, 1.55vw, 24px);
  line-height: 1.65;
}

.ofs-stat-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 36px;
}

.ofs-stat-row > div {
  min-height: 132px;
  padding: 21px;
  border: 1px solid rgba(112, 229, 197, 0.23);
  border-radius: 20px;
  background: rgba(3, 19, 25, 0.62);
}

.ofs-stat-row strong {
  display: block;
  color: var(--ofs-mint);
  font-size: clamp(25px, 2.5vw, 39px);
  line-height: 1;
}

.ofs-stat-row span {
  display: block;
  margin-top: 12px;
  color: var(--ofs-muted);
  font-size: 13px;
  line-height: 1.45;
}

.ofs-block-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 28px;
}

.ofs-info-block {
  padding: clamp(23px, 3vw, 38px);
  border: 1px solid rgba(112, 229, 197, 0.18);
  border-radius: 23px;
  background:
    linear-gradient(150deg, rgba(15, 50, 59, 0.78), rgba(3, 18, 24, 0.85));
}

.ofs-info-block--wide {
  grid-column: 1 / -1;
}

.ofs-info-block h3 {
  margin: 11px 0 15px;
  color: var(--ofs-text);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(24px, 2.3vw, 35px);
  font-weight: 400;
  line-height: 1.18;
}

.ofs-info-block p {
  margin: 0 0 13px;
  color: var(--ofs-muted);
  font-size: 16px;
  line-height: 1.75;
}

.ofs-info-block p:last-child {
  margin-bottom: 0;
}

.ofs-explainer {
  display: grid;
  grid-template-columns: minmax(140px, 0.25fr) minmax(0, 1fr);
  gap: 24px;
  margin-top: 18px;
  padding: 24px 28px;
  border: 1px solid rgba(185, 239, 114, 0.28);
  border-radius: 22px;
  background: rgba(185, 239, 114, 0.08);
}

.ofs-explainer strong {
  color: var(--ofs-lime);
  font-size: 15px;
}

.ofs-explainer p {
  margin: 0;
  color: #d7e6e4;
  line-height: 1.7;
}

.ofs-notice {
  display: grid;
  grid-template-columns: 0.4fr 1fr;
  gap: 35px;
  align-items: center;
  margin-top: 32px;
  padding: 26px 30px;
  border: 1px solid rgba(67, 200, 219, 0.22);
  border-radius: 24px;
  background: rgba(3, 17, 23, 0.7);
}

.ofs-notice > div {
  display: flex;
  gap: 15px;
  align-items: center;
}

.ofs-notice span {
  display: grid;
  flex: 0 0 52px;
  width: 52px;
  height: 52px;
  place-items: center;
  border: 1px solid var(--ofs-cyan);
  border-radius: 50%;
  color: var(--ofs-cyan);
  font-weight: 900;
}

.ofs-notice strong {
  line-height: 1.45;
}

.ofs-notice p {
  margin: 0;
  color: var(--ofs-muted);
  font-size: 13px;
  line-height: 1.65;
}
/* OFFERS END */

/* OFFERS RESPONSIVE START */
@media (max-width: 1240px) {
  .ofs-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ofs-stat-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .ofs-shell {
    display: block;
  }

  .ofs-rail {
    display: none;
  }

  .ofs-content {
    padding: 34px 18px calc(var(--mobile-dock, 82px) + 32px);
  }

  .ofs-intro h1 {
    margin-bottom: 22px;
    font-size: clamp(44px, 14vw, 68px);
  }

  .ofs-intro-layout {
    display: block;
  }

  .ofs-lead {
    font-size: 22px;
    line-height: 1.48;
  }

  .ofs-intro-copy {
    display: none;
  }

  .ofs-mobile-intro {
    display: block;
    margin: 18px 0 0;
    color: var(--ofs-muted);
    font-size: 15px;
    line-height: 1.6;
  }

  .ofs-principles {
    display: flex;
    flex-wrap: nowrap;
    margin-inline: -18px;
    padding: 0 18px 8px;
    overflow-x: auto;
    scrollbar-width: none;
  }

  .ofs-principles::-webkit-scrollbar {
    display: none;
  }

  .ofs-principles span {
    flex: 0 0 auto;
  }

  .ofs-selector-heading {
    display: block;
    margin-top: 38px;
    padding-top: 28px;
  }

  .ofs-selector-heading > p {
    margin-top: 9px;
    text-align: left;
  }

  .ofs-card-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .ofs-card {
    min-height: 225px;
    border-radius: 21px;
  }

  .ofs-profile-region {
    display: contents;
  }

  .ofs-profile {
    grid-column: 1 / -1;
    margin: 2px 0 12px;
    padding: 25px 18px;
    border-radius: 23px;
  }

  .ofs-profile-top h2 {
    font-size: clamp(36px, 11vw, 52px);
  }

  .ofs-profile-lead {
    font-size: 16px;
    line-height: 1.62;
  }

  .ofs-stat-row,
  .ofs-block-grid {
    grid-template-columns: 1fr;
  }

  .ofs-stat-row > div {
    min-height: 0;
  }

  .ofs-info-block--wide {
    grid-column: auto;
  }

  .ofs-explainer {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .ofs-notice {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 22px 19px;
  }
}

@media (max-width: 520px) {
  .ofs-content {
    padding-inline: 14px;
  }

  .ofs-principles {
    margin-inline: -14px;
    padding-inline: 14px;
  }

  .ofs-card {
    min-height: 205px;
  }

  .ofs-card-copy {
    right: 69px;
    bottom: 16px;
    left: 16px;
  }

  .ofs-card-copy strong {
    font-size: 24px;
  }

  .ofs-card-value {
    top: 14px;
    left: 14px;
  }

  .ofs-card-action {
    right: 14px;
    bottom: 14px;
    width: 45px;
    height: 45px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ofs-card,
  .ofs-card img,
  .ofs-rail-nav a,
  .ofs-profile {
    animation: none;
    transition: none;
  }
}
/* OFFERS RESPONSIVE END */
/* REWARDS START */
.rwd-section {
  --rwd-bg: #190f27;
  --rwd-bg-deep: #0d0917;
  --rwd-panel: #241533;
  --rwd-panel-light: #302043;
  --rwd-text: #fbf7ef;
  --rwd-muted: #c9bed2;
  --rwd-silver: #d7dae5;
  --rwd-purple: #a98cff;
  --rwd-blue: #58b9ff;
  --rwd-green: #6be2b1;
  --rwd-coral: #ff9278;
  --rwd-gold: #f5cf76;
  --rwd-line: rgba(215, 218, 229, 0.18);

  min-height: 100vh;
  color: var(--rwd-text);
  background:
    radial-gradient(circle at 13% 8%, rgba(169, 140, 255, 0.2), transparent 28%),
    radial-gradient(circle at 88% 31%, rgba(88, 185, 255, 0.11), transparent 31%),
    linear-gradient(150deg, #130b20 0%, #261535 49%, #100b1b 100%);
}

.rwd-section[hidden] {
  display: none;
}

.rwd-section button,
.rwd-section a {
  font: inherit;
}

.rwd-shell {
  display: grid;
  grid-template-columns: 126px minmax(0, 1fr);
  max-width: 1880px;
  min-height: 100vh;
  margin: 0 auto;
}

.rwd-rail {
  position: sticky;
  top: 50%;
  align-self: start;
  z-index: 7;
  display: flex;
  flex-direction: column;
  gap: 18px;
  width: 112px;
  max-height: calc(100vh - 40px);
  padding: 18px 10px;
  transform: translateY(-50%);
}

.rwd-rail-label {
  color: #a99bb7;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.2em;
  text-align: center;
  text-transform: uppercase;
}

.rwd-rail-nav {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.rwd-rail-nav a {
  display: grid;
  min-height: 44px;
  padding: 9px 8px;
  place-items: center;
  border: 1px solid rgba(215, 218, 229, 0.15);
  border-radius: 15px;
  color: #81778c;
  background: rgba(10, 7, 18, 0.58);
  font-size: 11px;
  font-weight: 800;
  text-align: center;
  text-decoration: none;
  transition:
    color 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    transform 180ms ease;
}

.rwd-rail-nav a:hover,
.rwd-rail-nav a:focus-visible {
  color: var(--rwd-text);
  border-color: rgba(169, 140, 255, 0.56);
  background: rgba(45, 29, 62, 0.94);
  transform: translateX(3px);
}

.rwd-rail-nav a[aria-current="page"] {
  color: #130b20;
  border-color: #e5dbff;
  background: linear-gradient(135deg, #e5dbff, var(--rwd-purple));
  box-shadow: 0 12px 30px rgba(169, 140, 255, 0.24);
}

.rwd-content {
  min-width: 0;
  padding: clamp(52px, 6vw, 104px) clamp(24px, 5vw, 88px) 90px;
}

.rwd-intro,
.rwd-steps,
.rwd-selector-heading,
.rwd-card-grid,
.rwd-profile-region,
.rwd-footnote {
  width: min(100%, 1540px);
  margin-inline: auto;
}

.rwd-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(340px, 0.55fr);
  gap: clamp(40px, 7vw, 120px);
  align-items: center;
}

.rwd-eyebrow,
.rwd-kicker,
.rwd-profile-label {
  margin: 0;
  color: #c6b4ff;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.rwd-intro h1 {
  margin: 14px 0 27px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(56px, 7vw, 116px);
  font-weight: 400;
  line-height: 0.88;
  letter-spacing: -0.05em;
}

.rwd-intro h1 span {
  display: block;
  color: var(--rwd-purple);
}

.rwd-lead {
  max-width: 980px;
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(23px, 2vw, 35px);
  line-height: 1.45;
}

.rwd-intro-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  margin-top: 30px;
  color: var(--rwd-muted);
  line-height: 1.75;
}

.rwd-intro-columns p {
  margin: 0;
}

.rwd-mobile-summary {
  display: none;
}

.rwd-hero-card,
.rwd-choice {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.rwd-hero-card {
  min-height: 310px;
  padding: 30px;
  border: 1px solid rgba(229, 219, 255, 0.45);
  border-radius: 30px;
  color: #f9f6ff;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.16), transparent 42%),
    linear-gradient(145deg, #755bd6, #31205c 58%, #181126);
  box-shadow:
    0 34px 75px rgba(4, 2, 10, 0.44),
    inset 0 1px 0 rgba(255, 255, 255, 0.24);
  transform: rotate(3deg);
}

.rwd-hero-card::after,
.rwd-choice::after {
  position: absolute;
  right: -55px;
  bottom: -68px;
  z-index: -1;
  width: 210px;
  height: 210px;
  border: 1px solid rgba(255, 255, 255, 0.17);
  border-radius: 50%;
  content: "";
}

.rwd-hero-card-glow {
  position: absolute;
  top: -90px;
  right: -55px;
  z-index: -1;
  width: 250px;
  height: 250px;
  border-radius: 50%;
  background: rgba(88, 185, 255, 0.27);
  filter: blur(15px);
}

.rwd-card-brand {
  display: flex;
  gap: 14px;
  align-items: center;
}

.rwd-card-mark {
  display: grid;
  width: 47px;
  height: 47px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 13px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 27px;
}

.rwd-card-brand strong,
.rwd-card-brand small {
  display: block;
}

.rwd-card-brand strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 21px;
}

.rwd-card-brand small {
  margin-top: 3px;
  color: #d9d1e9;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.rwd-card-chip,
.rwd-choice-chip {
  display: block;
  width: 51px;
  height: 39px;
  border: 1px solid rgba(255, 255, 255, 0.45);
  border-radius: 10px;
  background:
    linear-gradient(90deg, transparent 31%, rgba(255, 255, 255, 0.28) 32% 34%, transparent 35%),
    linear-gradient(0deg, transparent 47%, rgba(255, 255, 255, 0.28) 48% 51%, transparent 52%),
    linear-gradient(135deg, #c7cad7, #747990);
}

.rwd-card-chip {
  margin-top: 50px;
}

.rwd-hero-card > p {
  margin: 20px 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 30px;
}

.rwd-card-footer {
  position: absolute;
  right: 28px;
  bottom: 25px;
  left: 28px;
  display: flex;
  justify-content: space-between;
  color: #d7cee8;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.rwd-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 62px;
  border: 1px solid var(--rwd-line);
  border-radius: 24px;
  overflow: hidden;
  background: rgba(10, 7, 17, 0.36);
}

.rwd-steps > div {
  min-height: 120px;
  padding: 24px;
  border-right: 1px solid var(--rwd-line);
}

.rwd-steps > div:last-child {
  border-right: 0;
}

.rwd-steps span {
  color: var(--rwd-purple);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.rwd-steps p {
  margin: 11px 0 0;
  color: var(--rwd-muted);
  line-height: 1.55;
}

.rwd-selector-heading {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  align-items: end;
  margin-top: 65px;
}

.rwd-selector-heading h2 {
  margin: 8px 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(32px, 3.3vw, 52px);
  font-weight: 400;
}

.rwd-selector-heading > p {
  max-width: 390px;
  margin: 0;
  color: var(--rwd-muted);
  line-height: 1.6;
  text-align: right;
}

.rwd-card-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin-top: 27px;
}

.rwd-choice {
  min-height: 350px;
  padding: 25px;
  border: 1px solid rgba(255, 255, 255, 0.23);
  border-radius: 27px;
  color: #fff;
  cursor: pointer;
  text-align: left;
  box-shadow: 0 24px 45px rgba(4, 2, 9, 0.28);
  transition:
    transform 220ms ease,
    box-shadow 220ms ease,
    border-color 220ms ease;
}

.rwd-choice--join {
  background:
    radial-gradient(circle at 100% 0%, rgba(255, 255, 255, 0.18), transparent 32%),
    linear-gradient(145deg, #2e8f72, #165340 68%, #0d3328);
}

.rwd-choice--earn {
  background:
    radial-gradient(circle at 100% 0%, rgba(255, 255, 255, 0.18), transparent 32%),
    linear-gradient(145deg, #277fb5, #174f7f 68%, #102e51);
}

.rwd-choice--redeem {
  background:
    radial-gradient(circle at 100% 0%, rgba(255, 255, 255, 0.18), transparent 32%),
    linear-gradient(145deg, #d56d5e, #913f54 68%, #51243b);
}

.rwd-choice--experience {
  background:
    radial-gradient(circle at 100% 0%, rgba(255, 255, 255, 0.18), transparent 32%),
    linear-gradient(145deg, #8e6bd3, #5b3b91 68%, #35235e);
}

.rwd-choice:hover,
.rwd-choice:focus-visible {
  z-index: 2;
  border-color: rgba(255, 255, 255, 0.72);
  transform: translateY(-7px) rotate(-1deg);
  box-shadow: 0 32px 60px rgba(4, 2, 9, 0.42);
}

.rwd-choice:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 4px;
}

.rwd-choice[aria-expanded="true"] {
  border-color: #fff;
  box-shadow:
    0 0 0 3px rgba(255, 255, 255, 0.17),
    0 32px 65px rgba(4, 2, 9, 0.43);
  transform: translateY(-6px);
}

.rwd-choice-top {
  display: flex;
  justify-content: space-between;
  gap: 15px;
  align-items: start;
}

.rwd-choice-brand {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 17px;
}

.rwd-choice-stage {
  padding: 7px 10px;
  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 999px;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.rwd-choice-chip {
  margin-top: 38px;
}

.rwd-choice-title {
  display: block;
  margin-top: 24px;
}

.rwd-choice-title strong,
.rwd-choice-title small {
  display: block;
}

.rwd-choice-title strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 28px;
  font-weight: 400;
  line-height: 1.05;
}

.rwd-choice-title small {
  margin-top: 7px;
  color: rgba(255, 255, 255, 0.76);
  font-size: 12px;
}

.rwd-choice-task {
  display: block;
  margin-top: 19px;
  color: rgba(255, 255, 255, 0.84);
  font-size: 13px;
  line-height: 1.55;
}

.rwd-choice-open {
  position: absolute;
  right: 24px;
  bottom: 22px;
  left: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 15px;
  border-top: 1px solid rgba(255, 255, 255, 0.22);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.rwd-choice-open::after {
  content: "+";
  font-size: 22px;
}

.rwd-choice[aria-expanded="true"] .rwd-choice-open::after {
  content: "−";
}

.rwd-profile-region {
  margin-top: 34px;
}

.rwd-profile {
  --rwd-profile-accent: var(--rwd-purple);

  padding: clamp(28px, 4.5vw, 70px);
  border: 1px solid rgba(215, 218, 229, 0.22);
  border-radius: 34px;
  background:
    radial-gradient(circle at 95% 0%, color-mix(in srgb, var(--rwd-profile-accent) 17%, transparent), transparent 30%),
    linear-gradient(145deg, rgba(49, 31, 67, 0.97), rgba(17, 10, 27, 0.98));
  box-shadow: 0 38px 90px rgba(4, 2, 9, 0.38);
  animation: rwdReveal 300ms ease both;
}

.rwd-profile[hidden] {
  display: none;
}

.rwd-profile--join {
  --rwd-profile-accent: var(--rwd-green);
}

.rwd-profile--earn {
  --rwd-profile-accent: var(--rwd-blue);
}

.rwd-profile--redeem {
  --rwd-profile-accent: var(--rwd-coral);
}

.rwd-profile--experience {
  --rwd-profile-accent: var(--rwd-purple);
}

@keyframes rwdReveal {
  from {
    opacity: 0;
    transform: translateY(16px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.rwd-close {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  margin-bottom: 27px;
  padding: 10px 16px;
  border: 1px solid rgba(215, 218, 229, 0.3);
  border-radius: 999px;
  color: var(--rwd-text);
  background: rgba(9, 5, 15, 0.43);
  font-weight: 800;
  cursor: pointer;
}

.rwd-close:hover,
.rwd-close:focus-visible {
  color: #100918;
  background: var(--rwd-profile-accent);
}

.rwd-profile-label {
  color: var(--rwd-profile-accent);
}

.rwd-profile-header h2 {
  max-width: 1100px;
  margin: 12px 0 21px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(39px, 5vw, 77px);
  font-weight: 400;
  line-height: 0.97;
  letter-spacing: -0.04em;
}

.rwd-profile-header h2 span {
  display: block;
  color: var(--rwd-profile-accent);
}

.rwd-profile-lead {
  max-width: 1150px;
  margin: 0;
  color: #e2dbe7;
  font-size: clamp(18px, 1.55vw, 24px);
  line-height: 1.65;
}

.rwd-highlight-row,
.rwd-conversion {
  display: grid;
  gap: 12px;
  margin-top: 36px;
}

.rwd-highlight-row {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.rwd-conversion {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.rwd-highlight-row > div,
.rwd-conversion > div {
  padding: 21px;
  border: 1px solid rgba(215, 218, 229, 0.16);
  border-radius: 20px;
  background: rgba(9, 5, 16, 0.47);
}

.rwd-highlight-row span,
.rwd-conversion span,
.rwd-conversion small {
  display: block;
  color: var(--rwd-muted);
  font-size: 12px;
}

.rwd-highlight-row strong,
.rwd-conversion strong {
  display: block;
  margin-top: 10px;
  color: var(--rwd-profile-accent);
  font-size: clamp(24px, 2.3vw, 37px);
  line-height: 1;
}

.rwd-conversion small {
  margin-top: 8px;
}

.rwd-block-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px;
  margin-top: 28px;
}

.rwd-info {
  display: grid;
  grid-template-columns: 53px minmax(0, 1fr);
  gap: 20px;
  padding: clamp(23px, 3vw, 37px);
  border: 1px solid rgba(215, 218, 229, 0.14);
  border-radius: 23px;
  background: rgba(10, 6, 17, 0.4);
}

.rwd-info--wide {
  grid-column: 1 / -1;
}

.rwd-info-number {
  margin: 0;
  color: var(--rwd-profile-accent);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 30px;
}

.rwd-info h3 {
  margin: 0 0 14px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(24px, 2.2vw, 34px);
  font-weight: 400;
}

.rwd-info div > p {
  margin: 0 0 13px;
  color: var(--rwd-muted);
  font-size: 16px;
  line-height: 1.75;
}

.rwd-info div > p:last-child {
  margin-bottom: 0;
}

.rwd-tip {
  display: grid;
  grid-template-columns: 0.35fr 1fr;
  gap: 26px;
  margin-top: 18px;
  padding: 27px;
  border: 1px solid color-mix(in srgb, var(--rwd-profile-accent) 35%, transparent);
  border-radius: 23px;
  background: color-mix(in srgb, var(--rwd-profile-accent) 8%, transparent);
}

.rwd-tip > span {
  color: var(--rwd-profile-accent);
  font-weight: 900;
}

.rwd-tip ul {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px 30px;
  margin: 0;
  padding-left: 20px;
  color: #e2dce7;
  line-height: 1.55;
}

.rwd-comparison {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.rwd-comparison > div {
  padding: 23px;
  border-radius: 20px;
  background: linear-gradient(
    145deg,
    color-mix(in srgb, var(--rwd-blue) 18%, #151020),
    #120b1c
  );
}

.rwd-comparison span,
.rwd-comparison strong {
  display: block;
}

.rwd-comparison span {
  color: var(--rwd-blue);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.rwd-comparison strong {
  margin-top: 13px;
  font-size: 24px;
}

.rwd-comparison p {
  margin: 8px 0 0;
  color: var(--rwd-muted);
  font-size: 13px;
}

.rwd-value-table {
  margin-top: 18px;
  overflow: hidden;
  border: 1px solid rgba(215, 218, 229, 0.16);
  border-radius: 22px;
}

.rwd-value-table > div {
  display: grid;
  grid-template-columns: 0.55fr 1fr 0.8fr;
}

.rwd-value-table > div > * {
  padding: 17px 20px;
  border-right: 1px solid rgba(215, 218, 229, 0.12);
}

.rwd-value-table > div > *:last-child {
  border-right: 0;
}

.rwd-value-table > div:not(:last-child) {
  border-bottom: 1px solid rgba(215, 218, 229, 0.12);
}

.rwd-value-heading {
  color: var(--rwd-coral);
  background: rgba(255, 146, 120, 0.09);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.rwd-value-table > div:not(.rwd-value-heading) {
  color: var(--rwd-muted);
  font-size: 14px;
  line-height: 1.45;
}

.rwd-value-table strong {
  color: var(--rwd-text);
}

.rwd-perk-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 15px;
  margin-top: 32px;
}

.rwd-perk-grid section {
  position: relative;
  min-height: 275px;
  padding: 31px 27px 25px;
  overflow: hidden;
  border: 1px solid rgba(215, 218, 229, 0.15);
  border-radius: 23px;
  background: rgba(10, 6, 17, 0.42);
}

.rwd-perk-accent {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 5px;
  background: var(--rwd-purple);
}

.rwd-perk-grid section:nth-child(2) .rwd-perk-accent {
  background: var(--rwd-coral);
}

.rwd-perk-grid section:nth-child(3) .rwd-perk-accent {
  background: var(--rwd-green);
}

.rwd-perk-grid section:nth-child(4) .rwd-perk-accent {
  background: var(--rwd-blue);
}

.rwd-perk-grid section:nth-child(5) .rwd-perk-accent {
  background: var(--rwd-gold);
}

.rwd-perk-grid section:nth-child(6) .rwd-perk-accent {
  background: #e690ff;
}

.rwd-perk-grid section > p:first-of-type {
  margin: 0;
  color: var(--rwd-profile-accent);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.rwd-perk-grid h3 {
  margin: 13px 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 25px;
  font-weight: 400;
  line-height: 1.18;
}

.rwd-perk-grid section > p:last-child {
  margin: 0;
  color: var(--rwd-muted);
  line-height: 1.7;
}

.rwd-footnote {
  display: grid;
  grid-template-columns: 60px minmax(0, 1fr);
  gap: 20px;
  margin-top: 31px;
  padding: 25px 28px;
  border: 1px solid var(--rwd-line);
  border-radius: 23px;
  background: rgba(9, 5, 15, 0.48);
}

.rwd-footnote-age {
  display: grid;
  width: 56px;
  height: 56px;
  place-items: center;
  border: 1px solid var(--rwd-purple);
  border-radius: 50%;
  color: var(--rwd-purple);
  font-weight: 900;
}

.rwd-footnote strong {
  display: block;
  margin-top: 2px;
}

.rwd-footnote p {
  margin: 8px 0 0;
  color: var(--rwd-muted);
  font-size: 13px;
  line-height: 1.65;
}
/* REWARDS END */

/* REWARDS RESPONSIVE START */
@media (max-width: 1280px) {
  .rwd-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .rwd-choice {
    min-height: 325px;
  }

  .rwd-conversion {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .rwd-perk-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .rwd-shell {
    display: block;
  }

  .rwd-rail {
    display: none;
  }

  .rwd-content {
    padding: 34px 15px calc(var(--mobile-dock, 82px) + 32px);
  }

  .rwd-intro {
    display: block;
  }

  .rwd-intro h1 {
    font-size: clamp(49px, 15vw, 69px);
  }

  .rwd-lead {
    font-size: 21px;
    line-height: 1.5;
  }

  .rwd-intro-columns {
    display: none;
  }

  .rwd-mobile-summary {
    display: block;
    margin: 17px 0 0;
    color: var(--rwd-muted);
    line-height: 1.6;
  }

  .rwd-hero-card {
    display: none;
  }

  .rwd-steps {
    display: flex;
    margin-inline: -15px;
    margin-top: 31px;
    padding: 0 15px 8px;
    overflow-x: auto;
    border: 0;
    border-radius: 0;
    background: transparent;
    scrollbar-width: none;
    scroll-snap-type: x mandatory;
  }

  .rwd-steps::-webkit-scrollbar {
    display: none;
  }

  .rwd-steps > div {
    flex: 0 0 195px;
    min-height: 110px;
    margin-right: 10px;
    border: 1px solid var(--rwd-line);
    border-radius: 18px;
    background: rgba(10, 7, 17, 0.47);
    scroll-snap-align: start;
  }

  .rwd-selector-heading {
    display: block;
    margin-top: 40px;
  }

  .rwd-selector-heading > p {
    margin-top: 8px;
    text-align: left;
  }

  .rwd-card-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .rwd-choice {
    min-height: 292px;
  }

  .rwd-profile-region {
    display: contents;
  }

  .rwd-profile {
    grid-column: 1 / -1;
    margin: 2px 0 12px;
    padding: 25px 17px;
    border-radius: 24px;
  }

  .rwd-profile-header h2 {
    font-size: clamp(37px, 11.5vw, 53px);
  }

  .rwd-profile-lead {
    font-size: 16px;
    line-height: 1.63;
  }

  .rwd-highlight-row,
  .rwd-conversion,
  .rwd-block-grid,
  .rwd-perk-grid,
  .rwd-comparison {
    grid-template-columns: 1fr;
  }

  .rwd-info--wide {
    grid-column: auto;
  }

  .rwd-info {
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 13px;
    padding: 22px 17px;
  }

  .rwd-info-number {
    font-size: 24px;
  }

  .rwd-tip {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .rwd-tip ul {
    grid-template-columns: 1fr;
  }

  .rwd-value-table > div {
    grid-template-columns: 1fr;
    padding: 15px 17px;
  }

  .rwd-value-table > div > * {
    padding: 4px 0;
    border-right: 0;
  }

  .rwd-value-heading {
    display: none !important;
  }

  .rwd-perk-grid section {
    min-height: 0;
  }
}

@media (max-width: 520px) {
  .rwd-choice {
    min-height: 275px;
    padding: 22px;
  }

  .rwd-choice-chip {
    margin-top: 26px;
  }

  .rwd-choice-title strong {
    font-size: 27px;
  }

  .rwd-footnote {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rwd-choice,
  .rwd-rail-nav a,
  .rwd-profile {
    animation: none;
    transition: none;
  }
}
/* REWARDS RESPONSIVE END */
/* DINING START */
.dng-section {
  --dng-cream: #f4ead8;
  --dng-paper: #fff8ec;
  --dng-wine: #542333;
  --dng-wine-dark: #2b111b;
  --dng-rust: #b85436;
  --dng-gold: #d59a43;
  --dng-ink: #271b18;
  --dng-muted: #715f58;
  --dng-line: rgba(84, 35, 51, 0.18);

  min-height: 100vh;
  color: var(--dng-ink);
  background:
    radial-gradient(circle at 88% 8%, rgba(213, 154, 67, 0.22), transparent 28%),
    linear-gradient(135deg, #f8f0e2, #ead8bf);
}

.dng-section[hidden] {
  display: none;
}

.dng-section button,
.dng-section a {
  font: inherit;
}

.dng-shell {
  display: grid;
  grid-template-columns: 126px minmax(0, 1fr);
  max-width: 1880px;
  min-height: 100vh;
  margin: 0 auto;
}

.dng-rail {
  position: sticky;
  top: 50%;
  align-self: start;
  z-index: 6;
  width: 112px;
  padding: 18px 10px;
  transform: translateY(-50%);
}

.dng-rail-label {
  display: block;
  margin-bottom: 16px;
  color: #9d7e73;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.2em;
  text-align: center;
  text-transform: uppercase;
}

.dng-rail-nav {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.dng-rail-nav a {
  display: grid;
  min-height: 44px;
  padding: 9px;
  place-items: center;
  border: 1px solid rgba(84, 35, 51, 0.17);
  border-radius: 15px;
  color: #a38d84;
  background: rgba(255, 248, 236, 0.52);
  font-size: 11px;
  font-weight: 800;
  text-decoration: none;
  transition: 180ms ease;
}

.dng-rail-nav a:hover,
.dng-rail-nav a:focus-visible {
  color: var(--dng-wine);
  border-color: var(--dng-wine);
  transform: translateX(3px);
}

.dng-rail-nav a[aria-current="page"] {
  color: #fff7ea;
  border-color: var(--dng-wine);
  background: var(--dng-wine);
  box-shadow: 0 12px 28px rgba(84, 35, 51, 0.24);
}

.dng-content {
  min-width: 0;
  padding: clamp(54px, 6vw, 105px) clamp(24px, 5vw, 88px) 90px;
}

.dng-intro,
.dng-mood,
.dng-selector-heading,
.dng-card-grid,
.dng-profile-region,
.dng-notice {
  width: min(100%, 1540px);
  margin-inline: auto;
}

.dng-eyebrow,
.dng-kicker,
.dng-profile-label {
  margin: 0;
  color: var(--dng-rust);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.dng-intro h1 {
  margin: 14px 0 34px;
  color: var(--dng-wine);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(56px, 7vw, 116px);
  font-weight: 400;
  line-height: 0.9;
  letter-spacing: -0.05em;
}

.dng-intro h1 span {
  display: block;
  color: var(--dng-rust);
}

.dng-intro-layout {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: clamp(35px, 7vw, 110px);
}

.dng-lead {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(25px, 2.3vw, 39px);
  line-height: 1.42;
}

.dng-intro-copy {
  color: var(--dng-muted);
  font-size: 17px;
  line-height: 1.8;
}

.dng-intro-copy p {
  margin: 0 0 18px;
}

.dng-mobile-intro {
  display: none;
}

.dng-mood {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  align-items: center;
  margin-top: 50px;
  padding: 27px 30px;
  border: 1px solid var(--dng-line);
  border-radius: 24px;
  background: rgba(255, 248, 236, 0.6);
}

.dng-mood blockquote {
  margin: 0;
  color: var(--dng-wine);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(21px, 2.1vw, 32px);
}

.dng-mood > div {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  justify-content: flex-end;
}

.dng-mood span {
  padding: 8px 13px;
  border: 1px solid rgba(84, 35, 51, 0.25);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}

.dng-selector-heading {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  align-items: end;
  margin-top: 62px;
}

.dng-selector-heading h2 {
  margin: 8px 0 0;
  color: var(--dng-wine);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(33px, 3.5vw, 54px);
  font-weight: 400;
}

.dng-selector-heading > p {
  max-width: 390px;
  margin: 0;
  color: var(--dng-muted);
  line-height: 1.6;
  text-align: right;
}

.dng-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 27px;
}

.dng-card {
  position: relative;
  isolation: isolate;
  min-height: 310px;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(84, 35, 51, 0.18);
  border-radius: 25px;
  color: #fff;
  background: var(--dng-wine);
  cursor: pointer;
  text-align: left;
  box-shadow: 0 18px 38px rgba(69, 36, 25, 0.14);
  transition: 220ms ease;
}

.dng-card:hover,
.dng-card:focus-visible,
.dng-card[aria-expanded="true"] {
  border-color: var(--dng-gold);
  transform: translateY(-6px);
  box-shadow: 0 27px 52px rgba(69, 36, 25, 0.25);
}

.dng-card:focus-visible {
  outline: 3px solid var(--dng-rust);
  outline-offset: 4px;
}

.dng-card img {
  position: absolute;
  inset: 0;
  z-index: -3;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 450ms ease;
}

.dng-card:hover img,
.dng-card[aria-expanded="true"] img {
  transform: scale(1.045);
}

.dng-card-shade {
  position: absolute;
  inset: 0;
  z-index: -2;
  background: linear-gradient(180deg, transparent 22%, rgba(35, 12, 18, 0.94) 100%);
}

.dng-card-copy {
  position: absolute;
  right: 74px;
  bottom: 19px;
  left: 20px;
}

.dng-card-copy small,
.dng-card-copy strong,
.dng-card-copy span {
  display: block;
}

.dng-card-copy small {
  color: #f0c882;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.dng-card-copy strong {
  margin-top: 7px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 29px;
  font-weight: 400;
  line-height: 1.05;
}

.dng-card-copy span {
  margin-top: 6px;
  color: #eadfd8;
  font-size: 12px;
}

.dng-card-open {
  position: absolute;
  right: 16px;
  bottom: 16px;
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 50%;
  color: var(--dng-wine);
  background: var(--dng-gold);
  font-size: 0;
}

.dng-card-open::before {
  content: "+";
  font-size: 24px;
  font-weight: 700;
}

.dng-card[aria-expanded="true"] .dng-card-open::before {
  content: "−";
}

.dng-profile-region {
  margin-top: 32px;
}

.dng-profile {
  padding: clamp(28px, 4.5vw, 68px);
  border: 1px solid rgba(84, 35, 51, 0.18);
  border-radius: 32px;
  background:
    radial-gradient(circle at 95% 0%, rgba(184, 84, 54, 0.12), transparent 31%),
    var(--dng-paper);
  box-shadow: 0 32px 70px rgba(69, 36, 25, 0.16);
  animation: dngReveal 300ms ease both;
}

.dng-profile[hidden] {
  display: none;
}

@keyframes dngReveal {
  from {
    opacity: 0;
    transform: translateY(15px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.dng-close {
  display: inline-flex;
  gap: 9px;
  align-items: center;
  margin-bottom: 27px;
  padding: 10px 16px;
  border: 1px solid var(--dng-line);
  border-radius: 999px;
  color: var(--dng-wine);
  background: transparent;
  font-weight: 800;
  cursor: pointer;
}

.dng-close:hover,
.dng-close:focus-visible {
  color: #fff;
  background: var(--dng-wine);
}

.dng-profile h2 {
  margin: 10px 0 20px;
  color: var(--dng-wine);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(41px, 5vw, 75px);
  font-weight: 400;
  line-height: 1;
}

.dng-profile-lead {
  max-width: 1120px;
  margin: 0;
  color: #513e38;
  font-size: clamp(18px, 1.55vw, 24px);
  line-height: 1.7;
}

.dng-profile-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 15px;
  margin-top: 32px;
}

.dng-profile-grid section {
  padding: 27px;
  border: 1px solid var(--dng-line);
  border-radius: 22px;
  background: rgba(244, 234, 216, 0.5);
}

.dng-profile-grid h3 {
  margin: 0 0 14px;
  color: var(--dng-rust);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 26px;
  font-weight: 400;
}

.dng-profile-grid p {
  margin: 0;
  color: var(--dng-muted);
  line-height: 1.75;
}

.dng-notice {
  display: grid;
  grid-template-columns: 0.42fr 1fr;
  gap: 30px;
  margin-top: 30px;
  padding: 26px 30px;
  border-radius: 23px;
  color: #f8eddf;
  background: var(--dng-wine);
}

.dng-notice strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 21px;
  line-height: 1.4;
}

.dng-notice p {
  margin: 0;
  color: #d9c8c7;
  font-size: 13px;
  line-height: 1.7;
}
/* DINING END */

/* DINING RESPONSIVE START */
@media (max-width: 1200px) {
  .dng-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .dng-profile-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .dng-shell {
    display: block;
  }

  .dng-rail {
    display: none;
  }

  .dng-content {
    padding: 34px 15px calc(var(--mobile-dock, 82px) + 32px);
  }

  .dng-intro h1 {
    font-size: clamp(48px, 15vw, 68px);
  }

  .dng-intro-layout {
    display: block;
  }

  .dng-lead {
    font-size: 21px;
  }

  .dng-intro-copy {
    display: none;
  }

  .dng-mobile-intro {
    display: block;
    margin: 17px 0 0;
    color: var(--dng-muted);
    line-height: 1.6;
  }

  .dng-mood {
    display: block;
    margin-top: 30px;
    padding: 21px;
  }

  .dng-mood > div {
    justify-content: flex-start;
    margin-top: 17px;
  }

  .dng-selector-heading {
    display: block;
    margin-top: 39px;
  }

  .dng-selector-heading > p {
    margin-top: 8px;
    text-align: left;
  }

  .dng-card-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .dng-card {
    min-height: 245px;
  }

  .dng-profile-region {
    display: contents;
  }

  .dng-profile {
    grid-column: 1 / -1;
    margin: 2px 0 12px;
    padding: 25px 17px;
    border-radius: 24px;
  }

  .dng-profile h2 {
    font-size: clamp(38px, 11.5vw, 54px);
  }

  .dng-profile-lead {
    font-size: 16px;
  }

  .dng-notice {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 22px 19px;
  }
}

@media (max-width: 480px) {
  .dng-card {
    min-height: 225px;
  }

  .dng-card-copy strong {
    font-size: 25px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .dng-card,
  .dng-card img,
  .dng-rail-nav a,
  .dng-profile {
    animation: none;
    transition: none;
  }
}
/* DINING RESPONSIVE END */
/* STAY START */
.sty-section {
  --sty-ink: #102b2a;
  --sty-deep: #0a211f;
  --sty-forest: #174a44;
  --sty-teal: #247269;
  --sty-mint: #91c8bc;
  --sty-mist: #e7efeb;
  --sty-paper: #f5f3ea;
  --sty-copper: #c78b4d;
  --sty-line: rgba(16, 43, 42, 0.18);

  min-height: 100vh;
  color: var(--sty-ink);
  background:
    radial-gradient(
      circle at 84% 10%,
      rgba(145, 200, 188, 0.32),
      transparent 29rem
    ),
    linear-gradient(135deg, #eef3ef 0%, #dce9e4 48%, #f2eee3 100%);
}

.sty-section[hidden] {
  display: none;
}

.sty-shell {
  display: grid;
  grid-template-columns: 138px minmax(0, 1fr);
  max-width: 1920px;
  min-height: 100vh;
  margin: 0 auto;
}

.sty-rail {
  position: sticky;
  top: var(--header-height, 92px);
  align-self: start;
  height: calc(100vh - var(--header-height, 92px));
  padding: 40px 18px;
  border-right: 1px solid rgba(145, 200, 188, 0.18);
  background: var(--sty-deep);
}

.sty-rail-label {
  display: block;
  margin-bottom: 18px;
  color: var(--sty-mint);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.22em;
  text-align: center;
  text-transform: uppercase;
}

.sty-rail-nav {
  display: grid;
  gap: 8px;
}

.sty-rail-nav a {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 10px 8px;
  border: 1px solid rgba(145, 200, 188, 0.18);
  border-radius: 16px;
  color: rgba(231, 239, 235, 0.64);
  font-size: 12px;
  font-weight: 750;
  text-align: center;
  text-decoration: none;
  transition:
    color 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    transform 180ms ease;
}

.sty-rail-nav a:hover,
.sty-rail-nav a:focus-visible {
  color: #ffffff;
  border-color: var(--sty-mint);
  background: rgba(145, 200, 188, 0.12);
  transform: translateX(3px);
}

.sty-rail-nav a[aria-current="page"] {
  color: #ffffff;
  border-color: var(--sty-mint);
  background:
    linear-gradient(
      135deg,
      rgba(36, 114, 105, 0.98),
      rgba(23, 74, 68, 0.98)
    );
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.2);
}

.sty-rail-nav a[aria-disabled="true"] {
  opacity: 0.35;
  pointer-events: none;
}

.sty-content {
  min-width: 0;
  padding: clamp(48px, 6vw, 104px) clamp(24px, 5vw, 92px) 100px;
}

.sty-intro {
  display: grid;
  grid-template-columns: minmax(0, 0.94fr) minmax(420px, 0.72fr);
  gap: clamp(42px, 6vw, 96px);
  align-items: center;
  max-width: 1540px;
  margin: 0 auto;
}

.sty-eyebrow,
.sty-kicker,
.sty-profile-kicker,
.sty-card-label {
  margin: 0;
  color: var(--sty-teal);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.sty-intro h1 {
  max-width: 850px;
  margin: 16px 0 28px;
  color: var(--sty-ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(54px, 6.6vw, 112px);
  font-weight: 500;
  line-height: 0.9;
  letter-spacing: -0.055em;
}

.sty-intro h1 span {
  display: block;
  color: var(--sty-teal);
}

.sty-lead {
  max-width: 790px;
  margin: 0;
  color: var(--sty-ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(23px, 2vw, 36px);
  font-weight: 600;
  line-height: 1.36;
}

.sty-intro-text {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  margin-top: 34px;
}

.sty-intro-text p {
  margin: 0;
  color: rgba(16, 43, 42, 0.76);
  font-size: 16px;
  line-height: 1.85;
}

.sty-intro-visual {
  position: relative;
  min-height: 650px;
  margin: 0;
  overflow: hidden;
  border-radius: 42px 42px 42px 12px;
  box-shadow: 0 34px 70px rgba(10, 33, 31, 0.24);
}

.sty-intro-visual::after {
  position: absolute;
  inset: 0;
  content: "";
  background:
    linear-gradient(
      180deg,
      transparent 45%,
      rgba(7, 25, 23, 0.88) 100%
    );
}

.sty-intro-visual img {
  width: 100%;
  height: 100%;
  min-height: 650px;
  object-fit: cover;
}

.sty-intro-visual figcaption {
  position: absolute;
  z-index: 1;
  right: 34px;
  bottom: 34px;
  left: 34px;
  display: grid;
  gap: 7px;
  color: #ffffff;
}

.sty-intro-visual figcaption span {
  color: var(--sty-mint);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

.sty-intro-visual figcaption strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(24px, 2.2vw, 38px);
  font-weight: 500;
}

.sty-atmosphere {
  max-width: 1540px;
  margin: 90px auto 0;
  padding: clamp(34px, 5vw, 66px);
  border-radius: 36px;
  color: #ffffff;
  background:
    linear-gradient(
      135deg,
      var(--sty-deep),
      var(--sty-forest)
    );
  box-shadow: 0 24px 60px rgba(10, 33, 31, 0.18);
}

.sty-atmosphere-heading {
  display: flex;
  gap: 30px;
  align-items: end;
  justify-content: space-between;
  padding-bottom: 34px;
  border-bottom: 1px solid rgba(145, 200, 188, 0.22);
}

.sty-atmosphere-heading .sty-kicker {
  color: var(--sty-mint);
}

.sty-atmosphere-heading h2,
.sty-explore-heading h2,
.sty-planning-heading h2 {
  margin: 8px 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(34px, 4vw, 64px);
  font-weight: 500;
  line-height: 1.05;
}

.sty-atmosphere-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 42px;
  margin-top: 42px;
}

.sty-atmosphere-grid article {
  position: relative;
  padding-top: 24px;
}

.sty-accent-line {
  position: absolute;
  top: 0;
  left: 0;
  width: 54px;
  height: 3px;
  border-radius: 99px;
  background: var(--sty-mint);
}

.sty-atmosphere-grid h3 {
  margin: 0 0 14px;
  color: #ffffff;
  font-size: 21px;
}

.sty-atmosphere-grid p {
  margin: 0;
  color: rgba(255, 255, 255, 0.74);
  font-size: 15px;
  line-height: 1.75;
}

.sty-explore {
  max-width: 1540px;
  margin: 90px auto 0;
}

.sty-explore-heading {
  display: flex;
  gap: 40px;
  align-items: end;
  justify-content: space-between;
  margin-bottom: 32px;
}

.sty-explore-heading > p {
  max-width: 480px;
  margin: 0;
  color: rgba(16, 43, 42, 0.68);
  line-height: 1.7;
}

.sty-selector {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 15px;
}

.sty-selector-button {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  min-height: 104px;
  padding: 21px 24px;
  border: 1px solid rgba(36, 114, 105, 0.3);
  border-radius: 22px;
  color: var(--sty-ink);
  text-align: left;
  background: rgba(255, 255, 255, 0.56);
  box-shadow: 0 10px 26px rgba(10, 33, 31, 0.07);
  cursor: pointer;
  transition:
    color 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    transform 180ms ease,
    box-shadow 180ms ease;
}

.sty-selector-button-wide {
  grid-column: 1 / -1;
}

.sty-selector-button:hover,
.sty-selector-button:focus-visible {
  border-color: var(--sty-teal);
  background: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 18px 34px rgba(10, 33, 31, 0.12);
}

.sty-selector-button[aria-expanded="true"] {
  color: #ffffff;
  border-color: var(--sty-teal);
  background:
    linear-gradient(
      135deg,
      var(--sty-teal),
      var(--sty-forest)
    );
  box-shadow: 0 18px 38px rgba(23, 74, 68, 0.25);
}

.sty-selector-mark {
  width: 16px;
  height: 16px;
  border: 2px solid var(--sty-teal);
  border-radius: 50%;
  box-shadow: inset 0 0 0 4px transparent;
}

.sty-selector-button[aria-expanded="true"] .sty-selector-mark {
  border-color: var(--sty-mint);
  background: var(--sty-mint);
  box-shadow: inset 0 0 0 4px var(--sty-teal);
}

.sty-selector-button > span:nth-child(2) {
  display: grid;
  gap: 6px;
}

.sty-selector-button strong {
  font-size: 20px;
}

.sty-selector-button small {
  color: rgba(16, 43, 42, 0.64);
  font-size: 13px;
}

.sty-selector-button[aria-expanded="true"] small {
  color: rgba(255, 255, 255, 0.7);
}

.sty-selector-action {
  padding: 9px 13px;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.sty-profile-region {
  max-width: 1540px;
  margin: 24px auto 0;
}

.sty-profile {
  padding: clamp(32px, 5vw, 70px);
  border: 1px solid rgba(36, 114, 105, 0.26);
  border-radius: 34px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 24px 54px rgba(10, 33, 31, 0.12);
}

.sty-profile[hidden] {
  display: none;
}

.sty-profile-header {
  display: flex;
  gap: 30px;
  align-items: start;
  justify-content: space-between;
  padding-bottom: 30px;
  border-bottom: 1px solid var(--sty-line);
}

.sty-profile-header h2 {
  max-width: 1000px;
  margin: 9px 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(38px, 4.8vw, 76px);
  font-weight: 500;
  line-height: 1.02;
}

.sty-profile-close {
  flex: none;
  padding: 12px 18px;
  border: 1px solid var(--sty-teal);
  border-radius: 999px;
  color: var(--sty-teal);
  font-weight: 800;
  background: transparent;
  cursor: pointer;
}

.sty-profile-close:hover,
.sty-profile-close:focus-visible {
  color: #ffffff;
  background: var(--sty-teal);
}

.sty-profile-lead {
  max-width: 1160px;
  margin: 34px 0 0;
  color: var(--sty-ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(21px, 2vw, 31px);
  line-height: 1.5;
}

.sty-text-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-top: 38px;
}

.sty-text-card {
  padding: 28px;
  border: 1px solid rgba(36, 114, 105, 0.18);
  border-radius: 24px;
  background: rgba(231, 239, 235, 0.52);
}

.sty-text-card-featured {
  grid-row: span 2;
  color: #ffffff;
  background:
    linear-gradient(
      145deg,
      var(--sty-deep),
      var(--sty-forest)
    );
}

.sty-text-card-featured .sty-card-label {
  color: var(--sty-mint);
}

.sty-text-card h3,
.sty-pool-points h3,
.sty-package-main h3,
.sty-package-side h3 {
  margin: 10px 0 14px;
  font-size: 23px;
  line-height: 1.25;
}

.sty-text-card p,
.sty-pool-points p,
.sty-package-main p,
.sty-package-side p {
  margin: 0;
  color: rgba(16, 43, 42, 0.72);
  line-height: 1.78;
}

.sty-text-card p + p {
  margin-top: 16px;
}

.sty-text-card-featured p {
  color: rgba(255, 255, 255, 0.76);
}

.sty-pool-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 0.72fr);
  gap: 48px;
  align-items: center;
  margin-top: 38px;
}

.sty-pool-points {
  display: grid;
  gap: 16px;
  margin-top: 28px;
}

.sty-pool-points section {
  padding: 22px 24px;
  border-left: 4px solid var(--sty-teal);
  border-radius: 0 18px 18px 0;
  background: var(--sty-mist);
}

.sty-pool-points h3 {
  margin-top: 0;
}

.sty-pool-visual {
  margin: 0;
  overflow: hidden;
  border-radius: 30px;
  box-shadow: 0 24px 50px rgba(10, 33, 31, 0.2);
}

.sty-pool-visual img {
  display: block;
  width: 100%;
  min-height: 560px;
  object-fit: cover;
}

.sty-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 20px;
  margin-top: 34px;
  padding: 22px 26px;
  border-radius: 20px;
  color: #ffffff;
  background: var(--sty-teal);
}

.sty-note p {
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  line-height: 1.65;
}

.sty-package-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(360px, 0.55fr);
  gap: 20px;
  margin-top: 38px;
}

.sty-package-main,
.sty-package-side {
  padding: 32px;
  border-radius: 26px;
}

.sty-package-main {
  background: var(--sty-mist);
}

.sty-package-side {
  color: #ffffff;
  background:
    linear-gradient(
      145deg,
      var(--sty-deep),
      var(--sty-forest)
    );
}

.sty-package-side .sty-card-label {
  color: var(--sty-mint);
}

.sty-package-side p {
  color: rgba(255, 255, 255, 0.74);
}

.sty-package-side p + p {
  margin-top: 18px;
}

.sty-package-items {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 24px;
}

.sty-package-items div {
  padding: 22px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.72);
}

.sty-package-items strong {
  display: block;
  margin-bottom: 9px;
  color: var(--sty-teal);
}

.sty-package-reminder {
  display: grid;
  gap: 8px;
  margin-top: 26px;
  padding: 20px;
  border: 1px solid rgba(145, 200, 188, 0.34);
  border-radius: 18px;
}

.sty-package-reminder strong {
  color: var(--sty-mint);
}

.sty-package-reminder span {
  color: rgba(255, 255, 255, 0.74);
  line-height: 1.6;
}

.sty-planning {
  max-width: 1540px;
  margin: 90px auto 0;
  padding-top: 56px;
  border-top: 1px solid var(--sty-line);
}

.sty-planning-flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-top: 34px;
}

.sty-planning-flow article {
  padding: 26px;
  border: 1px solid rgba(36, 114, 105, 0.2);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.48);
}

.sty-planning-flow span {
  display: inline-flex;
  padding: 7px 11px;
  border-radius: 999px;
  color: #ffffff;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: var(--sty-teal);
}

.sty-planning-flow h3 {
  margin: 18px 0 10px;
  font-size: 20px;
}

.sty-planning-flow p {
  margin: 0;
  color: rgba(16, 43, 42, 0.68);
  line-height: 1.7;
}

@media (max-width: 1180px) {
  .sty-intro {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.7fr);
  }

  .sty-intro-text,
  .sty-atmosphere-grid,
  .sty-planning-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sty-pool-layout,
  .sty-package-layout {
    grid-template-columns: 1fr;
  }

  .sty-pool-visual img {
    min-height: 420px;
  }
}

@media (max-width: 900px) {
  .sty-shell {
    display: block;
  }

  .sty-rail {
    display: none;
  }

  .sty-content {
    padding: 32px 18px calc(var(--mobile-dock, 82px) + 34px);
  }

  .sty-intro {
    display: flex;
    flex-direction: column;
    gap: 30px;
  }

  .sty-intro h1 {
    margin-bottom: 20px;
    font-size: clamp(47px, 14vw, 72px);
  }

  .sty-lead {
    font-size: 22px;
  }

  .sty-intro-text {
    display: block;
    margin-top: 22px;
  }

  .sty-intro-text p {
    font-size: 15px;
  }

  .sty-intro-text p + p {
    display: none;
  }

  .sty-intro-visual {
    width: 100%;
    min-height: 380px;
    border-radius: 28px 28px 28px 8px;
  }

  .sty-intro-visual img {
    min-height: 380px;
  }

  .sty-intro-visual figcaption {
    right: 22px;
    bottom: 22px;
    left: 22px;
  }

  .sty-atmosphere,
  .sty-explore,
  .sty-planning {
    margin-top: 56px;
  }

  .sty-atmosphere {
    padding: 30px 22px;
    border-radius: 26px;
  }

  .sty-atmosphere-heading,
  .sty-explore-heading {
    display: block;
  }

  .sty-atmosphere-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .sty-explore-heading > p {
    margin-top: 14px;
  }

  .sty-selector {
    grid-template-columns: 1fr;
  }

  .sty-selector-button-wide {
    grid-column: auto;
  }

  .sty-selector-button {
    min-height: 92px;
    padding: 18px;
    border-radius: 19px;
  }

  .sty-selector-action {
    padding: 8px 10px;
    font-size: 9px;
  }

  .sty-profile {
    margin: 14px 0 20px;
    padding: 28px 20px;
    border-radius: 26px;
  }

  .sty-profile-header {
    display: block;
  }

  .sty-profile-header h2 {
    font-size: 38px;
  }

  .sty-profile-close {
    margin-top: 22px;
  }

  .sty-profile-lead {
    font-size: 20px;
  }

  .sty-text-grid,
  .sty-package-items,
  .sty-planning-flow {
    grid-template-columns: 1fr;
  }

  .sty-text-card-featured {
    grid-row: auto;
  }

  .sty-pool-visual {
    order: -1;
  }

  .sty-pool-visual img {
    min-height: 300px;
  }

  .sty-note {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 520px) {
  .sty-content {
    padding-inline: 14px;
  }

  .sty-intro-text p {
    line-height: 1.7;
  }

  .sty-atmosphere-heading h2,
  .sty-explore-heading h2,
  .sty-planning-heading h2 {
    font-size: 36px;
  }

  .sty-selector-button {
    grid-template-columns: 18px minmax(0, 1fr);
  }

  .sty-selector-action {
    grid-column: 2;
    justify-self: start;
  }

  .sty-selector-button strong {
    font-size: 18px;
  }

  .sty-text-card,
  .sty-package-main,
  .sty-package-side {
    padding: 22px 18px;
  }

  .sty-pool-points section {
    padding: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sty-rail-nav a,
  .sty-selector-button {
    transition: none;
  }
}
/* STAY END */
/* ONLINE START */
.onl-section {
  --onl-bg: #070716;
  --onl-surface: #111128;
  --onl-surface-bright: #18183a;
  --onl-panel: #20204a;
  --onl-text: #f5f7ff;
  --onl-muted: #a9aec8;
  --onl-cyan: #48e5da;
  --onl-blue: #4da4ff;
  --onl-violet: #8f7dff;
  --onl-line: rgba(128, 148, 210, 0.22);

  min-height: 100vh;
  color: var(--onl-text);
  background:
    radial-gradient(
      circle at 76% 8%,
      rgba(83, 82, 210, 0.2),
      transparent 32rem
    ),
    radial-gradient(
      circle at 25% 42%,
      rgba(36, 164, 178, 0.1),
      transparent 34rem
    ),
    var(--onl-bg);
}

.onl-section[hidden] {
  display: none;
}

.onl-shell {
  display: grid;
  grid-template-columns: 138px minmax(0, 1fr);
  max-width: 1920px;
  min-height: 100vh;
  margin: 0 auto;
}

.onl-rail {
  position: sticky;
  top: var(--header-height, 92px);
  align-self: start;
  height: calc(100vh - var(--header-height, 92px));
  padding: 40px 18px;
  border-right: 1px solid var(--onl-line);
  background: rgba(7, 7, 22, 0.94);
  backdrop-filter: blur(18px);
}

.onl-rail-label {
  display: block;
  margin-bottom: 18px;
  color: var(--onl-cyan);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.22em;
  text-align: center;
  text-transform: uppercase;
}

.onl-rail-nav {
  display: grid;
  gap: 8px;
}

.onl-rail-nav a {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 10px 8px;
  border: 1px solid rgba(128, 148, 210, 0.16);
  border-radius: 16px;
  color: rgba(245, 247, 255, 0.54);
  font-size: 12px;
  font-weight: 750;
  text-align: center;
  text-decoration: none;
  transition:
    color 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    transform 180ms ease;
}

.onl-rail-nav a:hover,
.onl-rail-nav a:focus-visible {
  color: #ffffff;
  border-color: var(--onl-cyan);
  background: rgba(72, 229, 218, 0.09);
  transform: translateX(3px);
}

.onl-rail-nav a[aria-current="page"] {
  color: #071817;
  border-color: var(--onl-cyan);
  background: var(--onl-cyan);
  box-shadow: 0 10px 30px rgba(72, 229, 218, 0.2);
}

.onl-rail-nav a[aria-disabled="true"] {
  opacity: 0.3;
  pointer-events: none;
}

.onl-content {
  min-width: 0;
  padding: clamp(50px, 6vw, 100px) clamp(22px, 4.5vw, 82px) 110px;
}

.onl-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(330px, 0.55fr);
  gap: clamp(42px, 7vw, 110px);
  align-items: center;
  max-width: 1580px;
  margin: 0 auto;
}

.onl-eyebrow,
.onl-kicker,
.onl-profile-kicker,
.onl-card-label {
  margin: 0;
  color: var(--onl-cyan);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.onl-intro h1 {
  max-width: 1050px;
  margin: 18px 0 30px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(58px, 7vw, 122px);
  font-weight: 500;
  line-height: 0.88;
  letter-spacing: -0.055em;
}

.onl-intro h1 span {
  display: block;
  color: var(--onl-cyan);
}

.onl-lead {
  max-width: 960px;
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(23px, 2.25vw, 38px);
  line-height: 1.4;
}

.onl-intro-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 32px;
  margin-top: 34px;
}

.onl-intro-columns p {
  margin: 0;
  color: var(--onl-muted);
  font-size: 16px;
  line-height: 1.85;
}

.onl-access-panel {
  position: relative;
  overflow: hidden;
  min-height: 510px;
  padding: 44px 36px;
  border: 1px solid rgba(72, 229, 218, 0.35);
  border-radius: 34px;
  background:
    linear-gradient(
      145deg,
      rgba(30, 31, 72, 0.94),
      rgba(12, 13, 35, 0.98)
    );
  box-shadow:
    0 30px 80px rgba(0, 0, 0, 0.35),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.onl-access-panel::after {
  position: absolute;
  right: -90px;
  bottom: -90px;
  width: 240px;
  height: 240px;
  border: 1px solid rgba(72, 229, 218, 0.22);
  border-radius: 50%;
  content: "";
}

.onl-access-orbit {
  position: relative;
  width: 124px;
  height: 124px;
  margin-bottom: 44px;
  border: 1px solid rgba(72, 229, 218, 0.32);
  border-radius: 50%;
}

.onl-access-orbit::before,
.onl-access-orbit::after {
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(143, 125, 255, 0.4);
  border-radius: 50%;
  content: "";
}

.onl-access-orbit::after {
  inset: 40px;
  background: var(--onl-cyan);
  box-shadow: 0 0 36px rgba(72, 229, 218, 0.55);
}

.onl-access-orbit span {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--onl-violet);
}

.onl-access-orbit span:nth-child(1) {
  top: 8px;
  left: 54px;
}

.onl-access-orbit span:nth-child(2) {
  right: 12px;
  bottom: 28px;
}

.onl-access-orbit span:nth-child(3) {
  bottom: 17px;
  left: 18px;
}

.onl-access-label {
  margin: 0 0 8px;
  color: var(--onl-cyan);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.onl-access-panel > strong {
  display: block;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(34px, 3vw, 52px);
  font-weight: 500;
}

.onl-access-status {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin-top: 28px;
}

.onl-access-status span {
  padding: 10px 12px;
  border: 1px solid rgba(72, 229, 218, 0.2);
  border-radius: 12px;
  color: rgba(245, 247, 255, 0.78);
  font-size: 12px;
  background: rgba(72, 229, 218, 0.05);
}

.onl-access-panel > p:last-child {
  max-width: 360px;
  margin: 26px 0 0;
  color: var(--onl-muted);
  line-height: 1.7;
}

.onl-difference,
.onl-explore,
.onl-account,
.onl-control {
  max-width: 1580px;
  margin: 94px auto 0;
}

.onl-difference {
  padding: clamp(34px, 5vw, 66px);
  border: 1px solid var(--onl-line);
  border-radius: 36px;
  background:
    linear-gradient(
      135deg,
      rgba(24, 24, 58, 0.92),
      rgba(12, 13, 35, 0.92)
    );
}

.onl-difference-heading,
.onl-explore-heading {
  display: flex;
  gap: 38px;
  align-items: end;
  justify-content: space-between;
  padding-bottom: 34px;
  border-bottom: 1px solid var(--onl-line);
}

.onl-difference-heading h2,
.onl-explore-heading h2,
.onl-account-heading h2,
.onl-control-intro h2 {
  max-width: 980px;
  margin: 9px 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(36px, 4vw, 68px);
  font-weight: 500;
  line-height: 1.05;
}

.onl-difference-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 42px;
  margin-top: 42px;
}

.onl-difference-grid article {
  position: relative;
  padding-top: 24px;
}

.onl-detail-line {
  position: absolute;
  top: 0;
  left: 0;
  width: 58px;
  height: 3px;
  border-radius: 99px;
  background: var(--onl-cyan);
  box-shadow: 0 0 16px rgba(72, 229, 218, 0.42);
}

.onl-difference-grid h3 {
  margin: 0 0 14px;
  font-size: 21px;
}

.onl-difference-grid p,
.onl-explore-heading > p,
.onl-account-heading > p,
.onl-control-intro > p {
  margin: 0;
  color: var(--onl-muted);
  line-height: 1.75;
}

.onl-explore-heading > p {
  max-width: 470px;
}

.onl-card-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
  margin-top: 28px;
}

.onl-card {
  position: relative;
  min-width: 0;
  aspect-ratio: 0.72;
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(128, 148, 210, 0.28);
  border-radius: 22px;
  color: #ffffff;
  text-align: left;
  background: var(--onl-surface);
  cursor: pointer;
  transition:
    border-color 180ms ease,
    transform 180ms ease,
    box-shadow 180ms ease;
}

.onl-card:hover,
.onl-card:focus-visible {
  border-color: var(--onl-cyan);
  transform: translateY(-6px);
  box-shadow: 0 20px 46px rgba(0, 0, 0, 0.36);
}

.onl-card[aria-expanded="true"] {
  border-color: var(--onl-cyan);
  box-shadow:
    0 0 0 2px rgba(72, 229, 218, 0.22),
    0 24px 54px rgba(0, 0, 0, 0.4);
}

.onl-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.onl-card-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgba(7, 7, 22, 0.03) 28%,
      rgba(7, 7, 22, 0.94) 100%
    );
}

.onl-card-copy {
  position: absolute;
  right: 15px;
  bottom: 18px;
  left: 15px;
  display: grid;
  gap: 5px;
}

.onl-card-copy small {
  color: var(--onl-cyan);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.onl-card-copy strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(18px, 1.45vw, 25px);
  font-weight: 500;
  line-height: 1.05;
}

.onl-card-action {
  position: absolute;
  top: 13px;
  right: 13px;
  padding: 7px 9px;
  border: 1px solid rgba(255, 255, 255, 0.42);
  border-radius: 999px;
  color: #ffffff;
  font-size: 8px;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: rgba(7, 7, 22, 0.58);
  backdrop-filter: blur(8px);
}

.onl-card[aria-expanded="true"] .onl-card-action {
  color: #071817;
  border-color: var(--onl-cyan);
  background: var(--onl-cyan);
}

.onl-profile-region {
  max-width: 1580px;
  margin: 22px auto 0;
}

.onl-profile {
  padding: clamp(32px, 5vw, 70px);
  border: 1px solid rgba(72, 229, 218, 0.28);
  border-radius: 34px;
  background:
    linear-gradient(
      145deg,
      rgba(24, 24, 58, 0.97),
      rgba(11, 12, 31, 0.98)
    );
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.34);
}

.onl-profile[hidden] {
  display: none;
}

.onl-profile-header {
  display: flex;
  gap: 28px;
  align-items: start;
  justify-content: space-between;
  padding-bottom: 30px;
  border-bottom: 1px solid var(--onl-line);
}

.onl-profile-header h2 {
  max-width: 1050px;
  margin: 9px 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(38px, 4.7vw, 76px);
  font-weight: 500;
  line-height: 1.02;
}

.onl-profile-close {
  flex: none;
  padding: 12px 18px;
  border: 1px solid var(--onl-cyan);
  border-radius: 999px;
  color: var(--onl-cyan);
  font-weight: 800;
  background: transparent;
  cursor: pointer;
}

.onl-profile-close:hover,
.onl-profile-close:focus-visible {
  color: #071817;
  background: var(--onl-cyan);
}

.onl-profile-lead {
  max-width: 1200px;
  margin: 34px 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(21px, 2vw, 31px);
  line-height: 1.5;
}

.onl-info-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 17px;
  margin-top: 38px;
}

.onl-info-card,
.onl-poker-grid section,
.onl-bingo-features article {
  padding: 28px;
  border: 1px solid var(--onl-line);
  border-radius: 24px;
  background: rgba(32, 32, 74, 0.46);
}

.onl-info-card-featured {
  grid-row: span 2;
  background:
    linear-gradient(
      145deg,
      rgba(39, 95, 105, 0.5),
      rgba(33, 33, 78, 0.68)
    );
}

.onl-info-card h3,
.onl-live-main h3,
.onl-live-side h3,
.onl-jackpot-main h3,
.onl-poker-grid h3,
.onl-bingo-main h3 {
  margin: 10px 0 14px;
  font-size: 23px;
  line-height: 1.25;
}

.onl-info-card p,
.onl-live-main p,
.onl-live-side p,
.onl-jackpot-main p,
.onl-poker-grid p,
.onl-bingo-main p,
.onl-bingo-features p {
  margin: 0;
  color: var(--onl-muted);
  line-height: 1.78;
}

.onl-info-card p + p,
.onl-live-main p + p,
.onl-live-side p + p,
.onl-jackpot-main p + p,
.onl-bingo-main p + p {
  margin-top: 17px;
}

.onl-live-layout,
.onl-jackpot-layout,
.onl-bingo-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(350px, 0.55fr);
  gap: 20px;
  margin-top: 38px;
}

.onl-live-main,
.onl-jackpot-main,
.onl-bingo-main {
  padding: 34px;
  border: 1px solid rgba(72, 229, 218, 0.24);
  border-radius: 28px;
  background: rgba(72, 229, 218, 0.06);
}

.onl-live-side {
  padding: 34px;
  border-radius: 28px;
  background: var(--onl-panel);
}

.onl-live-points {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px;
  margin-top: 28px;
}

.onl-live-points div {
  display: grid;
  gap: 7px;
  padding: 18px;
  border: 1px solid var(--onl-line);
  border-radius: 17px;
  background: rgba(7, 7, 22, 0.28);
}

.onl-live-points strong,
.onl-jackpot-notes strong,
.onl-bingo-features strong {
  color: var(--onl-cyan);
}

.onl-live-points span {
  color: var(--onl-muted);
  font-size: 13px;
  line-height: 1.55;
}

.onl-jackpot-notes,
.onl-bingo-features {
  display: grid;
  gap: 12px;
}

.onl-jackpot-notes article {
  padding: 24px;
  border: 1px solid var(--onl-line);
  border-radius: 20px;
  background: var(--onl-panel);
}

.onl-jackpot-notes p {
  margin: 8px 0 0;
  color: var(--onl-muted);
  line-height: 1.65;
}

.onl-poker-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin-top: 38px;
}

.onl-profile-note {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 20px;
  margin-top: 18px;
  padding: 23px 26px;
  border: 1px solid rgba(72, 229, 218, 0.28);
  border-radius: 20px;
  background: rgba(72, 229, 218, 0.08);
}

.onl-profile-note strong {
  color: var(--onl-cyan);
}

.onl-profile-note p {
  margin: 0;
  color: var(--onl-muted);
  line-height: 1.65;
}

.onl-account {
  display: grid;
  grid-template-columns: minmax(300px, 0.48fr) minmax(0, 1fr);
  gap: 56px;
  align-items: start;
  padding: clamp(34px, 5vw, 66px);
  border: 1px solid var(--onl-line);
  border-radius: 36px;
  background: var(--onl-surface);
}

.onl-account-heading {
  position: sticky;
  top: calc(var(--header-height, 92px) + 32px);
}

.onl-account-heading > p {
  margin-top: 22px;
}

.onl-account-flow {
  display: grid;
  gap: 12px;
}

.onl-account-flow article {
  position: relative;
  display: grid;
  grid-template-columns: 16px minmax(170px, 0.42fr) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  padding: 22px 24px;
  border: 1px solid var(--onl-line);
  border-radius: 20px;
  background: rgba(7, 7, 22, 0.38);
}

.onl-flow-dot {
  width: 12px;
  height: 12px;
  margin-top: 5px;
  border: 2px solid var(--onl-cyan);
  border-radius: 50%;
  box-shadow: 0 0 14px rgba(72, 229, 218, 0.44);
}

.onl-account-flow strong {
  color: var(--onl-text);
}

.onl-account-flow p {
  margin: 0;
  color: var(--onl-muted);
  line-height: 1.65;
}

.onl-control {
  display: grid;
  grid-template-columns: minmax(320px, 0.6fr) minmax(0, 1fr);
  gap: 56px;
  padding: clamp(36px, 5vw, 72px);
  border-radius: 36px;
  color: #071817;
  background:
    linear-gradient(
      135deg,
      var(--onl-cyan),
      #a7f3ea
    );
}

.onl-control-intro .onl-kicker {
  color: #164d49;
}

.onl-control-intro > p {
  margin-top: 24px;
  color: rgba(7, 24, 23, 0.72);
}

.onl-control-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.onl-control-grid article {
  padding: 24px;
  border: 1px solid rgba(7, 24, 23, 0.16);
  border-radius: 21px;
  background: rgba(255, 255, 255, 0.4);
}

.onl-control-grid article:last-child {
  grid-column: 1 / -1;
}

.onl-control-grid span {
  color: #235c57;
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.onl-control-grid strong {
  display: block;
  margin-top: 10px;
  font-size: 19px;
}

.onl-control-grid p {
  margin: 10px 0 0;
  color: rgba(7, 24, 23, 0.68);
  line-height: 1.65;
}

@media (max-width: 1500px) {
  .onl-card-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .onl-card {
    aspect-ratio: 1.08;
  }
}

@media (max-width: 1180px) {
  .onl-intro {
    grid-template-columns: minmax(0, 1fr) 340px;
  }

  .onl-intro-columns,
  .onl-difference-grid {
    grid-template-columns: 1fr;
  }

  .onl-account,
  .onl-control {
    grid-template-columns: 1fr;
  }

  .onl-account-heading {
    position: static;
  }
}

@media (max-width: 900px) {
  .onl-shell {
    display: block;
  }

  .onl-rail {
    display: none;
  }

  .onl-content {
    padding: 34px 16px calc(var(--mobile-dock, 82px) + 36px);
  }

  .onl-intro {
    display: flex;
    flex-direction: column;
    gap: 32px;
  }

  .onl-intro h1 {
    font-size: clamp(48px, 15vw, 74px);
  }

  .onl-lead {
    font-size: 22px;
  }

  .onl-intro-columns {
    display: block;
    margin-top: 22px;
  }

  .onl-intro-columns p {
    font-size: 15px;
  }

  .onl-intro-columns p + p {
    display: none;
  }

  .onl-access-panel {
    width: 100%;
    min-height: auto;
    padding: 28px 24px;
    border-radius: 26px;
  }

  .onl-access-orbit {
    width: 92px;
    height: 92px;
    margin-bottom: 28px;
  }

  .onl-access-orbit::before {
    inset: 14px;
  }

  .onl-access-orbit::after {
    inset: 30px;
  }

  .onl-difference,
  .onl-explore,
  .onl-account,
  .onl-control {
    margin-top: 58px;
  }

  .onl-difference {
    padding: 30px 22px;
    border-radius: 26px;
  }

  .onl-difference-heading,
  .onl-explore-heading {
    display: block;
  }

  .onl-difference-heading h2,
  .onl-explore-heading h2,
  .onl-account-heading h2,
  .onl-control-intro h2 {
    font-size: 38px;
  }

  .onl-explore-heading > p {
    margin-top: 16px;
  }

  .onl-card-grid {
    grid-template-columns: 1fr;
    gap: 13px;
  }

  .onl-card {
    min-height: 180px;
    aspect-ratio: auto;
    border-radius: 22px;
  }

  .onl-card img {
    height: 180px;
  }

  .onl-card-copy strong {
    font-size: 28px;
  }

  .onl-card-action {
    top: 15px;
    right: 15px;
  }

  .onl-profile {
    margin: 14px 0 22px;
    padding: 28px 20px;
    border-radius: 26px;
  }

  .onl-profile-header {
    display: block;
  }

  .onl-profile-header h2 {
    font-size: 39px;
  }

  .onl-profile-close {
    margin-top: 22px;
  }

  .onl-profile-lead {
    font-size: 20px;
  }

  .onl-info-grid,
  .onl-live-layout,
  .onl-jackpot-layout,
  .onl-poker-grid,
  .onl-bingo-layout {
    grid-template-columns: 1fr;
  }

  .onl-info-card-featured {
    grid-row: auto;
  }

  .onl-account,
  .onl-control {
    padding: 28px 20px;
    border-radius: 27px;
  }

  .onl-account-flow article {
    grid-template-columns: 16px minmax(0, 1fr);
  }

  .onl-account-flow article p {
    grid-column: 2;
  }

  .onl-control-grid {
    grid-template-columns: 1fr;
  }

  .onl-control-grid article:last-child {
    grid-column: auto;
  }
}

@media (max-width: 520px) {
  .onl-access-status,
  .onl-live-points {
    grid-template-columns: 1fr;
  }

  .onl-info-card,
  .onl-live-main,
  .onl-live-side,
  .onl-jackpot-main,
  .onl-jackpot-notes article,
  .onl-poker-grid section,
  .onl-bingo-main,
  .onl-bingo-features article {
    padding: 22px 18px;
  }

  .onl-profile-note {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .onl-rail-nav a,
  .onl-card {
    transition: none;
  }
}
/* ONLINE END */
/* FAQ START */
.faq-section {
  --faq-bg: #dcd8ec;
  --faq-paper: #eeecf7;
  --faq-white: #faf9ff;
  --faq-ink: #26223b;
  --faq-deep: #171426;
  --faq-plum: #40365f;
  --faq-green: #198f78;
  --faq-mint: #65d8bd;
  --faq-muted: #69637f;
  --faq-line: rgba(64, 54, 95, 0.17);

  min-height: 100vh;
  color: var(--faq-ink);
  background:
    radial-gradient(
      circle at 78% 4%,
      rgba(101, 216, 189, 0.2),
      transparent 32rem
    ),
    linear-gradient(145deg, #e7e3f2 0%, #d7d4e8 100%);
}

.faq-section[hidden] {
  display: none;
}

.faq-shell {
  display: grid;
  grid-template-columns: 138px minmax(0, 1fr);
  max-width: 1920px;
  min-height: 100vh;
  margin: 0 auto;
}

.faq-rail {
  position: sticky;
  top: var(--header-height, 92px);
  align-self: start;
  height: calc(100vh - var(--header-height, 92px));
  padding: 40px 18px;
  border-right: 1px solid rgba(101, 216, 189, 0.15);
  background: var(--faq-deep);
}

.faq-rail-label {
  display: block;
  margin-bottom: 18px;
  color: var(--faq-mint);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: 0.22em;
  text-align: center;
  text-transform: uppercase;
}

.faq-rail-nav {
  display: grid;
  gap: 8px;
}

.faq-rail-nav a {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 10px 8px;
  border: 1px solid rgba(220, 216, 236, 0.14);
  border-radius: 16px;
  color: rgba(250, 249, 255, 0.55);
  font-size: 12px;
  font-weight: 750;
  text-align: center;
  text-decoration: none;
  transition:
    color 180ms ease,
    border-color 180ms ease,
    background 180ms ease,
    transform 180ms ease;
}

.faq-rail-nav a:hover,
.faq-rail-nav a:focus-visible {
  color: #ffffff;
  border-color: var(--faq-mint);
  background: rgba(101, 216, 189, 0.08);
  transform: translateX(3px);
}

.faq-rail-nav a[aria-current="page"] {
  color: #ffffff;
  border-color: var(--faq-green);
  background: var(--faq-green);
  box-shadow: 0 12px 30px rgba(25, 143, 120, 0.25);
}

.faq-rail-nav a[aria-disabled="true"] {
  opacity: 0.3;
  pointer-events: none;
}

.faq-content {
  min-width: 0;
  padding: clamp(48px, 6vw, 100px) clamp(24px, 5vw, 92px) 110px;
}

.faq-intro {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(380px, 0.62fr);
  gap: clamp(44px, 7vw, 120px);
  align-items: end;
  max-width: 1540px;
  margin: 0 auto;
  padding-bottom: 52px;
  border-bottom: 1px solid var(--faq-line);
}

.faq-eyebrow,
.faq-kicker {
  margin: 0;
  color: var(--faq-green);
  font-size: 12px;
  font-weight: 850;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.faq-intro h1 {
  max-width: 980px;
  margin: 17px 0 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(56px, 7vw, 116px);
  font-weight: 500;
  line-height: 0.9;
  letter-spacing: -0.055em;
}

.faq-intro h1 span {
  display: block;
  color: var(--faq-green);
}

.faq-lead {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(22px, 2vw, 32px);
  font-weight: 600;
  line-height: 1.45;
}

.faq-intro-copy > p:last-child {
  margin: 24px 0 0;
  color: var(--faq-muted);
  font-size: 16px;
  line-height: 1.8;
}

.faq-topics {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
  max-width: 1540px;
  margin: 30px auto 0;
  color: var(--faq-plum);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.faq-topics i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--faq-green);
}

.faq-accordion {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 18px;
  align-items: start;
  max-width: 1540px;
  margin: 56px auto 0;
}

.faq-item {
  align-self: start;
  overflow: hidden;
  border: 1px solid rgba(64, 54, 95, 0.2);
  border-radius: 24px;
  background: rgba(250, 249, 255, 0.67);
  box-shadow: 0 8px 22px rgba(38, 34, 59, 0.05);
  transition:
    border-color 180ms ease,
    background 180ms ease,
    box-shadow 180ms ease;
}

.faq-item:hover {
  border-color: rgba(25, 143, 120, 0.5);
  background: var(--faq-white);
}

.faq-item[open] {
  border-color: var(--faq-green);
  background: var(--faq-white);
  box-shadow: 0 20px 44px rgba(38, 34, 59, 0.12);
}

.faq-item summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px;
  gap: 20px;
  align-items: center;
  min-height: 104px;
  padding: 22px 24px;
  color: var(--faq-ink);
  cursor: pointer;
  list-style: none;
}

.faq-item summary::-webkit-details-marker {
  display: none;
}

.faq-item summary::marker {
  content: "";
}

.faq-item summary span {
  font-size: 18px;
  font-weight: 800;
  line-height: 1.38;
}

.faq-item summary i {
  position: relative;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(25, 143, 120, 0.42);
  border-radius: 50%;
  background: rgba(25, 143, 120, 0.06);
  transition:
    background 180ms ease,
    transform 180ms ease;
}

.faq-item summary i::before,
.faq-item summary i::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 15px;
  height: 2px;
  border-radius: 99px;
  content: "";
  background: var(--faq-green);
  transform: translate(-50%, -50%);
}

.faq-item summary i::after {
  transform: translate(-50%, -50%) rotate(90deg);
  transition: opacity 180ms ease;
}

.faq-item[open] summary {
  color: var(--faq-green);
}

.faq-item[open] summary i {
  background: var(--faq-green);
  transform: rotate(180deg);
}

.faq-item[open] summary i::before,
.faq-item[open] summary i::after {
  background: #ffffff;
}

.faq-item[open] summary i::after {
  opacity: 0;
}

.faq-item summary:focus-visible {
  outline: 3px solid rgba(25, 143, 120, 0.36);
  outline-offset: -3px;
}

.faq-answer {
  padding: 0 24px 27px;
}

.faq-answer::before {
  display: block;
  height: 1px;
  margin-bottom: 22px;
  content: "";
  background: var(--faq-line);
}

.faq-answer p {
  margin: 0;
  color: var(--faq-muted);
  font-size: 15px;
  line-height: 1.8;
}

.faq-answer p + p {
  margin-top: 15px;
}

.faq-closing {
  max-width: 1540px;
  margin: 88px auto 0;
  padding: clamp(36px, 5vw, 68px);
  border-radius: 36px;
  color: #ffffff;
  background:
    radial-gradient(
      circle at 86% 10%,
      rgba(101, 216, 189, 0.2),
      transparent 24rem
    ),
    linear-gradient(
      135deg,
      var(--faq-deep),
      var(--faq-plum)
    );
  box-shadow: 0 28px 64px rgba(38, 34, 59, 0.2);
}

.faq-closing .faq-kicker {
  color: var(--faq-mint);
}

.faq-closing > div {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(320px, 0.55fr);
  gap: 60px;
  align-items: end;
  margin-top: 20px;
}

.faq-closing h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(36px, 4.5vw, 70px);
  font-weight: 500;
  line-height: 1.05;
}

.faq-closing p {
  margin: 0;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.8;
}

@media (max-width: 1100px) {
  .faq-intro {
    grid-template-columns: minmax(0, 1fr) minmax(330px, 0.7fr);
  }

  .faq-closing > div {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

@media (max-width: 900px) {
  .faq-shell {
    display: block;
  }

  .faq-rail {
    display: none;
  }

  .faq-content {
    padding: 34px 16px calc(var(--mobile-dock, 82px) + 36px);
  }

  .faq-intro {
    display: block;
    padding-bottom: 34px;
  }

  .faq-intro h1 {
    font-size: clamp(48px, 14vw, 72px);
  }

  .faq-intro-copy {
    margin-top: 28px;
  }

  .faq-lead {
    font-size: 21px;
  }

  .faq-intro-copy > p:last-child {
    display: none;
  }

  .faq-topics {
    flex-wrap: nowrap;
    gap: 11px;
    overflow-x: auto;
    margin-top: 22px;
    padding-bottom: 9px;
    white-space: nowrap;
    scrollbar-width: none;
  }

  .faq-topics::-webkit-scrollbar {
    display: none;
  }

  .faq-accordion {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 36px;
  }

  .faq-item {
    border-radius: 20px;
  }

  .faq-item summary {
    min-height: 82px;
    padding: 18px;
  }

  .faq-item summary span {
    font-size: 16px;
  }

  .faq-item summary i {
    width: 38px;
    height: 38px;
  }

  .faq-answer {
    padding: 0 18px 22px;
  }

  .faq-closing {
    margin-top: 56px;
    padding: 32px 22px;
    border-radius: 27px;
  }

  .faq-closing h2 {
    font-size: 38px;
  }
}

@media (max-width: 420px) {
  .faq-item summary {
    grid-template-columns: minmax(0, 1fr) 34px;
    gap: 12px;
  }

  .faq-item summary i {
    width: 34px;
    height: 34px;
  }

  .faq-answer p {
    font-size: 14px;
    line-height: 1.72;
  }
}

@media (prefers-reduced-motion: reduce) {
  .faq-rail-nav a,
  .faq-item,
  .faq-item summary i,
  .faq-item summary i::after {
    transition: none;
  }
}
/* FAQ END */
/* LEGAL PAGES START */

.legal-document {
  --legal-accent: #68ddc0;
  --legal-accent-soft: #b7f6e6;
  --legal-accent-rgb: 104, 221, 192;
  --legal-surface: #0d2230;
  --legal-surface-deep: #071722;
  --legal-border: rgba(var(--legal-accent-rgb), 0.2);

  min-height: 100%;
  color: #eef6f4;
  background: var(--legal-surface-deep);
}

.legal-terms-page {
  --legal-accent: #64dfbd;
  --legal-accent-soft: #b5f7e4;
  --legal-accent-rgb: 100, 223, 189;
  --legal-surface: #0b2b2d;
  --legal-surface-deep: #07191f;
}

.legal-privacy-page {
  --legal-accent: #76c9f3;
  --legal-accent-soft: #c7ebff;
  --legal-accent-rgb: 118, 201, 243;
  --legal-surface: #102b42;
  --legal-surface-deep: #071725;
}

.legal-responsible-page {
  --legal-accent: #94dfa6;
  --legal-accent-soft: #d3f6da;
  --legal-accent-rgb: 148, 223, 166;
  --legal-surface: #143128;
  --legal-surface-deep: #081b1a;
}

.legal-cookies-page {
  --legal-accent: #d4b7ff;
  --legal-accent-soft: #eadcff;
  --legal-accent-rgb: 212, 183, 255;
  --legal-surface: #292442;
  --legal-surface-deep: #131426;
}

.legal-document .mca-header {
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.2);
}

.legal-main {
  position: relative;
  isolation: isolate;
  min-height: calc(100svh - var(--header-size));
  overflow: clip;
  background:
    radial-gradient(
      circle at 82% 4%,
      rgba(var(--legal-accent-rgb), 0.15),
      transparent 27%
    ),
    radial-gradient(
      circle at 8% 78%,
      rgba(var(--legal-accent-rgb), 0.08),
      transparent 24%
    ),
    linear-gradient(
      145deg,
      var(--legal-surface-deep),
      #0b1d29 56%,
      var(--legal-surface)
    );
}

.legal-main::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: 0.16;
  pointer-events: none;
  background-image:
    linear-gradient(
      rgba(var(--legal-accent-rgb), 0.08) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(var(--legal-accent-rgb), 0.08) 1px,
      transparent 1px
    );
  background-size: 72px 72px;
  mask-image: linear-gradient(to bottom, #000, transparent 65%);
}

.legal-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 42px;
  width: min(100% - 44px, 1500px);
  margin-inline: auto;
  padding: clamp(62px, 8vw, 118px) 0 clamp(45px, 6vw, 78px);
  border-bottom: 1px solid var(--legal-border);
}

.legal-hero-copy {
  max-width: 960px;
}

.legal-eyebrow,
.legal-label {
  margin: 0 0 16px;
  color: var(--legal-accent);
  font: 800 10px/1.3 Arial, sans-serif;
  letter-spacing: 0.19em;
  text-transform: uppercase;
}

.legal-hero h1 {
  max-width: 1040px;
  margin: 0;
  color: #fff3dd;
  font: clamp(50px, 6.8vw, 104px)/0.96 Georgia, serif;
  letter-spacing: -0.045em;
}

.legal-lead {
  max-width: 850px;
  margin: 28px 0 0;
  color: #cbd9d8;
  font: 400 clamp(17px, 1.4vw, 21px)/1.72 Arial, sans-serif;
}

.legal-date-card {
  min-width: 190px;
  padding: 22px 24px;
  border: 1px solid var(--legal-border);
  border-radius: 22px;
  background:
    linear-gradient(
      145deg,
      rgba(var(--legal-accent-rgb), 0.14),
      rgba(3, 15, 23, 0.58)
    );
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.18);
}

.legal-date-card span,
.legal-date-card time {
  display: block;
}

.legal-date-card span {
  margin-bottom: 8px;
  color: #8fa8a8;
  font: 700 9px/1 Arial, sans-serif;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.legal-date-card time {
  color: var(--legal-accent-soft);
  font: 700 15px/1.3 Arial, sans-serif;
}

.legal-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  align-items: start;
  gap: clamp(38px, 5vw, 88px);
  width: min(100% - 44px, 1500px);
  margin-inline: auto;
  padding: clamp(48px, 6vw, 84px) 0 clamp(70px, 8vw, 120px);
}

.legal-toc {
  position: sticky;
  top: calc(var(--header-size) + 28px);
  display: grid;
  gap: 7px;
  padding: 22px;
  border: 1px solid var(--legal-border);
  border-radius: 22px;
  background: rgba(4, 17, 25, 0.72);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.16);
  backdrop-filter: blur(15px);
}

.legal-toc p {
  margin: 0 0 10px;
  color: var(--legal-accent);
  font: 800 9px/1 Arial, sans-serif;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.legal-toc a {
  padding: 9px 11px;
  border-left: 2px solid transparent;
  border-radius: 0 9px 9px 0;
  color: #9fb3b3;
  font: 600 11px/1.35 Arial, sans-serif;
  transition:
    color 0.18s ease,
    border-color 0.18s ease,
    background 0.18s ease;
}

.legal-toc a:hover,
.legal-toc a:focus-visible {
  border-left-color: var(--legal-accent);
  color: #ffffff;
  background: rgba(var(--legal-accent-rgb), 0.09);
}

.legal-content {
  display: grid;
  gap: 24px;
  min-width: 0;
}

.legal-panel {
  padding: clamp(28px, 4vw, 52px);
  scroll-margin-top: calc(var(--header-size) + 24px);
  border: 1px solid var(--legal-border);
  border-radius: 28px;
  background:
    linear-gradient(
      145deg,
      rgba(14, 34, 45, 0.94),
      rgba(6, 21, 30, 0.92)
    );
  box-shadow: 0 22px 55px rgba(0, 0, 0, 0.13);
}

.legal-panel-featured {
  position: relative;
  overflow: hidden;
  border-color: rgba(var(--legal-accent-rgb), 0.38);
  background:
    radial-gradient(
      circle at 100% 0,
      rgba(var(--legal-accent-rgb), 0.17),
      transparent 37%
    ),
    linear-gradient(
      145deg,
      rgba(15, 45, 51, 0.97),
      rgba(6, 24, 31, 0.96)
    );
}

.legal-panel-featured::after {
  content: "";
  position: absolute;
  top: 0;
  left: clamp(28px, 4vw, 52px);
  width: 80px;
  height: 3px;
  border-radius: 999px;
  background: var(--legal-accent);
}

.legal-panel h2 {
  margin: 0 0 20px;
  color: #fff0d2;
  font: clamp(28px, 3vw, 45px)/1.08 Georgia, serif;
  letter-spacing: -0.025em;
}

.legal-panel p {
  max-width: 980px;
  margin: 0;
  color: #c6d2d3;
  font: 400 16px/1.82 Arial, sans-serif;
}

.legal-panel p + p {
  margin-top: 17px;
}

.legal-note {
  margin: 24px 0;
  padding: 22px 24px;
  border-left: 3px solid var(--legal-accent);
  border-radius: 0 16px 16px 0;
  background: rgba(var(--legal-accent-rgb), 0.09);
}

.legal-note strong,
.legal-callouts strong,
.legal-check-grid strong,
.legal-cookie-grid strong {
  display: block;
  margin-bottom: 7px;
  color: var(--legal-accent-soft);
  font: 800 13px/1.3 Arial, sans-serif;
}

.legal-note p {
  color: #c8d8d5;
  font-size: 14px;
  line-height: 1.7;
}

.legal-note-alert {
  border-left-color: #f0c46a;
  background: rgba(240, 196, 106, 0.08);
}

.legal-note-alert strong {
  color: #ffe0a0;
}

.legal-callouts,
.legal-check-grid,
.legal-cookie-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
  margin: 25px 0;
}

.legal-cookie-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.legal-callouts div,
.legal-check-grid div,
.legal-cookie-grid div {
  min-height: 105px;
  padding: 19px;
  border: 1px solid rgba(var(--legal-accent-rgb), 0.18);
  border-radius: 16px;
  background: rgba(2, 15, 23, 0.52);
}

.legal-callouts span,
.legal-check-grid span,
.legal-cookie-grid span {
  display: block;
  color: #aebfc0;
  font: 400 13px/1.55 Arial, sans-serif;
}

.legal-document .mca-footer-shell {
  grid-template-columns:
    minmax(250px, 1.35fr)
    repeat(2, minmax(190px, 1fr));
}

.legal-document .mca-footer-brand {
  grid-row: auto;
}

.legal-document .mca-footer-column a[aria-current="page"] {
  color: #ffffff;
}

.legal-document .mca-footer-column a[aria-current="page"]::before {
  border-color: #8ff5dc;
  background: #5fe0bd;
}

@media (max-width: 1100px) {
  .legal-layout {
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 32px;
  }

  .legal-toc {
    padding: 17px;
  }

  .legal-document .mca-footer-shell {
    grid-template-columns:
      minmax(230px, 1.35fr)
      repeat(2, minmax(150px, 1fr));
  }
}

@media (max-width: 900px) {
  .legal-hero {
    grid-template-columns: 1fr;
    gap: 27px;
    width: min(100% - 32px, 720px);
    padding: 48px 0 38px;
  }

  .legal-hero h1 {
    font-size: clamp(43px, 12vw, 70px);
  }

  .legal-lead {
    margin-top: 20px;
    font-size: 16px;
  }

  .legal-date-card {
    min-width: 0;
    width: fit-content;
    padding: 15px 18px;
    border-radius: 15px;
  }

  .legal-layout {
    display: block;
    width: min(100% - 32px, 720px);
    padding: 34px 0 64px;
  }

  .legal-toc {
    position: static;
    display: flex;
    gap: 8px;
    margin-bottom: 26px;
    padding: 11px;
    overflow-x: auto;
    border-radius: 16px;
    scrollbar-width: none;
  }

  .legal-toc::-webkit-scrollbar {
    display: none;
  }

  .legal-toc p {
    display: none;
  }

  .legal-toc a {
    flex: 0 0 auto;
    padding: 10px 13px;
    border: 1px solid rgba(var(--legal-accent-rgb), 0.18);
    border-radius: 999px;
    white-space: nowrap;
  }

  .legal-toc a:hover,
  .legal-toc a:focus-visible {
    border-color: var(--legal-accent);
  }

  .legal-content {
    gap: 16px;
  }

  .legal-panel {
    padding: 25px 21px;
    border-radius: 21px;
  }

  .legal-panel h2 {
    margin-bottom: 15px;
    font-size: clamp(27px, 8vw, 37px);
  }

  .legal-panel p {
    font-size: 14px;
    line-height: 1.75;
  }

  .legal-callouts,
  .legal-check-grid,
  .legal-cookie-grid {
    grid-template-columns: 1fr;
  }

  .legal-document .mca-footer-shell {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .legal-document .mca-footer-brand {
    grid-column: 1 / -1;
  }
}

@media (max-width: 430px) {
  .legal-hero,
  .legal-layout {
    width: min(100% - 24px, 720px);
  }

  .legal-hero {
    padding-top: 36px;
  }

  .legal-hero h1 {
    font-size: clamp(39px, 12.5vw, 54px);
  }

  .legal-panel {
    padding: 23px 18px;
  }

  .legal-note {
    padding: 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .legal-toc a,
  .legal-document .mca-footer-column a {
    transition: none;
  }
}

/* LEGAL PAGES END */