html, body { margin:0; padding:0; background:#0A0A0A; }
  body { -webkit-font-smoothing:antialiased; }
  a { color:#F2C14E; text-decoration:none; }
  a:hover { color:#FFD877; }
  ::selection { background:#F2C14E; color:#0A0A0A; }
  input, select, textarea, button { font-family:inherit; }
  @keyframes fr-pulse { 0%,100% { opacity:.55; transform:scale(1); } 50% { opacity:1; transform:scale(1.35); } }

/* ── responsive branches ──────────────────────────────────────────────────
   The design carried two hand-built layouts and switched between them in JS
   at max-width:720px. Same breakpoint here, done in CSS so there is no
   flash of the wrong layout before scripts run. */
@media (min-width: 721px) { .on-mobile  { display: none !important; } }
@media (max-width: 720px) { .on-desktop { display: none !important; } }

[hidden] { display: none !important; }

/* ── "which door" picker ───────────────────────────────────────────────── */
.path-btn {
  font-family: 'Oswald', sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 15px 12px;
  min-height: 50px;
  cursor: pointer;
  border-radius: 2px;
  text-align: center;
  background: #0A0A0A;
  border: 1px solid rgba(237,232,222,.18);
  color: #CFC8BD;
}
.path-btn:hover { border-color: rgba(242,193,78,.55); color: #EDE8DE; }
.path-btn.is-active {
  background: rgba(242,193,78,.14);
  border-color: #F2C14E;
  color: #F2C14E;
}

/* ── FAQ accordion ─────────────────────────────────────────────────────── */
.faq-a { display: block; }

/* ── empty image slot in "The Reel" ────────────────────────────────────── */
.image-slot {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  text-align: center;
  border: 1px dashed rgba(242,193,78,.28);
  border-radius: 4px;
  background: #101010;
  color: #8E8880;
  font-size: 15px;
}

#sticky-cta { transition: opacity .2s ease; }


.lander-s1:hover { background:#FFD877 }
.lander-s2:hover { background:#FFD877; box-shadow:0 14px 40px rgba(242,193,78,.34) }
.lander-s3:hover { border-color:#F2C14E; color:#F2C14E }
.lander-s4:focus { border-color:#F2C14E }
.lander-s5:hover { background:rgba(242,193,78,.05) }
