/* ============================================================
   ASTRA HEADER BACKGROUND OVERRIDE
   Make the header dark so the ambient FX (grid, orbs, scan) is visible.
   ============================================================ */
.site-header,
.site-header > div,
.main-header-bar,
.main-header-bar-wrap,
.ast-builder-grid-row,
.ast-header-break-point .main-header-bar {
  background: #06000f !important;
  background-color: #06000f !important;
  position: relative !important;
}

/* Make sure header content (logo + menu) sits ABOVE the FX overlay */
.site-header .site-branding,
.site-header .main-header-bar-navigation,
.site-header .ast-builder-grid-row > div,
.site-header .main-header-menu,
.site-header .menu-toggle {
  position: relative !important;
  z-index: 5 !important;
}

/* FX overlay sits at the bottom of the stacking order inside the header */
.cgp-hdr-fx {
  z-index: 0 !important;
}

tput: No value for $TERM and no -T specified

/* ════════════════════════════════════════════════════════════════════════
   CROWN GRADING PRO — Futuristic AI Header
   ════════════════════════════════════════════════════════════════════════ */

/* ── Ambient FX container (positioned via JS) ── */
.cgp-hdr-fx {
  visibility: hidden;
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  overflow: hidden;
}

/* Circuit / node grid */
.cgp-hdr-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(114,28,203,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(114,28,203,.08) 1px, transparent 1px);
  background-size: 38px 38px;
}
.cgp-hdr-grid::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(circle, rgba(212,175,55,.3) 1.5px, transparent 1.5px);
  background-size: 38px 38px;
  background-position: 19px 19px;
  opacity: .45;
}

/* Ambient orb glows — left purple, right gold hint */
.cgp-hdr-orbs {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 6% 50%, rgba(114,28,203,.35) 0%, transparent 42%),
    radial-gradient(ellipse at 94% 50%, rgba(212,175,55,.12) 0%, transparent 38%);
  animation: cgp-hdr-orb 7s ease-in-out infinite alternate;
}
@keyframes cgp-hdr-orb { 0%{opacity:.6} 100%{opacity:1} }

/* Gold data scan line sweeping top → bottom */
.cgp-hdr-scan {
  position: absolute;
  left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(114,28,203,.5) 12%,
    rgba(212,175,55,.95) 50%,
    rgba(114,28,203,.5) 88%,
    transparent 100%);
  box-shadow: 0 0 8px rgba(212,175,55,.6), 0 0 20px rgba(212,175,55,.25);
  animation: cgp-hdr-scan-line 6s linear infinite;
  opacity: 0;
}
@keyframes cgp-hdr-scan-line {
  0%  {top:0%;    opacity:0;}
  4%  {opacity:1;}
  88% {opacity:.35;}
  100%{top:100%;  opacity:0;}
}

/* Animated gold/purple gradient bottom border */
.cgp-hdr-border {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(114,28,203,.65) 18%,
    rgba(212,175,55,1) 50%,
    rgba(114,28,203,.65) 82%,
    transparent 100%);
  animation: cgp-hdr-border-pulse 3s ease-in-out infinite alternate;
}
@keyframes cgp-hdr-border-pulse {
  0%   {opacity:.45; box-shadow:0 0 4px rgba(212,175,55,.25);}
  100% {opacity:1;   box-shadow:0 0 14px rgba(212,175,55,.7), 0 0 30px rgba(212,175,55,.2);}
}

/* Data node dots that blink along the bottom border */
.cgp-hdr-node {
  position: absolute;
  bottom: 0;
  width: 4px; height: 4px;
  border-radius: 50%;
  background: #ffd700;
  box-shadow: 0 0 8px rgba(212,175,55,1), 0 0 16px rgba(212,175,55,.5);
  animation: cgp-node-blink 2.4s ease-in-out infinite;
  transform: translateY(50%);
}
@keyframes cgp-node-blink {
  0%,100%{opacity:.0; transform:translateY(50%) scale(.4);}
  50%    {opacity:1;  transform:translateY(50%) scale(1);}
}

/* ── Logo glow pulse ── */
.elementor-widget-image img, .site-branding img, .ast-site-identity img {
  filter: drop-shadow(0 0 10px rgba(212,175,55,.35)) !important;
  animation: cgp-logo-hdr 4.5s ease-in-out infinite !important;
  transition: filter .3s ease !important;
}
@keyframes cgp-logo-hdr {
  0%,100% {filter: drop-shadow(0 0 8px rgba(212,175,55,.3));}
  50%     {filter: drop-shadow(0 0 22px rgba(212,175,55,.75));}
}

