:root{
  --bg:#0a0a0a;
  --panel:#131313;
  --cream:#ede8dc;
  --silver:#b9b3a5;
  --orange:#e8792c;
  --orange-dark:#a8531a;
  --line:#232323;
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
body{
  background:var(--bg);
  background-image:
    radial-gradient(ellipse 900px 600px at 50% 20%, rgba(232,121,44,0.06), transparent 60%),
    radial-gradient(ellipse 700px 500px at 50% 100%, rgba(185,179,165,0.05), transparent 60%);
  color:var(--cream);
  font-family:'Work Sans', sans-serif;
  min-height:100vh;
  overflow-x:hidden;
}

/* ===== HEADER ===== */
header.site-header{
  position:sticky;
  top:0;
  z-index:1000;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0.8rem 5vw;
  background:rgba(10,10,10,0.9);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.header-logo{
  display:flex;
  align-items:center;
  flex:0 0 auto;
}
.header-logo img{
  width:200px;
  height:200px;
  border-radius:50%;
  display:block;
}
.header-title{
  flex:1 1 auto;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  line-height:1.2;
  padding:0 1rem;
}
.header-title .main{
  font-family:'Oswald', sans-serif;
  font-weight:800;
  font-size:clamp(2.2rem,4.2vw,2.5rem);
  letter-spacing:0.03em;
  text-transform:uppercase;
  color:var(--cream);
}
.header-title .main em{
  font-style:normal;
  color:var(--orange);
}
.header-title .sub{
  font-family:'Work Sans', sans-serif;
  font-size:clamp(1.2rem,2.8vw,0.78rem);
  color:var(--silver);
  letter-spacing:0.02em;
}

/* Hamburger */
.hamburger{
  flex:0 0 auto;
  width:42px;
  height:42px;
  border-radius:8px;
  border:1px solid var(--line);
  background:var(--panel);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  cursor:pointer;
}
.hamburger span{
  width:20px;
  height:2px;
  background:var(--orange);
  border-radius:2px;
  transition:0.25s ease;
}
.hamburger.active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.active span:nth-child(2){opacity:0;}
.hamburger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* Slide-in menu from right */
.side-menu{
  position:fixed;
  top:0;
  right:0;
  height:100%;
  width:min(320px, 80vw);
  background:var(--panel);
  border-left:1px solid var(--line);
  transform:translateX(100%);
  transition:transform 0.3s ease;
  z-index:1100;
  padding:5.5rem 2rem 2rem;
  display:flex;
  flex-direction:column;
  gap:1.6rem;
}
.side-menu.open{transform:translateX(0);}
.side-menu a{
  font-family:'Oswald', sans-serif;
  font-weight:600;
  font-size:1rem;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--cream);
  text-decoration:none;
  border-bottom:1px solid var(--line);
  padding-bottom:0.8rem;
  transition:color 0.2s ease;
}
.side-menu a:hover{color:var(--orange);}
.side-menu a.hidden-item{display:none;}

.overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.55);
  z-index:1050;
  opacity:0;
  pointer-events:none;
  transition:opacity 0.3s ease;
}
.overlay.open{opacity:1;pointer-events:auto;}

/* ===== BANNER (hidden placeholder) ===== */
.ad-banner{
  display:none;/* attivare rimuovendo display:none quando disponibile uno sponsor */
  width:100%;
  max-width:1100px;
  margin:1.2rem auto 0;
  padding:0.8rem;
  text-align:center;
  border:1px dashed rgba(232,121,44,0.35);
  border-radius:10px;
  color:var(--silver);
  font-size:0.8rem;
}

/* ===== MAIN LAYOUT ===== */
main{
  max-width:1100px;
  margin:0 auto;
  padding:2.4rem 5vw 3rem;
  display:flex;
  flex-wrap:wrap;
  gap:1.6rem;
  justify-content:center;
}

