/* shared/header.css — CSS único do header/nav (ver shared/header.js).
   Fonte única do design: mude aqui e toda página que linkar este arquivo
   reflete a mudança automaticamente. Cores fixas (não usa var(--orange) de
   cada página) de propósito: assim o header nunca mais herda sem querer o
   tema próprio de uma página (ex: o dourado de marketplace.html). */

.utility{
  height:38px;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 3.1vw;
  background:#11100f;
  border-bottom:1px solid #252525;
  font-family:"Manrope",sans-serif;
  font-size:11px;font-weight:600;letter-spacing:.08em;
  color:#a09c98;
}
.utility-left{display:flex;align-items:center;gap:22px}
.utility-hl{color:#8f8b86;font-weight:700}
.utility-right{display:flex;align-items:center;gap:14px}
.utility-right a{color:#a09c98}
.utility-right a:hover{color:#b23a3a}
.utility-right .lang-active{color:#e8e5e1}
.utility-right .sep{width:1px;height:12px;background:#3a3a39}
@media (max-width:900px){ .utility-left span:nth-child(3){display:none} }
@media (max-width:640px){ .utility-left span:nth-child(2){display:none} }

.nav{
  position:sticky;top:0;z-index:150;
  height:72px;
  display:flex;align-items:center;gap:28px;
  padding:0 3.1vw;
  background:rgba(11,9,8,.88);
  backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(242,237,230,.10);
  box-shadow:0 4px 30px rgba(0,0,0,.5);
}
.brand{ display:flex;align-items:center;gap:11px; flex-shrink:0;min-width:0; }
.brand-bars{display:flex;gap:4px;flex:none}
.brand-bars i{ width:5px;height:27px; background:#7a2020; transform:skewX(-20deg); box-shadow:0 0 14px rgba(122,32,32,.5); }
.brand-bars i:last-child{ background:rgba(122,32,32,.42); box-shadow:none; }
.brand-word{ font-family:"Manrope",sans-serif; font-weight:800;font-size:23px;line-height:1; letter-spacing:-.04em; color:#f4f2ef; white-space:nowrap; }
.brand-word span{color:#b23a3a;font-style:italic}
.nav-ticker{ flex:1 1 auto;min-width:0; font-family:"Inter",sans-serif; font-size:12.5px;color:rgba(168,154,140,.55); white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.nav-links{display:flex;align-items:center;gap:2px;flex-shrink:0;white-space:nowrap}
.nav-links a{position:relative;display:flex;align-items:center;gap:6px;height:42px;padding:0 14px;border-radius:9px;background:none;font-family:"Manrope",sans-serif;font-size:13.5px;font-weight:500;white-space:nowrap;color:#bcbfbd;transition:color .15s ease,background .15s ease}
.nav-links a:hover{background:rgba(255,255,255,.045);color:#fff}
.nav-links a.cta{background:#7a2020;color:#f4f2ef;font-weight:700;border:1px solid #b23a3a}
.nav-links a.cta:hover{background:#b23a3a;color:#f4f2ef}
.nav-links a.ext{color:#a89a8c}
.nav-links a.nav-disabled{cursor:default;opacity:.55}
.nav-links a.nav-disabled:hover{background:none;color:#bcbfbd}
.nav-links a .nav-ext-ico{font-size:11px;opacity:.7}
.nav-links a .nav-discord-ico{flex:none}
.nav-links a .nav-twitch-ico{flex:none}
.nav-links a.active{background:rgba(122,32,32,.14);color:#b23a3a;font-weight:600}
.nav-links a.active:hover{background:rgba(122,32,32,.14);color:#b23a3a}
.nav-links a.active::after{content:"";position:absolute;left:16px;right:16px;bottom:-11px;height:2px;background:#b23a3a;border-radius:10px}
.nav-hamburger{ display:none; width:38px;height:38px;flex:none; border:1px solid rgba(242,237,230,.10);border-radius:9px; background:rgba(255,255,255,.04); align-items:center;justify-content:center; color:#f4f2ef;cursor:pointer; }
.nav-hamburger:hover{background:rgba(255,255,255,.09)}
.nav-actions{ min-width:0;margin-left:0; display:flex;align-items:center;gap:14px; flex-shrink:0;white-space:nowrap; }
.nav-actions-group{ display:flex;align-items:center;gap:10px; }
.nav-actions-sep{width:0;height:20px;background:transparent;flex:none;}
.login-btn{ display:flex;align-items:center;gap:7px; height:42px; border:none;border-left:1px solid rgba(242,237,230,.10); background:none;padding:0 0 0 16px; font-family:"Manrope",sans-serif; font-size:14px;font-weight:500; color:#d8d8d8; cursor:pointer; transition:color .15s ease; }
.login-btn:hover{color:#b23a3a}
.signup-btn{ display:flex;align-items:center; height:38px;padding:0 18px; border:1px solid #c9a24a; border-radius:6px; background:transparent; font-family:"Manrope",sans-serif; font-size:14px;font-weight:700; color:#f4f2ef; transition:background .2s ease, color .2s ease; }
.signup-btn:hover{background:#c9a24a;color:#0b0908}

.profile-icon-btn{ width:38px;height:38px; border:1px solid #7a2020; border-radius:50%; display:grid;place-items:center; color:#7a2020; background:rgba(122,32,32,.12); cursor:pointer; transition:background .15s,transform .15s; }
.profile-icon-btn.has-initials{ border-color:#7a2020; background:#7a2020; color:#f4f2ef; font-family:"Manrope",sans-serif;font-weight:800;font-size:13px;letter-spacing:.3px; }
.profile-icon-btn.has-initials:hover{ filter:brightness(1.08); }
.profile-icon-btn:hover{background:rgba(122,32,32,.22);transform:translateY(-1px);}
.profile-verified-badge{ position:absolute; bottom:-2px;right:-2px; width:16px;height:16px;border-radius:50%; background:#21d46f; border:2px solid #11100f; display:grid;place-items:center; pointer-events:none; }
.profile-verified-badge svg{ width:9px;height:9px; }
.profile-dropdown{ display:none; position:absolute;top:48px;right:0; min-width:200px; background:#151515;border:1px solid rgba(242,237,230,.10);border-radius:10px; padding:14px;z-index:200; box-shadow:0 14px 30px rgba(0,0,0,.4); }
#profileMenuWrap:hover .profile-dropdown, #profileMenuWrap.open .profile-dropdown{ display:block; }
.profile-dropdown-name{font-size:13.5px;font-weight:700;color:#f4f2ef;}
.profile-dropdown-email{font-size:11px;color:#b4b0ac;margin-bottom:10px;word-break:break-all;}
.profile-dropdown-sep{height:1px;background:rgba(242,237,230,.10);margin-bottom:8px;}
.profile-dropdown-item{ display:block;width:100%;text-align:left; background:none;border:none;color:#b4b0ac; font-size:13px;padding:8px 4px;cursor:pointer;text-decoration:none; border-radius:6px; }
.profile-dropdown-item:hover{background:rgba(122,32,32,.14);color:#b23a3a;}
.profile-dropdown-logout{color:#e5484d;}
.profile-dropdown-logout:hover{background:rgba(229,72,77,.08);color:#e5484d;}

@media (max-width:980px){ .nav{gap:18px} .nav-ticker{display:none} }
@media (max-width:760px){
  .nav{height:auto;padding:15px 18px;gap:18px}
  .nav .brand-word{display:none}
  .nav-hamburger{display:flex}
  .nav-links{ display:none; position:absolute;left:0;right:0;top:100%; flex-direction:column;align-items:stretch;gap:6px; background:#101010; border-radius:0 0 16px 16px; padding:14px; box-shadow:0 14px 30px rgba(0,0,0,.4); z-index:150; }
  .nav-links.mobile-open{display:flex}
  .nav-links a{justify-content:flex-start;padding:12px 16px}
  .nav-actions{min-width:auto}
  .nav-actions-group{padding:0 12px;gap:10px}
  .login-btn span{display:none}
  .signup-btn{padding:0 14px;font-size:13px}
}
