/* Black + gold theme — minimal overrides (load last, don't fight component CSS) */

:root{
  --bg:#0a0a0a;
  --panel:#161616e6;
  --line:rgba(201,169,97,.28);
  --text:#f2f2f2;
  --muted:#a0a0a0;
  --aqua:#c9a961;
  --blue:#d4b87a;
  --violet:#a0824f;
  --green:#4ade80;
  --danger:#ff7272;
  --shadow:0 10px 28px rgba(0,0,0,.35);
  --brand1:#c9a961;
  --brand2:#d4b87a;
  --brand3:#a0824f;
  --deep:#0a0a0a;
  --gold:#c9a961;
  --gold-light:#d4b87a;
  --gold-dark:#a0824f;
  --border-gold:rgba(201,169,97,.3);
  --border-subtle:rgba(255,255,255,.08);
}

html{background:#0a0a0a}
body{
  background:transparent!important;
  color:var(--text)!important;
  isolation:auto!important;
}
body:before,
body:after{
  display:none!important;
  content:none!important;
  animation:none!important;
}
.orb{display:none!important}

.siteBg{
  position:fixed!important;
  inset:0!important;
  z-index:-1!important;
  pointer-events:none!important;
  background:#0a0a0a!important;
}
.siteBg:before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:url('/img/site-bg.jpg') center / cover no-repeat!important;
  filter:blur(2px) brightness(.14)!important;
  opacity:.8!important;
  transform:scale(1.03)!important;
}
.siteBg:after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(to bottom,rgba(0,0,0,.72),rgba(0,0,0,.65) 45%,rgba(0,0,0,.78))!important;
}

/* Layout — don't break fixed/sticky */
.nav{
  position:sticky!important;
  z-index:50!important;
  background:rgba(10,10,10,.82)!important;
  border-bottom:1px solid rgba(255,255,255,.06)!important;
  box-shadow:none!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
}
.support,
.authModal,
.modal,
.infoModal,
.sigMarketModal,
.mobileNav,
.toast{position:fixed!important}
.support{
  right:22px!important;
  bottom:22px!important;
  left:auto!important;
  z-index:60!important;
}
.authModal{z-index:120!important}
.modal,.infoModal{z-index:100!important}
.sigMarketModal{z-index:200!important}
.mobileNav{z-index:200!important}
.toast{z-index:300!important}

.footer{
  background:rgba(10,10,10,.82)!important;
  border-top:1px solid rgba(255,255,255,.06)!important;
  box-shadow:none!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
  margin-top:0!important;
}
.footer .container{
  width:min(1180px,92vw)!important;
  max-width:1180px!important;
  margin:0 auto!important;
}
.footgrid{
  display:grid!important;
  grid-template-columns:1.5fr 1fr 1fr 1fr!important;
  gap:35px!important;
  align-items:start!important;
}
.footCopy{
  grid-column:1 / -1!important;
  margin:0!important;
  padding-top:8px!important;
  border-top:1px solid rgba(255,255,255,.06)!important;
  text-align:center!important;
  color:#888!important;
}

/* === No decorative glows — siteBg only === */
.flowPage:before,
.flowPage:after,
.connectFlow.flowPage:before,
.connectFlow.flowPage:after,
#connect .flowPage:before,
#connect .flowPage:after,
#connect .connectFlow.flowPage:before,
#connect .connectFlow.flowPage:after,
#deposit .flowPage:before,
#deposit .flowPage:after,
.profilePage .flowPage:before,
.profilePage .flowPage:after,
.signalsPage.flowPage:before,
.signalsPage.flowPage:after,
#signals .flowPage:before,
#signals .flowPage:after,
.authModal:after,
.hero:after,
.toolsMenu:before,
.winCard:before,
.depositCard:before,
.idCard:before,
.sigPromoGlow,
.sigMarketModalGlow{
  display:none!important;
  content:none!important;
  animation:none!important;
}

