/* ============================================================================
   THE FACTS AS A TICKER, three ways to present it.
   The old strip was a panel with vertical dividers, which read as a separate
   row bolted under the picture. Mia's note: the facts should simply run, not
   sit in a highlighted row. So the panel is gone in all three; what differs is
   how the line meets the picture and how much furniture it carries.

   The copy is untouched. The brand marks travel inside the same line as the
   facts, so the three casinos are proof in the sentence rather than a logo
   wall beside it.
   ========================================================================= */

main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .ticker{
  grid-row:2; position:relative; z-index:2; width:100%;
  overflow:hidden;
  padding-block:clamp(14px,1.4vw,22px);
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
          mask-image:linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}
/* The loop has no seam by construction. ticker.js clones the one authored set
   until the track is at least one set wider than the viewport, then shifts by
   EXACTLY one set width in px. The old version shifted by -50% of two sets,
   so on any screen wider than one set the tail ran out before the loop reset
   and the line visibly stopped (Mia, 2026-09-14). Spacing lives in a
   per-item margin, not flex gap, so each set's width includes its own
   trailing space and the jump is exact. */
main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .ticker__track{
  --tk-gap:clamp(18px,1.8vw,30px);
  display:flex; align-items:center;
  width:max-content;
}
main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .ticker__set{
  display:flex; align-items:center; flex:0 0 auto;
}
main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .ticker__set>*{ margin-right:var(--tk-gap); }
main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .ticker.is-live .ticker__track{
  animation:tk-run var(--tk-dur,46s) linear infinite;
}
main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .ticker:hover .ticker__track{
  animation-play-state:paused;
}
@keyframes tk-run{ from{ transform:translate3d(0,0,0); } to{ transform:translate3d(calc(-1 * var(--tk-shift)),0,0); } }
@media (prefers-reduced-motion:reduce){
  main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .ticker__track{ animation:none; }
}

main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .tk{
  display:inline-flex; align-items:baseline; gap:.45em; white-space:nowrap;
  font-size:clamp(13px,1vw,16px); color:rgba(242,239,246,.80);
  letter-spacing:.005em;
}
main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .tk b{
  font-weight:600; color:#CBB2FF;
  background:linear-gradient(96deg,#EDE4FF 0%, #B98CFF 60%, #8B54F7 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .tk--mark{ align-items:center; }
main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .tk__dot{
  width:4px; height:4px; border-radius:50%; flex:0 0 auto;
  background:rgba(190,155,255,.55);
}
main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .hmark{ display:block; width:auto; opacity:.92; }
main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .hmark--ss{ height:clamp(15px,1.3vw,20px); }
main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .hmark--ks{ height:clamp(13px,1.15vw,18px); filter:invert(1) brightness(1.6); }
main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .hmark--caf{ height:clamp(20px,1.8vw,26px); filter:saturate(.85) brightness(1.06); }

/* ---- T1 · NAKED ---------------------------------------------------------
   No ground at all. The line runs straight over the bottom of the picture,
   held only by a hairline above it. Lightest possible, and the one that most
   obviously stops being "a row". */
body.tk-1 main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .ticker{
  background:linear-gradient(0deg, rgba(4,1,14,.72) 0%, rgba(4,1,14,0) 100%);
}

/* ---- T2 · GLASS RAIL ----------------------------------------------------
   The line sits on a thin band of violet glass that floats clear of both
   edges, so it reads as a rail laid over the picture rather than a section. */
body.tk-2 main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .ticker{
  margin:0 auto clamp(18px,2vw,30px);
  width:calc(100% - 2 * var(--gut));
  border-radius:999px;
  background:linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.025));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12), 0 18px 44px -26px rgba(0,0,0,.9);
  backdrop-filter:blur(8px) saturate(1.2);
  padding-block:clamp(11px,1.1vw,16px);
}
body.tk-2 main>section.pl--01:is(#proof,#services,#why,#markets,.pl){ padding-bottom:0; }

/* ---- T3 · UNDER THE PICTURE ---------------------------------------------
   The picture ends, the line runs on the page's own ground below it. The
   quietest of the three and the only one that never sits on the image. */
body.tk-3 main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .ticker{
  background:#04010E;
  border-top:1px solid rgba(255,255,255,.08);
  padding-block:clamp(16px,1.6vw,24px);
}
body.tk-3 main>section.pl--01:is(#proof,#services,#why,#markets,.pl) .tk{ color:rgba(242,239,246,.72); }