/* ============================================================
   BRAXTRADE · Chrome (ticker / header / mega / mobile / footer)
   ============================================================ */

.brax-top{position:sticky; top:0; z-index:900}

/* ---------- TICKER ---------- */
.ticker{
  height:var(--ticker-h); display:flex; align-items:center; gap:0;
  background:var(--green-950); color:var(--t-on-dark); overflow:hidden;
  border-bottom:1px solid rgba(214,200,160,.1);
  transition:height .35s var(--ease), opacity .3s;
}
.brax-top.scrolled .ticker{height:0; opacity:0; border-color:transparent}
.tk-live{
  display:flex; align-items:center; gap:.5em; flex:0 0 auto; height:100%;
  padding:0 16px; font-family:var(--f-mono); font-size:.68rem; letter-spacing:.18em; font-weight:600;
  color:var(--gold-400); background:linear-gradient(90deg,var(--green-900),transparent); z-index:2;
}
.tk-viewport{overflow:hidden; flex:1; height:100%; display:flex; align-items:center; -webkit-mask:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.tk-track{display:flex; gap:0; white-space:nowrap; animation:tkScroll 60s linear infinite; will-change:transform}
.brax-top:hover .tk-track{animation-play-state:paused}
@keyframes tkScroll{to{transform:translateX(-50%)}}
.tk-item{display:inline-flex; align-items:center; gap:.55em; padding:0 22px; font-size:.8rem; border-right:1px solid rgba(214,200,160,.1)}
.tk-sym{color:var(--t-on-dark-mut); font-weight:600; letter-spacing:.02em}
.tk-px{color:var(--cream); font-size:.82rem}
.tk-ch{font-family:var(--f-mono); font-size:.74rem; font-weight:500}
.flash-up{animation:fUp .6s} .flash-down{animation:fDown .6s}
@keyframes fUp{0%{color:var(--up)}100%{}} @keyframes fDown{0%{color:var(--down)}100%{}}

/* ---------- HEADER ---------- */
.hdr{
  height:var(--header-h);
  background:rgba(7,12,28,.72); backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border-bottom:1px solid rgba(214,200,160,.12);
  transition:background .35s, height .35s var(--ease), border-color .35s;
}
.brax-top.scrolled .hdr{background:rgba(5,9,20,.94); height:64px}
.hdr-inner{height:100%; display:flex; align-items:center; gap:28px}
.brand{flex:0 0 auto; display:flex; align-items:center}
.brand img{height:42px; width:auto; transition:height .35s var(--ease)}
.brax-top.scrolled .brand img{height:34px}
.nav{display:flex; align-items:center; gap:4px; margin-left:8px}
.nav-item{position:relative}
.nav-link{
  display:inline-flex; align-items:center; gap:.4em; background:none; border:0;
  color:var(--t-on-dark); font-family:var(--f-body); font-weight:600; font-size:.93rem;
  padding:.6em .82em; border-radius:9px; transition:color .25s, background .25s; position:relative;
}
.nav-link:hover{color:var(--cream); background:rgba(237,233,220,.07)}
.nav-link svg{opacity:.6; transition:transform .3s}
.has-mega:hover .nav-link svg{transform:rotate(180deg)}
.nav-link.is-active{color:var(--gold-400)}
.nav-link.is-active::after{content:""; position:absolute; left:.82em; right:.82em; bottom:.2em; height:2px; background:var(--gold); border-radius:2px}
.nav-flag{color:var(--gold-300)}
.nav-flag::before{content:"●"; font-size:.5em; color:var(--gold); margin-right:.5em; vertical-align:middle; animation:livepulse 2s infinite}
.hdr-cta{margin-left:auto; display:flex; align-items:center; gap:14px; flex:0 0 auto}
.hdr-cta .login{font-size:.9rem}

/* mega-menu */
.mega{
  position:absolute; top:calc(100% + 14px); left:50%; transform:translateX(-50%) translateY(10px);
  width:min(860px,90vw); background:rgba(8,15,36,.98); backdrop-filter:blur(20px);
  border:1px solid rgba(214,200,160,.16); border-radius:18px; padding:22px;
  box-shadow:var(--sh-lg); opacity:0; visibility:hidden; transition:opacity .3s var(--ease), transform .3s var(--ease);
}
.has-mega:hover .mega{opacity:1; visibility:visible; transform:translateX(-50%) translateY(0)}
.mega::before{content:""; position:absolute; top:-14px; left:0; right:0; height:14px}
.mega-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px}
.mega-card{display:block; padding:15px 16px; border-radius:13px; border:1px solid transparent; transition:background .25s, border-color .25s}
.mega-card:hover{background:rgba(237,233,220,.05); border-color:rgba(214,200,160,.2)}
.mega-card-h{display:flex; align-items:center; gap:11px; margin-bottom:11px}
.mega-card-h strong{display:block; color:var(--cream); font-family:var(--f-display); font-size:1rem; font-weight:700}
.mega-card-h em{display:block; color:var(--t-on-dark-mut); font-style:normal; font-size:.78rem; margin-top:1px}
.mega-ic{width:30px; height:30px; border-radius:8px; flex:0 0 auto; background:rgba(199,163,107,.16); position:relative}
.mega-ic::after{content:""; position:absolute; inset:0; background:var(--gold-400); -webkit-mask:center/16px no-repeat var(--i); mask:center/16px no-repeat var(--i)}
.cat-forex{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 17l5-5 4 3 8-9'/%3E%3Cpath d='M16 6h4v4'/%3E%3C/svg%3E")}
.cat-acoes{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 20V10M10 20V4M16 20v-7M22 20H2'/%3E%3C/svg%3E")}
.cat-metais{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M12 8v8M9 12h6'/%3E%3C/svg%3E")}
.cat-indices{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h4l3 7 4-14 3 7h4'/%3E%3C/svg%3E")}
.cat-cripto{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M9 8h4.5a2 2 0 010 4H9zM9 12h5a2 2 0 010 4H9zM9 6v12'/%3E%3C/svg%3E")}
.cat-energia{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2L4 14h7l-1 8 9-12h-7z'/%3E%3C/svg%3E")}
.mega-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px}
.mega-list li{display:flex; justify-content:space-between; font-size:.82rem; color:var(--t-on-dark-mut)}
.mega-list li .mono{font-size:.78rem}
.mega-foot{display:flex; justify-content:space-between; align-items:center; margin-top:16px; padding-top:16px; border-top:1px solid rgba(214,200,160,.12); font-size:.82rem; color:var(--t-on-dark-mut)}
.mega-foot a{color:var(--gold-400); font-weight:600}

/* burger */
.burger{display:none; width:40px; height:40px; border:0; background:none; flex-direction:column; gap:5px; align-items:center; justify-content:center}
.burger span{width:22px; height:2px; background:var(--cream); border-radius:2px; transition:.3s var(--ease)}
.burger.x span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.x span:nth-child(2){opacity:0}
.burger.x span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* mobile */
.mobile{
  position:fixed; inset:0; z-index:899; background:linear-gradient(180deg,var(--green-950),var(--green-900));
  padding:calc(var(--header-h) + var(--ticker-h) + 30px) var(--gut) 40px; transform:translateX(100%);
  transition:transform .42s var(--ease); display:flex; flex-direction:column; gap:30px; overflow-y:auto;
}
.mobile.open{transform:none}
.mobile nav{display:flex; flex-direction:column}
.mobile nav a{color:var(--cream); font-family:var(--f-display); font-weight:700; font-size:1.5rem; padding:.6em 0; border-bottom:1px solid rgba(214,200,160,.12)}
.mobile nav a.m-flag{color:var(--gold-400)}
.mobile-cta{display:flex; flex-direction:column; gap:12px; margin-top:auto}
.mobile-cta .btn{width:100%}

/* ---------- FOOTER ---------- */
.ft{background:var(--green-950); color:var(--t-on-dark-mut); padding-top:72px}
.ft-top{display:grid; grid-template-columns:1.3fr 2fr; gap:60px; padding-bottom:48px}
.ft-logo{height:30px; margin-bottom:18px}
.ft-brand p{font-size:.92rem; line-height:1.6; max-width:38ch}
.ft-social{display:flex; gap:10px; margin-top:22px}
.ft-social a{width:38px; height:38px; border-radius:10px; border:1px solid rgba(214,200,160,.18); display:grid; place-items:center; color:var(--gold-400); transition:.25s}
.ft-social a:hover{background:rgba(199,163,107,.14); transform:translateY(-2px)}
.ft-cols{display:grid; grid-template-columns:repeat(4,1fr); gap:26px}
.ft-col h4{color:var(--cream); font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; font-family:var(--f-mono); font-weight:500; margin-bottom:16px}
.ft-col a{display:block; color:var(--t-on-dark-mut); font-size:.9rem; padding:.34em 0; transition:color .2s}
.ft-col a:hover{color:var(--gold-400)}
.ft-risk{font-size:.78rem; line-height:1.6; color:rgba(237,233,220,.45); border-top:1px solid rgba(214,200,160,.12); border-bottom:1px solid rgba(214,200,160,.12); padding:22px 0; margin-top:8px}
.ft-risk strong{color:var(--gold-400)}
.ft-risk span{color:rgba(237,233,220,.62)}
.ft-bottom{display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; padding:24px 0 40px; font-size:.82rem}
.ft-reg{color:var(--gold-700)}

@media(max-width:980px){
  .nav,.hdr-cta .login{display:none}
  .burger{display:flex}
  .ft-top{grid-template-columns:1fr; gap:40px}
}
@media(max-width:560px){
  .ft-cols{grid-template-columns:repeat(2,1fr)}
  .tk-live{display:none}
}