/* ==========================================================================
   Blocco: Timeline annuale (csp-tla)
   - .csp-tla-wrap → fascia a tutta larghezza del viewport con colore di
                     fondo opzionale (background inline dalla view)
   - .csp-tla      → container interno centrato (max-width 1200px) con gli anni
   Stile di anno e blocchi: vedi timeline-annuale-anno/style.css e
   timeline-annuale-blocco/style.css.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Wrapper a tutta larghezza ("full bleed")
   -------------------------------------------------------------------------- */
.csp-tla-wrap {
	position: relative;
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	box-sizing: border-box;
}

/* Necessario allo sticky: assets/csp.css mette overflow-x:hidden su html e
   body, che trasforma body in un contesto di scroll e blocca position:sticky.
   "clip" evita la scrollbar orizzontale del 100vw senza crearne uno. */
body:has(.csp-tla-wrap) {
	overflow-x: clip;
}

/* Nell'editor il blocco è già "align full": niente 100vw. */
.editor-styles-wrapper .csp-tla-wrap {
	width: auto;
	max-width: none;
	margin-left: 0;
	margin-right: 0;
}

/* --------------------------------------------------------------------------
   Container interno
   -------------------------------------------------------------------------- */
.csp-tla {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 1.5rem;
	box-sizing: border-box;
}

@media (min-width: 769px) {
	.csp-tla {
		padding: 0 2rem;
	}
}
