/* Famiglia «articolo»: regole condivise dagli articoli del blog, sotto .qrevely-pagina--articolo.
   Valori dal foglio «ar-» del live (Content Block 1709), con i colori sui token della palette. */

.qrevely-pagina--articolo {
	color: var(--wp--preset--color--inchiostro);
}

/* Colonna di 1160px (1200 con il gutter) per le tre fasce del template. */
.qrevely-pagina--articolo .qrevely-articolo-testa,
.qrevely-pagina--articolo .qrevely-articolo-corpo,
.qrevely-pagina--articolo .qrevely-articolo-altri {
	padding-inline: var(--wp--custom--gutter, 20px);
}
.qrevely-pagina--articolo .qrevely-articolo-testa > *,
.qrevely-pagina--articolo .qrevely-articolo-corpo > *,
.qrevely-pagina--articolo .qrevely-articolo-altri > * {
	max-width: 1160px;
	margin-inline: auto;
}
.qrevely-pagina--articolo .qrevely-articolo-corpo > .wp-block-post-content > * {
	max-width: none;
}

/* Fra le fasce del template non c'è spazio oltre al loro. */
.qrevely-pagina--articolo > * {
	margin-block: 0;
}

/* ---------- testata ---------- */
/* Fra la testata del sito e le briciole: 55px, gli stessi dell'elenco di guide e articoli (testata di blog.css). Erano 93, la misura del live:
   troppo vuoto sopra il titolo, per articoli e guide. */
.qrevely-pagina--articolo .qrevely-articolo-testa {
	padding-top: 55px;
}
.qrevely-pagina--articolo .qrevely-articolo-titolo {
	margin: 22px 0 0;
	font-size: clamp(32px, 3.8vw, 54px);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.035em;
	color: var(--wp--preset--color--inchiostro);
}
.qrevely-pagina--articolo .qrevely-articolo-titolo mark {
	background: none;
}
.qrevely-pagina--articolo .qrevely-articolo-intro {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 430px;
	gap: 60px;
	align-items: end;
	margin: 26px 0 0;
}
.qrevely-pagina--articolo .qrevely-articolo-intro > .wp-block-column {
	flex-basis: auto !important;
	align-self: end;
	min-width: 0;
}
.qrevely-pagina--articolo .qrevely-articolo-intro .is-style-occhiello {
	font-size: 17px;
	line-height: 28px;
	letter-spacing: -0.01em;
}
.qrevely-pagina--articolo .qrevely-articolo-descrizione,
.qrevely-pagina--articolo .qrevely-articolo-descrizione p {
	margin: 0;
	font-size: 15px;
	line-height: 1.62;
	color: var(--wp--preset--color--testo);
}
.qrevely-pagina--articolo .qrevely-articolo-meta {
	align-items: center;
	gap: 26px;
	margin: 34px 0 0;
	padding: 13px 0;
	border-block: 1px solid var(--wp--preset--color--linea);
	font-size: 11px;
	line-height: 1.65;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--grigio);
}
.qrevely-pagina--articolo .qrevely-articolo-meta > * {
	margin: 0;
}
/* I pulsanti di condivisione stanno a destra della riga. */
.qrevely-pagina--articolo .qrevely-articolo-meta > .qrevely-condividi--compatto {
	margin-left: auto;
}
/* Le icone non prendono il grigio della riga (che vale per i suoi link). */
.qrevely-pagina--articolo .qrevely-articolo-meta .qrevely-condividi-icona {
	color: var(--wp--preset--color--inchiostro);
}
.qrevely-pagina--articolo .qrevely-articolo-meta .qrevely-condividi-icona:is(:hover, :focus-visible),
.qrevely-pagina--articolo .qrevely-articolo-meta .qrevely-condividi-copia.is-copiato {
	color: var(--wp--preset--color--bianco);
}
.qrevely-pagina--articolo .qrevely-articolo-meta a {
	color: inherit;
	text-decoration: none;
}

/* ---------- copertina ---------- */
.qrevely-pagina--articolo .qrevely-articolo-copertina {
	margin: 27px 0 0;
}
.qrevely-pagina--articolo .qrevely-articolo-copertina img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 7;
	object-fit: cover;
}
.qrevely-pagina--articolo .qrevely-articolo-copertina figcaption {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
	margin: 5px 0 0;
	padding: 12px 0 1px;
	font-size: 11px;
	line-height: 1.6;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--grigio);
}
.qrevely-pagina--articolo .qrevely-articolo-copertina figcaption::after {
	content: "";
	flex: 0 0 auto;
	width: 11px;
	height: 11px;
	background: var(--wp--preset--color--arancio);
	-webkit-mask: url(../../icone/freccia-diagonale.svg) center / contain no-repeat;
	mask: url(../../icone/freccia-diagonale.svg) center / contain no-repeat;
}

