:root {
	--accento-chiaro: #DFF3F0;
	--accento: #2A9D8F;
	--riga-sottile: #D6D6D6;
	--sfondo-a: #F3F3F3;
	--sfondo-b: #EFE9F3;
	--tenue: #56586F;
	--tinta-2: #2C1F38;
	--tinta: #3B2A4A;
}

*, *::before, *::after {
	box-sizing: border-box;
}
html {
	overflow-x: clip;
}
body {
	margin: 0px;
	color: #212529;
	font: 400 0.9375rem/1.5 "Work Sans", Arial, sans-serif;
	background: #FFF;
}
img {
	display: block;
	height: auto;
	max-width: 100%;
}
a {
	color: var(--tinta);
}
h1, h2, h3, h4 {
	margin: 0px 0 1rem;
	color: var(--tinta);
	font-family: Lora, Arial, sans-serif;
	line-height: 1.2;
}
h1 {
	font-size: 1.9375rem;
	font-weight: 400;
}
h2 {
	font-size: 1.5625rem;
	font-weight: 400;
}
h3 {
	font-size: 1.1875rem;
	font-weight: 700;
}
p {
	margin: 0px 0 1rem;
}
.solo-lettori {
	position: absolute;
	height: 1px;
	overflow: hidden;
	width: 1px;
	clip: rect(0 0px 0px 0);
}
.telaio {
	margin: 0px auto;
	max-width: 1095px;
	padding: 0px 0.9375rem;
	width: 100%;
}
.linea {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -0.9375rem;
}
.linea > [class*="cella"] {
	min-width: 0px;
	padding: 0px 0.9375rem;
	width: 100%;
}
.scritta-mezzo {
	text-align: center;
}
.fascia {
	padding: 2.5rem 0px;
}
.fascia--grigio {
	background: var(--sfondo-a);
}
.fascia--azzurro {
	background: var(--sfondo-b);
}
.sopratitolo {
	margin-bottom: 0.5rem;
	font-size: 1rem;
}

/* valori di base */
.portale-intestazione {
	left: 0px;
	position: absolute;
	right: 0px;
	top: 0px;
	z-index: 30;
	height: 80px;
	padding-top: 10px;
}
.testata-barra {
	display: flex;
	align-items: center;
	gap: 1rem;
	min-height: 60px;
	padding: 8px 8px 8px 18px;
	background: #FFF;
	border-radius: 4px;
	box-shadow: 0px 0 40px rgba(74, 98, 120, 0.2);
}
.testata-barra__logo img {
	height: auto;
	width: 170px;
}
.testata-barra__collegamenti {
	display: none;
}
.testata-barra__collegamenti a {
	display: inline-block;
	padding: 0.75rem 0px;
	color: var(--tinta);
	font: 400 1rem/1.1 Lora, Arial, sans-serif;
	text-decoration-color: transparent;
	text-decoration-thickness: 2px;
	text-decoration: underline;
	text-underline-offset: 5px;
	transition: text-decoration-color 0.15s ease-in-out;
}
.testata-barra__collegamenti a:hover {
	text-decoration-color: var(--accento);
}
.con-tendina {
	display: inline-block;
	position: relative;
}
.tendina {
	display: none;
	left: -1rem;
	position: absolute;
	top: 100%;
	min-width: 260px;
	padding: 0.5rem 1rem;
	background: #FFF;
	border-radius: 4px;
	filter: drop-shadow(0 0.5rem 1.5rem rgba(74, 98, 120, 0.25));
}
.tendina a {
	display: block;
	padding: 0.5rem 0px;
}
.con-tendina:hover .tendina, .con-tendina:focus-within .tendina {
	display: block;
}
.gettone-posto {
	margin-left: auto;
	padding: 10px 14px;
	color: var(--tinta);
	font-size: 0.875rem;
	font-weight: 700;
	text-decoration: none;
	background: var(--accento-chiaro);
	border-radius: 3px;
}
.hamburger {
	display: flex;
	flex-direction: column;
	gap: 6px;
	justify-content: center;
	height: 44px;
	padding: 10px;
	width: 44px;
	background: none;
	border: 0px;
	cursor: pointer;
}
.hamburger i {
	display: block;
	height: 2px;
	background: var(--tinta);
}
.cassetto-tasca {
	display: flex;
	inset: 0px;
	position: fixed;
	top: 80px;
	flex-direction: column;
	padding: 1.5rem;
	background: #F6F7F9;
	animation: scivola 0.4s cubic-bezier(.22,1,.36,1);
}
.cassetto-tasca[hidden] {
	display: none;
}
@keyframes scivola { from {
	transform: translateX(100%);
} to {
	transform: none;
} }
.cassetto-tasca a {
	padding: 0.875rem 0px;
	color: var(--tinta);
	font: 700 1.25rem Lora, Arial, sans-serif;
	text-decoration: none;
	border-bottom: 1px solid var(--riga-sottile);
}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible {
	outline-offset: 2px;
	outline: 3px solid var(--accento);
}

