/* =========================================================
   GHOSTMU V4 - POLIMENTO INGAME SEM MEXER NA ESTRUTURA
========================================================= */

body{position:relative}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(circle at 15% 18%, rgba(255,70,20,.05), transparent 18%),
    radial-gradient(circle at 82% 12%, rgba(255,110,30,.05), transparent 16%),
    radial-gradient(circle at 50% 58%, rgba(255,120,40,.04), transparent 24%);
  mix-blend-mode:screen;
  opacity:.9;
}
body:after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.20)),
    radial-gradient(circle at center, transparent 40%, rgba(0,0,0,.18) 100%);
}

.nav,.hero,main,.footer{position:relative;z-index:1}

.nav{
  box-shadow:
    0 10px 30px rgba(0,0,0,.35),
    inset 0 -1px 0 rgba(255,140,60,.08);
}
.links a{transition:all .22s ease}
.links a:hover{
  color:#ffd6a0;
  text-shadow:0 0 12px rgba(255,140,60,.18);
}

.hero{position:relative}
.hero:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 28%, rgba(255,120,40,.10), transparent 22%),
    radial-gradient(circle at 84% 18%, rgba(255,70,20,.06), transparent 16%),
    linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.18));
  mix-blend-mode:screen;
}
.hero-main-full{position:relative}
.hero-main-full:after{
  content:"";
  position:absolute;
  left:-8%;
  right:-8%;
  bottom:-40px;
  height:220px;
  pointer-events:none;
  background:radial-gradient(circle at 50% 50%, rgba(255,100,20,.12), transparent 42%);
  filter:blur(26px);
  opacity:.65;
}
.hero h1{
  text-shadow:
    0 0 16px rgba(255,130,40,.08),
    0 0 40px rgba(255,70,20,.10);
}
.hero p{color:rgba(255,235,220,.82)}

.hero-elite-tags span{
  box-shadow:
    0 0 0 1px rgba(255,150,60,.08) inset,
    0 0 18px rgba(255,140,50,.06);
  transition:all .2s ease;
}
.hero-elite-tags span:hover{
  transform:translateY(-1px);
  box-shadow:
    0 0 0 1px rgba(255,170,80,.12) inset,
    0 0 24px rgba(255,140,50,.10);
}

.btn,.btn.secondary{transition:all .22s ease}
.btn:hover,.btn.secondary:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(0,0,0,.28), 0 0 24px rgba(255,150,60,.12);
}

.panel,.info-card,.rank-mini-card,.stream-card,.social-card,.promo-slider-box{
  position:relative;
  overflow:hidden;
  box-shadow:
    0 16px 34px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,170,80,.04);
}
.panel:before,.info-card:before,.rank-mini-card:before,.stream-card:before,.social-card:before,.promo-slider-box:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(135deg, rgba(255,130,40,.045), transparent 30%, transparent 70%, rgba(255,130,40,.03));
}
.panel:after,.info-card:after,.rank-mini-card:after,.stream-card:after,.social-card:after,.promo-slider-box:after{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  top:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,180,90,.16), transparent);
  pointer-events:none;
}

h2{
  text-shadow:0 0 18px rgba(255,120,40,.08);
  letter-spacing:-.02em;
}

.info-card,.rank-mini-card,.stream-card,.social-card{
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.info-card:hover,.rank-mini-card:hover,.stream-card:hover,.social-card:hover{
  transform:translateY(-3px);
  box-shadow:
    0 20px 38px rgba(0,0,0,.28),
    0 0 22px rgba(255,140,50,.08),
    inset 0 1px 0 rgba(255,190,100,.06);
}

.live-number,#liveOnlineCount,#liveServerStatus,#liveAccountsCount,#liveInvasionsCount,#liveEventsCount,#liveSpecialsCount{
  text-shadow:0 0 18px rgba(255,130,40,.10);
}

.rank-legend .lg{
  box-shadow:
    0 0 0 1px rgba(255,170,80,.08) inset,
    0 0 12px rgba(255,150,60,.05);
}

.promo-slider-media img,.side-preview-image{
  transition:transform .35s ease, filter .35s ease;
}
.promo-slider-box:hover .promo-slider-media img,
.home-side-panel:hover .side-preview-image{
  transform:scale(1.02);
  filter:brightness(1.03);
}

.footer{
  box-shadow:inset 0 1px 0 rgba(255,150,60,.06);
}

#heroSeasonPanel{
  box-shadow:
    0 0 22px rgba(255,140,50,.14),
    0 0 0 1px rgba(255,150,40,.08) inset !important;
}

.social-logo{
  filter:drop-shadow(0 0 8px rgba(255,140,50,.16));
}