/* ---------- indice a lato e testo ---------- */
/* Il modello mette l'indice (blocco qrevely/indice, un <aside>) e il contenuto (post-content) in una griglia. */
.qrevely-pagina--articolo .qrevely-corpo-con-indice {
	display: grid;
	grid-template-columns: 250px minmax(0, 1fr);
	column-gap: 70px;
	align-items: start;
	margin: 52px 0 0;
}
/* Indice spento o articolo senza titoli: il blocco non stampa nulla e il testo resta largo com'è, centrato
   (840px: la colonna del testo misurata a 1440, 1160 − 250 − 70). */
.qrevely-pagina--articolo .qrevely-corpo-con-indice:not(:has(> .qrevely-corpo-lato)) {
	grid-template-columns: minmax(0, 840px);
	justify-content: center;
}
.qrevely-pagina--articolo .qrevely-corpo-lato {
	align-self: stretch; /* la cella è alta quanto il testo: il gruppo fisso dentro può scorrere */
}
.qrevely-pagina--articolo .qrevely-corpo-testo {
	min-width: 0;
	margin-block: 0; /* il gruppo ha il layout a flusso: al secondo figlio darebbe il blockGap (24px) sopra */
}
.qrevely-pagina--articolo .qrevely-corpo-lato-fisso {
	position: sticky;
	top: calc(110px + var(--wp-admin--admin-bar--height, 0px));
}
.qrevely-pagina--articolo .qrevely-indice {
	position: static;
}
.qrevely-pagina--articolo .qrevely-indice ol {
	border-top: 1px solid var(--wp--preset--color--linea);
}
.qrevely-pagina--articolo .qrevely-articolo-indietro {
	margin: 22px 0 0;
	font-size: 14px;
}
.qrevely-pagina--articolo .qrevely-articolo-indietro a {
	color: var(--wp--preset--color--viola);
	text-decoration: none;
}
.qrevely-pagina--articolo .qrevely-articolo-indietro a:hover {
	color: var(--wp--preset--color--viola-scuro);
}

/* ---------- testo ---------- */
.qrevely-pagina--articolo .qrevely-corpo-testo > * {
	margin-block: 20px 0;
}
/* Un titolo raggiunto dall'indice non resta attaccato all'header fisso. */
.qrevely-pagina--articolo .qrevely-corpo-testo [id] {
	scroll-margin-top: 20px;
}
.qrevely-pagina--articolo .qrevely-corpo-testo > :first-child {
	margin-top: 0;
}
.qrevely-pagina--articolo .qrevely-corpo-testo > p {
	font-size: 16px;
	line-height: 1.75;
	color: var(--wp--preset--color--inchiostro-2);
}
.qrevely-pagina--articolo .qrevely-corpo-testo > p a,
.qrevely-pagina--articolo .qrevely-articolo-due p a,
.qrevely-pagina--articolo .wp-block-details a {
	color: var(--wp--preset--color--viola);
	text-decoration: underline;
}
.qrevely-pagina--articolo .qrevely-corpo-testo > p.qrevely-articolo-lead {
	font-size: 18px;
	font-weight: 600;
	line-height: 1.66;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--inchiostro);
}
.qrevely-pagina--articolo .qrevely-corpo-testo > h2 {
	margin-top: 46px;
	font-size: clamp(23px, 2vw, 28px);
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.028em;
	color: var(--wp--preset--color--inchiostro);
}
.qrevely-pagina--articolo .qrevely-corpo-testo > h2 mark {
	background: none;
}
.qrevely-pagina--articolo .qrevely-articolo-figura {
	margin-top: 34px;
}
.qrevely-pagina--articolo .qrevely-articolo-figura img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 21 / 9;
	object-fit: cover;
}

