/* ------------------------------------------------------------------
   Blocchi RustiApp.

   Nessun colore scritto a mano: tutto nasce dalla tavolozza del tema
   (--wp--preset--color--*). Per questo gli stessi blocchi funzionano
   nella variante scura e in quella chiara, e continuerebbero a
   funzionare con un altro tema che dichiari la stessa tavolozza.
   ------------------------------------------------------------------ */

.ra-sezione {
	--ra-base: var(--wp--preset--color--base, #080604);
	--ra-testo: var(--wp--preset--color--contrast, #F2E8D6);
	--ra-oro: var(--wp--preset--color--accent-1, #C9934A);
	--ra-oro-chiaro: var(--wp--preset--color--accent-2, #DBA95E);
	--ra-verde: var(--wp--preset--color--accent-3, #5EAF7D);
	--ra-secondario: var(--wp--preset--color--accent-4, #999286);
	--ra-superficie: var(--wp--preset--color--accent-5, #110F0C);
	--ra-calda: var(--wp--preset--color--accent-6, #1A130C);

	--ra-carta: color-mix(in srgb, var(--ra-testo) 4.5%, transparent);
	--ra-carta-alta: color-mix(in srgb, var(--ra-testo) 8%, transparent);
	--ra-linea: color-mix(in srgb, var(--ra-testo) 12%, transparent);
	--ra-oro-tenue: color-mix(in srgb, var(--ra-oro) 14%, transparent);
	--ra-oro-linea: color-mix(in srgb, var(--ra-oro) 32%, transparent);
	--ra-raggio: 12px;

	position: relative;
	padding-block: clamp(72px, 9vw, 128px);
	padding-inline: var(--wp--preset--spacing--50, 32px);
}

/* Le stesse variabili servono anche fuori dalle sezioni: piè di pagina,
   pagine interne, banner. */
body {
	--ra-carta: color-mix(in srgb, var(--wp--preset--color--contrast) 4.5%, transparent);
	--ra-linea: color-mix(in srgb, var(--wp--preset--color--contrast) 12%, transparent);
	--ra-oro-tenue: color-mix(in srgb, var(--wp--preset--color--accent-1) 14%, transparent);
	--ra-oro-linea: color-mix(in srgb, var(--wp--preset--color--accent-1) 32%, transparent);
	--ra-raggio: 12px;
}

.ra-sezione--superficie {
	background: var(--wp--preset--color--accent-5);
}

.ra-sezione--calda {
	background: linear-gradient(180deg, var(--wp--preset--color--accent-6) 0%, var(--wp--preset--color--accent-5) 100%);
}

.ra-sezione--invertita {
	background: var(--wp--preset--color--contrast);
	color: var(--wp--preset--color--base);
}

.ra-sezione--ridotta {
	padding-block: clamp(40px, 6vw, 72px);
}

.ra-sezione--attacca {
	padding-top: 0;
}

.ra-contenitore {
	max-width: var(--wp--style--global--wide-size, 1200px);
	margin-inline: auto;
}

.ra-contenitore--stretto {
	max-width: 820px;
}

/* --- Griglia ------------------------------------------------------ */

.ra-griglia {
	display: grid;
	gap: var(--wp--preset--spacing--40, 24px);
	margin-block: var(--wp--preset--spacing--60, 48px);
}

.ra-griglia--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ra-griglia--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ra-griglia--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 980px) {
	.ra-griglia--3,
	.ra-griglia--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.ra-griglia--2,
	.ra-griglia--3,
	.ra-griglia--4 {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* --- Scheda ------------------------------------------------------- */

.ra-scheda {
	background: var(--ra-carta);
	border: 1px solid var(--ra-linea);
	border-radius: var(--ra-raggio);
	padding: clamp(22px, 2.6vw, 30px);
	transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

.ra-scheda:hover {
	border-color: var(--ra-oro-linea);
	background: var(--ra-carta-alta);
	transform: translateY(-2px);
}

.ra-scheda > *:first-child { margin-top: 0; }
.ra-scheda > *:last-child { margin-bottom: 0; }

.ra-scheda p {
	color: var(--wp--preset--color--accent-4);
	font-size: 0.97rem;
	line-height: 1.6;
}

.ra-scheda h3 {
	margin-top: 0.5rem;
	margin-bottom: 0.4rem;
}

.ra-scheda--nota {
	background: var(--ra-carta);
	border: none;
	border-left: 3px solid var(--wp--preset--color--accent-1);
	border-radius: 0 var(--ra-raggio) var(--ra-raggio) 0;
}

.ra-scheda--nota:hover {
	transform: none;
}

.ra-numero {
	display: block;
	font-family: var(--wp--preset--font-family--cormorant);
	font-size: 2.5rem;
	line-height: 1;
	color: var(--wp--preset--color--accent-1);
	margin-bottom: 0.5rem;
}

/* --- Etichetta di stato ------------------------------------------- */

.ra-stato {
	display: inline-flex;
	align-items: flex-start;
	gap: 0.55rem;
	font-family: var(--wp--preset--font-family--jakarta);
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	line-height: 1.35;
	padding: 0.5rem 0.95rem;
	border-radius: 999px;
	border: 1px solid;
	max-width: 100%;
	margin: 0;
}

.ra-stato::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: currentColor;
	flex: none;
	margin-top: 0.42em;
}

.ra-stato--vivo {
	color: var(--wp--preset--color--accent-3);
	background: color-mix(in srgb, var(--wp--preset--color--accent-3) 12%, transparent);
	border-color: color-mix(in srgb, var(--wp--preset--color--accent-3) 32%, transparent);
}

.ra-stato--demo {
	color: var(--wp--preset--color--accent-2);
	background: color-mix(in srgb, var(--wp--preset--color--accent-2) 14%, transparent);
	border-color: color-mix(in srgb, var(--wp--preset--color--accent-2) 34%, transparent);
}

.ra-stato--futuro {
	color: var(--wp--preset--color--accent-4);
	background: color-mix(in srgb, var(--wp--preset--color--accent-4) 12%, transparent);
	border-color: color-mix(in srgb, var(--wp--preset--color--accent-4) 30%, transparent);
}

/* --- Sequenza numerata -------------------------------------------- */

.ra-passi {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ra-passi > li {
	counter-increment: ra-passo;
	position: relative;
	padding: 1.35rem 0 1.35rem 3.7rem;
	border-top: 1px solid var(--ra-linea);
	color: var(--wp--preset--color--accent-4);
	font-size: 0.97rem;
	line-height: 1.6;
}

.ra-passi > li:last-child {
	border-bottom: 1px solid var(--ra-linea);
}

.ra-passi > li::before {
	content: counter(ra-passo, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: 1.4rem;
	font-family: var(--wp--preset--font-family--cormorant);
	font-size: 1.35rem;
	line-height: 1;
	color: var(--wp--preset--color--accent-1);
	font-variant-numeric: tabular-nums;
}

.ra-passi b {
	display: block;
	font-family: var(--wp--preset--font-family--jakarta);
	font-weight: 600;
	font-size: 1.05rem;
	margin-bottom: 0.25rem;
	color: var(--wp--preset--color--contrast);
}

/* --- Domande frequenti -------------------------------------------- */

.ra-faq-lista {
	max-width: 860px;
	margin-top: var(--wp--preset--spacing--60, 48px);
}

.ra-faq {
	border-top: 1px solid var(--ra-linea);
}

.ra-faq:last-of-type {
	border-bottom: 1px solid var(--ra-linea);
}

.ra-faq summary {
	list-style: none;
	cursor: pointer;
	padding: 1.2rem 2.75rem 1.2rem 0;
	font-weight: 600;
	position: relative;
}

.ra-faq summary::-webkit-details-marker {
	display: none;
}

.ra-faq summary::after {
	content: "+";
	position: absolute;
	right: 0.35rem;
	top: 50%;
	transform: translateY(-50%);
	font-family: var(--wp--preset--font-family--cormorant);
	font-size: 1.75rem;
	line-height: 1;
	color: var(--wp--preset--color--accent-1);
}

.ra-faq[open] summary::after {
	content: "\2013";
}

.ra-faq p {
	color: var(--wp--preset--color--accent-4);
	padding-bottom: 1.3rem;
	max-width: 70ch;
	margin: 0;
}

/* --- Immagine con segnaposto -------------------------------------- */

.ra-figura {
	margin: 0;
}

.ra-figura__img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: var(--ra-raggio);
	border: 1px solid var(--ra-linea);
}

.ra-figura__segnaposto {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	aspect-ratio: var(--ra-rapporto, 4 / 3);
	padding: 1.75rem;
	border: 1px dashed var(--ra-oro-linea);
	border-radius: var(--ra-raggio);
	background-color: var(--ra-carta);
	background-image: repeating-linear-gradient(45deg, transparent, transparent 7px, color-mix(in srgb, var(--wp--preset--color--contrast) 3%, transparent) 7px, color-mix(in srgb, var(--wp--preset--color--contrast) 3%, transparent) 8px);
	color: var(--wp--preset--color--accent-4);
	font-size: 0.82rem;
	line-height: 1.5;
}

.ra-figura figcaption {
	font-size: 0.78rem;
	color: var(--wp--preset--color--accent-4);
	margin-top: 0.6rem;
}

/* --- Dati dell'attività ------------------------------------------- */

.ra-contatti {
	font-style: normal;
	line-height: 1.7;
	color: var(--wp--preset--color--accent-4);
}

.ra-contatti--elenco {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	gap: 0.5rem;
	font-size: 0.94rem;
}

.ra-contatti--indirizzo {
	font-size: 0.94rem;
}

.ra-contatti--legale {
	font-size: 0.8rem;
	max-width: none;
}

/* --- Modulo -------------------------------------------------------- */

.ra-modulo {
	display: grid;
	gap: 1.15rem;
	background: var(--ra-carta);
	border: 1px solid var(--ra-linea);
	border-radius: var(--ra-raggio);
	padding: clamp(22px, 3vw, 34px);
}

.ra-campo {
	display: grid;
	gap: 0.45rem;
}

.ra-coppia {
	display: grid;
	gap: 1.15rem;
}

@media (min-width: 620px) {
	.ra-coppia {
		grid-template-columns: 1fr 1fr;
	}
}

.ra-modulo label {
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
}

.ra-modulo .ra-aiuto {
	font-size: 0.78rem;
	color: var(--wp--preset--color--accent-4);
}

.ra-obbligo {
	color: var(--wp--preset--color--accent-1);
}

.ra-modulo input[type="text"],
.ra-modulo input[type="email"],
.ra-modulo input[type="tel"],
.ra-modulo input[type="url"],
.ra-modulo input[type="number"],
.ra-modulo select,
.ra-modulo textarea {
	width: 100%;
	font: inherit;
	font-size: 0.94rem;
	color: var(--wp--preset--color--contrast);
	background: color-mix(in srgb, var(--wp--preset--color--contrast) 5%, transparent);
	border: 1px solid var(--ra-linea);
	border-radius: 9px;
	padding: 0.72rem 0.9rem;
}

.ra-modulo input:focus,
.ra-modulo select:focus,
.ra-modulo textarea:focus {
	border-color: var(--ra-oro-linea);
	outline: 2px solid var(--wp--preset--color--accent-1);
	outline-offset: 2px;
}

.ra-modulo textarea {
	min-height: 7rem;
	resize: vertical;
}

.ra-modulo select option {
	background: var(--wp--preset--color--accent-5);
	color: var(--wp--preset--color--contrast);
}

.ra-modulo fieldset {
	border: 1px solid var(--ra-linea);
	border-radius: var(--ra-raggio);
	padding: 1.1rem 1.2rem;
	margin: 0;
}

.ra-modulo legend {
	font-size: 0.88rem;
	font-weight: 600;
	padding: 0 0.4rem;
}

.ra-scelte {
	display: grid;
	gap: 0.6rem;
	margin-top: 0.7rem;
}

@media (min-width: 620px) {
	.ra-scelte {
		grid-template-columns: 1fr 1fr;
	}
}

.ra-scelta {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	font-size: 0.9rem;
	font-weight: 400;
	line-height: 1.45;
	color: var(--wp--preset--color--accent-4);
	cursor: pointer;
}

.ra-scelta input {
	margin: 0.2rem 0 0;
	accent-color: var(--wp--preset--color--accent-1);
	width: 1.05rem;
	height: 1.05rem;
	flex: none;
}

.ra-errore {
	font-size: 0.82rem;
	color: #E05555;
}

.ra-esito {
	padding: 0.9rem 1.1rem;
	border-radius: 9px;
	font-size: 0.94rem;
	border: 1px solid;
}

.ra-esito p {
	margin: 0;
}

.ra-esito--ok {
	color: var(--wp--preset--color--accent-3);
	background: color-mix(in srgb, var(--wp--preset--color--accent-3) 12%, transparent);
	border-color: color-mix(in srgb, var(--wp--preset--color--accent-3) 30%, transparent);
}

.ra-esito--ko {
	color: #E05555;
	background: rgba(224, 85, 85, 0.12);
	border-color: rgba(224, 85, 85, 0.3);
}

/* Trappola antispam: invisibile a chi vede, presente per i robot */
.ra-trappola {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.ra-invia,
.ra-btn {
	justify-self: start;
	font: inherit;
	font-weight: 600;
	font-size: 0.97rem;
	color: var(--wp--preset--color--base);
	background: var(--wp--preset--color--accent-1);
	border: 1px solid transparent;
	border-radius: 10px;
	padding: 0.85rem 1.7rem;
	cursor: pointer;
	text-decoration: none;
}

.ra-invia:hover,
.ra-btn--oro:hover {
	background: var(--wp--preset--color--accent-2);
}

.ra-btn--fantasma {
	background: transparent;
	color: var(--wp--preset--color--contrast);
	border-color: var(--ra-oro-linea);
}

.ra-btn--fantasma:hover {
	background: var(--ra-oro-tenue);
	border-color: var(--wp--preset--color--accent-1);
}

/* --- Banner cookie -------------------------------------------------- */

.ra-banner-cookie {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
	flex-wrap: wrap;
	padding: 1.1rem 1.5rem;
	background: color-mix(in srgb, var(--wp--preset--color--accent-5) 97%, transparent);
	border-top: 1px solid var(--ra-oro-linea);
	backdrop-filter: blur(20px);
	transform: translateY(110%);
	transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.ra-banner-cookie[hidden] {
	display: none;
}

.ra-banner-cookie.ra-visibile {
	transform: translateY(0);
}

.ra-banner-cookie p {
	flex: 1;
	min-width: 240px;
	max-width: 820px;
	margin: 0;
	font-size: 0.8rem;
	line-height: 1.6;
	color: var(--wp--preset--color--accent-4);
}

.ra-banner-cookie__azioni {
	display: flex;
	gap: 0.6rem;
	flex-shrink: 0;
}

.ra-banner-cookie .ra-btn {
	padding: 0.55rem 1.15rem;
	font-size: 0.85rem;
	border-radius: 8px;
}

@media (max-width: 640px) {
	.ra-banner-cookie {
		flex-direction: column;
		align-items: stretch;
		padding: 1rem 1.25rem;
	}

	.ra-banner-cookie__azioni .ra-btn {
		flex: 1;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ra-scheda:hover {
		transform: none;
	}

	.ra-banner-cookie {
		transition: none;
	}
}

/* --- Comparsa progressiva (aggiunta da fronte.js) ------------------ */

.ra-rivela {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}

.ra-rivela.ra-dentro {
	opacity: 1;
	transform: none;
}

@media (prefers-reduced-motion: reduce) {
	.ra-rivela {
		opacity: 1;
		transform: none;
		transition: none;
	}
}
