/*
 * Stili dei blocchi Nordest: caricati sia sul sito sia nell'editor.
 */


/* Titolo a fascia: barra blu con angoli superiori arrotondati. */
.wp-block-heading.is-style-fascia {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	text-align: center;
	padding: 1rem 1.5rem;
	border-radius: 30px 30px 0 0;
	margin-block-end: 0;
}
.wp-block-heading.is-style-fascia + * { margin-block-start: 0; }

/* Riquadro: box azzurro chiaro con bordo sfumato, come sul sito attuale.
   Da solo ha tutti gli angoli arrotondati; sotto un titolo a fascia si attacca alla fascia. */
.wp-block-group.is-style-riquadro {
	border: 2px solid transparent;
	border-radius: 30px;
	background:
		linear-gradient(#E5F9FB, #E5F9FB) padding-box,
		linear-gradient(90deg, #BAF6F9, #D7D7D7) border-box;
	padding: var(--wp--preset--spacing--40);
}
.wp-block-heading.is-style-fascia + .wp-block-group.is-style-riquadro {
	border-top: 0;
	border-radius: 0 0 30px 30px;
}
.wp-block-group.is-style-riquadro .wp-block-list > li + li { margin-top: .6em; }
.wp-block-group.is-style-riquadro .wp-block-list .wp-block-list { margin-top: .4em; }

/* Colonne dentro un riquadro: la foto "riquadro-foto" riempie tutta l'altezza. */
.riquadro-colonne { gap: var(--wp--preset--spacing--40); }
.riquadro-colonne > .wp-block-column:has(> .riquadro-foto) { display: flex; flex-direction: column; }
.wp-block-image.riquadro-foto { position: relative; flex: 1; min-height: 16rem; margin: 0; }
.wp-block-image.riquadro-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* Su desktop la foto arriva al bordo del riquadro, come sul sito attuale. */
@media (min-width: 782px) {
	.wp-block-group.is-style-riquadro:has(> .riquadro-colonne .riquadro-foto) { padding: 0; }
	.riquadro-colonne:has(.riquadro-foto) > .wp-block-column:not(:has(> .riquadro-foto)) { padding-block: var(--wp--preset--spacing--40); }
	.riquadro-colonne:has(.riquadro-foto) > .wp-block-column:first-child:not(:has(> .riquadro-foto)) { padding-left: var(--wp--preset--spacing--40); }
	.riquadro-colonne:has(.riquadro-foto) > .wp-block-column:last-child:not(:has(> .riquadro-foto)) { padding-right: var(--wp--preset--spacing--40); }
	.riquadro-colonne:has(.riquadro-foto) > .wp-block-column:first-child .riquadro-foto img { border-radius: 28px 0 0 28px; }
	.riquadro-colonne:has(.riquadro-foto) > .wp-block-column:last-child .riquadro-foto img { border-radius: 0 28px 28px 0; }
}

/* Immagine grande: occupa tutta la larghezza del contenuto. */
.wp-block-image.immagine-piena img { width: 100%; }

/* Titolo a barra: H1 delle pagine di dettaglio dentro una barra blu arrotondata. */
.wp-block-heading.is-style-barra {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	border-radius: 30px;
	padding: .35em .75em;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: .1em;
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 700;
	line-height: 1.2;
}


/* Contenitori flex/grid dei blocchi: niente pseudo-elementi "clearfix"
   aggiunti da plugin esterni, che diventerebbero elementi della riga e
   sposterebbero i bottoni fuori centro. */
.is-layout-flex::before, .is-layout-flex::after,
.is-layout-grid::before, .is-layout-grid::after {
	content: none;
}

/* Immagini a blocco: i plugin esterni che rendono le figure "inline-block"
   impediscono il centraggio e le lasciano a sinistra rispetto ai riquadri.
   Specificità bassa: gallerie e immagini centrate mantengono il loro stile. */
figure.wp-block-image:where(:not(.alignleft):not(.alignright):not(.aligncenter)) {
	display: block;
}

/* Bottone contorno (es. "Settori correlati", "Torna a ..."). */
.wp-block-button.is-style-contorno .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--primary);
	box-shadow: inset 0 0 0 2px currentColor;
}
.wp-block-button.is-style-contorno .wp-block-button__link:hover {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
}

/* Tabs a pillole (Chi siamo: Vision / Mission / Values / History).
   Barra unica a segmenti: la scheda aperta è piena, le altre restano chiare. */