.flowPage,
.connectFlow.flowPage,
#connect.page.active,
#connect.page.active .connectFlow,
#deposit .flowPage,
.profilePage .flowPage,
.signalsPage,
.signalsPage.flowPage,
#signals .flowPage{
  background:transparent!important;
  background-image:none!important;
  isolation:auto!important;
}

/* About + Privacy — no local backgrounds */
#about .aboutHero,
.aboutHero{
  background:transparent!important;
  background-image:none!important;
  overflow:visible!important;
  isolation:auto!important;
}
#about .aboutHero:after,
.aboutHero:after{
  display:none!important;
  content:none!important;
}
#about .aboutWhyPrice{text-shadow:none!important}
.privacyPage,
#privacy .privacyPage{
  background:transparent!important;
  isolation:auto!important;
}
.privacyPage:before,
.privacyPage:after{
  display:none!important;
  content:none!important;
}

/* Pages — transparent so siteBg shows through */
.page,
.page.active,
.aboutHero,
.flowPage,
.learnPage,
.calcPage,
.newsPage,
.privacyPage,
.signalsPage,
#about,#learn,#news,#calculator,#privacy,#profile,#deposit,#signals,#connect,
#connect.page.active,
body.connect-mode,
body.deposit-mode,
body.menu-open .mobileNav{
  background-color:transparent!important;
}

/* Homepage panels only — NOT signals / FAQ internals */
.stat,.card,.step,.quote,.metric,.chapter,
.osGlass:not(.sigPromo):not(.sigConfig),
.aboutLeadCard,.aboutNumbers,.valueItem,
.privacyCard,.perk,.featureCard,.stepCard,
.winCard,.depositCard,.idCard,.profileStat,
.toolsMenu,.langMenu,
.modalCard,.infoModalCard,.calcPanel,.calcBox,
.newsCard,.newsItem,.mobileNavPanel,
.connectCard{
  border-color:rgba(255,255,255,.08)!important;
}

