/* ViceCity OS — neon accent layer (matches hero video). Recolors warm/yellow
   accents to pink / purple / cyan / green. Loaded after the Webflow stylesheet. */

:root{
  --vc-magenta:#ff2d95;
  --vc-cyan:#1ef0ff;
  --vc-violet:#a855ff;
  --vc-green:#39ff9c;
  /* tan/gold panel tone -> soft neon lavender */
  --biege:#cbb6ef;
}

/* active timeline step dot: amber #ffb937 -> neon */
.circle_item.current .circle_dot{
  background:linear-gradient(135deg,var(--vc-cyan),var(--vc-magenta)) !important;
  box-shadow:0 0 14px rgba(255,45,149,.85),0 0 7px rgba(30,240,255,.7) !important;
}
.circle_link:hover .circle_dot{ box-shadow:0 0 12px rgba(30,240,255,.85) !important; }

/* nav separator dots -> neon */
.h_dot{
  background:linear-gradient(135deg,var(--vc-cyan),var(--vc-magenta)) !important;
  box-shadow:0 0 6px rgba(255,45,149,.6);
}
.dot_bold{ background:var(--vc-green) !important; box-shadow:0 0 8px rgba(57,255,156,.7); }
.dot_menu{ background:var(--vc-magenta) !important; }

/* link hover accent */
a:hover,a.h_link:hover,a.h_link:hover div{ color:var(--vc-magenta) !important; }

/* selection */
::selection{ background:var(--vc-magenta); color:#fff; }

/* purple→blue tint on the section background image (theme match, no new image) */
.background_image{ position:relative; overflow:hidden; }
.background_image img{ filter:grayscale(1) contrast(1.12) brightness(.82) !important; position:relative; z-index:0; }
.background_image::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(135deg,#3b1d8f 0%,#6d3bf5 45%,#2563eb 100%);
  mix-blend-mode:lighten; opacity:.62;
}

/* floating "Join Waitlist" button (bottom-right): wider, less oval */
a[data-vc-waitlist]{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  padding:15px 42px !important;
  min-width:210px;
  border-radius:16px !important;
  font-weight:600;
  letter-spacing:.01em;
  white-space:nowrap;
}
a[data-vc-waitlist] > div{ width:auto !important; }
/* center the floating button text (Webflow set a tiny line-height) */
a[data-vc-waitlist], a[data-vc-waitlist] > div{ line-height:1 !important; }
a[data-vc-waitlist] > div{ display:flex; align-items:center; }

/* ===== modal waitlist form: bigger, cleaner fields ===== */
.modal_headline{ font-size:clamp(34px,4vw,46px) !important; line-height:1.05 !important; }
.headline_box .txt_base.opacity{ font-size:16px !important; }
.field_text{ font-size:15px !important; font-weight:600 !important; letter-spacing:.01em; margin-bottom:10px !important; display:block; }
.field_input{
  font-size:18px !important; line-height:1.3 !important;
  padding:16px 18px !important; height:auto !important; width:100% !important;
  border:1.5px solid rgba(10,4,20,.14) !important; border-radius:14px !important;
  background:#fff !important; transition:border-color .15s, box-shadow .15s;
}
.field_input::placeholder{ color:rgba(10,4,20,.4); }
.field_input:focus{ border-color:#7c5cff !important; box-shadow:0 0 0 3px rgba(124,92,255,.18) !important; outline:none; }
.field_box{ margin-bottom:24px !important; }
.flex_modal{ margin-top:6px; }
.submit_form{ font-size:18px !important; font-weight:700 !important; padding:18px !important; border-radius:16px !important; }
.note_pp .txt_base{ font-size:14px !important; }

/* hide the floating Join Waitlist button on mobile/tablet (it overlaps the hero CTA;
   mobile already has the Menu + hero "Join the Waitlist") */
@media (max-width: 991px){
  .inline_referral, a[data-vc-waitlist]{ display:none !important; }
}