/* ---------- due colonne: statico/dinamico, iPhone/Android ---------- */
.qrevely-pagina--articolo .qrevely-articolo-due {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0;
	margin-top: 40px;
	border-top: 1px solid var(--wp--preset--color--linea);
}
.qrevely-pagina--articolo .qrevely-articolo-due > .wp-block-column {
	flex-basis: auto !important;
	min-width: 0;
	padding: 26px 34px 6px 0;
}
.qrevely-pagina--articolo .qrevely-articolo-due > .wp-block-column + .wp-block-column {
	padding: 26px 0 6px 34px;
	border-left: 1px solid var(--wp--preset--color--linea);
}
.qrevely-pagina--articolo .qrevely-articolo-due > .wp-block-column > * {
	margin-block: 14px 0;
}
.qrevely-pagina--articolo .qrevely-articolo-due > .wp-block-column > :first-child {
	margin-top: 0;
}
.qrevely-pagina--articolo .qrevely-articolo-due > .wp-block-column > .qrevely-articolo-tag {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.7;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--wp--preset--color--viola);
}
.qrevely-pagina--articolo .qrevely-articolo-due > .wp-block-column > h2 {
	margin-top: 16px;
	font-size: 21px;
	font-weight: 800;
	line-height: 1.22;
	letter-spacing: -0.025em;
}
.qrevely-pagina--articolo .qrevely-articolo-due p:not(.qrevely-articolo-tag) {
	font-size: 15px;
	line-height: 1.7;
	color: var(--wp--preset--color--inchiostro-2);
}

/* Spazi fra i pezzi di un articolo (i pattern hanno i loro, ma qui la regola generica del testo è più forte). */
.qrevely-pagina--articolo .qrevely-corpo-testo > .qrevely-articolo-passi {
	margin-top: 24px;
}
.qrevely-pagina--articolo .qrevely-corpo-testo > .qrevely-articolo-box {
	margin-top: 40px;
}
.qrevely-pagina--articolo .qrevely-corpo-testo > .qrevely-articolo-cta {
	margin-top: 56px;
}
.qrevely-pagina--articolo .qrevely-corpo-testo > .qrevely-articolo-approfondimenti,
.qrevely-pagina--articolo .qrevely-corpo-testo > .qrevely-articolo-fonti {
	margin-top: 22px;
}

/* ---------- tabella di confronto ---------- */
.qrevely-pagina--articolo .qrevely-articolo-tabella {
	margin-top: 22px;
	overflow-x: auto;
}
.qrevely-pagina--articolo .qrevely-articolo-tabella table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}
.qrevely-pagina--articolo .qrevely-articolo-tabella th {
	padding: 13px 16px;
	border: 0;
	background: var(--wp--preset--color--lilla);
	text-align: left;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wp--preset--color--viola);
}
.qrevely-pagina--articolo .qrevely-articolo-tabella td {
	padding: 15px 16px;
	border: 0;
	border-bottom: 1px solid var(--wp--preset--color--linea);
	color: var(--wp--preset--color--inchiostro-2);
}
.qrevely-pagina--articolo .qrevely-articolo-tabella td:first-child {
	font-weight: 700;
	color: var(--wp--preset--color--inchiostro);
}

/* ---------- domande frequenti ---------- */
.qrevely-pagina--articolo .qrevely-corpo-testo > .wp-block-details.is-style-domanda {
	margin-top: 0;
	padding: 0;
	border-bottom: 1px solid var(--wp--preset--color--linea);
}
.qrevely-pagina--articolo .qrevely-corpo-testo > h2 + .wp-block-details.is-style-domanda {
	margin-top: 24px;
	border-top: 1px solid var(--wp--preset--color--linea);
}
.qrevely-pagina--articolo .wp-block-details.is-style-domanda summary {
	align-items: center;
	gap: 20px;
	margin-bottom: 8px;
	padding: 20px 0;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: -0.012em;
}
.qrevely-pagina--articolo .wp-block-details.is-style-domanda summary::after,
.qrevely-pagina--articolo .wp-block-details.is-style-domanda[open] summary::after {
	content: "";
	flex: 0 0 auto;
	width: 14px;
	height: 14px;
	background:
		linear-gradient(var(--wp--preset--color--viola), var(--wp--preset--color--viola)) center / 14px 2px no-repeat,
		linear-gradient(var(--wp--preset--color--viola), var(--wp--preset--color--viola)) center / 2px 14px no-repeat;
}
.qrevely-pagina--articolo .wp-block-details.is-style-domanda[open] summary::after {
	background: linear-gradient(var(--wp--preset--color--viola), var(--wp--preset--color--viola)) center / 14px 2px no-repeat;
}
.qrevely-pagina--articolo .wp-block-details.is-style-domanda > p {
	margin: 0;
	padding: 0 0 22px;
	font-size: 15px;
	line-height: 1.7;
	color: var(--wp--preset--color--inchiostro-2);
}

