/*
 * Studio Arfia · ecosistemi-cresce.css · v0.113 · 05/11/2026 notte
 * «Al centro c'è la tua azienda» su Ecosistemi (template-parts/site/ecosistemi-cresce.php): l'iPad Pro del gestionale di Villa
 * Castelmora e l'iPhone della titolare, in una regia a tempo (assets/js/ecosistemi-cresce.js) nello stile della posta in Gmail
 * e del salone: palco, telecamera, dito, capitoli fuori.
 * La tela è 100em di larghezza (57 di altezza; da telefono 122) e nasce alla misura del primo piano: font-size = --z volte un
 * centesimo del palco. La telecamera (--cx --cy --cs) la rimpicciolisce per i campi larghi e non la ingrandisce mai: così il
 * testo resta nitido anche nel primo piano (Rami, 05/11: «bassa qualità nel mockup»). Dentro gli schermi le misure sono in
 * punti: var(--u), registrata come <length> in demo.css (iPad 1194 × 834, iPhone 402 × 874).
 * Il markup nasce col fotogramma finale: senza JS la scena è finita e la telecamera è larga (i valori qui sotto).
 * Niente gialli, niente backdrop-filter, niente 3D (lo sfocava), niente will-change sulla telecamera.
 */

/* ══ IL PALCO E LA TELECAMERA ══ */
.as-cr { position: relative; }
.as-cr__titolo { max-width: 24ch; margin: 0 0 clamp(20px, 3.2vw, 40px); }
/* la scena (palco, capitoli, nota) sta nello schermo: da computer si stringe finché il palco non supera l'altezza utile */
.as-cr__scena { --a: 1.75; width: min(100%, calc((100svh - 250px) * var(--a))); margin-inline: auto; }
.as-cr__palco {
	--a: 1.75;
	--z: 1.9;
	position: relative;
	container-type: inline-size;
	width: 100%;
	aspect-ratio: var(--a);
	overflow: hidden;
	border-radius: calc(28px * var(--as-brm));
	background: linear-gradient(180deg, #F5F2F6 0%, #EFEBF1 62%, #E9E4EC 100%);
}
@supports (corner-shape: squircle) { .as-cr__palco { corner-shape: squircle; } }
.as-cr__cam {
	/* il campo largo (anche senza JS): i due dispositivi e il riflesso, centrati */
	--cs: calc(1.0636 / var(--z));
	--cx: -3.446cqw;
	--cy: -1.477cqw;
	position: absolute;
	left: 0;
	top: 0;
	width: 100em;
	height: 57em;
	font-size: calc(var(--z) * 1cqw);
	transform-origin: 0 0;
	transform: translate(var(--cx), var(--cy)) scale(var(--cs));
}
.as-cr.is-viva .as-cr__cam { transition: transform 1.35s cubic-bezier(.65, 0, .3, 1); }
.as-cr.is-salto, .as-cr.is-salto * { transition: none !important; animation: none !important; }

/* la luce colorata dietro i vetri, e il piano chiaro dove i dispositivi stanno in piedi */
.as-cr__luce { position: absolute; left: -12em; top: -8em; width: 124em; height: 74em; pointer-events: none;
	background:
		radial-gradient(22% 34% at 30% 34%, rgba(255, 170, 205, .55), rgba(255, 170, 205, 0) 72%),
		radial-gradient(24% 36% at 56% 22%, rgba(186, 166, 255, .45), rgba(186, 166, 255, 0) 72%),
		radial-gradient(26% 38% at 76% 42%, rgba(140, 190, 255, .55), rgba(140, 190, 255, 0) 72%),
		radial-gradient(20% 30% at 90% 70%, rgba(150, 226, 200, .4), rgba(150, 226, 200, 0) 72%),
		radial-gradient(20% 28% at 16% 70%, rgba(255, 190, 168, .45), rgba(255, 190, 168, 0) 72%); }
.as-cr__piano { position: absolute; left: -20em; right: -20em; top: 49.6em; height: 30em; pointer-events: none;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .5) 1.4em, rgba(255, 255, 255, .22) 9em, rgba(255, 255, 255, 0) 22em); }

/* i dispositivi: la cornice fotografica sopra, lo schermo HTML sotto, il riflesso sul piano, l'ombra di contatto */
.as-cr__ipad, .as-cr__iphone { position: absolute; }
.as-cr__ipad { left: 26em; top: 3em; width: 66em; --u: calc(66em * .92167 / 1194); }
.as-cr__iphone { left: 8.5em; top: 13.8em; width: 19em; --u: calc(19em * .90824 / 402); }
.as-cr__ipad::after, .as-cr__iphone::after { content: ""; position: absolute; left: 5%; right: 5%; bottom: -1.6%; height: 4%; border-radius: 50%; pointer-events: none;
	background: radial-gradient(50% 50% at 50% 50%, rgba(36, 24, 50, .38), rgba(36, 24, 50, 0) 72%); }
.as-cr__iphone::after { left: 3%; right: 3%; bottom: -1%; height: 2.6%; }
.as-cr__dentro { position: relative; -webkit-box-reflect: below .2em linear-gradient(transparent 74%, rgba(255, 255, 255, .26)); }
.as-cr__cornice { position: relative; z-index: 3; display: block; width: 100%; height: auto; pointer-events: none; user-select: none; }
/* l'entrata: salgono dal piano, prima l'iPad poi il telefono */
.as-cr.is-viva :is(.as-cr__ipad, .as-cr__iphone) { transition: opacity .9s ease, transform 1.5s cubic-bezier(.2, .8, .2, 1); }
.as-cr.is-viva .as-cr__iphone { transition-delay: .25s; }
.as-cr.is-attesa :is(.as-cr__ipad, .as-cr__iphone) { opacity: 0; transform: translateY(5em); }

/* il vetro: un velo appena, e un lampo di luce che lo attraversa (is-lampo, dal JS) */
.as-cr__vetro { position: absolute; z-index: 2; left: 4.005%; top: 5.535%; width: 92.167%; height: 89.114%; border-radius: 1.98% / 2.83%; pointer-events: none;
	background: linear-gradient(112deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, .2) 48%, rgba(255, 255, 255, .06) 53%, rgba(255, 255, 255, 0) 61%) 130% 0 / 300% 100% no-repeat, rgba(255, 255, 255, .03); }