.wp-block-tabs.is-style-pillole { max-width: 920px; margin-inline: auto; }
.wp-block-tabs.is-style-pillole .wp-block-tab-list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: .4rem;
	padding: .4rem;
	border: 0;
	border-radius: 999px;
	background: var(--wp--preset--color--light-blue);
	margin-block-end: var(--wp--preset--spacing--40);
}
.wp-block-tabs.is-style-pillole .wp-block-tab-list [role="tab"] {
	width: 100%;
	justify-content: center;
	text-align: center;
	background: transparent;
	color: var(--wp--preset--color--primary);
	border: 0;
	border-radius: 999px;
	padding: .9rem 1rem;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--large);
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background-color .25s ease, color .25s ease, box-shadow .25s ease;
}
/* Niente lineetta di WordPress sotto la scheda aperta: qui la scheda aperta è già piena. */
.wp-block-tabs.is-style-pillole .wp-block-tab-list [role="tab"]::before,
.wp-block-tabs.is-style-pillole .wp-block-tab-list [role="tab"]::after { content: none; }
.wp-block-tabs.is-style-pillole .wp-block-tab-list [role="tab"]:hover { background: rgba(2, 97, 171, .1); }
.wp-block-tabs.is-style-pillole .wp-block-tab-list [role="tab"][aria-selected="true"] {
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	box-shadow: 0 8px 20px rgba(2, 97, 171, .3);
}
.wp-block-tabs.is-style-pillole .wp-block-tab-list [role="tab"]:focus-visible {
	outline: 3px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}
@media (max-width: 600px) {
	.wp-block-tabs.is-style-pillole .wp-block-tab-list { grid-template-columns: repeat(2, 1fr); border-radius: 28px; }
}

/* Accordion a pillole (R&D). */
.wp-block-accordion.is-style-pillole { display: flex; flex-direction: column; gap: 1.5rem; }
.wp-block-accordion.is-style-pillole .wp-block-accordion-heading { margin: 0; }
.wp-block-accordion.is-style-pillole .wp-block-accordion-heading__toggle {
	width: 100%;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	border: 0;
	border-radius: 30px;
	padding: 1.25rem 2rem;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 600;
	text-align: center;
	cursor: pointer;
}
.wp-block-accordion.is-style-pillole .wp-block-accordion-heading__toggle:hover { background: var(--wp--preset--color--accent); }
/* Il plugin Colibri forza lo sfondo dei tasti a "inherit !important" (trasparente):
   qui lo sfondo pieno va tenuto con !important, altrimenti il testo bianco sparisce. */
.wp-block-accordion.is-style-pillole .wp-block-accordion-heading__toggle { background-color: var(--wp--preset--color--primary) !important; }
.wp-block-accordion.is-style-pillole .wp-block-accordion-heading__toggle:hover { background-color: var(--wp--preset--color--accent) !important; }
.wp-block-accordion.is-style-pillole .wp-block-accordion-panel { padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--20) 0; }

/* Valori numerati (Chi siamo). */
.valore-numerato .valore-numerato__numero {
	flex: 0 0 auto;
	min-width: 2.5ch;
	font-size: var(--wp--preset--font-size--xx-large);
	font-weight: 700;
	line-height: 1;
	color: var(--wp--preset--color--primary);
}
.valore-numerato > p { margin: 0; }
@media (max-width: 600px) {
	.valore-numerato { gap: .75rem; }
	.valore-numerato .valore-numerato__numero { min-width: 0; font-size: var(--wp--preset--font-size--x-large); }
}
.valore-numerato + .valore-numerato {
	margin-block-start: 1.25rem;
	padding-block-start: 1.25rem;
	border-top: 1px solid rgba(2, 97, 171, .15);
}


/* Spazio tra un riquadro e il titolo a fascia successivo (scheda progetto). */
.wp-block-group.is-style-riquadro + .wp-block-heading.is-style-fascia { margin-block-start: var(--wp--preset--spacing--50); }
.wp-block-accordion.is-style-pillole .wp-block-accordion-heading__toggle,
.wp-block-accordion.is-style-pillole .wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title { text-decoration: none; }

