/* Stili condivisi di tutte le pagine pubbliche (barra, tema, footer). Caricato da includes/layout.php */
:root {
  --bg: #07111a; --bg-alt: #0b1929; --nav-bg: rgba(7,17,26,.92);
  --surf: rgba(255,255,255,.05); --surf-h: rgba(255,255,255,.10);
  --txt: #eaf6ff; --muted: rgba(234,246,255,.6); --accent: #5ef7d4;
  --border: rgba(255,255,255,.09); --r: 12px; --radius: 12px;
  --nav-h: 64px; --t: .3s ease;
}
[data-theme="light"] {
  --bg: #f4f7fb; --bg-alt: #ffffff; --nav-bg: rgba(244,247,251,.95);
  --surf: rgba(0,0,0,.04); --surf-h: rgba(0,0,0,.09);
  --txt: #0f172a; --muted: #64748b; --accent: #0077b6;
  --border: rgba(0,0,0,.10);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { overflow-x: clip; }
img, video, svg { max-width: 100%; }
.vm-inner { margin: 0; padding-top: var(--nav-h); background: var(--bg); color: var(--txt);
  font-family: 'Inter', system-ui, -apple-system, sans-serif; line-height: 1.7; min-height: 100vh;
  display: flex; flex-direction: column; transition: background var(--t), color var(--t); }
.vm-inner > main, .vm-inner > .container-vm { flex: 1 0 auto; width: 100%; }
.vm-nav {
  position: fixed; top: 0; left: 0; right: 0; height: var(--nav-h);
  display: flex; align-items: center; padding: 0 2rem; gap: 1.5rem; z-index: 9000;
  background: var(--nav-bg); border-bottom: 1px solid var(--border);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  transition: background var(--t), border-color var(--t);
}
.vm-nav__brand { font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 1.25rem;
  color: var(--accent); letter-spacing: .08em; flex-shrink: 0; text-decoration: none; display: flex; align-items: center; gap: .55rem; }
.vm-nav__brand img { width: 28px; height: 28px; border-radius: 7px; }
.vm-nav__links { display: flex; gap: 1.4rem; flex: 1; min-width: 0; }
.vm-nav__links a { color: var(--muted); font-size: .88rem; font-weight: 500; text-decoration: none; white-space: nowrap; transition: color var(--t); }
.vm-nav__links a:hover, .vm-nav__links a.active { color: var(--txt); text-decoration: none; }
.vm-theme-btn { margin-left: auto; width: 38px; height: 38px; border-radius: 50%;
  border: 1px solid var(--border); background: var(--surf); color: var(--txt); cursor: pointer;
  display: flex; align-items: center; justify-content: center; font-size: .95rem; flex-shrink: 0;
  transition: background var(--t), color var(--t), transform .2s; }
.vm-theme-btn:hover { background: var(--surf-h); transform: rotate(20deg); }
.vm-footer { text-align: center; color: var(--muted); font-size: .8rem; padding: 2rem 1rem 3rem;
  border-top: 1px solid var(--border); margin-top: 2rem; }
.vm-footer a { color: var(--accent); text-decoration: none; }
.vm-footer a:hover { text-decoration: underline; }
.vm-footer__links { display: flex; justify-content: center; flex-wrap: wrap; gap: .4rem 1.2rem; margin-bottom: .6rem; }
.vm-nav__menu { display: none; width: 42px; height: 42px; border-radius: 10px; border: 1px solid var(--border);
  background: var(--surf); color: var(--txt); cursor: pointer; font-size: 1.05rem; flex-shrink: 0;
  align-items: center; justify-content: center; -webkit-tap-highlight-color: transparent; }
.vm-theme-btn { width: 42px; height: 42px; }
@media (max-width: 820px) {
  .vm-nav { padding: 0 .85rem; gap: .6rem; }
  .vm-nav__menu { display: flex; }
  .vm-nav__links { position: fixed; top: var(--nav-h); left: 0; right: 0; flex: none; flex-direction: column; gap: 0;
    padding: .4rem .85rem 1rem; background: var(--bg-alt); border-bottom: 1px solid var(--border);
    box-shadow: 0 18px 40px rgba(0,0,0,.28); max-height: calc(100vh - var(--nav-h)); overflow-y: auto;
    transform: translateY(-8px); opacity: 0; visibility: hidden; transition: opacity .18s ease, transform .18s ease, visibility .18s; }
  .vm-nav--open .vm-nav__links { transform: none; opacity: 1; visibility: visible; }
  .vm-nav__links a { font-size: 1.05rem; padding: .9rem .4rem; min-height: 48px; display: flex; align-items: center;
    border-bottom: 1px solid var(--border); color: var(--txt); }
  .vm-nav__links a:last-child { border-bottom: 0; }
  .vm-nav__links a.active { color: var(--accent); font-weight: 600; }
  .vm-footer { padding: 1.6rem 1rem 2.4rem; }
  .vm-footer__links a { padding: .35rem .2rem; }
}
@media (prefers-reduced-motion: reduce) { .vm-nav__links { transition: none; } }