/* ── Brand name + AI badge (injected via JS) ── */
.cgp-hdr-brand {
  font-family: 'Orbitron', sans-serif;
  font-weight: 900;
  font-size: 0.65rem;
  letter-spacing: 3px;
  text-transform: uppercase;
  white-space: nowrap;
  background: linear-gradient(135deg,#b8860b 0%,#ffd700 28%,#fffbe0 50%,#ffd700 72%,#b8860b 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: cgp-gold-sweep 6s ease-in-out infinite;
  filter: drop-shadow(0 0 5px rgba(212,175,55,.2));
  line-height: 1.25;
}
.cgp-hdr-brand span {
  display: block;
  font-size: 0.4rem;
  letter-spacing: 4.5px;
  opacity: .6;
  margin-top: 1px;
}
@keyframes cgp-gold-sweep {
  0%,100%{background-position:0% center}
  50%    {background-position:100% center}
}

/* AI badge — pulsing green dot */
.cgp-hdr-ai {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-family: 'Orbitron', sans-serif;
  font-size: 0.4rem;
  font-weight: 700;
  letter-spacing: 2px;
  color: rgba(212,175,55,.6);
  border: 1px solid rgba(212,175,55,.28);
  border-radius: 20px;
  padding: 2px 8px 2px 5px;
  animation: cgp-ai-badge 4s ease-in-out infinite;
}
.cgp-hdr-ai-dot {
  width: 5px; height: 5px;
  border-radius: 50%;
  background: #3dffa0;
  box-shadow: 0 0 6px rgba(61,255,160,.9);
  animation: cgp-ai-dot-pulse 1.2s ease-in-out infinite;
  flex-shrink: 0;
}
@keyframes cgp-ai-badge {
  0%,100%{opacity:.6; border-color:rgba(212,175,55,.22);}
  50%    {opacity:1;  border-color:rgba(212,175,55,.5);}
}
@keyframes cgp-ai-dot-pulse {
  0%,100%{opacity:.5; box-shadow:0 0 4px rgba(61,255,160,.7); transform:scale(.85);}
  50%    {opacity:1;  box-shadow:0 0 10px rgba(61,255,160,1); transform:scale(1.2);}
}


/* ── Nav spread — fill full width evenly ── */
.elementor-widget-nav-menu, .elementor-widget-nav-menu .elementor-widget-container, .elementor-nav-menu--main.elementor-nav-menu__container, .main-header-menu, .main-header-bar-navigation {
  width: 100% !important;
}
ul.elementor-nav-menu, ul.main-header-menu {
  width: 100% !important;
  display: flex !important;
  justify-content: space-evenly !important;
  flex-wrap: nowrap !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
ul.elementor-nav-menu, ul.main-header-menu > li {
  flex: 1 1 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ── Nav base — clean Rajdhani ── */
.elementor-nav-menu--main .elementor-item, .main-header-menu > .menu-item > a {
  font-family: 'Rajdhani', sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.92rem !important;
  letter-spacing: 1.1px !important;
  text-transform: uppercase !important;
  color: rgba(220,210,255,.78) !important;
  padding: 8px 10px !important;
  margin: 0 1px !important;
  border: none !important;
  background: transparent !important;
  border-radius: 0 !important;
  transition: color .2s ease, text-shadow .2s ease !important;
  position: relative !important;
}
.elementor-nav-menu--main .elementor-item, .main-header-menu > .menu-item > a:hover,
.elementor-nav-menu--main .elementor-item, .main-header-menu > .menu-item > a.elementor-item-active {
  color: #ffd700 !important;
  text-shadow: 0 0 12px rgba(212,175,55,.55), 0 0 24px rgba(212,175,55,.2) !important;
  background: transparent !important;
}

/* Gold slim underline pointer */
.e--pointer-underline .elementor-item::after, .main-header-menu > .menu-item > a::after {
  background-color: #d4af37 !important;
  height: 1.5px !important;
}

/* Cyber top-left corner bracket on hover */
.elementor-nav-menu--main li:not(.menu-item-1995):not(.menu-item-2011) > .elementor-item::before, .main-header-menu > li.menu-item:not(.menu-item-1995):not(.menu-item-2011) > a::before {
  content: '' !important;
  position: absolute !important;
  top: 3px !important; left: 3px !important;
  width: 7px !important; height: 7px !important;
  border-top: 1.5px solid rgba(212,175,55,.85) !important;
  border-left: 1.5px solid rgba(212,175,55,.85) !important;
  opacity: 0 !important;
  transform: translate(-3px,-3px) !important;
  transition: opacity .2s ease, transform .2s ease !important;
  background: transparent !important;
  animation: none !important;
}
.elementor-nav-menu--main li:not(.menu-item-1995):not(.menu-item-2011):hover > .elementor-item::before, .main-header-menu > li.menu-item:not(.menu-item-1995):not(.menu-item-2011):hover > a::before {
  opacity: 1 !important;
  transform: translate(0,0) !important;
}

/* ── Submit Cards — metallic animated CTA ── */
.elementor-nav-menu--main li.menu-item-1995 > .elementor-item, .main-header-menu > li.menu-item-1995 > a {
  font-family: 'Orbitron', sans-serif !important;
  font-size: 0.62rem !important;
  font-weight: 900 !important;
  letter-spacing: 1.5px !important;
  background: linear-gradient(135deg,#c8960c 0%,#ffd700 40%,#fffde0 50%,#ffd700 60%,#c8960c 100%) !important;
  background-size: 300% auto !important;
  color: #07000f !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 8px 15px !important;
  margin: 0 5px !important;
  animation: cgp-submit-shine 4s ease-in-out infinite !important;
  transition: transform .2s ease, box-shadow .2s ease !important;
}
@keyframes cgp-submit-shine {
  0%,100%{background-position:0% center;   box-shadow:0 2px 16px rgba(212,175,55,.4);}
  50%    {background-position:100% center; box-shadow:0 2px 30px rgba(212,175,55,.8);}
}
.elementor-nav-menu--main li.menu-item-1995 > .elementor-item, .main-header-menu > li.menu-item-1995 > a:hover {
  transform: translateY(-2px) scale(1.03) !important;
  box-shadow: 0 4px 36px rgba(212,175,55,.85) !important;
  color: #07000f !important;
}
.elementor-nav-menu--main li.menu-item-1995 > .elementor-item, .main-header-menu > li.menu-item-1995 > a::before,
.elementor-nav-menu--main li.menu-item-1995 > .elementor-item, .main-header-menu > li.menu-item-1995 > a::after {
  display: none !important;
}

/* ── Login — neon outlined pill ── */
.elementor-nav-menu--main li.menu-item-2011 > .elementor-item, .main-header-menu > li.menu-item-2011 > a {
  font-family: 'Orbitron', sans-serif !important;
  font-size: 0.62rem !important;
  font-weight: 700 !important;
  letter-spacing: 1.4px !important;
  color: #d4af37 !important;
  border: 1px solid rgba(212,175,55,.55) !important;
  border-radius: 4px !important;
  padding: 7px 14px !important;
  margin: 0 0 0 4px !important;
  background: transparent !important;
  transition: all .25s ease !important;
}
.elementor-nav-menu--main li.menu-item-2011 > .elementor-item, .main-header-menu > li.menu-item-2011 > a:hover {
  background: rgba(212,175,55,.08) !important;
  border-color: #ffd700 !important;
  color: #ffd700 !important;
  box-shadow: 0 0 16px rgba(212,175,55,.4), inset 0 0 16px rgba(212,175,55,.04) !important;
}
.elementor-nav-menu--main li.menu-item-2011 > .elementor-item, .main-header-menu > li.menu-item-2011 > a::before,
.elementor-nav-menu--main li.menu-item-2011 > .elementor-item, .main-header-menu > li.menu-item-2011 > a::after {
  display: none !important;
}



/* ── Ensure dropdowns always float above page content ── */
.elementor-location-header {
  z-index: 9999 !important;
  position: relative !important;
}
.elementor-nav-menu--main .elementor-nav-menu .sub-menu {
  z-index: 99999 !important;
}
/* ── Z-index: dropdowns above hero ── */
.elementor-widget-nav-menu,
.elementor-nav-menu--main,
.elementor-nav-menu__container {
  position: relative !important;
  z-index: 9999 !important;
}
/* ── Dropdown panels ── */
.elementor-nav-menu--main .elementor-nav-menu .sub-menu {
  z-index: 9999 !important;
  background: linear-gradient(160deg,#06001a,#14032e) !important;
  border: 1px solid rgba(212,175,55,.2) !important;
  border-top: 2px solid rgba(212,175,55,.55) !important;
  border-radius: 0 0 8px 8px !important;
  box-shadow: 0 16px 48px rgba(0,0,0,.8), 0 0 20px rgba(114,28,203,.25) !important;
  min-width: 200px !important;
}
.elementor-nav-menu--main .elementor-nav-menu .sub-menu .menu-item a {
  color: rgba(220,210,255,.8) !important;
  font-family: 'Rajdhani', sans-serif !important;
  font-size: 0.82rem !important;
  letter-spacing: .7px !important;
  padding: 10px 18px !important;
  transition: color .18s ease, padding-left .18s ease, background .18s ease !important;
  border-left: 2px solid transparent !important;
}
.elementor-nav-menu--main .elementor-nav-menu .sub-menu .menu-item a:hover {
  color: #ffd700 !important;
  padding-left: 22px !important;
  background: rgba(212,175,55,.05) !important;
  border-left-color: rgba(212,175,55,.5) !important;
}



/* ── Mobile nav fix ── */
@media (max-width: 767px) {
  /* Hide the horizontal nav, let Elementor hamburger take over */
  .elementor-nav-menu--main.elementor-nav-menu__container {
    display: none !important;
  }
  /* Show the hamburger toggle */
  .elementor-widget-nav-menu .elementor-menu-toggle {
    display: flex !important;
  }
  /* Reset our flex overrides that break mobile layout */
  ul.elementor-nav-menu, ul.main-header-menu {
    display: block !important;
  }
  ul.elementor-nav-menu, ul.main-header-menu > li {
    flex: auto !important;
    display: block !important;
  }
}


/* ── Astra-only adjustments (only applies when Astra renders the header) ── */
.ast-builder-grid-row {
  position: relative !important;
}
.main-header-bar {
  position: relative !important;
  z-index: 1 !important;
}
.main-header-bar .site-branding,
.main-header-bar .main-header-bar-navigation {
  position: relative !important;
  z-index: 2 !important;
}

/* Hide Astra's default menu border (we set our own animation) */
.main-header-menu .menu-item > a {
  border-bottom: none !important;
}

/* Astra mobile menu trigger - match Elementor's style */
.ast-header-break-point .main-header-bar .ast-button-wrap {
  position: relative;
  z-index: 3;
}

/* ============================================================
   FIX: text wrapping in nav menu items
   ============================================================ */
ul.main-header-menu > li.menu-item > a,
.main-header-menu > .menu-item > a,
.main-header-bar-navigation .menu-link,
.main-header-bar-navigation a {
  white-space: nowrap !important;
  word-break: keep-all !important;
}

/* Stop Astra from forcing equal-width items — let menu wrap naturally if needed */
ul.main-header-menu {
  flex-wrap: nowrap !important;
}
ul.main-header-menu > li.menu-item {
  flex: 0 0 auto !important;  /* override the flex:1 1 0 from earlier; let items use natural width */
}

/* ============================================================
   FIX: make FX overlay visible
   ============================================================ */
.cgp-hdr-fx {
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: 0 !important;
  visibility: visible !important;
  overflow: hidden !important;
  display: block !important;
}

/* Make sure the header parent allows the FX to fill it */
.site-header,
#ast-desktop-header,
.ast-primary-header-bar,
.main-header-bar,
.ast-main-header-wrap {
  overflow: visible !important;  /* don't clip the FX */
}

.ast-primary-header-bar {
  position: relative !important;
  isolation: isolate !important;  /* create a new stacking context */
}

/* Force FX child elements to be visible */
.cgp-hdr-grid,
.cgp-hdr-orbs,
.cgp-hdr-scan,
.cgp-hdr-border,
#cgp-hdr-nodes {
  display: block !important;
  visibility: visible !important;
  pointer-events: none !important;
}


/* ============================================================
   FIX: Dropdown (sub-menu) styling
   Astra's default sub-menu has white bg + invisible text.
   Apply Crown dark theme to dropdowns.
   ============================================================ */

/* The dropdown container */
.main-header-menu .sub-menu,
.ast-builder-menu .sub-menu,
.main-navigation .sub-menu,
ul.main-header-menu ul.sub-menu {
  background: #06000f !important;
  background-color: #06000f !important;
  border: 1px solid rgba(212,175,55,0.35) !important;
  border-radius: 6px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.55), 0 0 24px rgba(114,28,203,0.2) !important;
  padding: 8px 0 !important;
  min-width: 220px !important;
}

/* Dropdown items (links) */
.main-header-menu .sub-menu .menu-item > a,
.main-header-menu .sub-menu a,
.ast-builder-menu .sub-menu a,
ul.sub-menu li.menu-item > a {
  font-family: 'Rajdhani', sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.88rem !important;
  letter-spacing: 0.7px !important;
  color: rgba(220,210,255,0.85) !important;
  background: transparent !important;
  padding: 10px 18px !important;
  display: block !important;
  border-bottom: 1px solid rgba(212,175,55,0.08) !important;
  text-transform: none !important;
  transition: color .2s ease, background .2s ease, padding-left .2s ease !important;
}

/* Last item — no border under it */
.main-header-menu .sub-menu .menu-item:last-child > a,
.main-header-menu .sub-menu li:last-child > a {
  border-bottom: none !important;
}

/* Hover state on dropdown item */
.main-header-menu .sub-menu .menu-item > a:hover,
.main-header-menu .sub-menu .current-menu-item > a,
.main-header-menu .sub-menu a:hover {
  color: #ffd700 !important;
  background: rgba(212,175,55,0.08) !important;
  padding-left: 24px !important;
  text-shadow: 0 0 12px rgba(212,175,55,0.4) !important;
}


/* ============================================================
   FIX: Mobile off-canvas / popup menu
   Astra's default mobile drawer is white — apply Crown dark theme.
   ============================================================ */
.ast-mobile-popup-drawer,
.ast-mobile-popup-content,
.ast-mobile-popup-inner,
.ast-mobile-popup-overlay,
.ast-mobile-header-wrap,
#ast-mobile-popup,
#ast-mobile-header,
.ast-mobile-popup-drawer .ast-mobile-popup-content,
.ast-builder-menu-mobile,
.ast-mobile-menu-buttons {
  background: #06000f !important;
  background-color: #06000f !important;
  color: rgba(220,210,255,0.9) !important;
}

/* Mobile menu items */
.ast-mobile-popup-drawer .menu-item > a,
.ast-mobile-popup-content .menu-item > .menu-link,
.ast-mobile-popup-content .menu-item > a,
#ast-mobile-popup .menu-item > a,
.menu-mobile .menu-item > a,
.ast-builder-menu-mobile .menu-item > a {
  font-family: 'Rajdhani', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 1.1px !important;
  text-transform: uppercase !important;
  color: rgba(220,210,255,0.85) !important;
  background: transparent !important;
  border-bottom: 1px solid rgba(212,175,55,0.12) !important;
  padding: 14px 20px !important;
}

/* Mobile menu hover/current */
.ast-mobile-popup-drawer .menu-item > a:hover,
.ast-mobile-popup-content .current-menu-item > a,
.ast-mobile-popup-content .menu-item > a:hover {
  color: #ffd700 !important;
  background: rgba(212,175,55,0.06) !important;
  text-shadow: 0 0 12px rgba(212,175,55,0.4) !important;
}

/* Mobile dropdown toggle arrows */
.ast-mobile-popup-drawer .ast-menu-toggle,
.ast-mobile-popup-content .ast-menu-toggle {
  color: rgba(212,175,55,0.85) !important;
}

/* Close button (X) — make it gold */
.ast-mobile-popup-drawer .menu-toggle-close,
#menu-toggle-close,
.ast-mobile-popup-content .menu-toggle-close {
  color: #d4af37 !important;
}

/* Submit button (menu-item-1995) on mobile — keep gold gradient */
.ast-mobile-popup-content li.menu-item-1995 > a {
  background: linear-gradient(135deg,#c8960c 0%,#ffd700 40%,#fffde0 50%,#ffd700 60%,#c8960c 100%) !important;
  background-size: 300% auto !important;
  color: #07000f !important;
  margin: 12px 16px !important;
  border-radius: 6px !important;
  text-align: center !important;
  border: none !important;
}


/* ============================================================
   PRECISE FIX (v2): Royal Purple + Gold theme
   Targets ACTUAL Astra classes after inspecting the live DOM
   ============================================================ */

/* HEADER BACKGROUND — royal purple instead of navy */
.site-header,
.site-header > div,
.main-header-bar,
.main-header-bar-wrap,
.ast-builder-grid-row,
.ast-primary-header-bar,
.ast-main-header-wrap,
.ast-header-break-point .main-header-bar,
.ast-mobile-header-wrap,
.ast-mobile-header-content,
#ast-mobile-header {
  background: #1a0a3a !important;
  background-color: #1a0a3a !important;
}

/* ────────────────────────────────────────────────────────
   HAMBURGER (3-LINE) BUTTON — change from blue to gold
   ──────────────────────────────────────────────────────── */
.ast-menu-toggle,
.menu-toggle,
button.menu-toggle {
  background: transparent !important;
  color: #d4af37 !important;
}
.ast-menu-toggle .ast-icon,
.ast-menu-toggle svg,
.ast-arrow-svg,
.ast-menu-toggle .ast-arrow-svg {
  fill: #d4af37 !important;
  color: #d4af37 !important;
}
.ast-menu-toggle .ast-arrow-svg path,
.ast-menu-toggle svg path,
.ast-menu-toggle svg line,
.ast-menu-toggle svg polyline,
.ast-menu-toggle svg rect {
  fill: #d4af37 !important;
  stroke: #d4af37 !important;
}

/* ────────────────────────────────────────────────────────
   MOBILE MENU CONTAINER — actual classes from DOM
   ──────────────────────────────────────────────────────── */
#ast-hf-mobile-menu,
.ast-builder-menu-mobile #ast-hf-mobile-menu,
.ast-builder-menu-mobile .main-header-menu,
#ast-mobile-site-navigation .main-navigation,
#ast-mobile-site-navigation ul,
.main-navigation > ul.main-header-menu {
  background: #1a0a3a !important;
  background-color: #1a0a3a !important;
}

/* ────────────────────────────────────────────────────────
   MOBILE MENU LINKS — Astra uses .menu-link (not just <a>)
   ──────────────────────────────────────────────────────── */
#ast-hf-mobile-menu .menu-item > .menu-link,
#ast-hf-mobile-menu .menu-link,
.ast-builder-menu-mobile .menu-item > .menu-link,
.main-header-menu .menu-item > .menu-link {
  font-family: 'Rajdhani', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 1.1px !important;
  text-transform: uppercase !important;
  color: rgba(220,210,255,0.85) !important;
  background: transparent !important;
  padding: 14px 20px !important;
  border-bottom: 1px solid rgba(212,175,55,0.18) !important;
  display: block !important;
}

#ast-hf-mobile-menu .menu-item > .menu-link:hover,
#ast-hf-mobile-menu .current-menu-item > .menu-link,
.main-header-menu .menu-item > .menu-link:hover,
.main-header-menu .current-menu-item > .menu-link {
  color: #ffd700 !important;
  background: rgba(212,175,55,0.08) !important;
  text-shadow: 0 0 12px rgba(212,175,55,0.4) !important;
}

/* Mobile submit button (gold gradient) */
#ast-hf-mobile-menu li.menu-item-1995 > .menu-link {
  background: linear-gradient(135deg,#c8960c 0%,#ffd700 40%,#fffde0 50%,#ffd700 60%,#c8960c 100%) !important;
  background-size: 300% auto !important;
  color: #07000f !important;
  margin: 12px 16px !important;
  border-radius: 6px !important;
  text-align: center !important;
  border: none !important;
  font-family: 'Orbitron', sans-serif !important;
  font-weight: 900 !important;
  letter-spacing: 1.5px !important;
}

/* Mobile sign-in button (gold outline) */
#ast-hf-mobile-menu li.menu-item-2011 > .menu-link {
  border: 1px solid rgba(212,175,55,0.55) !important;
  color: #d4af37 !important;
  border-radius: 6px !important;
  margin: 8px 16px !important;
  text-align: center !important;
  font-family: 'Orbitron', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 1.4px !important;
}

/* Dropdown arrow toggles on mobile (▾) */
.dropdown-menu-toggle,
.ast-header-navigation-arrow,
#ast-hf-mobile-menu .ast-header-navigation-arrow svg,
.dropdown-menu-toggle svg {
  color: #d4af37 !important;
  fill: #d4af37 !important;
}
.dropdown-menu-toggle svg path,
.ast-header-navigation-arrow svg path {
  fill: #d4af37 !important;
}

/* Desktop DROPDOWN sub-menu — also re-target with .menu-link */
.main-header-menu .sub-menu .menu-link,
.main-header-menu ul.sub-menu .menu-item > .menu-link {
  font-family: 'Rajdhani', sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.7px !important;
  color: rgba(220,210,255,0.85) !important;
  background: transparent !important;
  padding: 10px 18px !important;
  border-bottom: 1px solid rgba(212,175,55,0.08) !important;
  text-transform: none !important;
}
.main-header-menu .sub-menu .menu-link:hover,
.main-header-menu .sub-menu .current-menu-item > .menu-link {
  color: #ffd700 !important;
  background: rgba(212,175,55,0.08) !important;
}
.main-header-menu .sub-menu {
  background: #1a0a3a !important;
  background-color: #1a0a3a !important;
}


/* ============================================================
   v3 OVERRIDES — high specificity to win cascade
   ============================================================ */

/* ── HAMBURGER (3-line) → GOLD ─────────────────────────────── */
html body .ast-menu-toggle .ast-arrow-svg,
html body .ast-menu-toggle .ast-icon svg,
html body button.ast-menu-toggle svg {
  fill: #d4af37 !important;
}
html body .ast-menu-toggle .ast-arrow-svg path,
html body .ast-menu-toggle .ast-icon svg path,
html body .ast-menu-toggle svg path {
  fill: #d4af37 !important;
  stroke: #d4af37 !important;
  color: #d4af37 !important;
}
html body .ast-menu-toggle {
  color: #d4af37 !important;
}

/* Override Astra's CSS variable for header icon color */
:root,
.ast-header-break-point body {
  --ast-global-color-1: #d4af37 !important;
  --ast-global-color-2: #d4af37 !important;
}

/* ── CROWN PORTAL (menu-item-2011) → outlined gold pill ──── */
html body .main-header-menu li.menu-item-2011 > a,
html body .main-header-menu li.menu-item-2011 > .menu-link,
html body ul.main-header-menu li.menu-item-2011 .menu-link,
html body .main-header-menu li#menu-item-2011 > a {
  font-family: 'Orbitron', sans-serif !important;
  font-size: 0.62rem !important;
  font-weight: 700 !important;
  letter-spacing: 1.4px !important;
  text-transform: uppercase !important;
  color: #d4af37 !important;
  background: transparent !important;
  border: 1px solid rgba(212,175,55,0.55) !important;
  border-radius: 4px !important;
  padding: 7px 14px !important;
  margin: 0 5px !important;
  box-shadow: 0 0 16px rgba(212,175,55,0.18), inset 0 0 12px rgba(212,175,55,0.04) !important;
  transition: color .25s ease, border-color .25s ease, box-shadow .25s ease, text-shadow .25s ease !important;
  text-shadow: 0 0 8px rgba(212,175,55,0.35) !important;
}

html body .main-header-menu li.menu-item-2011 > a:hover,
html body .main-header-menu li.menu-item-2011 > .menu-link:hover {
  color: #ffd700 !important;
  border-color: #ffd700 !important;
  box-shadow: 0 0 22px rgba(212,175,55,0.55), inset 0 0 16px rgba(212,175,55,0.08) !important;
  text-shadow: 0 0 14px rgba(212,175,55,0.7) !important;
  background: rgba(212,175,55,0.04) !important;
}

/* Remove the corner-bracket pseudo-elements from CROWN PORTAL specifically */
html body .main-header-menu li.menu-item-2011 > a::before,
html body .main-header-menu li.menu-item-2011 > a::after,
html body .main-header-menu li.menu-item-2011 > .menu-link::before,
html body .main-header-menu li.menu-item-2011 > .menu-link::after {
  display: none !important;
}

/* ── SUBMIT (menu-item-1995) → gold gradient button ──── */
html body .main-header-menu li.menu-item-1995 > a,
html body .main-header-menu li.menu-item-1995 > .menu-link,
html body ul.main-header-menu li.menu-item-1995 .menu-link {
  font-family: 'Orbitron', sans-serif !important;
  font-size: 0.62rem !important;
  font-weight: 900 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  background: linear-gradient(135deg,#c8960c 0%,#ffd700 40%,#fffde0 50%,#ffd700 60%,#c8960c 100%) !important;
  background-size: 300% auto !important;
  color: #07000f !important;
  border: none !important;
  border-radius: 4px !important;
  padding: 8px 15px !important;
  margin: 0 5px !important;
  animation: cgp-submit-shine 4s ease-in-out infinite !important;
  transition: transform .2s ease, box-shadow .2s ease !important;
  box-shadow: 0 0 12px rgba(212,175,55,0.5) !important;
}

html body .main-header-menu li.menu-item-1995 > a:hover,
html body .main-header-menu li.menu-item-1995 > .menu-link:hover {
  transform: translateY(-2px) scale(1.03) !important;
  box-shadow: 0 4px 36px rgba(212,175,55,0.85) !important;
  color: #07000f !important;
}


/* ============================================================
   v4: CROWN PORTAL — more pop (shine sweep + glow pulse)
   ============================================================ */
@keyframes cgp-portal-shine-sweep {
  0%   { background-position: 200% 0; }
  100% { background-position: -100% 0; }
}
@keyframes cgp-portal-glow-pulse {
  0%, 100% { box-shadow: 0 0 16px rgba(212,175,55,0.30), inset 0 0 12px rgba(212,175,55,0.04); }
  50%      { box-shadow: 0 0 28px rgba(212,175,55,0.65), inset 0 0 18px rgba(212,175,55,0.10); }
}

html body .main-header-menu li.menu-item-2011 > a,
html body .main-header-menu li.menu-item-2011 > .menu-link {
  animation: cgp-portal-glow-pulse 3.2s ease-in-out infinite !important;
  text-shadow: 0 0 10px rgba(212,175,55,0.55) !important;
  position: relative !important;
  overflow: hidden !important;
}


/* ============================================================
   v5: MAKE FX VISIBLE — boost contrast against purple background
   The grid/orbs use purple at 8% opacity which is invisible against
   the purple header. Boost to gold + brighter purple for visibility.
   ============================================================ */
.cgp-hdr-grid {
  background-image:
    linear-gradient(rgba(255,215,0,0.18) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,215,0,0.18) 1px, transparent 1px) !important;
  background-size: 38px 38px !important;
  opacity: 1 !important;
}
.cgp-hdr-grid::before {
  background-image: radial-gradient(circle, rgba(212,175,55,0.55) 1.8px, transparent 2px) !important;
  background-size: 38px 38px !important;
  background-position: 19px 19px !important;
  opacity: 0.7 !important;
}
.cgp-hdr-orbs {
  background:
    radial-gradient(ellipse at 6% 50%, rgba(168,85,247,0.45) 0%, transparent 42%),
    radial-gradient(ellipse at 94% 50%, rgba(212,175,55,0.30) 0%, transparent 38%) !important;
  opacity: 1 !important;
}

/* Ensure .ast-primary-header-bar background doesn't paint OVER the FX —
   the FX is inside this bar and its background was opaque, hiding the FX
   gradients. Use a transparent background here, keep purple on the parent .site-header */
.ast-primary-header-bar {
  background: transparent !important;
  background-color: transparent !important;
}
.ast-main-header-wrap {
  background: transparent !important;
  background-color: transparent !important;
}
.main-header-bar-wrap {
  background: transparent !important;
  background-color: transparent !important;
}

/* The wider site-header keeps the purple base so the FX has a canvas */
.site-header {
  background: #1a0a3a !important;
  background-color: #1a0a3a !important;
}


/* ============================================================
   DIAGNOSTIC — temporarily make FX impossible to miss
   If you can see RED/ORANGE/GREEN, the FX IS rendering and the
   issue is just color contrast. If you see nothing, it's positioning.
   ============================================================ */
.cgp-hdr-fx {
  visibility: visible !important;
  opacity: 1 !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;
  overflow: hidden !important;
  border: 3px solid red !important;
}
.cgp-hdr-grid {
  background-image:
    linear-gradient(rgba(255,80,80,0.85) 2px, transparent 2px),
    linear-gradient(90deg, rgba(255,80,80,0.85) 2px, transparent 2px) !important;
  background-size: 50px 50px !important;
  opacity: 1 !important;
  display: block !important;
}
.cgp-hdr-orbs {
  background:
    radial-gradient(circle at 15% 50%, orange 0%, transparent 30%),
    radial-gradient(circle at 85% 50%, lime 0%, transparent 30%) !important;
  opacity: 1 !important;
  display: block !important;
}

/* Make sure the actual primary header bar is fully transparent so FX shows */
.ast-primary-header-bar,
.ast-main-header-wrap,
.main-header-bar-wrap,
#ast-desktop-header,
.ast-builder-grid-row,
.ast-builder-grid-row-container,
.site-primary-header-wrap {
  background: transparent !important;
  background-color: transparent !important;
}


/* ============================================================
   FIX: ensure FX containing block has actual height
   ============================================================ */
header#masthead.site-header,
.site-header {
  position: relative !important;
  min-height: 70px !important;
  display: block !important;
}

.cgp-hdr-fx {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 100% !important;
  width: 100% !important;
  pointer-events: none !important;
  z-index: 1 !important;
  overflow: hidden !important;
  visibility: visible !important;
  opacity: 1 !important;
  display: block !important;
  /* keep the red diagnostic border for now */
  border: 3px solid red !important;
}

/* ============================================================
   FINAL TUNING — restore Crown gold/purple theme to FX
   (overrides earlier diagnostic red/orange/green)
   ============================================================ */

/* Container — invisible, just provides positioning */
.cgp-hdr-fx {
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
  height: 100% !important; width: 100% !important;
  pointer-events: none !important;
  z-index: 0 !important;
  overflow: hidden !important;
  visibility: visible !important;
  opacity: 1 !important;
  display: block !important;
  border: none !important;
  background: transparent !important;
}

/* Grid — gold lines on the purple base */
.cgp-hdr-grid {
  position: absolute !important;
  inset: 0 !important;
  background-image:
    linear-gradient(rgba(212,175,55,0.15) 1px, transparent 1px),
    linear-gradient(90deg, rgba(212,175,55,0.15) 1px, transparent 1px) !important;
  background-size: 38px 38px !important;
  opacity: 1 !important;
}
.cgp-hdr-grid::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: radial-gradient(circle, rgba(212,175,55,0.45) 1.5px, transparent 1.8px) !important;
  background-size: 38px 38px !important;
  background-position: 19px 19px !important;
  opacity: 0.55 !important;
}