/* Contenuto delle schede: riquadro azzurro con bordo sfumato, come sul sito attuale. */
.wp-block-tabs.is-style-pillole .wp-block-tab-panel {
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
	border: 2px solid transparent;
	border-radius: 30px;
	background:
		linear-gradient(#E5F9FB, #E5F9FB) padding-box,
		linear-gradient(90deg, #BAF6F9, #D7D7D7) border-box;
	box-shadow: 0 12px 32px rgba(0, 11, 48, .06);
}
.wp-block-tabs.is-style-pillole .wp-block-tab-panel:not([hidden]) { animation: nd-scheda-apri .35s ease both; }
.wp-block-tabs.is-style-pillole .wp-block-tab-panel > h2 { margin-block: 0 var(--wp--preset--spacing--30); }
.wp-block-tabs.is-style-pillole .wp-block-tab-panel > p:last-child { margin-block-end: 0; }
@keyframes nd-scheda-apri {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: none; }
}
@media (max-width: 600px) {
	.wp-block-tabs.is-style-pillole .wp-block-tab-panel { padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--20); border-radius: 24px; }
}
@media (prefers-reduced-motion: reduce) {
	.wp-block-tabs.is-style-pillole .wp-block-tab-panel:not([hidden]) { animation: none; }
}

/* Card con link (blocco Copertina): foto a tutta card, titolo in basso
   sulla sfumatura, numero come etichetta e tutta la card cliccabile. */
.wp-block-cover.is-style-card-link {
	isolation: isolate;
	border-radius: 30px;
	overflow: hidden;
	padding: var(--wp--preset--spacing--30);
}
.wp-block-cover.is-style-card-link .wp-block-cover__image-background { z-index: -2; transition: transform .5s ease; }
.wp-block-cover.is-style-card-link .wp-block-cover__background { z-index: -1; }
.wp-block-cover.is-style-card-link .wp-block-cover__inner-container { position: static; width: 100%; }
/* Numero fisso in alto a sinistra: resta allineato qualunque sia la lunghezza del titolo. */
.wp-block-cover.is-style-card-link .card-numero {
	position: absolute;
	top: var(--wp--preset--spacing--30);
	left: var(--wp--preset--spacing--30);
	margin: 0;
	padding: .15rem .75rem;
	border-radius: 999px;
	background: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	letter-spacing: 1px;
}
.wp-block-cover.is-style-card-link .wp-block-heading {
	margin: 0;
	font-size: var(--wp--preset--font-size--large);
	line-height: 1.25;
	color: var(--wp--preset--color--white);
}
.wp-block-cover.is-style-card-link .wp-block-heading::after {
	content: "\2192";
	display: inline-block;
	margin-left: .4em;
	transition: transform .3s ease;
}
.wp-block-cover.is-style-card-link .wp-block-heading a { color: inherit; text-decoration: none; }
/* Il link del titolo copre tutta la card. */
.wp-block-cover.is-style-card-link .wp-block-heading a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.wp-block-cover.is-style-card-link .wp-block-heading a:focus-visible { outline: none; }
.wp-block-cover.is-style-card-link:focus-within { outline: 3px solid var(--wp--preset--color--accent); outline-offset: 3px; }
.wp-block-cover.is-style-card-link:hover .wp-block-cover__image-background,
.wp-block-cover.is-style-card-link:focus-within .wp-block-cover__image-background { transform: scale(1.06); }
.wp-block-cover.is-style-card-link:hover .wp-block-heading::after { transform: translateX(6px); }

/* Testo sotto il titolo della card. */
.wp-block-cover.is-style-card-link .wp-block-cover__inner-container > p:not(.card-numero) {
	margin: .6rem 0 0;
	max-width: 46ch;
	color: rgba(255, 255, 255, .88);
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.55;
}
.wp-block-cover.is-style-card-link .wp-block-cover__inner-container > p strong { color: var(--wp--preset--color--white); }

/* Paragrafo "Parole chiave in blu": il grassetto prende il colore del brand. */
p.is-style-evidenza { line-height: 1.6; }
p.is-style-evidenza strong { color: var(--wp--preset--color--primary); font-weight: 600; }

/* Introduzione a due colonne: linea azzurra che separa le colonne su desktop. */
.intro-colonne { gap: var(--wp--preset--spacing--50); }
@media (min-width: 782px) {
	.intro-colonne > .wp-block-column + .wp-block-column {
		border-left: 3px solid var(--wp--preset--color--light-blue);
		padding-left: var(--wp--preset--spacing--40);
	}
}
