/* =====================================================
   UC SILO NAV — v4 Final
   DELETE all previous nav CSS snippets, use only this
   ===================================================== */

/* 1. Fixed nav */
#uc-nav {
  position: fixed !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  z-index: 9999 !important;
  transition: background .3s, box-shadow .3s !important;
}

/* Desktop: gradient + scroll */
@media (min-width: 1025px) {
  #uc-nav          { background: linear-gradient(rgba(10,10,10,.72),rgba(10,10,10,0)) !important; backdrop-filter: blur(4px) !important; }
  #uc-nav.scrolled { background: #0A0A0A !important; box-shadow: 0 1px 0 rgba(255,255,255,.08) !important; }
}

/* Mobile: always solid, no scroll change */
@media (max-width: 1024px) {
  #uc-nav,
  #uc-nav.scrolled { background: #0A0A0A !important; backdrop-filter: none !important; box-shadow: none !important; }
}

/* Admin bar offset — WordPress adds 32px top bar for logged-in users */
.admin-bar #uc-nav { top: 32px !important; }
@media (max-width: 782px) {
  .admin-bar #uc-nav { top: 46px !important; }
}

/* 2. Nav always horizontal row */
.elementor-element-474c4919,
.elementor-element-474c4919.e-con {
  flex-direction: row !important; align-items: center !important;
  justify-content: space-between !important; flex-wrap: nowrap !important; width: 100% !important;
}
.elementor-element-26fd1697,
.elementor-element-26fd1697.e-con {
  flex-direction: row !important; align-items: center !important;
  flex-shrink: 0 !important; width: auto !important; max-width: none !important;
}
.elementor-element-3160746e,
.elementor-element-3160746e.e-con {
  flex-direction: row !important; align-items: center !important;
  justify-content: flex-end !important; flex-shrink: 0 !important;
  width: auto !important; max-width: none !important; gap: 12px !important;
}

/* 3. Hamburger — HIDDEN BY DEFAULT on ALL sizes */
/* Using high-specificity selector to beat browser defaults */
#uc-nav button#uc-hamburger,
.elementor-element-3160746e button#uc-hamburger,
button#uc-hamburger {
  display: none !important;   /* hidden everywhere until mobile breakpoint overrides */
  flex-direction: column !important;
  justify-content: center !important; align-items: center !important;
  gap: 5px !important;
  width: 40px !important; height: 40px !important; min-width: 40px !important;
  background: transparent !important; border: none !important; outline: none !important;
  cursor: pointer !important; padding: 6px !important; flex-shrink: 0 !important; margin: 0 !important;
  -webkit-tap-highlight-color: transparent !important;
}

/* Only show on mobile/tablet */
@media (max-width: 1024px) {
  #uc-nav button#uc-hamburger,
  .elementor-element-3160746e button#uc-hamburger,
  button#uc-hamburger {
    display: flex !important;
  }
}

/* Hamburger bars */
button#uc-hamburger span {
  display: block !important;
  width: 22px !important; height: 2px !important;
  background: #FFFFFF !important; border-radius: 2px !important;
  transition: transform .25s ease, opacity .2s ease !important;
  transform-origin: center !important; pointer-events: none !important;
}
/* X close state */
button#uc-hamburger.open span:nth-child(1) { transform: translateY(7px)  rotate(45deg)  !important; }
button#uc-hamburger.open span:nth-child(2) { opacity: 0 !important; transform: scaleX(0) !important; }
button#uc-hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg) !important; }

/* 4. Hide desktop links+button on mobile */
@media (max-width: 1024px) {
  .elementor-element-2f90a92e { display: none !important; }
  .elementor-element-735dc58b { display: none !important; }
}

/* Show them on desktop */
@media (min-width: 1025px) {
  .elementor-element-2f90a92e { display: flex !important; }
  .elementor-element-735dc58b { display: block !important; }
}

/* 5. Mobile drawer */
#uc-mobile-drawer {
  display: flex !important;
  flex-direction: column !important;
  position: fixed !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  z-index: 9998 !important;
  background: #0A0A0A !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  padding: 68px 24px 28px !important;
  transform: translateY(-110%) !important;
  visibility: hidden !important;
  transition: transform .32s cubic-bezier(.2,.7,.2,1) !important;
}
#uc-mobile-drawer.open {
  transform: translateY(0) !important;
  visibility: visible !important;
}
/* Admin bar offset for drawer */
.admin-bar #uc-mobile-drawer      { padding-top: 100px !important; }
@media (max-width: 782px) {
  .admin-bar #uc-mobile-drawer    { padding-top: 114px !important; }
}

/* Hide drawer on desktop */
@media (min-width: 1025px) {
  #uc-mobile-drawer { display: none !important; }
}

/* Drawer link styles */
#uc-mobile-drawer a.uc-mob-link {
  display: block !important; font-family: 'Saira', sans-serif !important;
  font-weight: 500 !important; font-size: 15px !important; letter-spacing: .10em !important;
  text-transform: uppercase !important; color: #D6D9DC !important;
  text-decoration: none !important; padding: 15px 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important; transition: color .18s !important;
}
#uc-mobile-drawer a.uc-mob-link:hover { color: #fff !important; }

#uc-mobile-drawer a.uc-mob-phone {
  display: block !important; font-family: 'JetBrains Mono', monospace !important;
  font-size: 14px !important; color: #C9A961 !important; text-decoration: none !important;
  padding: 15px 0 !important; border-bottom: 1px solid rgba(255,255,255,.07) !important;
}

#uc-mobile-drawer a.uc-mob-cta {
  display: block !important; margin-top: 20px !important; padding: 14px 24px !important;
  background: #C8202A !important; color: #fff !important;
  font-family: 'Saira', sans-serif !important; font-weight: 600 !important;
  font-size: 13px !important; letter-spacing: .08em !important;
  text-transform: uppercase !important; text-decoration: none !important;
  text-align: center !important; border-radius: 2px !important;
}
#uc-mobile-drawer a.uc-mob-cta:hover { background: #a01820 !important; }