/* Contact / events box */
.contact-box{
  flex:1 1 320px;
  max-width:420px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:14px;
  padding:1.8rem 1.6rem;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0.9rem;
  box-shadow:0 0 0 1px rgba(232,121,44,0.04) inset;
}
.contact-box h2{
  font-family:'Oswald', sans-serif;
  font-weight:700;
  font-size:1.1rem;
  text-transform:uppercase;
  letter-spacing:0.02em;
  color:var(--cream);
  line-height:1.4;
}
.contact-box .cta{
  font-family:'Oswald', sans-serif;
  font-weight:600;
  font-size:0.95rem;
  color:var(--orange);
  text-transform:uppercase;
  letter-spacing:0.05em;
}
.contact-box a{
  color:var(--cream);
  text-decoration:none;
  border-bottom:1px solid var(--line);
  padding-bottom:2px;
}
.contact-box a:hover{color:var(--orange);}
.contact-box .phone{
  font-family:'Work Sans', sans-serif;
  font-size:0.95rem;
  color:var(--silver);
}

/* Player box */
.player-box{
  flex:1 1 320px;
  max-width:420px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:14px;
  padding:1.8rem 1.6rem;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:0.8rem;
  box-shadow:0 0 0 1px rgba(232,121,44,0.04) inset;
}
.player-box .player-title{
  font-family:'Oswald', sans-serif;
  font-weight:600;
  font-size:0.8rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--orange);
}
.player-placeholder{
  width:100%;
  min-height:90px;
  border:1px dashed var(--line);
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--silver);
  font-size:0.85rem;
  text-align:center;
  padding:0.8rem;
}

/* Sponsor section (hidden) */
#sponsor{display:none;}

footer{
  text-align:center;
  padding:2rem 5vw 2.4rem;
  font-size:0.78rem;
  color:#6b6862;
  letter-spacing:0.03em;
}

@media (max-width:800px){
  .header-title .main{font-size:1.2rem;}
  .header-title .sub{font-size:1srem;}
  .header-logo img{width:42px;height:42px;}
  main{padding:1.6rem 5vw 2.4rem;}
}

@media (prefers-reduced-motion: reduce){
  .hamburger span, .side-menu, .overlay{transition:none;}
}

/* Utility riutilizzabili per pagine interne */
.page-hero {
    padding: 8rem 1.25rem 3rem;
    text-align: center;
}

.page-hero h1 {
    font-size: clamp(2.2rem, 8vw, 4.8rem);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.page-hero p {
    margin: 1rem auto 0;
    color: var(--muted);
    width: min(100%, 62ch);
}

.page-shell {
    width: min(100%, 1180px);
    margin: 0 auto;
    padding: 0 1.25rem 5rem;
}

.section-title {
    margin-bottom: 1.2rem;
    font-size: clamp(1.6rem, 4vw, 2.6rem);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.text-center {
    text-align: center;
}
 

    .menu-overlay {
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.55);
      backdrop-filter: blur(3px);
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.25s ease;
      z-index: 1090;
    }

    .menu-overlay.open {
      opacity: 1;
      pointer-events: auto;
    }

    .side-menu-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
      padding-bottom: 1rem;
      border-bottom: 1px solid var(--line);
      margin-bottom: 0.5rem;
    }

    .side-menu-title {
      font-family: 'Oswald', sans-serif;
      font-size: 1.2rem;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--cream);
    }

    .menu-close {
      width: 44px;
      height: 44px;
      border-radius: 999px;
      border: 1px solid var(--line);
      background: #1b1b1b;
      color: var(--cream);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 1.5rem;
      line-height: 1;
      cursor: pointer;
    }

    .menu-close:hover {
      background: var(--orange);
      color: #111;
    }

    .eyebrow {
      display: inline-block;
      margin-bottom: 0.9rem;
      color: var(--orange);
      text-transform: uppercase;
      letter-spacing: 0.18em;
      font-size: 0.86rem;
      font-weight: 700;
    }

    .about-layout {
      display: grid;
      gap: 1.5rem;
    }

    .about-card {
      max-width: 920px;
      margin: 0 auto;
      text-align: center;
    }

    .about-text {
      display: grid;
      gap: 1.15rem;
      color: var(--silver);
      line-height: 1.8;
      font-size: clamp(1rem, 2.4vw, 1.08rem);
      justify-items: center;
    }

    .about-highlight {
      margin-top: 0.4rem;
      color: var(--cream);
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
    }

    @media (max-width: 768px) {
      .header-logo img {
        width: 88px;
        height: 88px;
      }

      .header-title .main {
        font-size: clamp(1.4rem, 6vw, 2rem);
      }

      .header-title .sub {
        font-size: 0.82rem;
      }

      .page-hero {
        padding-top: 7.5rem;
      }
    }