/* ---------- «Continua a esplorare» ---------- */
.qrevely-pagina--articolo .qrevely-articolo-altri {
	padding-block: 80px 59px;
}
.qrevely-pagina--articolo .qrevely-correlati-testa {
	align-items: baseline;
	gap: 24px;
	margin: 0;
	padding-top: 40px;
	border-top: 1px solid var(--wp--preset--color--linea);
}
.qrevely-pagina--articolo .qrevely-correlati-testa h2 {
	margin: 0;
	font-size: clamp(23px, 2vw, 28px);
	font-weight: 800;
	line-height: 1.5;
	letter-spacing: -0.028em;
}
.qrevely-pagina--articolo .qrevely-correlati-testa .wp-block-buttons {
	margin: 0;
}
.qrevely-pagina--articolo .qrevely-articolo-altri .is-style-link-freccia .wp-block-button__link,
.qrevely-pagina--articolo .qrevely-articolo-fine .is-style-link-freccia .wp-block-button__link {
	border-color: var(--wp--preset--color--viola);
	color: var(--wp--preset--color--viola);
}
.qrevely-pagina--articolo .qrevely-articolo-altri .is-style-link-freccia .wp-block-button__link:hover,
.qrevely-pagina--articolo .qrevely-articolo-fine .is-style-link-freccia .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--viola-scuro);
	color: var(--wp--preset--color--viola-scuro);
}
.qrevely-pagina--articolo .qrevely-correlati .wp-block-post-template {
	gap: 40px;
	margin: 34px 0 0;
	padding: 0;
}
.qrevely-pagina--articolo .qrevely-correlati .wp-block-post-template > li {
	margin: 0;
}
.qrevely-pagina--articolo .qrevely-correlati .wp-block-post-featured-image {
	margin: 0;
}
.qrevely-pagina--articolo .qrevely-correlati .wp-block-post-featured-image img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 3 / 2;
	object-fit: cover;
}
.qrevely-pagina--articolo .qrevely-correlati .qrevely-blog-meta {
	gap: 0;
	margin: 16px 0 0; /* un po' di aria fra l'immagine e data e categoria */
	font-size: 11px;
	line-height: 1.65;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--wp--preset--color--grigio);
}
.qrevely-pagina--articolo .qrevely-correlati .qrevely-blog-meta a {
	color: inherit;
	text-decoration: none;
}
.qrevely-pagina--articolo .qrevely-correlati .qrevely-blog-meta .wp-block-post-terms::before {
	content: "·";
	margin: 0 0.6em;
}
.qrevely-pagina--articolo .qrevely-correlati .wp-block-post-title {
	margin: 10px 0 0;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.35;
	letter-spacing: -0.015em;
}
.qrevely-pagina--articolo .qrevely-correlati .wp-block-post-title a {
	color: var(--wp--preset--color--inchiostro);
	text-decoration: none;
}
.qrevely-pagina--articolo .qrevely-correlati .wp-block-post-title a:hover {
	color: var(--wp--preset--color--viola);
}
/* ---------- chiusura ---------- */
.qrevely-pagina--articolo .qrevely-articolo-fine {
	align-items: center;
	justify-content: space-between;
	gap: 30px;
	margin-top: 76px;
	padding: 34px 0 92px;
	border-top: 1px solid var(--wp--preset--color--linea);
}
.qrevely-pagina--articolo .qrevely-articolo-fine-testo {
	gap: 18px;
}
.qrevely-pagina--articolo .qrevely-articolo-fine-testo .qrevely-icona {
	margin-top: 2px;
}
.qrevely-pagina--articolo .qrevely-articolo-fine h3 {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: -0.012em;
}
.qrevely-pagina--articolo .qrevely-articolo-fine p {
	margin: 4px 0 0;
	font-size: 15px;
	color: var(--wp--preset--color--testo);
}
.qrevely-pagina--articolo .qrevely-articolo-fine .wp-block-buttons {
	margin: 0;
}