/* Orbs — royal purple left, gold right */
.cgp-hdr-orbs {
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(ellipse at 8% 50%, rgba(78,14,153,0.55) 0%, transparent 40%),
    radial-gradient(ellipse at 92% 50%, rgba(212,175,55,0.25) 0%, transparent 40%) !important;
  animation: cgp-hdr-orb 7s ease-in-out infinite alternate !important;
  opacity: 1 !important;
}

/* Scan line — gold horizontal sweep moving top→bottom */
.cgp-hdr-scan {
  position: absolute !important;
  left: 0 !important; right: 0 !important; top: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(78,14,153,0.5) 15%,
    rgba(212,175,55,0.95) 50%,
    rgba(78,14,153,0.5) 85%,
    transparent 100%) !important;
  animation: cgp-hdr-scan-line 6s linear infinite !important;
  opacity: 0.9 !important;
}

/* Animated bottom border */
.cgp-hdr-border {
  position: absolute !important;
  bottom: 0 !important; left: 0 !important; right: 0 !important;
  height: 1.5px !important;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(78,14,153,0.7) 18%,
    rgba(212,175,55,1) 50%,
    rgba(78,14,153,0.7) 82%,
    transparent 100%) !important;
  animation: cgp-hdr-border-pulse 4s ease-in-out infinite !important;
  opacity: 1 !important;
}

/* Circuit node dots blinking along the bottom */
.cgp-hdr-node {
  position: absolute !important;
  bottom: 0 !important;
  width: 4px !important; height: 4px !important;
  border-radius: 50% !important;
  background: #ffd700 !important;
  box-shadow: 0 0 8px rgba(212,175,55,1), 0 0 16px rgba(212,175,55,0.5) !important;
  animation: cgp-node-blink 2.4s ease-in-out infinite !important;
  transform: translateY(50%) !important;
}

/* Make sure header bar background is transparent so FX shows through */
.ast-primary-header-bar,
.ast-main-header-wrap,
.main-header-bar-wrap,
#ast-desktop-header,
.ast-builder-grid-row,
.ast-builder-grid-row-container,
.site-primary-header-wrap {
  background: transparent !important;
  background-color: transparent !important;
}

/* Header logo + menu content sits above FX */
.site-branding,
.main-header-bar-navigation,
.main-header-menu,
.cgp-hdr-brand-wrap {
  position: relative !important;
  z-index: 5 !important;
}

/* Outer header keeps royal purple base */
header#masthead.site-header,
.site-header {
  background: #1a0a3a !important;
  position: relative !important;
}