/* caratteri */
.pulsante {
	display: inline-flex;
	position: relative;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	padding: 15px 20px;
	font: 700 0.9375rem/1 "Work Sans", Arial, sans-serif;
	text-decoration: none;
	border-radius: 3px;
	border: 0px;
	cursor: pointer;
	transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.pulsante--notte {
	color: #FFF;
	background: var(--tinta);
}
.pulsante--notte::after {
	bottom: 0px;
	content: "";
	left: 0px;
	position: absolute;
	right: 0px;
	height: 3px;
	background: var(--accento);
}
.pulsante--notte:hover {
	background: var(--tinta-2);
}
.pulsante--bordo {
	color: var(--tinta);
	background: transparent;
	box-shadow: inset 0px 0px 0 2px var(--tinta);
}
.pulsante--bordo:hover {
	color: #FFF;
	background: var(--tinta);
}
.pulsante--pieno {
	margin-top: auto;
	width: 100%;
}
.pulsante--piccolo {
	padding: 10px 14px;
	font-size: 0.8125rem;
}
.pulsante-linea {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.pulsante[disabled] {
	cursor: wait;
	opacity: 0.6;
}

/* testata */
.vetrina {
	position: relative;
	height: 420px;
	overflow: hidden;
}
.vetrina__ritratto {
	height: 100%;
	width: 100vw;
	object-fit: cover;
}
.sigillo-tondo {
	bottom: 24px;
	display: flex;
	position: absolute;
	right: 6%;
	align-items: center;
	justify-content: center;
	height: 150px;
	width: 150px;
	color: #FFF;
	font: 700 1.125rem/1.2 Lora, Arial, sans-serif;
	text-align: center;
	background: var(--tinta);
	border-radius: 50%;
	box-shadow: 0px 0px 0px 4px #FFF, 0px 0px 0 7px var(--accento);
	transform: rotate(-8deg);
}

/* menu del telefono */
.punti-strip {
	border-bottom: 2px solid var(--riga-sottile);
}
.punti-strip__lista {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	margin: 0px;
	padding: 1.25rem 0px;
	font-weight: 700;
	list-style: none;
}
.punti-strip__lista li::before {
	content: "✓";
	margin-right: 0.5rem;
	color: #6F7A00;
}

.apertura__attacco {
	max-width: 1065px;
}

/* pulsanti */
.doppio {
	row-gap: 1rem;
}
.docu-pannello {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 0px 1.5rem 1.5rem;
	background: #FFF;
	border-radius: 3px;
	box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
}
.docu-pannello__ritratto {
	height: 200px;
	margin: 0px -1.5rem 1.25rem;
	max-width: none;
	width: calc(100% + 3rem);
	border-radius: 3px 3px 0 0px;
	object-fit: cover;
}
.docu-pannello__titolo {
	font-size: 1.375rem;
}
.docu-pannello__linea {
	display: flex;
	gap: 14px;
	padding: 14px 0px;
	border-top: 1px solid var(--riga-sottile);
}
.docu-pannello__linea svg {
	flex: none;
}
.docu-pannello__linea b {
	display: block;
}
.docu-pannello__linea:last-of-type {
	margin-bottom: 1.25rem;
}

/* foto in apertura */
.profili {
	row-gap: 2rem;
	margin-top: 2rem;
	text-align: left;
}
.profili img {
	aspect-ratio: 59 / 86;
	margin-bottom: 1rem;
	width: 100%;
	border-radius: 3px;
	object-fit: cover;
}

/* punti sotto la foto */
.sigillo-linea {
	display: flex;
	align-items: center;
	flex-direction: column;
	gap: 1.25rem;
	margin: 1.5rem 0 2rem;
}
.disco {
	display: flex;
	align-items: center;
	flex-direction: column;
	gap: 2px;
	justify-content: center;
	height: 160px;
	width: 160px;
	background: #FFF;
	border-radius: 50%;
	border: 2px solid var(--tinta);
}
.disco b {
	font: 700 1.125rem Lora, Arial, sans-serif;
}
.disco small {
	color: var(--tenue);
}
.disco--scuro {
	color: #FFF;
	background: var(--tinta);
}
.disco--scuro small {
	color: #DFE2E8;
}

/* apertura del testo */
.carosello-fascia .telaio {
	position: relative;
}
.carosello-fascia .telaio::before {
	bottom: -2.5rem;
	content: "";
	left: 50%;
	position: absolute;
	z-index: -1;
	height: 50%;
	width: 100vw;
	background: var(--accento-chiaro);
	transform: translateX(-50%);
}
.carosello-fascia {
	position: relative;
	z-index: 0;
}
.carosello-testa {
	display: flex;
	align-items: flex-end;
	gap: 1rem;
	justify-content: space-between;
	margin-bottom: 1.25rem;
}
.carosello-arrows {
	display: flex;
	gap: 8px;
}
.carosello-puntatore {
	height: 48px;
	width: 48px;
	color: #FFF;
	font-size: 1.5rem;
	background: var(--tinta);
	border-radius: 3px;
	border: 0px;
	cursor: pointer;
}
.carosello-pista {
	display: flex;
	gap: 15px;
	overflow-x: auto;
	padding-bottom: 1rem;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}
.carosello-pista::-webkit-scrollbar {
	display: none;
}
.quadro-pannello {
	flex: 0 0 85%;
	overflow: hidden;
	padding-bottom: 1rem;
	background: #F6F7F9;
	border-radius: 3px;
	scroll-snap-align: start;
}
.quadro-pannello img {
	aspect-ratio: 9 / 5;
	margin-bottom: 1rem;
	width: 100%;
	object-fit: cover;
}
.quadro-pannello h3, .quadro-pannello p {
	padding: 0px 1rem;
}

/* i due documenti */
.limiti {
	row-gap: 1rem;
	margin-top: 1.5rem;
}
.limite {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding-top: 12px !important;
	border-top: 3px solid var(--tinta);
}
.limite b {
	color: var(--tinta);
	font: 700 1.1875rem Lora, Arial, sans-serif;
}
.limite--marcata {
	border-top-color: var(--accento);
}

.h3-nero {
	font-size: 1.375rem;
	font-weight: 700;
}
.ampio-ritratto {
	margin: 1.5rem auto 0px;
	max-width: 1245px;
	padding: 0px 0.9375rem;
}
.ampio-ritratto img {
	aspect-ratio: 8 / 3;
	width: 100%;
	border-radius: 3px;
	object-fit: cover;
}

/* i profili */
.puntatore-rimando {
	font-weight: 700;
	text-decoration: none;
}
.puntatore-rimando:hover {
	text-decoration: underline;
}
.percorso .linea {
	row-gap: 1rem;
	margin-top: 1rem;
}
.step-card {
	display: flex;
	flex-direction: column;
	gap: 6px;
	height: 100%;
	padding: 20px 20px 22px;
	border-radius: 3px;
	border: 1px solid #DDE1EA;
}

/* le pagine dell'anno */
.schede-t {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 1.25rem;
}
.scheda-t {
	min-height: 44px;
	padding: 10px 16px;
	color: var(--tinta);
	font: 700 0.9375rem "Work Sans", Arial, sans-serif;
	background: #FFF;
	border-radius: 3px;
	border: 0px;
	box-shadow: inset 0px 0px 0 2px var(--tinta);
	cursor: pointer;
}
.scheda-t.si-acceso {
	color: #FFF;
	background: var(--tinta);
}
.scheda-t-vano details {
	border-bottom: 1px solid var(--riga-sottile);
}
.scheda-t-vano summary {
	position: relative;
	padding: 27px 40px 27px 0px;
	font: 700 1rem Lora, Arial, sans-serif;
	list-style: none;
	cursor: pointer;
}
.scheda-t-vano summary::-webkit-details-marker {
	display: none;
}
.scheda-t-vano summary::after {
	content: "+";
	position: absolute;
	right: 4px;
	top: 22px;
	font: 300 1.5rem Lora, Arial, sans-serif;
}
.scheda-t-vano details[open] summary::after {
	content: "−";
}
.scheda-t-vano details p {
	padding-bottom: 1rem;
}

/* cicli */
.piede {
	padding: 3rem 0 1.5rem;
	color: #FFF;
	background: var(--tinta);
	border-top: 1px solid var(--tenue);
}
.piede .linea {
	row-gap: 2rem;
}
.piede__h {
	position: relative;
	margin-bottom: 1rem;
	padding-bottom: 0.5rem;
	font: 700 1rem Lora, Arial, sans-serif;
}
.piede__h::after {
	bottom: 0px;
	content: "";
	left: 0px;
	position: absolute;
	height: 1px;
	width: 40%;
	background: var(--accento);
}
.piede a, .piede span {
	display: block;
	margin-bottom: 20px;
	overflow-wrap: anywhere;
	color: #FFF;
	text-decoration: none;
}
.piede a:hover {
	text-decoration: underline;
}
.piede__copy {
	margin-top: 2rem;
	padding-top: 1rem;
	font-size: 0.875rem;
	border-top: 1px solid var(--tenue);
}
.rimando-pulsante {
	min-height: 24px;
	padding: 0px;
	color: #FFF;
	font: inherit;
	text-decoration: underline;
	background: none;
	border: 0px;
	cursor: pointer;
}

/* carosello */
.informa-canto {
	bottom: 1rem;
	left: 1rem;
	position: fixed;
	right: 1rem;
	z-index: 50;
	padding: 1.25rem;
	background: #FFF;
	border-radius: 4px;
	box-shadow: 0px 0 40px rgba(74, 98, 120, 0.3);
}
.informa-canto[hidden] {
	display: none;
}
.informa-canto__casella {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 0.75rem;
}
.informa-canto__pulsanti {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

@media (min-width: 36rem) {
		.quadro-pannello {
	flex-basis: 48%;
}
		.informa-canto {
	left: auto;
	max-width: 420px;
}
}
@media (min-width: 48rem) {
		.punti-strip__lista {
	flex-direction: row;
	justify-content: space-around;
	text-align: center;
}
		.sigillo-linea {
	flex-direction: row;
	justify-content: center;
}
		.vetrina {
	height: 520px;
}
		.sigillo-tondo {
	height: 200px;
	width: 200px;
	font-size: 1.375rem;
}
}
@media (min-width: 62rem) {
		.fascia {
	padding: 3.75rem 0px;
}
		h1 {
	font-size: 2.5rem;
}
		h2 {
	font-size: 1.75rem;
}
		.telaio {
	padding: 0px 1.875rem;
}
		.testata-barra__collegamenti {
	display: flex;
	gap: 1.75rem;
	margin-left: 2rem;
}
		.hamburger {
	display: none;
}
		.vetrina {
	height: 585px;
}
		.cella-larga-6 {
	width: 50% !important;
}
		.cella-larga-4 {
	width: 33.333% !important;
}
		.cella-larga-3 {
	width: 25% !important;
}
		.limiti .cella {
	width: 20% !important;
}
		.profili {
	column-gap: 0px;
}
		.quadro-pannello {
	flex-basis: 32%;
}
		/* limiti */
		.percorso {
	padding-top: 2.5rem;
}
}
@media (prefers-reduced-motion: reduce) {
		*, *::before, *::after {
	animation: none !important;
	transition: none !important;
}
}

/* fasi */
.pagina-cima {
	padding: 120px 0 2.5rem;
}
.pagina-cima h1 {
	margin-bottom: 0.75rem;
}
.centra-linea {
	align-items: center;
	row-gap: 1.5rem;
}
.scatto-curva {
	aspect-ratio: 9 / 7;
	width: 100%;
	border-radius: 3px;
	object-fit: cover;
}
.scatto-piena {
	margin: 2rem 0px;
}
.scatto-piena img {
	aspect-ratio: 7 / 3;
	width: 100%;
	border-radius: 3px;
	object-fit: cover;
}
.scatto-piena figcaption {
	margin-top: 0.5rem;
	color: var(--tenue);
	font-size: 0.875rem;
}
.diritto-scritto {
	max-width: 900px;
}
.diritto-scritto h3 {
	margin: 2rem 0 0.5rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--riga-sottile);
}
.diritto-scritto h3:first-child {
	margin-top: 0px;
}
.scheda-box {
	margin-bottom: 3rem;
	max-width: 720px;
	padding: 2rem 1.5rem;
	background: var(--sfondo-a);
	border-radius: 3px;
}
.fasi-traccia {
	display: flex;
	gap: 0.5rem;
	margin: 0px 0 1.5rem;
	padding: 0px;
	list-style: none;
	counter-reset: p;
}
.fasi-traccia li {
	flex: 1;
	padding-top: 0.5rem;
	font-size: 0.875rem;
	font-weight: 700;
	border-top: 3px solid var(--riga-sottile);
	counter-increment: p;
}
.fasi-traccia li::before {
	content: counter(p) ". ";
}
.fasi-traccia li.corrente {
	border-top-color: var(--accento);
}
.fase {
	margin: 0px;
	padding: 0px;
	border: 0px;
}
.fase legend {
	margin-bottom: 1rem;
	padding: 0px;
	color: var(--tinta);
	font: 400 1.375rem Lora, Arial, sans-serif;
}
.campo-etich {
	display: block;
	margin: 0.75rem 0 0.375rem;
	font-weight: 700;
}
.fase input[type="text"], .fase input[type="email"], .fase select {
	height: 48px;
	padding: 0.5rem 0.75rem;
	width: 100%;
	font: 400 1rem "Work Sans", Arial, sans-serif;
	background: #FFF;
	border-radius: 3px;
	border: 1px solid #DDE1EA;
}
.fase input:invalid:not(:placeholder-shown) {
	border-color: #B3261E;
}
.risposte {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.25rem;
}
.risposte label {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-height: 36px;
}
.accordo-etich {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	margin: 1rem 0px;
}
.accordo-etich input {
	margin-top: 3px;
}
.invisibile {
	left: -9999px;
	position: absolute;
}
.fase .pulsante-linea {
	margin-top: 1.25rem;
}
.triplo-fasi__risultato {
	margin: 1rem 0 0px;
	min-height: 1.5em;
	font-weight: 700;
}
.poi-scheda {
	margin-top: 1rem;
}
.apertura h1 {
	font-size: clamp(1.9375rem, 1.2rem + 2vw, 2.5rem);
	text-wrap: balance;
}
.apertura__attacco, .docu-pannello p {
	text-wrap: pretty;
}
.fasi-contate {
	display: grid;
	gap: 1rem;
	margin: 1.5rem 0 0px;
	padding: 0px;
	list-style: none;
	counter-reset: n;
}
.fasi-contate li {
	display: flex;
	position: relative;
	flex-direction: column;
	gap: 4px;
	padding: 18px 20px 18px 64px;
	border-radius: 3px;
	border: 1px solid #DDE1EA;
	box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.06);
	counter-increment: n;
}
.fasi-contate li::before {
	content: counter(n);
	display: grid;
	left: 18px;
	position: absolute;
	top: 16px;
	place-items: center;
	height: 32px;
	width: 32px;
	color: #FFF;
	font: 700 1rem Lora, Arial, sans-serif;
	background: #3B2A4A;
	border-radius: 50%;
}
.piede a, .piede span {
	min-height: 24px;
}
.dropdown-menu a, .tendina a {
	min-height: 32px;
}
@media (min-width: 62rem) { .fasi-contate {
	grid-template-columns: repeat(3, 1fr);
} }

/* domande */
.pagine-calendario {
	padding: 3.5rem 0px 3rem;
}
.pagine-calendario-apertura {
	max-width: 38rem;
	color: var(--tenue);
}
.pagine-calendario-serie {
	display: grid;
	gap: 1rem;
	grid-template-columns: 1fr;
	margin-top: 2rem;
}
.pagine-calendario-voce {
	padding: 1.25rem 1.25rem 0.75rem;
	background: var(--sfondo-a);
	border-left: 4px solid var(--accento);
}
.pagine-calendario-tempo {
	margin: 0.75rem 0px 0.25rem;
	color: var(--tenue);
	font-size: 0.8125rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
.pagine-calendario-voce h3 {
	margin-bottom: 0.4rem;
	font-size: 1.15rem;
}
@media (min-width: 48rem) {
		.pagine-calendario-serie {
	grid-template-columns: repeat(4, minmax(0px, 1fr));
}
}
.disco {
	border-width: 3px;
}