.as-cr__vetro.is-tel { left: 4.503%; top: 1.789%; width: 90.824%; height: 96.421%; border-radius: 14.967% / 6.905%; }
.as-cr.is-lampo .as-cr__vetro { animation: as-cr-lampo 2.2s cubic-bezier(.45, 0, .25, 1) both; }
.as-cr.is-lampo .as-cr__vetro.is-tel { animation-delay: .35s; }
@keyframes as-cr-lampo { from { background-position: 130% 0, 0 0; } to { background-position: -30% 0, 0 0; } }

/* le zone dove guarda la telecamera (invisibili) */
.as-cr-zona { position: absolute; display: block; visibility: hidden; pointer-events: none; }
.as-cr-zona.is-tutto { left: 8.5em; top: 3em; width: 83.5em; height: 50.5em; }
.as-cr-zona.is-ipad { left: calc(266 * var(--u)); top: calc(30 * var(--u)); width: calc(928 * var(--u)); height: calc(800 * var(--u)); }
.as-cr-zona.is-prenota { left: calc(286 * var(--u)); top: calc(128 * var(--u)); width: calc(576 * var(--u)); height: calc(520 * var(--u)); }
.as-cr-zona.is-prenota-m { display: none; left: calc(286 * var(--u)); top: calc(150 * var(--u)); width: calc(560 * var(--u)); height: calc(560 * var(--u)); }
/* il telefono a sinistra e un pezzo d'iPad a destra: la zona esce dallo schermo verso l'iPad (il riquadro si misura anche se è tagliato) */
.as-cr-zona.is-iphone { left: 0; top: calc(120 * var(--u)); width: calc(760 * var(--u)); height: calc(634 * var(--u)); }

/* il dito: il polpastrello dei video Apple, un disco di vetro piatto (lo stesso del salone) */
.as-cr-dito { position: absolute; z-index: 30; left: 0; top: 0; width: calc(44 * var(--u)); height: calc(44 * var(--u)); margin: calc(-22 * var(--u)) 0 0 calc(-22 * var(--u)); border-radius: 50%; background: rgba(255, 255, 255, .55); box-shadow: inset 0 0 0 calc(1.5 * var(--u)) rgba(255, 255, 255, .95), 0 0 0 calc(.75 * var(--u)) rgba(20, 20, 20, .22), 0 calc(3 * var(--u)) calc(10 * var(--u)) rgba(0, 0, 0, .24); opacity: 0; pointer-events: none; transform: translate(var(--tx, 800px), var(--ty, 500px)) scale(.7); transition: transform .55s cubic-bezier(.45, 0, .2, 1), opacity .25s ease; }
.as-cr-dito.is-su { opacity: 1; transform: translate(var(--tx, 800px), var(--ty, 500px)); }
.as-cr-dito.is-premi { animation: as-cr-premi .42s ease; }
@keyframes as-cr-premi { 40% { transform: translate(var(--tx), var(--ty)) scale(.8); background: rgba(255, 255, 255, .78); } }