/* ---------- sotto i 1080px ---------- */
@media (max-width: 1080px) {
	.qrevely-pagina--articolo .qrevely-articolo-intro {
		grid-template-columns: minmax(0, 1fr);
		gap: 18px;
		align-items: start;
	}
	/* Una colonna sola, a tutta larghezza, con l'indice o senza. */
	.qrevely-pagina--articolo .qrevely-corpo-con-indice,
	.qrevely-pagina--articolo .qrevely-corpo-con-indice:not(:has(> .qrevely-corpo-lato)) {
		grid-template-columns: minmax(0, 1fr);
	}
	.qrevely-pagina--articolo .qrevely-corpo-lato {
		align-self: start;
		padding-bottom: 26px;
		margin-bottom: 34px;
		border-bottom: 1px solid var(--wp--preset--color--linea);
	}
	.qrevely-pagina--articolo .qrevely-corpo-lato-fisso {
		position: static;
	}
	.qrevely-pagina--articolo .qrevely-articolo-due {
		grid-template-columns: minmax(0, 1fr);
	}
	.qrevely-pagina--articolo .qrevely-articolo-due > .wp-block-column,
	.qrevely-pagina--articolo .qrevely-articolo-due > .wp-block-column + .wp-block-column {
		padding: 26px 0 8px;
	}
	.qrevely-pagina--articolo .qrevely-articolo-due > .wp-block-column + .wp-block-column {
		border-left: 0;
		border-top: 1px solid var(--wp--preset--color--linea);
	}
	.qrevely-pagina--articolo .qrevely-correlati .wp-block-post-template {
		grid-template-columns: minmax(0, 1fr);
		gap: 34px;
	}
}

/* ---------- sotto i 782px ---------- */
@media (max-width: 781px) {
	/* Da telefono niente pulsanti di condivisione nella riga sotto il titolo (restano in fondo) e niente «Tutti gli articoli» sotto l'indice. */
	.qrevely-pagina--articolo .qrevely-articolo-meta > .qrevely-condividi--compatto,
	.qrevely-pagina--articolo .qrevely-articolo-indietro {
		display: none;
	}
	.qrevely-pagina--articolo .qrevely-corpo-testo > .qrevely-articolo-cta {
		margin-top: 44px;
	}
	.qrevely-pagina--articolo .qrevely-articolo-testa {
		padding-top: 39px;
	}
	.qrevely-pagina--articolo .qrevely-articolo-meta {
		margin-top: 26px;
	}
	.qrevely-pagina--articolo .qrevely-articolo-copertina {
		margin-top: 20px;
	}
	.qrevely-pagina--articolo .qrevely-articolo-copertina img {
		aspect-ratio: 3 / 2;
	}
	.qrevely-pagina--articolo .qrevely-articolo-figura img {
		aspect-ratio: 16 / 9;
	}
	.qrevely-pagina--articolo .qrevely-corpo-con-indice {
		margin-top: 38px;
	}
	.qrevely-pagina--articolo .qrevely-corpo-testo > h2 {
		margin-top: 36px;
	}
	.qrevely-pagina--articolo .qrevely-articolo-tabella table {
		font-size: 14px;
	}
	.qrevely-pagina--articolo .qrevely-articolo-tabella th,
	.qrevely-pagina--articolo .qrevely-articolo-tabella td {
		padding: 11px 10px;
	}
	.qrevely-pagina--articolo .qrevely-articolo-altri {
		padding-top: 50px;
	}
	.qrevely-pagina--articolo .qrevely-correlati-testa {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
	}
	.qrevely-pagina--articolo .qrevely-articolo-fine {
		flex-direction: column;
		align-items: flex-start;
		gap: 18px;
		margin-top: 52px;
		padding: 28px 0 70px;
	}
}

/* Immagini e clip delle guide (schermate dell'app). Le clip sono registrate con una fascia grigia in fondo al fotogramma: si ritaglia a 16:9 dall'alto. */
.qrevely-pagina--articolo .qrevely-guida-figura,
.qrevely-pagina--articolo .qrevely-guida-clip {
	margin: 28px 0 38px;
}
.qrevely-pagina--articolo .qrevely-guida-figura img,
.qrevely-pagina--articolo .qrevely-guida-clip video {
	display: block;
	width: 100%;
	border: 1px solid var(--wp--preset--color--linea);
	background: var(--wp--preset--color--bianco);
}
.qrevely-pagina--articolo .qrevely-guida-figura img {
	height: auto;
}
.qrevely-pagina--articolo .qrevely-guida-clip video {
	aspect-ratio: 16 / 9;
	object-fit: cover;
	object-position: top;
}
.qrevely-pagina--articolo .qrevely-guida-figura figcaption,
.qrevely-pagina--articolo .qrevely-guida-clip figcaption {
	margin-top: 10px;
	color: var(--wp--preset--color--grigio);
	font-size: 12.5px;
	line-height: 1.6;
}

/* Guide: le card di «Continua a esplorare» non hanno la data e la categoria non è preceduta dalla barra. */
.qrevely-pagina--articolo .qrevely-blog-meta--categoria .wp-block-post-terms::before {
	display: none;
}
