/* =============================================================================
   BARRA IN ALTO CONDIVISA — Home (/), Item Shop (/itemshop), Rewards (/rewards)
   (2026-10-26) Stesso file e stesso HTML su tutte le pagine: cambiando pagina la
   barra resta identica (altezza, logo, link, bottone Discord). Misure fisse in px,
   indipendenti dalle variabili di ogni pagina (es. --ui dello shop).
   ============================================================================= */
@font-face{font-family:"Burbank";src:url("/website/fonts/Burbank.otf") format("opentype");font-display:swap}

/* lo spazio della barra di scorrimento è sempre riservato: le pagine corte non "saltano" */
html{scrollbar-gutter:stable}

.site-bar{position:sticky;top:0;z-index:40;background:rgba(11,13,23,.96);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.07);
  font-family:"Burbank","Arial Black",system-ui,sans-serif;font-weight:400;letter-spacing:.3px;color:#f3f4fa}
.site-wrap{display:flex;align-items:center;gap:18px;height:72px;max-width:1440px;margin:0 auto;padding:0 32px;box-sizing:border-box}
.site-brand{display:flex;align-items:center;gap:10px;flex:0 0 auto;font-size:28px;line-height:1;text-transform:uppercase;color:#fff;text-decoration:none}
.site-brand img{width:40px;height:40px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(139,108,255,.55))}
.site-nav{display:flex;gap:4px;margin-left:10px}
.site-nav a{padding:10px 14px 8px;border-radius:10px;font-size:19px;line-height:1;text-transform:uppercase;color:#8b90ab;text-decoration:none;white-space:nowrap}
.site-nav a:hover{color:#f3f4fa;background:#131626}
.site-nav a[aria-current="page"]{color:#f3f4fa;background:#1a1e31}
.site-right{display:flex;align-items:center;gap:10px;margin-left:auto}
.site-discord{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:10px;background:#5865f2;color:#fff;font-size:17px;line-height:1;text-transform:uppercase;text-decoration:none;box-shadow:0 8px 22px rgba(88,101,242,.3);white-space:nowrap}
.site-discord:hover{filter:brightness(1.1)}
.site-discord svg{width:20px;height:20px;flex:0 0 auto}
.site-bar :focus-visible{outline:2px solid #ffd24a;outline-offset:3px}

/* telefono: i link vanno su una seconda riga, uguale su tutte le pagine */
@media (max-width:760px){
  .site-wrap{flex-wrap:wrap;height:auto;padding:10px 16px;row-gap:10px}
  .site-brand{font-size:22px}.site-brand img{width:32px;height:32px}
  .site-nav{order:3;width:100%;margin:0;gap:6px}
  .site-nav a{flex:1;text-align:center;padding:10px 6px 8px;font-size:16px;background:#131626;border:1px solid rgba(255,255,255,.07)}
  .site-discord{width:40px;padding:0;justify-content:center}
  .site-discord span{display:none}
}
