/* The same hand-cut identity, with a little electricity running through it. */
.hero { isolation: isolate; }
html:not(.has-js) .bar { translate: 0 0; opacity: 1; pointer-events: auto; }
.grain { inset: -10%; }
.hero__atmosphere {
  position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(ellipse at 50% 44%, #8491001c 0, #1d200014 34%, transparent 67%);
}
.hero__atmosphere::before {
  content: ""; position: absolute; inset: 0; opacity: .11;
  background-image: linear-gradient(#cfff3617 1px, transparent 1px), linear-gradient(90deg, #cfff3617 1px, transparent 1px);
  background-size: 74px 74px; mask-image: radial-gradient(ellipse at center, #000 0, transparent 74%);
}
.hero__atmosphere span { position: absolute; background: var(--volt); width: 4px; height: 4px; rotate: 45deg; opacity: .55; }
.hero__atmosphere span:nth-child(1) { top: 21%; left: 17%; }
.hero__atmosphere span:nth-child(2) { top: 30%; right: 16%; width: 6px; height: 6px; }
.hero__atmosphere span:nth-child(3) { bottom: 27%; left: 22%; width: 3px; height: 3px; }
.hero__hud {
  position: absolute; top: clamp(18px, 3vh, 30px); left: var(--gutter); right: var(--gutter);
  z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  color: #b6b6aa; font: 700 .62rem/1.4 var(--font-mono); letter-spacing: .13em;
}
.hero__hud b { color: var(--volt); padding: 0 .45em; }
.motion-toggle {
  font: 700 .68rem/1 var(--font-mono); letter-spacing: .08em; color: #e4e4db;
  background: #080808; border: 1px solid #67675b; min-height: 44px; padding: .6em .7em; cursor: pointer; white-space: nowrap;
}
.motion-toggle:hover, .motion-toggle:focus-visible { color: var(--volt); border-color: var(--volt); }
.motion-toggle:disabled { cursor: default; color: #bdbdbd; }
.motion-toggle[hidden], .spark-trigger[hidden] { display: none !important; }
.motion-toggle--nav { font-size: .65rem; }
.bar { background: rgb(0 0 0 / .94); border-bottom: 1px solid #ffffff20; }
.bar__nav { gap: clamp(12px, 2vw, 28px); }
.bar__mark { min-width: 44px; min-height: 44px; display: grid; place-items: center; }
.bar__mark svg { width: 26px; height: 40px; }
.bar__nav a { min-height: 44px; display: inline-flex; align-items: center; }
.btn:focus-visible { outline: 3px solid currentColor; outline-offset: -7px; text-decoration: underline; }
.form__input::placeholder { color: #a8a8a8; }
.foot__col a { overflow-wrap: anywhere; }
.intro__skip { min-height: 44px; min-width: 72px; }
.hero__actions { display: flex; justify-content: center; align-items: center; gap: 14px 24px; flex-wrap: wrap; }
.spark-trigger {
  color: #e7e7de; border: 0; background: none; min-height: 44px; padding: .75em .25em;
  font: 700 .68rem/1.2 var(--font-mono); letter-spacing: .11em; cursor: pointer;
}
.spark-trigger span { color: var(--volt); font-size: 1.6rem; vertical-align: -.16em; margin-right: .25em; }
.spark-trigger:hover { color: var(--volt); }
.charge-line { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 97; pointer-events: none; }
.charge-line span { display: block; width: 100%; height: 100%; background: var(--volt); transform: scaleX(0); transform-origin: left; }

.signal-strip { position: relative; overflow: hidden; background: var(--volt); color: #000; margin-bottom: clamp(26px, 5vw, 64px); }
.signal-strip__track {
  width: max-content; min-height: 52px; display: flex; align-items: center;
  font: 400 clamp(1.05rem, 1.5vw, 1.35rem)/1 var(--font-display); letter-spacing: .065em;
  animation: signal-travel 32s linear infinite;
}
.signal-strip__group { display: flex; align-items: center; gap: clamp(22px, 4vw, 56px); padding-right: clamp(22px, 4vw, 56px); }
.signal-strip__track b { font: 400 .75rem/1 var(--font-body); }
@keyframes signal-travel { to { transform: translateX(-50%); } }

.flyer__slash { position: absolute; pointer-events: none; opacity: .8; }
.flyer__slash--pitch {
  right: -8%; top: 2%; width: 49%; height: 7px; background: var(--volt); rotate: -18deg;
  box-shadow: 0 13px 0 #e8ff0040, 0 26px 0 #e8ff0020;
}
.flyer__poster {
  position: relative; overflow: hidden; height: clamp(190px, 20vw, 250px); margin: 0 0 1.5rem;
  background: #141411; border: 1px solid #ffffff26; isolation: isolate;
}
.flyer__poster::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(0deg, #000a, transparent 34%), linear-gradient(90deg, #0004, transparent 40%);
}
.flyer__poster img {
  display: block; width: 100%; height: 100%; object-fit: cover; object-position: 68% 55%;
  transform: scale(1.035) translate3d(calc(var(--card-x, 0) * -5px), calc(var(--card-y, 0) * -5px), 0);
  transition: transform .5s var(--ease-out);
}
.flyer:hover .flyer__poster img {
  transform: scale(1.08) translate3d(calc(var(--card-x, 0) * -5px), calc(var(--card-y, 0) * -5px), 0);
}
.flyer__poster span {
  position: absolute; z-index: 1; left: 12px; bottom: 10px; color: #eee;
  font: 700 .6rem/1 var(--font-mono); letter-spacing: .12em; text-transform: uppercase;
}
.flyer__glyph { transform: translate3d(calc(var(--card-x, 0) * 12px), calc(var(--card-y, 0) * 12px), 0); }
.flyer:hover .flyer__glyph { transform: translate3d(calc(var(--card-x, 0) * 12px), calc(var(--card-y, 0) * 12px), 0) rotate(-8deg) scale(1.05); }
.flyer__inner > :not(.flyer__number):not(.flyer__texture):not(.flyer__glyph):not(.flyer__slash) { position: relative; z-index: 1; }

/* Retain a single soft flash; the detailed lightning does the visual work. */
@keyframes flash { 0% { opacity: .2; background: var(--volt); } 45% { opacity: .08; background: var(--paper); } 100% { opacity: 0; } }

html[data-motion="off"] { scroll-behavior: auto; }
html[data-motion="off"] .grain,
html[data-motion="off"] .hero__scroll span,
html[data-motion="off"] .flash,
html[data-motion="off"] body.is-shaking,
html[data-motion="off"] .signal-strip__track { animation: none !important; }
html[data-motion="off"] .intro,
html[data-motion="off"] .flyer__inner::after { display: none !important; }
html[data-motion="off"] .slam span { opacity: 1 !important; transform: none !important; }
html[data-motion="off"] .layer { transform: none !important; }
html[data-motion="off"] .strike::after { scale: 1 1; }
html[data-motion="off"] .flyer__inner,
html[data-motion="off"] .flyer__glyph,
html[data-motion="off"] .flyer__poster img { transition: none !important; }
html[data-motion="off"] .flyer__poster img,
html[data-motion="off"] .flyer:hover .flyer__poster img { transform: none !important; }

@media (prefers-reduced-motion: reduce) {
  .signal-strip__track { animation: none; }
  .flyer__inner, .flyer__glyph, .flyer__poster img { transition: none; }
  .flyer__poster img, .flyer:hover .flyer__poster img { transform: none; }
}
@media (max-width: 560px) {
  .hero__hud { font-size: .54rem; letter-spacing: .08em; }
  .motion-toggle { font-size: .6rem; }
  .motion-toggle--nav { font-size: .58rem; padding: .5em; }
  .bar__nav { gap: 10px; font-size: .68rem; letter-spacing: .06em; }
  .bar__cta { padding: .55em .65em; }
  .hero__actions { gap: 7px 16px; }
  .flyer__title { font-size: clamp(3.25rem, 15vw, 6rem); }
  .signal-strip__track { min-height: 44px; }
}
@media (max-width: 350px) {
  .bar__nav { gap: 7px; font-size: .6rem; }
  .motion-toggle--nav { font-size: .52rem; }
}
@media (max-width: 440px) {
  .foot__grid { grid-template-columns: 1fr; gap: 24px; }
  .foot__brand { grid-column: auto; }
}