/* ============================================================
   SFVDT-Layout.css — Header, navigazione, hero, sezioni, footer
   Unità in rem/em.
   ============================================================ */

/* ---------- HEADER ---------- */
.sito-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: saturate(160%) blur(0.5rem);
  border-bottom: var(--bordo-sottile) solid var(--c-bordo);
  min-height: var(--header-h);
}
.sito-header .contenitore {
  display: flex; align-items: center; gap: 1.75rem;
  min-height: var(--header-h);
}
.sito-logo { display: flex; align-items: center; gap: 0.75rem; margin-right: auto; }
.sito-logo img { height: 3.125rem; width: auto; }
.sito-logo .nome { display: flex; flex-direction: column; line-height: 1.05; }
.sito-logo .nome b { color: var(--c-primario-scuro); font-size: 0.95rem; letter-spacing: 0.01em; white-space: nowrap; }
.sito-logo .nome span { color: var(--c-primario); font-size: 0.66rem; letter-spacing: 0.01em; white-space: nowrap; }

.menu-principale { display: flex; align-items: center; gap: 0.25rem; }
.menu-principale a {
  padding: 0.5625rem 0.8125rem; border-radius: var(--raggio-sm); color: var(--c-testo);
  font-weight: 600; font-size: 0.95rem; transition: all var(--transizione);
  white-space: nowrap;
}
.menu-principale a:hover { background: var(--c-neutro); color: var(--c-primario-scuro); }
.menu-principale a.attivo { color: var(--c-primario); background: var(--c-primario-soft); }

.header-azioni { display: flex; align-items: center; gap: 0.625rem; }

/* hamburger */
.menu-toggle {
  display: none; background: none; border: 0; cursor: pointer; padding: 0.5rem;
  width: 2.75rem; height: 2.75rem;
}
.menu-toggle span { display: block; width: 1.5rem; height: 0.125rem; background: var(--c-primario-scuro); margin: 0.3125rem auto; transition: 0.3s; }
.menu-toggle.aperto span:nth-child(1) { transform: translateY(0.4375rem) rotate(45deg); }
.menu-toggle.aperto span:nth-child(2) { opacity: 0; }
.menu-toggle.aperto span:nth-child(3) { transform: translateY(-0.4375rem) rotate(-45deg); }

/* ---------- CONTENUTO / SEZIONI ---------- */
main { min-height: 60vh; }
.sezione { padding: 4.5rem 0; }
.sezione--neutra { background: var(--c-neutro); }
.sezione--chiara { background: linear-gradient(180deg, #fff, var(--c-chiaro) 320%); }
.sezione__intestazione { max-width: 45rem; margin: 0 auto 2.75rem; text-align: center; }
.sezione__intestazione p { color: #4a5b60; font-size: 1.05rem; }

/* ---------- HERO ---------- */
.hero {
  position: relative; color: #fff; isolation: isolate;
  padding: clamp(4.375rem, 12vw, 8.125rem) 0; overflow: hidden;
}
.hero__bg { position: absolute; inset: 0; z-index: -2; }
.hero__bg img { width: 100%; height: 100%; object-fit: cover; }
.hero::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(115deg, rgba(7,94,115,0.92) 0%, rgba(0,151,180,0.78) 55%, rgba(0,151,180,0.45) 100%);
}
.hero h1 { color: #fff; max-width: 16ch; }
.hero p { font-size: 1.2rem; max-width: 52ch; opacity: 0.97; }
.hero .azioni { margin-top: 1.75rem; display: flex; flex-wrap: wrap; gap: 0.875rem; }
.hero__nota { margin-top: 1.375rem; font-size: 0.92rem; opacity: 0.9; }
.hero__nota b { color: #fff; }

/* griglie generiche */
.griglia { display: grid; gap: 1.625rem; }
.griglia--2 { grid-template-columns: repeat(2, 1fr); }
.griglia--3 { grid-template-columns: repeat(3, 1fr); }
.griglia--4 { grid-template-columns: repeat(4, 1fr); }

/* blocco testo+immagine */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 3.125rem; align-items: center; }
.split img { border-radius: var(--raggio); box-shadow: var(--ombra); width: 100%; }

/* ---------- FOOTER ---------- */
.sito-footer { background: var(--c-primario-scuro); color: #d8eef3; padding: 3.5rem 0 1.625rem; }
.sito-footer a { color: #d8eef3; }
.sito-footer a:hover { color: #fff; }
.sito-footer .griglia { grid-template-columns: 1.4fr 1fr 1fr; gap: 2.25rem; }
.sito-footer h4 { color: #fff; font-size: 1.05rem; margin-bottom: 0.875rem; }
.sito-footer img.logo-footer { height: 3.5rem; margin-bottom: 0.875rem; }
.sito-footer .footer-claim { max-width: 34ch; color: #bfe3ea; }
.footer-orari li { list-style: none; display: flex; justify-content: space-between; gap: 0.625rem; max-width: 17.5rem; }
.footer-orari { padding: 0; }
.footer-bottom {
  border-top: var(--bordo-sottile) solid rgba(255,255,255,0.15); margin-top: 2.5rem; padding-top: 1.125rem;
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.625rem; font-size: 0.85rem; color: #a9d4dd;
}