/* ==========================================================================
   Modulo: Box Informativo
   ========================================================================== */

.csp-box-info {
	--csp-bi-bg: #F0F3F8;
	--csp-bi-border: #CDD5DE;
	--csp-bi-accent: #1E7B3C;      /* colore del sottotitolo H3 / link */
	--csp-bi-icon-size: 24px;

	position: relative;
	box-sizing: border-box;
	width: 100%;
	margin: 0 0 32px;
	padding: 64px 45px;
	background-color: var(--csp-bi-bg);
	border: 1px solid var(--csp-bi-border);
}

/* Spazio a destra per non far finire il testo sotto l'icona */
.csp-box-info--con-icona {
	padding-right: calc(var(--csp-bi-padding) + var(--csp-bi-icon-size) + 16px);
}

/* --------------------------------------------------------------------
   Icona in alto a destra
   -------------------------------------------------------------------- */
.csp-box-info__icona {
	position: absolute;
	top: 20px;
	right: 20px;
	z-index: 1;
	display: flex;
	width: var(--csp-bi-icon-size);
	height: var(--csp-bi-icon-size);
	line-height: 0;
}

.csp-box-info__icona img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* --------------------------------------------------------------------
   Titolo H2 (serif, eredita il font dei titoli del tema)
   Il doppio selettore (classe + tag) copre anche gli H2 a cui
   l'utente avesse tolto la classe dal pannello "Avanzate".
   -------------------------------------------------------------------- */
.csp-box-info .csp-box-info__titolo,
.csp-box-info__contenuto h2 {
	margin: 0 0 12px;
	padding: 0;
	font-size: 34px;
	font-weight: 400;
	line-height: 1.3;
	font-family: Gelasio;
	color: #000;
}

/* --------------------------------------------------------------------
   Sottotitolo H3 (sans-serif, verde, bold)
   -------------------------------------------------------------------- */
.csp-box-info .csp-box-info__sottotitolo,
.csp-box-info__contenuto h3 {
	margin: 0;
	padding: 0;
	font-family: inherit;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.4;
	color: #0E753B;
	word-break: break-word;
}

.csp-box-info__contenuto h3 a {
	color: inherit;
	text-decoration: none;
}

.csp-box-info__contenuto h3 a:hover,
.csp-box-info__contenuto h3 a:focus {
	text-decoration: underline;
}

/* Nessun margine sotto l'ultimo elemento (es. se il sottotitolo viene rimosso) */
.csp-box-info__contenuto > :last-child,
.csp-box-info__contenuto .block-editor-block-list__layout > :last-child {
	margin-bottom: 0;
}

/* --------------------------------------------------------------------
   Editor: azzera i margini che Gutenberg aggiunge ai blocchi figli
   -------------------------------------------------------------------- */
.editor-styles-wrapper .csp-box-info__contenuto .wp-block {
	margin-top: 0;
	max-width: none;
}

/* --------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------- */
@media (max-width: 768px) {
	.csp-box-info__icona {
		top: 23px;
		right: 23px;
	}
}