/* ========================
   STILI GLOBALI ARENA (Blu)
   ========================= */

/* Reset di base */
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
img, svg, video { display:block; max-width:100%; height:auto; }
button, input, select, textarea { font: inherit; color: inherit; }
a { color: inherit; text-decoration: none; }

/* Palette principale */
:root{
  --c-bg:#0b132b;        /* blu notte */
  --c-bg-2:#111d3a;      /* superfici / submenu */
  --c-text:#ffffff;      /* testo primario */
  --c-muted:#b8c7e0;     /* testo secondario */
  --c-border:#1e2b50;    /* bordi */
  --c-accent-1:#2f80ff;  /* blu vivo */
  --c-accent-2:#00c2ff;  /* ciano */
}

/* Body */
body{
  background:
    radial-gradient(1200px 800px at 80% -10%, rgba(47,128,255,.15), transparent),
    radial-gradient(800px 600px at 10% 110%, rgba(0,194,255,.10), transparent),
    var(--c-bg);
  color:var(--c-text);
  font-family:system-ui, -apple-system, "Segoe UI", Roboto, Inter, Helvetica, Arial, sans-serif;
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Layout base */
.container { width:min(100% - 32px, 1200px); margin-inline:auto; }
.section   { padding:48px 0; }

/* Tipografia */
h1, h2, h3, h4, h5, h6 { font-weight:700; margin-bottom:16px; }
h1 { font-size: clamp(28px, 5vw, 48px); letter-spacing:-.02em; }
h2 { font-size: 28px; }
h3 { font-size: 22px; }
p  { margin-bottom:12px; }
.muted { color: var(--c-muted); }

/* Card */
.card{
  background: var(--c-bg-2);
  border: 1px solid var(--c-border);
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 8px 24px rgba(0,0,0,.25);
}

/* =================
   HEADER + SUBMENU
   ================= */

.hdr{
  background: var(--c-bg);
  border-bottom: 1px solid var(--c-border);
}
.hdr__bar{
  height: 64px;
  display:flex; align-items:center; justify-content:space-between;
}
.hdr__brand{ font-weight:700; }
.hdr__nav{ display:flex; gap:16px; }
.hdr__link{ padding:10px 12px; border-radius:8px; }
.hdr__link:hover{ background: rgba(255,255,255,.06); }

/* Submenu leggermente più chiaro */
.subhdr {
  background: var(--c-bg-2);
  border-top: 1px solid var(--c-border);
}

/* Contenitore del menu */
.subhdr__menu {
  display: flex;
  justify-content: center;   /* centra orizzontalmente */
  align-items: center;       /* centra verticalmente */
  gap: 20px;                 /* spazio fra le voci */
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Link del menu */
.subhdr__link {
  color: #fff;
  padding: 8px 12px;
  text-decoration: none;
  cursor: pointer;
}

/* Hover neutro: nessun quadrato, nessuna sottolineatura */
.subhdr__link:hover {
  text-decoration: none;
  background: none;
  color: #fff;
}

/* Footer */
.site-footer{
  background:#0b132b;
  color:#fff;
  border-top:1px solid #1e2b50;
  margin-top:32px;
  font-size:14px;           /* testo più piccolo */
}

.footer-inner{
  padding:16px 0;           /* meno spazio verticale */
}

.footer-menu{
  list-style:none;
  display:flex;
  justify-content:center;   /* centra orizzontalmente */
  gap:24px;                 /* spazio tra le voci */
  padding:0;
  margin:0;
}

.footer-menu a {
  color: #fff;
  text-decoration: none;   /* niente sottolineatura */
  cursor: pointer;
}
.footer-menu a:hover {
  text-decoration: none;   /* niente underline */
  background: none;
  color: #fff;
}

.footer-bottom{
  margin-top:12px;
  text-align:center;
  font-size:13px;
  border-top:1px solid #1e2b50;
  padding-top:8px;
}

/* =========
   BUTTONS
   ========= */

.btn {
  display:inline-block;
  padding:6px 14px;           
  border-radius:9999px;       
  font-weight:600;
  font-size:14px;            
  text-align:center;
  cursor:pointer;
  text-decoration:none;
  transition: opacity .2s ease, background-color .2s ease, transform .06s ease, box-shadow .2s ease;
  border:0;
  line-height:1.2;
}

.btn--primary {
  background: linear-gradient(90deg, var(--c-accent-1), var(--c-accent-2));
  color:#fff;
  box-shadow: 0 4px 10px rgba(0,194,255,.25); 
}
.btn--primary:hover { opacity:.9; transform:translateY(-1px); }

.btn--outline {
  background: transparent;
  color:#fff;
  border:1px solid var(--c-accent-1);
}
.btn--outline:hover { background: rgba(47,128,255,0.15); }

.btn--sm { padding:6px 12px; font-size:14px; border-radius:9999px; }

/* =========
   FORMS
   ========= */

.field{ display:flex; flex-direction:column; gap:8px; }
.label{ color:var(--c-muted); font-size:14px; }
.input, .select, .textarea{
  width:100%;
  background:#0f1b3a;
  border:1px solid var(--c-border);
  color:#fff;
  padding:12px 14px;
  border-radius:12px;
  outline:none;
}
.input:focus, .select:focus, .textarea:focus{
  border-color: var(--c-accent-2);
  box-shadow: 0 0 0 3px rgba(0,194,255,.2);
}

/* =========
   UTILITY
   ========= */

.text-center{ text-align:center; }
.mt-4{ margin-top:16px; }
.mt-6{ margin-top:24px; }
.mt-8{ margin-top:32px; }
.hidden{ display:none !important; }

/* =========
   HERO
   ========= */
.hero{ padding:64px 0 48px; }
.hero-sub{ color:var(--c-muted); max-width:60ch; }


#mblu-bar[hidden],
#mblu-backdrop[hidden],
#mblu-drawer[hidden],
#mbl-guestBtn[hidden],
#mbl-guestDrawer[hidden],
#mbl-guestBackdrop[hidden] { 
  display: none !important; 
}