/* ===== Neon landing page (paste into Appearance → Customize → Additional CSS) ===== */

/* ---- Video wrapper ---- */
.neon-video{
  max-width: 900px;
  margin: 26px auto 0;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.12);
  background: #000;
}

/* VideoPress / iframe sizing */
.neon-video iframe,
.neon-video video,
.neon-video .videopress-player iframe,
.neon-video .videopress-player video{
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  display: block !important;
  border: 0 !important;
}

/* If the theme sets fixed heights, remove them inside the player */
.neon-video *{
  max-height: none !important;
}


/* ---- CTA buttons container ---- */
.neon-cta{
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 20px;
}

/* Desktop: keep on one line + equal size buttons */
.neon-cta-inline{
  display: flex;
  justify-content: center;
  align-items: stretch;   /* ensures same height */
  gap: 16px;
  flex-wrap: nowrap;      /* forces single row */
  margin-top: 22px;
}

/* ---- Button base ---- */
.neon-btn{
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;

  width: 240px;           /* equal width */
  height: 56px;           /* equal height */

  padding: 0 16px;        /* vertical centering handled by flex */
  border-radius: 14px;

  font-weight: 800;
  font-size: 16px;
  line-height: 1.2;

  text-decoration: none !important;
  box-shadow: none !important;
  outline: none !important;

  white-space: nowrap;
}

/* Primary + Outline */
.neon-btn-primary{
  background: #111;
  color: #fff !important;
  border: 2px solid #111;
}

.neon-btn-outline{
  background: transparent;
  color: #111 !important;
  border: 2px solid #111;
}

/* Help text */
.neon-help{
  text-align: center;
  margin: 12px 0 0;
  font-size: 13px;
  opacity: .75;
}
.neon-help a{
  font-weight: 800;
  text-decoration: none !important;
}

/* Gymdesk app line (compact) */
.neon-app{
  text-align: center;
  margin-top: 12px;
  font-size: 14px;
  opacity: .85;
  line-height: 1.4;
}
.neon-app a{
  font-weight: 800;
  text-decoration: none !important;
  margin-left: 8px;
}
.neon-app span{
  margin: 0 8px;
  opacity: .7;
}

/* Mobile: allow wrapping/stacking */
@media (max-width: 900px){
  .neon-cta-inline{
    flex-wrap: wrap;
  }
  .neon-btn{
    width: min(420px, 92%);
  }
}
/* === Make ALL CTA buttons black with white text === */

.neon-btn-primary,
.neon-btn-outline{
  background: #111 !important;
  color: #fff !important;
  border: 2px solid #111 !important;
}

/* Optional: subtle hover */
.neon-btn-primary:hover,
.neon-btn-outline:hover{
  background: #000 !important;
  border-color: #000 !important;
}