/* ══ LO SCHERMO DELL'IPAD: il gestionale di Villa Castelmora, 1194 × 834 punti ══ */
.as-cr-ic { --c: #8E8E93; display: grid; place-items: center; flex: none; width: 2.1em; height: 2.1em; border-radius: .58em; background: linear-gradient(160deg, color-mix(in srgb, var(--c) 72%, #fff) 0%, var(--c) 70%); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .2), 0 .35em .8em -.3em color-mix(in srgb, var(--c) 60%, transparent); color: #fff; }
.as-cr-ic.is-ai { background: linear-gradient(140deg, #A26BFF 0%, #5B6CFF 50%, #3E9BFF 100%); }
.as-cr-ic svg { width: 58%; height: 58%; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
@supports (corner-shape: squircle) { .as-cr-ic { corner-shape: squircle; border-radius: .8em; } }

.as-cr-ip { position: absolute; z-index: 1; left: 3.95%; top: 5.47%; width: 92.27%; height: 89.24%; overflow: hidden; border-radius: 2.1% / 3%; background: radial-gradient(55% 70% at 100% 0%, rgba(255, 190, 214, .6), transparent 70%), radial-gradient(50% 70% at 40% 100%, rgba(170, 200, 255, .55), transparent 70%), #F3F1EE; color: #1C1C1E; font-family: -apple-system, 'SF Pro Text', system-ui, 'Helvetica Neue', Arial, sans-serif; font-size: calc(15 * var(--u)); line-height: 1.25; -webkit-font-smoothing: antialiased; }
.as-cr-ip :is(p, ul, ol) { margin: 0; padding: 0; list-style: none; }
.as-cr-ip :is(b, small, em, i, time) { font-style: normal; }
.as-cr-ip svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.as-cr-ip__barra { position: absolute; z-index: 5; left: calc(30 * var(--u)); right: calc(26 * var(--u)); top: calc(9 * var(--u)); display: flex; justify-content: space-between; align-items: center; font-size: calc(13.5 * var(--u)); font-weight: 600; }
.as-cr-ip__icone { display: flex; align-items: center; gap: calc(6 * var(--u)); }
.as-cr-ip__icone svg { width: calc(17 * var(--u)); height: calc(12 * var(--u)); stroke-width: 2.2; }
.as-cr-ip__icone i { width: calc(25 * var(--u)); height: calc(12 * var(--u)); border-radius: calc(3.5 * var(--u)); background: #1C1C1E; box-shadow: calc(2 * var(--u)) 0 0 calc(-.5 * var(--u)) #1C1C1E; }
/* la barra a lato, in vetro chiaro */
.as-cr-ip__menu { position: absolute; left: calc(12 * var(--u)); top: calc(36 * var(--u)); bottom: calc(12 * var(--u)); width: calc(250 * var(--u)); display: flex; flex-direction: column; padding: calc(16 * var(--u)) calc(12 * var(--u)) calc(14 * var(--u)); border-radius: calc(28 * var(--u)); background: rgba(255, 255, 255, .64); box-shadow: inset 0 0 0 calc(1 * var(--u)) rgba(255, 255, 255, .95), 0 calc(10 * var(--u)) calc(30 * var(--u)) rgba(60, 40, 80, .08); }
.as-cr-ip__marchio { display: flex; align-items: center; gap: calc(10 * var(--u)); padding: 0 calc(4 * var(--u)) calc(16 * var(--u)); }
.as-cr-ip__marchio > span:last-child { display: grid; line-height: 1.2; }
.as-cr-ip__marchio b { font-size: calc(16 * var(--u)); font-weight: 600; }
.as-cr-ip__marchio small { font-size: calc(12.5 * var(--u)); color: rgba(28, 28, 30, .55); }
.as-cr-ip__logo { flex: none; width: calc(40 * var(--u)); height: calc(40 * var(--u)); overflow: hidden; border-radius: calc(11 * var(--u)); background: #F4EFE7; }
.as-cr-ip__logo .as-lg { padding: 12%; }
.as-cr-ip__voci { display: grid; gap: calc(2 * var(--u)); }
.as-cr-ip__voci li { display: flex; align-items: center; gap: calc(11 * var(--u)); height: calc(42 * var(--u)); padding: 0 calc(9 * var(--u)); border-radius: calc(13 * var(--u)); font-size: calc(15.5 * var(--u)); font-weight: 500; white-space: nowrap; }
.as-cr-ip__voci li.is-sel { background: #fff; box-shadow: 0 calc(1 * var(--u)) calc(4 * var(--u)) rgba(0, 0, 0, .06); font-weight: 600; }
.as-cr-ip__voci .as-cr-ic { font-size: calc(13 * var(--u)); }
.as-cr-ip__casa { display: grid; place-items: center; flex: none; width: calc(27.3 * var(--u)); height: calc(27.3 * var(--u)); border-radius: calc(7.5 * var(--u)); background: linear-gradient(160deg, #4A4A50, #1C1C1E); color: #fff; }
.as-cr-ip__casa svg { width: 58%; height: 58%; stroke-width: 2; }
.as-cr-ip__stato { display: flex; align-items: center; gap: calc(8 * var(--u)); margin-top: auto !important; padding: 0 calc(8 * var(--u)) calc(12 * var(--u)) !important; font-size: calc(13 * var(--u)); color: rgba(28, 28, 30, .62); }
.as-cr-ip__stato i { flex: none; width: calc(8 * var(--u)); height: calc(8 * var(--u)); border-radius: 50%; background: #34C759; box-shadow: 0 0 0 calc(3 * var(--u)) rgba(52, 199, 89, .2); }
.as-cr.is-tutto .as-cr-ip__stato i { animation: as-cr-batte 1.6s ease-in-out 3; }
@keyframes as-cr-batte { 50% { box-shadow: 0 0 0 calc(7 * var(--u)) rgba(52, 199, 89, 0); } }
.as-cr-ip__stato span { display: none; }
.as-cr-ip__stato .is-c3, .as-cr[data-step="1"] .as-cr-ip__stato .is-c1, .as-cr[data-step="2"] .as-cr-ip__stato .is-c2 { display: inline; }
.as-cr:is([data-step="1"], [data-step="2"]) .as-cr-ip__stato .is-c3 { display: none; }
.as-cr-ip__chi { display: flex; align-items: center; gap: calc(10 * var(--u)); padding: calc(12 * var(--u)) calc(6 * var(--u)) 0 !important; border-top: calc(1 * var(--u)) solid rgba(0, 0, 0, .07); }
.as-cr-ip__chi > span:last-child { display: grid; line-height: 1.2; }
.as-cr-ip__chi b { font-size: calc(14 * var(--u)); font-weight: 600; }
.as-cr-ip__chi small { font-size: calc(12 * var(--u)); color: rgba(28, 28, 30, .55); }
.as-cr-volto { display: grid; place-items: center; flex: none; width: calc(34 * var(--u)); height: calc(34 * var(--u)); overflow: hidden; border-radius: 50%; background: #E9E6E1; }
.as-cr-volto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.as-cr-volto.is-sigla { background: color-mix(in srgb, var(--c) 16%, #fff); color: var(--c); font-size: calc(12 * var(--u)); font-weight: 700; letter-spacing: .02em; }
/* «Nuovo»: sulle voci e sulle schede arrivate nel capitolo in corso (senza data-step: il terzo) */
.as-cr-nuovo { flex: none; margin-left: auto; padding: calc(2 * var(--u)) calc(8 * var(--u)); border-radius: 999px; background: #E3F6E8; color: #1C8A49; font-size: calc(11.5 * var(--u)); font-weight: 600; letter-spacing: .01em; opacity: 0; transform: scale(.5); }
.as-cr.is-viva .as-cr-nuovo { transition: opacity .3s ease .5s, transform .45s cubic-bezier(.34, 1.56, .64, 1) .5s; }
.as-cr:not([data-step]) [data-m="3"] .as-cr-nuovo, .as-cr[data-step="3"] [data-m="3"] .as-cr-nuovo, .as-cr[data-step="1"] [data-m="1"] .as-cr-nuovo, .as-cr[data-step="2"] [data-m="2"] .as-cr-nuovo { opacity: 1; transform: none; }
/* le voci della barra arrivano capitolo dopo capitolo (sono in ordine: quelle che mancano stanno in fondo) */
.as-cr.is-viva .as-cr-ip__voci li[data-m] { transition: opacity .35s ease .35s, transform .5s cubic-bezier(.34, 1.56, .64, 1) .35s; }
.as-cr[data-step="1"] .as-cr-ip__voci li:is([data-m="2"], [data-m="3"]), .as-cr[data-step="2"] .as-cr-ip__voci li[data-m="3"] { opacity: 0; transform: translateX(calc(-14 * var(--u))); transition-delay: 0s; }

/* la parte destra: il saluto e le schede */
.as-cr-ip__main { position: absolute; left: calc(280 * var(--u)); right: calc(24 * var(--u)); top: calc(40 * var(--u)); bottom: calc(18 * var(--u)); }
.as-cr-ip__testa { display: flex; justify-content: space-between; align-items: flex-end; height: calc(66 * var(--u)); }
.as-cr-ip__testa > span:first-child { display: grid; gap: calc(2 * var(--u)); }
.as-cr-ip__testa small { font-size: calc(13.5 * var(--u)); font-weight: 600; color: rgba(28, 28, 30, .5); }
.as-cr-ip__testa b { font-size: calc(30 * var(--u)); font-weight: 700; letter-spacing: -.02em; line-height: 1.1; }
.as-cr-ip__tondi { display: flex; gap: calc(10 * var(--u)); }
.as-cr-ip__tondi i { display: grid; place-items: center; width: calc(38 * var(--u)); height: calc(38 * var(--u)); border-radius: 50%; background: rgba(255, 255, 255, .78); box-shadow: inset 0 0 0 calc(1 * var(--u)) rgba(255, 255, 255, .95), 0 calc(4 * var(--u)) calc(12 * var(--u)) rgba(40, 30, 70, .08); }
.as-cr-ip__tondi svg { width: calc(18 * var(--u)); height: calc(18 * var(--u)); stroke-width: 2.2; }
.as-cr-ip__schede { position: absolute; left: 0; right: 0; top: calc(82 * var(--u)); bottom: 0; }

/* le schede: dove stanno al terzo capitolo (senza JS), al primo e al secondo; quelle non ancora arrivate sono trasparenti */
.as-cr-t { position: absolute; left: var(--x3); top: var(--y3); width: var(--w3); height: var(--h3); display: flex; flex-direction: column; gap: calc(12 * var(--u)); padding: calc(15 * var(--u)) calc(16 * var(--u)); overflow: hidden; border-radius: calc(22 * var(--u)); background: rgba(255, 255, 255, .93); box-shadow: inset 0 0 0 calc(1 * var(--u)) rgba(255, 255, 255, .95), 0 calc(14 * var(--u)) calc(30 * var(--u)) calc(-14 * var(--u)) rgba(40, 30, 70, .24); }
@supports (corner-shape: squircle) { .as-cr-t { corner-shape: squircle; border-radius: calc(34 * var(--u)); } }
.as-cr.is-viva .as-cr-t { transition: left .8s cubic-bezier(.65, 0, .35, 1), top .8s cubic-bezier(.65, 0, .35, 1), width .8s cubic-bezier(.65, 0, .35, 1), height .8s cubic-bezier(.65, 0, .35, 1), opacity .45s ease .5s, transform .6s cubic-bezier(.34, 1.56, .64, 1) .5s; }
.as-cr[data-step="1"] .as-cr-t { left: var(--x1); top: var(--y1); width: var(--w1); height: var(--h1); }
.as-cr[data-step="2"] .as-cr-t { left: var(--x2); top: var(--y2); width: var(--w2); height: var(--h2); }
.as-cr[data-step="1"] .as-cr-t:is([data-m="2"], [data-m="3"]), .as-cr[data-step="2"] .as-cr-t[data-m="3"] { opacity: 0; transform: scale(.86); transition-delay: 0s, 0s, 0s, 0s, 0s, 0s; }
.as-cr-t > * { flex: none; }
.as-cr-t__testa { display: flex; align-items: center; gap: calc(9 * var(--u)); }
.as-cr-t__testa .as-cr-ic { font-size: calc(12 * var(--u)); }
.as-cr-t__testa b { font-size: calc(15.5 * var(--u)); font-weight: 600; letter-spacing: -.01em; white-space: nowrap; }
.as-cr-t__testa small { margin-left: auto; font-size: calc(12.5 * var(--u)); color: rgba(28, 28, 30, .5); white-space: nowrap; }
.as-cr-t__testa .as-cr-nuovo { margin-left: calc(2 * var(--u)); }
/* ciò che serve solo quando la scheda è alta (primo e secondo capitolo) */
.as-cr .is-alta { display: none; }
.as-cr:is([data-step="1"], [data-step="2"]) .is-alta { display: revert; }
.as-cr:is([data-step="1"], [data-step="2"]) ul.is-alta { display: grid; }
.as-cr:is([data-step="1"], [data-step="2"]) li.is-alta { display: flex; }
/* i numeri che cambiano: il prima e il dopo */
.as-cr .is-prima { display: none; }
.as-cr:not(.is-arriva) .as-cr-t.is-prenota .is-prima, .as-cr:not(.is-richiesta) .as-cr-t.is-sito .is-prima { display: inline; }
.as-cr:not(.is-arriva) .as-cr-t.is-prenota .is-dopo, .as-cr:not(.is-richiesta) .as-cr-t.is-sito .is-dopo { display: none; }

/* Prenotazioni */
.as-cr-t__grande { display: flex; align-items: center; gap: calc(12 * var(--u)); }
.as-cr-t__grande b { font-size: calc(46 * var(--u)); font-weight: 600; line-height: 1; letter-spacing: -.04em; color: #E8487E; font-variant-numeric: tabular-nums; }
.as-cr-t__grande > span { font-size: calc(14 * var(--u)); line-height: 1.25; color: rgba(28, 28, 30, .6); }
.as-cr-giorni { display: grid; grid-template-columns: repeat(auto-fit, minmax(calc(36 * var(--u)), 1fr)); grid-template-rows: auto; grid-auto-rows: 0; column-gap: calc(6 * var(--u)); overflow: hidden; }
.as-cr-giorni span { display: grid; justify-items: center; gap: calc(2 * var(--u)); padding: calc(7 * var(--u)) 0; border-radius: calc(12 * var(--u)); background: rgba(120, 120, 128, .1); font-size: calc(11.5 * var(--u)); color: rgba(28, 28, 30, .55); }
.as-cr-giorni b { font-size: calc(18 * var(--u)); font-weight: 600; color: #1C1C1E; }
.as-cr-giorni .is-on { background: #E8487E; color: rgba(255, 255, 255, .85); box-shadow: 0 calc(6 * var(--u)) calc(14 * var(--u)) calc(-6 * var(--u)) rgba(232, 72, 126, .7); }
.as-cr-giorni .is-on b { color: #fff; }
.as-cr-visite { display: grid; }
.as-cr-visite li { display: flex; align-items: center; gap: calc(10 * var(--u)); max-height: calc(60 * var(--u)); padding: calc(8 * var(--u)) calc(2 * var(--u)); border-top: calc(1 * var(--u)) solid rgba(0, 0, 0, .06); }
.as-cr-visite time { flex: none; width: calc(42 * var(--u)); font-size: calc(14 * var(--u)); font-weight: 600; font-variant-numeric: tabular-nums; }
.as-cr-visite li > span:not(.as-cr-volto) { flex: 1; min-width: 0; display: grid; line-height: 1.25; }
.as-cr-visite b, .as-cr-righe b { font-size: calc(14.5 * var(--u)); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.as-cr-visite small, .as-cr-righe small { font-size: calc(12.5 * var(--u)); color: rgba(28, 28, 30, .55); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.as-cr-visite em { display: none; flex: none; padding: calc(4 * var(--u)) calc(9 * var(--u)); border-radius: 999px; background: rgba(120, 120, 128, .12); font-size: calc(11.5 * var(--u)); font-weight: 600; color: rgba(28, 28, 30, .62); }
.as-cr-visite em.is-ok { background: #E3F6E8; color: #1C8A49; }
.as-cr[data-step="1"] .as-cr-visite em { display: inline-block; }
/* la visita nuova di Chiara e Luca: entra in cima alla lista, poi il dito la conferma */
.as-cr.is-viva .as-cr-visite li.is-nuova { transition: max-height .6s cubic-bezier(.2, .8, .2, 1), padding .6s cubic-bezier(.2, .8, .2, 1), opacity .45s ease .2s, background-color .9s ease; }
.as-cr:not(.is-arriva) .as-cr-visite li.is-nuova { max-height: 0; padding-top: 0; padding-bottom: 0; opacity: 0; }
.as-cr.is-arriva:not(.is-conf) .as-cr-visite li.is-nuova { background: rgba(232, 72, 126, .07); }
.as-cr-visite .as-cr-conferma { position: relative; display: none; padding: 0; background: none; }
.as-cr[data-step="1"] .as-cr-visite .as-cr-conferma { display: inline-grid; }
.as-cr-conferma span { grid-area: 1 / 1; padding: calc(4 * var(--u)) calc(10 * var(--u)); border-radius: 999px; text-align: center; transition: opacity .3s ease, transform .35s cubic-bezier(.34, 1.56, .64, 1); }
.as-cr-conferma .is-a { background: #E8487E; color: #fff; }
.as-cr-conferma .is-b { background: #E3F6E8; color: #1C8A49; }
.as-cr.is-conf .as-cr-conferma .is-a, .as-cr:not(.is-conf) .as-cr-conferma .is-b { opacity: 0; transform: scale(.7); }
.as-cr-t__sotto { margin-top: calc(4 * var(--u)) !important; font-size: calc(12.5 * var(--u)); font-weight: 600; color: rgba(28, 28, 30, .5); }
/* Sito web: la foto prende l'altezza che c'è; il conto delle richieste sale di uno */
.as-cr-t__foto { position: relative; flex: 1 1 0 !important; min-height: calc(54 * var(--u)); border-radius: calc(15 * var(--u)); background: #DDD center 55% / cover no-repeat; }
.as-cr-t__foto span { position: absolute; left: calc(10 * var(--u)); bottom: calc(10 * var(--u)); padding: calc(4 * var(--u)) calc(10 * var(--u)); border-radius: 999px; background: rgba(255, 255, 255, .88); font-size: calc(12 * var(--u)); font-weight: 600; }
.as-cr-t__dato { display: flex; align-items: center; gap: calc(10 * var(--u)); }
.as-cr-t__dato b { font-size: calc(36 * var(--u)); font-weight: 600; line-height: 1; letter-spacing: -.03em; color: #2F6BFF; font-variant-numeric: tabular-nums; }
.as-cr-t__dato > span { font-size: calc(13 * var(--u)); line-height: 1.25; color: rgba(28, 28, 30, .6); }
.as-cr-t__nuova { flex: none; margin-left: auto; padding: calc(3 * var(--u)) calc(9 * var(--u)); border-radius: 999px; background: #E6EEFF; color: #2F6BFF; font-size: calc(12.5 * var(--u)); font-weight: 700; opacity: 0; transform: translateY(calc(6 * var(--u))) scale(.8); }
.as-cr.is-viva .as-cr-t__nuova { transition: opacity .3s ease, transform .45s cubic-bezier(.34, 1.56, .64, 1); }
.as-cr[data-step="1"].is-richiesta .as-cr-t__nuova { opacity: 1; transform: none; }
/* Gestionale */
.as-cr-righe { display: grid; gap: calc(12 * var(--u)); }
.as-cr-righe li { display: flex; align-items: center; gap: calc(10 * var(--u)); }
.as-cr-righe .as-cr-volto { width: calc(38 * var(--u)); height: calc(38 * var(--u)); }
.as-cr-righe li > span:last-child { flex: 1; min-width: 0; display: grid; line-height: 1.28; }
.as-cr-righe small.is-ok { color: #1C8A49; font-weight: 600; }
/* Preventivi: la firma si scrive da sola quando la scheda arriva */
.as-cr-prev { display: grid; line-height: 1.25; }
.as-cr-prev b { font-size: calc(15 * var(--u)); font-weight: 600; }
.as-cr-prev small { font-size: calc(13 * var(--u)); color: rgba(28, 28, 30, .55); }
.as-cr-firma { display: block; width: 100%; height: calc(52 * var(--u)); }
.as-cr-firma path { stroke: #1C1C1E; stroke-width: 2.4; stroke-dasharray: 1 1; stroke-dashoffset: 0; }
.as-cr-firma .is-riga { stroke: rgba(28, 28, 30, .14); stroke-width: 1.2; }
.as-cr.is-viva .as-cr-firma path:first-child { transition: stroke-dashoffset 1.6s cubic-bezier(.45, .05, .3, 1) 1.1s; }
.as-cr[data-step="1"] .as-cr-firma path:first-child { stroke-dashoffset: 1; transition-delay: 0s; transition-duration: .01s; }
.as-cr-ok { display: flex; align-items: center; gap: calc(7 * var(--u)); font-size: calc(13 * var(--u)); font-weight: 600; color: #1C8A49; }
.as-cr-ok i { display: grid; place-items: center; width: calc(20 * var(--u)); height: calc(20 * var(--u)); border-radius: 50%; background: #34C759; color: #fff; }
.as-cr-ok svg { width: 70%; height: 70%; stroke-width: 3; }
.as-cr-ok.is-arancio { color: #C2410C; }
.as-cr-ok.is-arancio i { background: #F37022; }
.as-cr.is-viva .as-cr-ok.is-venduto { transition: opacity .35s ease, transform .45s cubic-bezier(.34, 1.56, .64, 1); }
.as-cr:not(.is-venduto) .as-cr-ok.is-venduto { opacity: 0; transform: translateY(calc(6 * var(--u))) scale(.85); }
/* Notifiche */
.as-cr-avvisi { display: grid; gap: calc(8 * var(--u)); }
.as-cr-avvisi li { display: flex; align-items: center; gap: calc(9 * var(--u)); padding: calc(9 * var(--u)) calc(10 * var(--u)); border-radius: calc(15 * var(--u)); background: rgba(120, 120, 128, .1); }
.as-cr-avvisi .as-cr-ic { font-size: calc(11 * var(--u)); }
.as-cr-avvisi li > span:last-child { display: grid; min-width: 0; line-height: 1.25; }
.as-cr-avvisi small { font-size: calc(11.5 * var(--u)); color: rgba(28, 28, 30, .55); }
.as-cr-avvisi b { font-size: calc(13.5 * var(--u)); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Area clienti */
.as-cr-file { display: grid; gap: calc(8 * var(--u)); }
.as-cr-file span { display: flex; align-items: center; gap: calc(9 * var(--u)); padding: calc(9 * var(--u)) calc(11 * var(--u)); border-radius: calc(13 * var(--u)); background: rgba(120, 120, 128, .1); }
.as-cr-file i { flex: none; width: calc(20 * var(--u)); height: calc(25 * var(--u)); border-radius: calc(4 * var(--u)); background: linear-gradient(180deg, #F0575C, #D93A40); box-shadow: inset 0 calc(-8 * var(--u)) 0 rgba(0, 0, 0, .12); }
.as-cr-file b { font-size: calc(13.5 * var(--u)); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.as-cr-file small { margin-left: auto; font-size: calc(11.5 * var(--u)); color: rgba(28, 28, 30, .5); white-space: nowrap; }
/* Assistente AI: la domanda, i tre puntini, la risposta */
.as-cr-chat { display: grid; gap: calc(7 * var(--u)); }
.as-cr-chat > span { max-width: 88%; padding: calc(8 * var(--u)) calc(12 * var(--u)); border-radius: calc(17 * var(--u)); font-size: calc(13.5 * var(--u)); line-height: 1.3; }
.as-cr-chat .is-io { justify-self: end; background: #2F7BF6; color: #fff; }
.as-cr-chat .is-bot { justify-self: start; background: rgba(120, 120, 128, .13); }
.as-cr-chat .is-scrive { display: none; justify-self: start; gap: calc(5 * var(--u)); padding: calc(12 * var(--u)) calc(14 * var(--u)); background: rgba(120, 120, 128, .13); }
.as-cr-chat .is-scrive i { width: calc(7 * var(--u)); height: calc(7 * var(--u)); border-radius: 50%; background: rgba(28, 28, 30, .4); animation: as-cr-puntini 1.1s ease-in-out infinite; }
.as-cr-chat .is-scrive i:nth-child(2) { animation-delay: .15s; }
.as-cr-chat .is-scrive i:nth-child(3) { animation-delay: .3s; }
@keyframes as-cr-puntini { 30% { transform: translateY(calc(-3 * var(--u))); background: rgba(28, 28, 30, .7); } }
.as-cr:not(.is-ai) .as-cr-chat .is-bot { display: none; }
.as-cr[data-step="3"]:not(.is-ai) .as-cr-chat .is-scrive { display: flex; }
.as-cr.is-viva.is-ai .as-cr-chat .is-bot { animation: as-cr-bolla .45s cubic-bezier(.34, 1.56, .64, 1); transform-origin: 0 50%; }
@keyframes as-cr-bolla { from { opacity: 0; transform: scale(.6); } }
/* Negozio online */
.as-cr-riga { display: flex; align-items: center; gap: calc(11 * var(--u)); }
.as-cr-riga > span:last-child { display: grid; min-width: 0; line-height: 1.28; }
.as-cr-riga b { font-size: calc(14.5 * var(--u)); font-weight: 600; }
.as-cr-riga small { font-size: calc(12.5 * var(--u)); color: rgba(28, 28, 30, .55); }
.as-cr-t__mini { flex: none; width: calc(56 * var(--u)); height: calc(56 * var(--u)); border-radius: calc(13 * var(--u)); background: #DDD center / cover no-repeat; }

/* ══ LO SCHERMO DELL'IPHONE: la schermata di blocco, 402 × 874 punti ══ */
.as-cr-tel { position: absolute; z-index: 1; left: 4.4%; top: 1.7%; width: 91.1%; height: 96.6%; overflow: hidden; border-radius: 15.2% / 7.1%; background: #1E2B22; color: #fff; font-family: -apple-system, 'SF Pro Text', system-ui, 'Helvetica Neue', Arial, sans-serif; -webkit-font-smoothing: antialiased; }
.as-cr-tel p, .as-cr-tel ol { margin: 0; padding: 0; list-style: none; }
.as-cr-tel :is(b, small) { font-style: normal; }
.as-cr-tel__fondo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 38% 50%; }
.as-cr-tel::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(0, 0, 0, .34), rgba(0, 0, 0, .06) 32%, rgba(0, 0, 0, .1) 55%, rgba(0, 0, 0, .42)); }
.as-cr-tel > *:not(img) { position: absolute; z-index: 2; }
.as-cr-tel__barra { right: calc(30 * var(--u)); top: calc(21 * var(--u)); display: flex; align-items: center; gap: calc(6 * var(--u)); }
.as-cr-tel__barra svg { width: calc(17 * var(--u)); height: calc(11 * var(--u)); fill: #fff; }
.as-cr-tel__barra svg path.is-tratto { fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; }
.as-cr-tel__barra i { width: calc(25 * var(--u)); height: calc(12 * var(--u)); border-radius: calc(4 * var(--u)); background: #fff; }
.as-cr-tel__data { left: 0; right: 0; top: calc(78 * var(--u)); text-align: center; font-size: calc(19 * var(--u)); font-weight: 600; color: rgba(255, 255, 255, .9); }
.as-cr-tel__ora { left: 0; right: 0; top: calc(98 * var(--u)); text-align: center; font-size: calc(104 * var(--u)); font-weight: 600; line-height: 1; letter-spacing: -.02em; color: rgba(255, 255, 255, .94); }
/* gli avvisi: --n quanti ne sono arrivati, --i l'ordine di arrivo; il più nuovo sta in cima e spinge giù gli altri */
.as-cr-tel__notif { left: calc(12 * var(--u)); right: calc(12 * var(--u)); top: 0; bottom: 0; }
.as-cr-tel__notif li { --slot: calc(var(--n, 7) - 1 - var(--i)); position: absolute; left: 0; right: 0; top: calc((432 + var(--slot) * 82) * var(--u)); display: flex; align-items: center; gap: calc(11 * var(--u)); min-height: calc(72 * var(--u)); padding: calc(11 * var(--u)) calc(13 * var(--u)); border-radius: calc(24 * var(--u)); background: rgba(246, 246, 248, .86); color: #1C1C1E; box-shadow: 0 calc(6 * var(--u)) calc(18 * var(--u)) rgba(0, 0, 0, .14); opacity: clamp(0, min(var(--slot) + 1, 4 - var(--slot)), 1); }
.as-cr.is-viva .as-cr-tel__notif li { transition: top .65s cubic-bezier(.2, .8, .2, 1), opacity .4s ease; }
.as-cr-tel__notif .as-cr-ic { font-size: calc(18 * var(--u)); }
.as-cr-tel__notif li > span:last-child { flex: 1; display: grid; min-width: 0; font-size: calc(14.5 * var(--u)); line-height: 1.28; }
.as-cr-tel__notif li b { display: flex; justify-content: space-between; gap: calc(8 * var(--u)); font-weight: 600; }
.as-cr-tel__notif li small { font-size: calc(12.5 * var(--u)); font-weight: 400; color: rgba(28, 28, 30, .5); }
.as-cr-tel__tasto { bottom: calc(44 * var(--u)); display: grid; place-items: center; width: calc(50 * var(--u)); height: calc(50 * var(--u)); border-radius: 50%; background: rgba(0, 0, 0, .3); }
.as-cr-tel__tasto.is-sx { left: calc(46 * var(--u)); }
.as-cr-tel__tasto.is-dx { right: calc(46 * var(--u)); }
.as-cr-tel__tasto svg { width: 46%; height: 46%; fill: none; stroke: #fff; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.as-cr-tel__casa { left: 50%; bottom: calc(9 * var(--u)); width: calc(140 * var(--u)); height: calc(5 * var(--u)); margin-left: calc(-70 * var(--u)); border-radius: 999px; background: rgba(255, 255, 255, .92); }

/* ══ DA TELEFONO, GLI AVVISI (v0.117): banner in cima allo schermo dell'iPad, uno alla volta (.is-on dal JS); da computer no ══ */
.as-cr-ban, .as-cr-zona:is(.is-prev-m, .is-nuovi-m) { display: none; }
.as-cr-ban { position: absolute; z-index: 6; left: calc(387 * var(--u)); top: calc(14 * var(--u)); width: calc(420 * var(--u)); height: calc(84 * var(--u)); pointer-events: none; }
.as-cr-ban li { position: absolute; left: 0; right: 0; top: 0; display: flex; align-items: center; gap: calc(12 * var(--u)); min-height: calc(76 * var(--u)); padding: calc(12 * var(--u)) calc(15 * var(--u)); border-radius: calc(24 * var(--u)); background: rgba(250, 250, 252, .97); box-shadow: inset 0 0 0 calc(1 * var(--u)) rgba(255, 255, 255, .95), 0 calc(14 * var(--u)) calc(34 * var(--u)) rgba(30, 20, 50, .22); color: #1C1C1E; opacity: 0; transform: translateY(calc(-112 * var(--u))) scale(.96); transition: transform .6s cubic-bezier(.2, .8, .2, 1), opacity .3s ease; }
@supports (corner-shape: squircle) { .as-cr-ban li { corner-shape: squircle; border-radius: calc(36 * var(--u)); } }
.as-cr-ban li.is-on { opacity: 1; transform: none; }
.as-cr-ban .as-cr-ic { font-size: calc(17 * var(--u)); }
.as-cr-ban li > span:last-child { flex: 1; display: grid; min-width: 0; font-size: calc(15 * var(--u)); line-height: 1.28; }
.as-cr-ban li b { display: flex; justify-content: space-between; gap: calc(8 * var(--u)); font-weight: 600; }
.as-cr-ban li small { font-size: calc(13 * var(--u)); font-weight: 400; color: rgba(28, 28, 30, .5); }

/* ══ I CAPITOLI, sotto il palco: cosa succede, la barra che si riempie; un tocco porta lì; «Rivedi» alla fine ══ */
.as-cr__capitoli { position: relative; margin-top: 22px; }
.as-cr-cap { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.as-cr-cap__btn { appearance: none; display: grid; align-content: start; gap: 6px; width: 100%; margin: 0; padding: 0; border: 0; background: none; color: var(--as-ink); font: inherit; text-align: left; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.as-cr-cap__btn:focus-visible { outline: 2px solid var(--as-arancio); outline-offset: 6px; border-radius: 8px; }
.as-cr-cap__barra { display: block; height: 3px; margin-bottom: 12px; overflow: hidden; border-radius: 3px; background: var(--as-line); }
.as-cr-cap__barra i { display: block; height: 100%; border-radius: inherit; background: var(--as-arancio); transform-origin: 0 50%; transform: scaleX(var(--p, 1)); }
.as-cr-cap__n { color: var(--as-muted); transition: color .35s ease; }
.as-cr-cap__testo { display: grid; gap: 6px; }
.as-cr-cap__t { font-size: 19px; font-weight: 500; line-height: 1.25; letter-spacing: -.01em; }
.as-cr-cap__r { font-size: 15px; line-height: 1.45; color: var(--as-muted); text-wrap: pretty; }
.as-cr__capitoli.is-viva .as-cr-cap__btn { color: rgba(10, 10, 10, .38); transition: color .35s ease; }
.as-cr__capitoli.is-viva .as-cr-cap__r { color: inherit; }
.as-cr__capitoli.is-viva .as-cr-cap__voce.is-on .as-cr-cap__btn { color: var(--as-ink); }
.as-cr__capitoli.is-viva .as-cr-cap__voce.is-on .as-cr-cap__r { color: var(--as-muted); }
.as-cr__capitoli.is-viva .as-cr-cap__voce:is(.is-on, .is-fatto) .as-cr-cap__n { color: var(--as-arancio); }
@media (hover: hover) { .as-cr__capitoli.is-viva .as-cr-cap__btn:hover { color: var(--as-ink); } }
.as-cr-cap__rivedi { position: absolute; z-index: 3; right: 18px; top: -70px; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px 0 12px; border: 0; border-radius: 999px; background: var(--as-ink); color: #fff; font: inherit; font-size: 14px; font-weight: 500; cursor: pointer; opacity: 0; transform: translateY(8px); pointer-events: none; transition: opacity .35s ease, transform .45s cubic-bezier(.34, 1.56, .64, 1); }
.as-cr-cap__rivedi svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.as-cr__capitoli.is-finito .as-cr-cap__rivedi { opacity: 1; transform: none; pointer-events: auto; }
.as-cr__capitoli:not(.is-viva) .as-cr-cap__rivedi { display: none; }
.as-cr__nota { margin: 18px 0 0; font-size: 12px; color: var(--as-muted); }

/* ══ TABLET ══ */
@media (min-width: 700px) and (max-width: 999px) {
	.as-cr__scena { --a: 1.5; }
	.as-cr__palco { --a: 1.5; --z: 2; }
	.as-cr__cam { --cs: calc(1.1257 / var(--z)); --cx: -6.566cqw; --cy: 1.533cqw; }
	.as-cr-cap { gap: 20px; }
	.as-cr-cap__t { font-size: 17px; }
	.as-cr-cap__r { font-size: 14px; }
}

/* ══ TELEFONO (v0.117, Rami 05/11: «è tutto gigantesco e l'iPad dentro è orribile… metti solo iPad, leva l'iPhone, e fai l'iPad
   come da desktop»): solo l'iPad, a tutta larghezza, col palco alto quanto lui (niente piano, niente riflesso, niente iPhone), e
   dentro lo stesso gestionale del computer. La tela è 100em × 74em e nasce alla misura del primo piano (--z 2,5): il campo largo
   la rimpicciolisce (--cs .3917, l'iPad intero), i tre primi piani arrivano a 2,5 volte il campo largo (0,98: mai sopra 1, così
   il testo resta nitido). Gli avvisi scendono come banner in cima allo schermo dell'iPad (sopra). ══ */
@media (max-width: 699px) {
	.as-cr__scena { width: 100%; }
	.as-cr__palco { --a: 1.36; --z: 2.5; border-radius: calc(22px * var(--as-brm)); }
	.as-cr__cam { --cs: .3917; --cx: 1.04cqw; --cy: .53cqw; height: 74em; }
	.as-cr__luce { left: -10em; top: -8em; width: 120em; height: 90em;
		background:
			radial-gradient(26% 30% at 18% 26%, rgba(255, 170, 205, .6), rgba(255, 170, 205, 0) 72%),
			radial-gradient(28% 32% at 52% 12%, rgba(186, 166, 255, .5), rgba(186, 166, 255, 0) 72%),
			radial-gradient(28% 32% at 86% 34%, rgba(140, 190, 255, .6), rgba(140, 190, 255, 0) 72%),
			radial-gradient(26% 30% at 84% 84%, rgba(150, 226, 200, .5), rgba(150, 226, 200, 0) 72%),
			radial-gradient(26% 30% at 16% 84%, rgba(255, 190, 168, .55), rgba(255, 190, 168, 0) 72%); }
	.as-cr__piano, .as-cr__iphone { display: none; }
	.as-cr__ipad { left: 3em; top: 3em; width: 94em; --u: calc(94em * .92167 / 1194); }
	.as-cr__ipad .as-cr__dentro { -webkit-box-reflect: none; }
	/* il campo largo: l'iPad intero con un filo di margine; i primi piani, in punti dello schermo (1194 × 834), nella forma del
	   palco (560 × 415, 2,35 volte il campo largo): le prenotazioni dal numero grande a «Conferma», col banner in cima; gestionale
	   e preventivi (la firma); assistente e negozio */
	.as-cr-zona.is-tutto { left: 2em; top: 2em; width: 96em; height: 70em; }
	.as-cr-zona:is(.is-prenota-m, .is-prev-m, .is-nuovi-m) { display: block; width: calc(560 * var(--u)); height: calc(415 * var(--u)); }
	.as-cr-zona.is-prenota-m { left: calc(292 * var(--u)); top: calc(14 * var(--u)); }
	.as-cr-zona.is-prev-m { left: calc(598 * var(--u)); top: calc(96 * var(--u)); }
	.as-cr-zona.is-nuovi-m { left: calc(598 * var(--u)); top: calc(410 * var(--u)); }
	.as-cr-ban { display: block; }

	.as-cr__capitoli { margin-top: 16px; }
	/* (.as-cr__capitoli davanti: la regola globale ol[class] azzererebbe lo spazio sotto le barre) */
	.as-cr__capitoli .as-cr-cap { position: relative; gap: 6px; padding-bottom: 132px; }
	.as-cr-cap__barra { margin-bottom: 0; }
	.as-cr-cap__btn { gap: 0; padding: 10px 0; margin: -10px 0; }
	.as-cr-cap__n { position: absolute; top: 26px; left: 0; width: 64px; font-size: 46px !important; font-weight: 300; line-height: 1; letter-spacing: -.045em !important; color: transparent; -webkit-text-stroke: 1px var(--as-arancio); font-variant-numeric: tabular-nums; }
	.as-cr-cap__testo { position: absolute; top: 28px; left: 70px; right: 0; gap: 4px; }
	.as-cr-cap__t { font-size: 18.5px; }
	.as-cr-cap__r { font-size: 14.5px; }
	.as-cr-cap__voce :is(.as-cr-cap__n, .as-cr-cap__t, .as-cr-cap__r) { visibility: hidden; opacity: 0; transform: translateY(-14px); transition: opacity .25s ease, transform .35s ease, visibility 0s .35s; }
	.as-cr__capitoli:not(.is-viva) .as-cr-cap { grid-template-columns: 1fr; gap: 18px; padding-bottom: 0; }
	.as-cr__capitoli:not(.is-viva) .as-cr-cap__voce :is(.as-cr-cap__n, .as-cr-cap__testo) { position: static; }
	.as-cr__capitoli:not(.is-viva) .as-cr-cap__voce :is(.as-cr-cap__n, .as-cr-cap__t, .as-cr-cap__r) { visibility: visible; opacity: 1; transform: none; }
	.as-cr__capitoli:not(.is-viva) .as-cr-cap__n { width: auto; font-size: 13px !important; color: var(--as-muted) !important; -webkit-text-stroke: 0; }
	.as-cr__capitoli.is-viva .as-cr-cap__voce.is-on :is(.as-cr-cap__n, .as-cr-cap__t, .as-cr-cap__r) { visibility: visible; opacity: 1; transform: none; transition: none; animation: as-cr-sale .75s cubic-bezier(.2, .8, .2, 1) both; }
	.as-cr__capitoli.is-viva .as-cr-cap__voce.is-on .as-cr-cap__n { animation-name: as-cr-numero; animation-duration: .9s; }
	.as-cr__capitoli.is-viva .as-cr-cap__voce.is-on .as-cr-cap__t { animation-delay: .14s; }
	.as-cr__capitoli.is-viva .as-cr-cap__voce.is-on .as-cr-cap__r { animation-delay: .28s; }
	.as-cr-cap__rivedi { top: -58px; right: 12px; height: 36px; font-size: 13.5px; }
}
@keyframes as-cr-sale { from { opacity: 0; transform: translateY(22px); } }
@keyframes as-cr-numero {
	0% { opacity: 0; transform: translateY(30px) scale(.82); color: transparent; }
	55% { opacity: 1; transform: none; color: transparent; }
	100% { opacity: 1; transform: none; color: var(--as-arancio); }
}