/* Header nav — text + gold underline (no icons) */
.links .navico{display:none!important}
.links > a,
.links .toolsWrap > a{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:4px!important;
  padding:6px 0 8px!important;
  color:#9a9a9a!important;
  text-decoration:none!important;
  font-weight:500!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.links > a:hover,
.links .toolsWrap > a:hover,
.links .toolsWrap:hover > a,
.links .toolsWrap.open > a{
  color:#fff!important;
}
.links > a.active,
.links .toolsWrap > a.active,
.links .toolsWrap.active > a{
  color:#fff!important;
  font-weight:500!important;
}
.links > a::after,
.links .toolsWrap > a::after{
  content:""!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  height:2px!important;
  background:#c9a961!important;
  border-radius:1px!important;
  transform:scaleX(0)!important;
  transform-origin:center!important;
  transition:transform .2s ease!important;
  opacity:1!important;
  pointer-events:none!important;
}
.links > a.active::after,
.links .toolsWrap > a.active::after,
.links .toolsWrap.active > a::after{
  transform:scaleX(1)!important;
}
.links .toolsWrap > a .chev{
  display:inline-block!important;
  width:0!important;
  height:0!important;
  min-width:0!important;
  min-height:0!important;
  margin-left:5px!important;
  border-left:4px solid transparent!important;
  border-right:4px solid transparent!important;
  border-top:5px solid currentColor!important;
  opacity:.7!important;
  background:none!important;
  -webkit-mask:none!important;
  mask:none!important;
}
.links .toolsWrap > a .chev::before,
.links .toolsWrap > a .chev::after{
  display:none!important;
  content:none!important;
}

/* Mobile menu — text only, no icons */
.mobileNav .mNavIco{display:none!important}
.mobileNavInner a{
  gap:0!important;
  color:#b0b0b0!important;
}
.mobileNavInner a.active{
  color:#fff!important;
  background:rgba(201,169,97,.08)!important;
  border-color:rgba(201,169,97,.28)!important;
}
.mobileNavGroupLbl{
  gap:0!important;
  color:#6b7280!important;
}

/* Brand / auth */
.grad{
  background:linear-gradient(90deg,#fff,#c9a961 55%,#d4b87a)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
}
.logo{
  background:transparent!important;
  box-shadow:0 0 0 1px rgba(201,169,97,.35)!important;
  filter:none!important;
}
.logo .octoLogo,.logo svg{filter:none!important}
.brandName{
  background:none!important;
  -webkit-background-clip:unset!important;
  background-clip:unset!important;
  color:#f2f2f2!important;
  text-shadow:none!important;
  -webkit-text-fill-color:#f2f2f2!important;
}
.brandName b{
  background:linear-gradient(90deg,#c9a961,#e8d5a3)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
}
.eyebrow{
  border-color:rgba(201,169,97,.3)!important;
  background:rgba(201,169,97,.1)!important;
  color:#e8d5a3!important;
}
.hero h1{text-shadow:none!important}
.hero:before,.aboutHero:before{color:rgba(201,169,97,.04)!important}
.connectBrand{text-shadow:none!important}
.connectLogo{box-shadow:none!important}
.sigBot{filter:none!important}
#about .aboutReviewStars{text-shadow:none!important}

.authModal{
  background:
    linear-gradient(to bottom,rgba(0,0,0,.7),rgba(0,0,0,.76)),
    url('/img/site-bg.jpg') center / cover no-repeat!important;
}
.authModal:before{opacity:.08!important;animation:none!important}
.authModal:after{display:none!important}

/* Global controls — homepage / nav only, NOT .sig* components */
.langBtn,.dealTab,.btn.dark,.authGhost,.field,.authField input,.idInput input{
  border-color:rgba(255,255,255,.1)!important;
}
.btn.primary,.authPanel .btn.primary,.support,.navCta,.badge{
  background:linear-gradient(180deg,#d4b87a,#c9a961 50%,#a0824f)!important;
  color:#111!important;
  border:0!important;
}
.btn.primary *,.navCta *,.support *{color:#111!important}
.navCta,
.right .btn.primary{
  box-shadow:none!important;
}

.check{
  background:rgba(201,169,97,.12)!important;
  border-color:rgba(201,169,97,.3)!important;
}
.profileStat .pIcon,.valueIcon,.ico,
.featureCards .ico,.featureCards .ico--blue,.featureCards .ico--violet,
#about .valueIcon,#about .valueIcon--mint,#about .valueIcon--violet{
  color:#c9a961!important;
  background:rgba(201,169,97,.12)!important;
  border-color:rgba(201,169,97,.25)!important;
}
.progressLine:after{background:linear-gradient(90deg,#c9a961,#d4b87a)!important}

#about .aboutReviewAvatar--a,
#about .aboutReviewAvatar--d,
#about .aboutReviewAvatar--s,
#about .aboutReviewAvatar--i,
#about .aboutReviewAvatar--m{
  background:linear-gradient(135deg,#c9a961,#a0824f)!important;
}

.up,.calcUp{color:#4ade80!important}
.down,.calcDown,.calcDanger{color:#ff7272!important}

.animated-content{will-change:auto!important;filter:none!important}
@keyframes octoEnter{
  from{opacity:0;transform:translate3d(var(--fromX,0),var(--fromY,28px),0);filter:none}
  to{opacity:1;transform:none;filter:none}
}
@keyframes octoGlowSpin{0%,100%{transform:none}}
@keyframes octoFlowSpin{0%,100%{transform:none}}

.sigSearchOverlay{
  backdrop-filter:blur(8px)!important;
  background:rgba(0,0,0,.7)!important;
}
body.signal-searching .footer{filter:none!important}

@media (prefers-reduced-motion: reduce){
  .track,.sigTradeOutcomeTrack,
  .orb,.animated-content,
  .aboutHero:after,.authModal:before,.authModal:after,
  .flowPage:before,.flowPage:after{
    animation:none!important;
  }
}

@media(max-width:900px){
  .footgrid{
    grid-template-columns:1fr!important;
    gap:24px!important;
  }
  .footer .container{
    width:min(1180px,92vw)!important;
    padding:0 20px!important;
  }
}
