/* common.css */

/* RESET */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* FONT + BASE */
body {
  font-family: 'Segoe UI', system-ui, sans-serif;
  background: linear-gradient(to bottom, #f5f7fb, #e9f0ea);
  color: #1a1a1a;
}

/* HEADER */
header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 60px;
  background: white;
  box-shadow: 0 4px 20px rgba(0,0,0,0.05);
}

header h1 {
  font-size: 22px;
  font-weight: 600;
}

nav a {
  margin-left: 20px;
  text-decoration: none;
  color: #0d3620;
  font-weight: 500;
  transition: 0.3s;
}

nav a:hover { opacity: 0.6; }

/* TITOLI GLOBALI */
h2 {
  text-align: center;
  margin-bottom: 40px;
  font-size: 26px;
}

/* RESPONSIVE HEADER */
@media (max-width: 768px) {
  header { flex-direction: column; gap: 10px; }
}

/* Limita la larghezza del contenuto (escludendo header, footer e toolbar) */
:root {
  --site-max-width: 1900px;
}

/* Applica max-width e centratura ai contenuti principali tranne header/footer/toolbar */
body > *:not(header):not(footer):not(.toolbar) {
  max-width: var(--site-max-width);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  background-color: #fff; 
}

/* Se ci sono contenitori interni standard (es. .container), assicurati che non eccedano */
.container {
  max-width: var(--site-max-width);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0; /* il padding esterno del body > * gestisce il padding
                       lasciare a 0 evita doppio padding quando .container è usato */
}

/* Evita che media escano dal contenitore */
img, video, iframe {
  max-width: 100%;
  height: auto;
}

/* Classe per contenuti full-bleed intenzionali */
.full-bleed {
  max-width: none;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
}