:root {
  --navy: #101114;
  --ink: #f9f7f2;
  --blue: #f5c951;
  --blue-dark: #ffe3a1;
  --paper: #101114;
  --line: #39343a;
  --muted: #c3bdc8;
  --brand-light: #ffcf55;
  --gold: #ffcf55;
  --panel: #1b1b20;
}
header, footer {background: #0a0a0c}
header {border-bottom-color: #29252c}
nav a, .footer a, .footer p {color: #cfccd6}
nav a:hover, nav [aria-current] {color: var(--gold)}
.skip {color: #141319}
.central, .ghost {border-color: #746439}
.central:hover, .ghost:hover {background: #f5c95120}
.campaign-strip {
  background: #f6cd5d;
  color: #191206;
  text-align: center;
  font-size: .71rem;
  font-weight: 850;
  letter-spacing: .15em;
}
.campaign-strip a {display: inline-flex; align-items: center; gap: 12px; padding: 8px 10px}
.campaign-divider {opacity: .6}
.hero {
  background: radial-gradient(ellipse at 78% 43%, #634218 0%, #251b14 35%, transparent 63%), #101014;
}
.hero-grid {min-height: 488px}
.hero .eyebrow {color: var(--gold)}
.hero .lead, .hero-price {color: #e4dbcc}
.hero .primary, .primary {background: var(--gold); color: #1f1605}
.hero .primary:hover, .primary:hover {background: #ffe7a7}
.hero .ghost, .outline {border-color: #806c3a}
.outline {background: #201d18; color: #ffe1a1}
.outline:hover {border-color: var(--gold); background: #352919}
.orbit {border-color: #d3aa5455; box-shadow: 0 0 0 22px #ffd6700e, 0 0 0 46px #ffdc760a}
.bf-art {
  width: min(86%, 430px);
  padding: clamp(18px, 3vw, 38px);
  border-radius: 15px;
  border: 1px solid #a57b3b;
  background: linear-gradient(150deg,#3d2c17,#161317 56%,#211911);
  box-shadow: 0 27px 90px #0009, inset 0 1px #ffe1a85c;
  transform: rotate(-5deg);
}
.bf-art-top, .bf-art-bottom {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  color: #f0d8a8; font-size: clamp(.57rem, 1.15vw, .75rem);
  letter-spacing: .12em; font-weight: 780;
}
.bf-art-top {border-bottom: 1px solid #785929; padding-bottom: 12px}
.bf-art-bottom {border-top: 1px solid #785929; padding-top: 12px}
.bf-art strong {
  display: block; margin: 15px 0 17px;
  font-size: clamp(3rem, 7vw, 6.4rem);
  font-weight: 950; line-height: .83; letter-spacing: -.075em;
  color: #fff8e5;
}
.bf-art em {font-style: normal; color: var(--gold)}
.graphic {border-color: #b8914890; background: linear-gradient(140deg,#473017,#19161a)}
.graphic small {color: #ffe0a2}
.play {background: #f6cc65; color: #1f1605}
.speed-graphic {background: linear-gradient(145deg,#312253,#14122a 60%,#193d53); border-color: #a686e6; padding: 20px}
.gamepad {width: 115px; color: #bf9bff; filter: drop-shadow(0 0 8px #a46bff9c)}
.speed-graphic .gamepad {width: 125px; margin-bottom: 4px}
.speed-graphic small {color: #b4eaff}
.slider-controls button {background: #221c16; border-color: #755d37}
.slider-controls button:hover {background: #59421d}
.slider-dots button {background: transparent}
.slider-dots button::before {background: #bca682}
.slider-dots button[aria-current]::before {background: var(--gold)}
.quick, .plan, .service {background: var(--panel)}
.quick a:hover strong, .service span, .back {color: var(--gold)}
.speed-plan {position: relative; isolation: isolate; min-height: 290px; overflow: hidden}
.speed-plan h3 {font-size: clamp(2.75rem, 5vw, 4.15rem)}
.speed-plan .tag {background: #322a1d; color: #fbe0a0; text-transform: uppercase; letter-spacing: .08em}
.speed-plan .button {width: 100%; justify-content: space-between}
.gamer-plan {border-color: #a48cf9; background: radial-gradient(ellipse at 95% 8%, #482c79, transparent 61%), linear-gradient(150deg, #221a38, #131722 75%); box-shadow: inset 0 0 28px #9b6bff26}
.gamer-plan .gamepad {position: absolute; right: 11px; top: 30px; z-index: -1; opacity: .78}
.gamer-plan .tag {background: #382852; color: #e4ccff}
.gamer-plan h3 {color: #c0f4ff}
.gamer-plan .button {border-color: #a48cf9; background: #322547; color: #f1e2ff}
.gamer-plan .button:hover {background: #48316b}
.energy {background: #17251d; border-color: #395040}
.energy .eyebrow {color: #a3e1b9}
.registration select {background: #242329; color: var(--ink); border-color: #625769}
a:focus-visible, summary:focus-visible, .slider-controls button:focus-visible, select:focus-visible {outline-color: #ffdc79}
@media (hover: hover) {
  .speed-plan {transition: transform .2s, border-color .2s}
  .speed-plan:hover {transform: translateY(-4px); border-color: var(--gold)}
  .gamer-plan:hover {border-color: #c4aaff}
}
@media (prefers-reduced-motion: no-preference) {
  .gamer-plan .gamepad {animation: float-pad 3.8s ease-in-out infinite alternate}
  .slide:not([hidden]) .hero-art {animation: reveal-art .38s ease-out}
}
@keyframes float-pad {to {transform: translateY(-6px) rotate(-4deg)}}
@keyframes reveal-art {from {opacity: .45; transform: translateY(5px)} to {opacity: 1; transform: none}}
@media (max-width: 820px) {.hero-grid {min-height: 420px}}
@media (max-width: 560px) {
  .hero-grid {min-height: 0; grid-template-rows: minmax(290px, auto) 200px}
  .bf-art {width: min(84%, 275px); padding: 13px 19px}
  .bf-art strong {font-size: clamp(3rem, 15vw, 4.35rem); margin: 9px 0 11px}
  .bf-art-top, .bf-art-bottom {padding-block: 6px}
  .speed-graphic .gamepad {width: 80px}
  .speed-graphic {padding: 8px}
}