/* ======================================================
   RACECAPTURE HEADER — ELEMENTOR NAV FIX
   Moved from Bluehost Theme Customizer → Additional CSS
   so it survives theme/host changes.
   ====================================================== */

/* Force header links to always be white */
.rc-site-header a,
.rc-site-header a:visited {
  color: #ffffff !important;
  text-decoration: none !important;
}

/* Hover / focus stays white */
.rc-site-header a:hover,
.rc-site-header a:focus-visible {
  color: #ffffff !important;
}

/* Explicit nav links (beats Elementor .elementor-kit-xxxx a) */
.rc-site-header .rc-main-nav a {
  color: #ffffff !important;
}

/* Dropdown links */
.rc-site-header .rc-submenu a {
  color: #ffffff !important;
}

/* Neutralize Elementor opacity ONLY on links */
.rc-site-header a,
.rc-site-header a * {
  opacity: 1 !important;
  filter: none !important;
}

/* Underline accent on hover */
.rc-site-header .rc-main-nav a {
  position: relative;
}

.rc-site-header .rc-main-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 0;
  height: 3px;
  background: linear-gradient(90deg, #e21b2f, #ff4053) !important;
  transition: width 0.2s ease;
}

.rc-site-header .rc-main-nav a:hover::after,
.rc-site-header .rc-main-nav a:focus-visible::after {
  width: 100% !important;
}

/* ======================================================
   ONE-LINE NAV — keep each menu item on a single line so
   "THE TEAM", "OUR MISSION", "PRIVACY POLICY" stop wrapping
   into two-line labels. The header has plenty of horizontal
   room when items don't wrap; the visual squish Sean saw was
   line-wrapping, not container overflow.
   ====================================================== */

/* Force every nav item to a single line. !important required to
   beat Elementor's per-link styles. */
.rc-site-header .rc-main-nav a,
.rc-site-header .rc-main-nav li,
.rc-site-header .rc-main-nav .elementor-item,
.rc-site-header .rc-main-nav .elementor-item-anchor {
  white-space: nowrap !important;
  word-break: keep-all !important;
}

/* Tighten the gap between menu items so the longer signed-in
   "MY ACCOUNT" label has room without pushing items off-row.
   Falls back to spec'd values for older Elementor versions. */
.rc-site-header .rc-main-nav {
  gap: 18px !important;
  column-gap: 18px !important;
}

.rc-site-header .rc-main-nav li {
  margin: 0 6px !important;
}

/* Slightly smaller nav font on tighter viewports — kicks in
   before items get crowded on mid-width screens. */
@media (max-width: 1280px) {
  .rc-site-header .rc-main-nav a,
  .rc-site-header .rc-main-nav .elementor-item {
    font-size: 13px !important;
    letter-spacing: 0.06em !important;
  }
  .rc-site-header .rc-main-nav { gap: 14px !important; column-gap: 14px !important; }
  .rc-site-header .rc-main-nav li { margin: 0 4px !important; }
}

/* On mobile, Elementor switches to its burger menu — these
   desktop rules don't apply there. */