/*
 * Studio Arfia — casi/salone.css · v0.104.0 · 04/11/2026
 * Il chatbot del salone (inc/casi/salone.php), sulla pagina /soluzioni/chatbot-per-sito-web/: l'iPhone di Giorgio col sito
 * di Autosalone Bellini e la sua chat, il MacBook di Matteo con Google Calendar. Una regia a tempo (motion.js, data-as-cb)
 * nello stile della posta in Gmail: palco, telecamera, capitoli fuori.
 * Misure: la tela è 86 × 50em (il MacBook del kit è 66em); nell'iPhone i punti dello schermo (var(--u)); nel Mac i punti
 * della posta (--q, la cornice di Chrome viene da casi/posta.css). Niente backdrop-filter sui telefoni (Errori 1.78).
 * Colori di Bellini: blu #1F4FD8, inchiostro #0F0F10, carta #F1EFE8. Il sito di Bellini in Anton e Instrument Sans (come
 * il suo sito da computer, demo.css), la chat e Safari nel font di sistema, Calendar nei font di Google.
 */
@font-face { font-family: 'Anton Bellini'; src: url('../../fonts/schermate/anton-normal-latin.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Instrument Sans Bellini'; src: url('../../fonts/schermate/instrument-sans-normal-latin.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; }

/* ══ IL PALCO E LA TELECAMERA ══ */
.as-cb { position: relative; width: 100%; }
.as-cb__palco {
	--a: 1.9;
	--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: var(--as-sup);
}
@supports (corner-shape: squircle) { .as-cb__palco { corner-shape: squircle; } }
/* la notte: blu profondo, la luce del telefono a sinistra e un riflesso viola in alto; la mattina se ne va */
.as-cb__cielo { position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity 1.4s ease;
	background:
		radial-gradient(34% 52% at 15% 60%, rgba(78, 104, 255, .34), rgba(78, 104, 255, 0) 72%),
		radial-gradient(42% 46% at 82% 14%, rgba(150, 84, 255, .2), rgba(150, 84, 255, 0) 70%),
		linear-gradient(180deg, #0A0E1C 0%, #10162E 100%); }
.as-cb:not(.is-giorno) .as-cb__cielo { opacity: 1; }
.as-cb__cam {
	/* il campo lungo (anche senza JS): i due dispositivi, centrati */
	--cs: calc(.815 / var(--z));
	--cx: 9.25cqw;
	--cy: 2.6cqw;
	position: absolute;
	left: 0;
	top: 0;
	width: 86em;
	height: 50em;
	font-size: calc(var(--z) * 100cqw / 86);
	transform-origin: 0 0;
	transform: translate(var(--cx), var(--cy)) scale(var(--cs));
	transition: transform 1.35s cubic-bezier(.65, 0, .3, 1);
}
@media (max-width: 999px) {
	.as-cb__palco { --a: 1.5; --z: 2.3; }
	.as-cb__cam { --cs: calc(.94 / var(--z)); --cx: 3cqw; --cy: 6cqw; }
}
@media (max-width: 699px) {
	.as-cb__palco { --a: .84; --z: 4.6; border-radius: calc(22px * var(--as-brm)); }
	.as-cb__cam { --cs: calc(.94 / var(--z)); --cx: 3cqw; --cy: 32.2cqw; }
}
.as-cb__scena { position: absolute; left: 0; top: 0; width: 86em; height: 50em; }
.as-cb__mac { position: absolute; left: 20em; top: 3.5em; transition: filter 1.2s ease; }
.as-cb__mac .as-macbook { margin: 0; }
.as-cb__tel { position: absolute; z-index: 2; left: 2em; top: 8.6em; font-size: .92em; }
.as-cb__tel .as-iphone { margin: 0; }
/* di notte il Mac di Matteo dorme: schermo spento, alluminio in penombra */
.as-cb__mac .as-disp__spento { transition: opacity 1s ease .2s; }
.as-cb:not(.is-giorno) .as-cb__mac .as-disp__spento { opacity: 1; }
.as-cb:not(.is-giorno) .as-cb__mac { filter: brightness(.42) saturate(.8); }
.as-cb--fermo *, .as-cb--fermo, .as-cb.is-salto, .as-cb.is-salto * { transition: none !important; animation: none !important; }
.as-cb-zona { position: absolute; display: block; visibility: hidden; pointer-events: none; }
.as-cb-t .as-cb-zona { left: calc(var(--x) * var(--u)); top: calc(var(--y) * var(--u)); width: calc(var(--w) * var(--u)); height: calc(var(--h) * var(--u)); }
.as-cb-c .as-cb-zona { left: calc(var(--x) * var(--q)); top: calc(var(--y) * var(--q)); width: calc(var(--w) * var(--q)); height: calc(var(--h) * var(--q)); }
.as-cb-ic { display: block; flex: none; fill: none; }
.as-cb-segno { display: block; flex: none; }

/* ══ L'IPHONE DI GIORGIO: la scheda della berlina sul sito di Bellini, in Safari ══ */
.as-cb-t { position: absolute; inset: 0; overflow: hidden; background: #F1EFE8; color: #0F0F10; font-family: -apple-system, 'SF Pro Text', system-ui, 'Helvetica Neue', Arial, sans-serif; -webkit-font-smoothing: antialiased; text-rendering: geometricPrecision; }
.as-cb-t *, .as-cb-t *::before, .as-cb-t *::after { box-sizing: border-box; }
.as-cb-t p { margin: 0; }
.as-cb-t :is(b, small, em, i) { font-style: normal; }
.as-cb-t .as-k-chat__ic { display: block; flex: none; width: 100%; height: 100%; }

.as-cb-t__sito { position: absolute; inset: 0; font-family: 'Instrument Sans Bellini', 'Helvetica Neue', Arial, sans-serif; }
.as-cb-t__testa { position: absolute; top: calc(60 * var(--u)); left: calc(18 * var(--u)); right: calc(18 * var(--u)); display: flex; align-items: center; justify-content: space-between; height: calc(46 * var(--u)); }
.as-cb-t__marchio { display: flex; align-items: center; gap: calc(9 * var(--u)); }
.as-cb-t__marchio .as-cb-segno { width: calc(34 * var(--u)); height: calc(27 * var(--u)); color: #0F0F10; }
.as-cb-t__marchio > span { display: grid; line-height: 1; }
.as-cb-t__marchio b { font-family: 'Anton Bellini', Impact, 'Arial Narrow Bold', sans-serif; font-weight: 400; font-size: calc(20 * var(--u)); letter-spacing: .03em; text-transform: uppercase; }
.as-cb-t__marchio small { margin-top: calc(3 * var(--u)); font-size: calc(8 * var(--u)); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: rgba(15, 15, 16, .55); white-space: nowrap; }
.as-cb-t__menu { display: grid; gap: calc(6 * var(--u)); width: calc(22 * var(--u)); }
.as-cb-t__menu i { display: block; height: calc(1.6 * var(--u)); border-radius: 2px; background: #0F0F10; }
.as-cb-t__briciole { position: absolute; top: calc(118 * var(--u)); left: calc(18 * var(--u)); right: calc(18 * var(--u)); display: flex; align-items: center; gap: calc(6 * var(--u)); font-size: calc(12 * var(--u)); color: rgba(15, 15, 16, .5); white-space: nowrap; overflow: hidden; }
.as-cb-t__briciole b { font-weight: 500; color: rgba(15, 15, 16, .78); }
.as-cb-t__foto { position: absolute; top: calc(144 * var(--u)); left: calc(12 * var(--u)); right: calc(12 * var(--u)); height: calc(250 * var(--u)); border-radius: calc(20 * var(--u)); background-color: #cfcac0; background-size: cover; background-position: 50% 58%; }
.as-cb-t__foto em { position: absolute; right: calc(12 * var(--u)); bottom: calc(12 * var(--u)); padding: calc(4 * var(--u)) calc(9 * var(--u)); border-radius: 999px; background: rgba(15, 15, 16, .62); color: #fff; font-size: calc(11.5 * var(--u)); font-weight: 600; font-variant-numeric: tabular-nums; }
.as-cb-t__info { position: absolute; top: calc(410 * var(--u)); left: calc(18 * var(--u)); right: calc(18 * var(--u)); }
.as-cb-t__nome { font-family: 'Anton Bellini', Impact, sans-serif; font-size: calc(30 * var(--u)); line-height: 1; letter-spacing: .005em; text-transform: uppercase; }
.as-cb-t__meta { margin-top: calc(9 * var(--u)) !important; font-size: calc(13.5 * var(--u)); color: rgba(15, 15, 16, .62); }
.as-cb-t__prezzo { display: flex; align-items: baseline; gap: calc(10 * var(--u)); margin-top: calc(14 * var(--u)) !important; }
.as-cb-t__prezzo b { font-size: calc(28 * var(--u)); font-weight: 700; letter-spacing: -.02em; }
.as-cb-t__prezzo span { font-size: calc(14 * var(--u)); color: rgba(15, 15, 16, .6); }
.as-cb-t__pill { display: flex; gap: calc(6 * var(--u)); margin-top: calc(14 * var(--u)) !important; }
.as-cb-t__pill span { display: inline-flex; align-items: center; gap: calc(5 * var(--u)); padding: calc(6 * var(--u)) calc(10 * var(--u)); border-radius: 999px; background: #fff; font-size: calc(12 * var(--u)); font-weight: 500; box-shadow: 0 0 0 calc(.6 * var(--u)) rgba(15, 15, 16, .12); }
.as-cb-t__pill .as-cb-ic { width: calc(15 * var(--u)); height: calc(15 * var(--u)); color: #1F4FD8; }
.as-cb-t__cta { display: flex; align-items: center; justify-content: space-between; height: calc(52 * var(--u)); margin-top: calc(18 * var(--u)) !important; padding: 0 calc(6 * var(--u)) 0 calc(20 * var(--u)); border-radius: 999px; background: #1F4FD8; color: #fff; box-shadow: 0 calc(10 * var(--u)) calc(22 * var(--u)) calc(-10 * var(--u)) rgba(31, 79, 216, .75); }
.as-cb-t__cta b { font-family: 'Anton Bellini', Impact, sans-serif; font-weight: 400; font-size: calc(15 * var(--u)); letter-spacing: .04em; text-transform: uppercase; }
.as-cb-t__cta i { display: grid; place-items: center; width: calc(40 * var(--u)); height: calc(40 * var(--u)); border-radius: 50%; background: #fff; color: #1F4FD8; }
.as-cb-t__cta .as-cb-ic { width: calc(20 * var(--u)); height: calc(20 * var(--u)); }

/* l'invito e la bolla della chat (Bellini: il blu del sito, il pallino verde = c'è qualcuno) */
.as-cb-t__invito { position: absolute; z-index: 5; right: calc(86 * var(--u)); bottom: calc(102 * var(--u)); display: grid; gap: calc(1 * var(--u)); width: calc(206 * var(--u)); padding: calc(10 * var(--u)) calc(14 * var(--u)); border-radius: calc(18 * var(--u)) calc(18 * var(--u)) calc(6 * var(--u)) calc(18 * var(--u)); background: #fff; font-size: calc(12.5 * var(--u)); line-height: 1.3; color: rgba(15, 15, 16, .62); box-shadow: 0 calc(14 * var(--u)) calc(30 * var(--u)) calc(-12 * var(--u)) rgba(15, 15, 16, .45), 0 0 0 calc(.5 * var(--u)) rgba(15, 15, 16, .08); transition: opacity .3s ease, transform .4s cubic-bezier(.2, .8, .2, 1); }
.as-cb-t__invito b { font-size: calc(14 * var(--u)); font-weight: 600; color: #0F0F10; }
.as-cb-t__lancia { position: absolute; z-index: 6; right: calc(18 * var(--u)); bottom: calc(96 * var(--u)); display: grid; place-items: center; width: calc(58 * var(--u)); height: calc(58 * var(--u)); border-radius: 50%; background: #1F4FD8; color: #fff; box-shadow: 0 calc(12 * var(--u)) calc(26 * var(--u)) calc(-8 * var(--u)) rgba(31, 79, 216, .8), inset 0 0 0 calc(1 * var(--u)) rgba(255, 255, 255, .16); transition: opacity .3s ease, transform .4s cubic-bezier(.2, .8, .2, 1); }
.as-cb-t__lancia .as-k-chat__ic { width: calc(28 * var(--u)); height: calc(28 * var(--u)); }
.as-cb-t__lancia::after { content: ""; position: absolute; top: calc(2 * var(--u)); right: calc(2 * var(--u)); width: calc(13 * var(--u)); height: calc(13 * var(--u)); border-radius: 50%; background: #34C759; box-shadow: 0 0 0 calc(2.5 * var(--u)) #1F4FD8; }
.as-cb.is-chat :is(.as-cb-t__invito, .as-cb-t__lancia) { opacity: 0; transform: scale(.7); }
.as-cb-t__velo { position: absolute; inset: 0; z-index: 7; background: rgba(6, 8, 16, .5); transition: opacity .45s ease; }
.as-cb:not(.is-chat) .as-cb-t__velo { opacity: 0; }

/* la chat: il foglio sopra la barra di Safari; con la tastiera si alza */
.as-cb-t__foglio { position: absolute; z-index: 8; left: calc(8 * var(--u)); right: calc(8 * var(--u)); top: calc(108 * var(--u)); bottom: calc(80 * var(--u)); display: flex; flex-direction: column; overflow: hidden; border-radius: calc(30 * var(--u)); background: #F6F4EF; color: #0F0F10; box-shadow: 0 calc(30 * var(--u)) calc(60 * var(--u)) calc(-18 * var(--u)) rgba(0, 0, 0, .6), 0 0 0 calc(.5 * var(--u)) rgba(0, 0, 0, .1); transition: transform .6s cubic-bezier(.2, .9, .25, 1), bottom .38s cubic-bezier(.2, .8, .2, 1); }
.as-cb:not(.is-chat) .as-cb-t__foglio { transform: translateY(calc(780 * var(--u))); }
.as-cb.is-tastiera .as-cb-t__foglio { bottom: calc(306 * var(--u)); }
.as-cb-t__intesta { flex: none; display: flex; align-items: center; gap: calc(11 * var(--u)); padding: calc(12 * var(--u)) calc(12 * var(--u)) calc(12 * var(--u)) calc(13 * var(--u)); background: #fff; box-shadow: 0 calc(.5 * var(--u)) 0 rgba(15, 15, 16, .1); }
.as-cb-t__av { flex: none; display: grid; place-items: center; width: calc(26 * var(--u)); height: calc(26 * var(--u)); border-radius: 50%; background: #fff; color: #0F0F10; box-shadow: 0 0 0 calc(.6 * var(--u)) rgba(15, 15, 16, .16); }
.as-cb-t__av .as-cb-segno { width: 68%; height: auto; }
.as-cb-t__av.is-grande { width: calc(40 * var(--u)); height: calc(40 * var(--u)); background: #F1EFE8; box-shadow: none; }
.as-cb-t__av.is-vuoto { background: none; box-shadow: none; }
.as-cb-t__chi { flex: 1; min-width: 0; display: grid; gap: calc(2 * var(--u)); }
.as-cb-t__chi b { font-size: calc(16.5 * var(--u)); font-weight: 600; line-height: 1.15; letter-spacing: -.015em; }
.as-cb-t__chi small { display: flex; align-items: center; gap: calc(6 * var(--u)); font-size: calc(12 * var(--u)); line-height: 1.2; color: rgba(15, 15, 16, .55); white-space: nowrap; }
.as-cb-t__chi small i { flex: none; width: calc(7 * var(--u)); height: calc(7 * var(--u)); border-radius: 50%; background: #34C759; }
.as-cb-t__chiudi { flex: none; display: grid; place-items: center; width: calc(32 * var(--u)); height: calc(32 * var(--u)); border-radius: 50%; background: rgba(15, 15, 16, .06); color: rgba(15, 15, 16, .7); }
.as-cb-t__chiudi .as-k-chat__ic { width: calc(20 * var(--u)); height: calc(20 * var(--u)); }

/* i messaggi: la lista è ancorata in basso, i nuovi spingono su i vecchi */
.as-cb-t__flusso { position: relative; flex: 1 1 auto; min-height: 0; overflow: hidden; }
.as-cb-t__lista { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; min-height: 100%; padding: calc(10 * var(--u)) calc(12 * var(--u)) calc(12 * var(--u)); }
.as-cb-t__giorno { align-self: center; margin: auto 0 0 !important; padding-top: calc(12 * var(--u)); font-size: calc(11.5 * var(--u)); font-weight: 500; color: rgba(15, 15, 16, .42); }
.as-cb-t__v { display: grid; grid-template-rows: 1fr; transition: grid-template-rows .5s cubic-bezier(.2, .8, .2, 1), opacity .3s ease .08s; }
.as-cb-t__v > div { display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.as-cb-t__v > div > * { margin-top: calc(8 * var(--u)) !important; transition: transform .5s cubic-bezier(.34, 1.4, .64, 1); }
.as-cb:not(.is-m0) .as-cb-t__v.is-m0, .as-cb:not(.is-m1) .as-cb-t__v.is-m1, .as-cb:not(.is-m2) .as-cb-t__v.is-m2,
.as-cb:not(.is-m3) .as-cb-t__v.is-m3, .as-cb:not(.is-m4) .as-cb-t__v.is-m4, .as-cb:not(.is-m5) .as-cb-t__v.is-m5,
.as-cb:not(.is-m6) .as-cb-t__v.is-m6, .as-cb:not(.is-m7) .as-cb-t__v.is-m7, .as-cb:not(.is-m8) .as-cb-t__v.is-m8,
.as-cb:not(.is-scrive) .as-cb-t__v.is-scrive, .as-cb:not(.is-scrive2) .as-cb-t__v.is-scrive2 { grid-template-rows: 0fr; opacity: 0; }
.as-cb:not(.is-m0) .as-cb-t__v.is-m0 > div > *, .as-cb:not(.is-m2) .as-cb-t__v.is-m2 > div > *, .as-cb:not(.is-m3) .as-cb-t__v.is-m3 > div > *,
.as-cb:not(.is-m4) .as-cb-t__v.is-m4 > div > *, .as-cb:not(.is-m6) .as-cb-t__v.is-m6 > div > *, .as-cb:not(.is-m8) .as-cb-t__v.is-m8 > div > * { transform: translateY(calc(14 * var(--u))) scale(.94); transform-origin: 0 100%; }
.as-cb-t__bot { display: flex; align-items: flex-end; gap: calc(7 * var(--u)); }
.as-cb-t__msg { max-width: 84%; padding: calc(9 * var(--u)) calc(13 * var(--u)) calc(10 * var(--u)); font-size: calc(15 * var(--u)); line-height: 1.37; letter-spacing: -.012em; text-wrap: pretty; }
.as-cb-t__bot .as-cb-t__msg { max-width: calc(90% - calc(33 * var(--u))); }
.as-cb-t__msg.is-bot { border-radius: calc(19 * var(--u)) calc(19 * var(--u)) calc(19 * var(--u)) calc(6 * var(--u)); background: #fff; box-shadow: 0 calc(1 * var(--u)) calc(2 * var(--u)) rgba(15, 15, 16, .06), 0 0 0 calc(.5 * var(--u)) rgba(15, 15, 16, .08); }
.as-cb-t__msg.is-io { align-self: flex-end; border-radius: calc(19 * var(--u)) calc(19 * var(--u)) calc(6 * var(--u)) calc(19 * var(--u)); background: #1F4FD8; color: #fff; text-wrap: balance; }
.as-cb-t__scrive { display: flex; gap: calc(4 * var(--u)); padding: calc(13 * var(--u)) calc(14 * var(--u)); border-radius: calc(19 * var(--u)) calc(19 * var(--u)) calc(19 * var(--u)) calc(6 * var(--u)); background: #fff; box-shadow: 0 calc(1 * var(--u)) calc(2 * var(--u)) rgba(15, 15, 16, .06), 0 0 0 calc(.5 * var(--u)) rgba(15, 15, 16, .08); }
.as-cb-t__scrive i { width: calc(7 * var(--u)); height: calc(7 * var(--u)); border-radius: 50%; background: #A8A6A0; animation: as-cb-puntino 1s ease-in-out infinite; }
.as-cb-t__scrive i:nth-child(2) { animation-delay: .15s; }
.as-cb-t__scrive i:nth-child(3) { animation-delay: .3s; }
@keyframes as-cb-puntino { 0%, 60%, 100% { transform: none; opacity: .5; } 30% { transform: translateY(calc(-3 * var(--u))); opacity: 1; } }

/* la scheda dell'auto con la rata */
.as-cb-t__scheda { width: calc(90% - calc(33 * var(--u))); overflow: hidden; border-radius: calc(18 * var(--u)); background: #fff; box-shadow: 0 calc(8 * var(--u)) calc(20 * var(--u)) calc(-10 * var(--u)) rgba(15, 15, 16, .3), 0 0 0 calc(.5 * var(--u)) rgba(15, 15, 16, .08); }
.as-cb-t__scheda-foto { position: relative; display: block; height: calc(104 * var(--u)); background-color: #cfcac0; background-size: cover; background-position: 50% 58%; }
.as-cb-t__scheda-foto b { position: absolute; left: calc(10 * var(--u)); top: calc(10 * var(--u)); display: inline-flex; align-items: center; gap: calc(5 * var(--u)); padding: calc(4 * var(--u)) calc(9 * var(--u)) calc(4 * var(--u)) calc(7 * var(--u)); border-radius: 999px; background: rgba(255, 255, 255, .95); color: #1E7A45; font-size: calc(11.5 * var(--u)); font-weight: 600; }
.as-cb-t__scheda-foto b::before { content: ""; width: calc(6 * var(--u)); height: calc(6 * var(--u)); border-radius: 50%; background: #34A065; }
.as-cb-t__scheda-c { padding: calc(11 * var(--u)) calc(13 * var(--u)) calc(13 * var(--u)); }
.as-cb-t__scheda-h { display: flex; align-items: baseline; justify-content: space-between; gap: calc(8 * var(--u)); font-size: calc(15 * var(--u)); font-weight: 600; letter-spacing: -.015em; }
.as-cb-t__scheda-h b { font-weight: 600; color: rgba(15, 15, 16, .6); font-size: calc(13.5 * var(--u)); }
.as-cb-t__rata { display: grid; margin-top: calc(10 * var(--u)) !important; padding: calc(10 * var(--u)) calc(12 * var(--u)); border-radius: calc(12 * var(--u)); background: #EEF2FD; }
.as-cb-t__rata small { font-size: calc(12 * var(--u)); color: rgba(15, 15, 16, .6); }
.as-cb-t__rata b { margin: calc(2 * var(--u)) 0 !important; font-size: calc(26 * var(--u)); font-weight: 700; letter-spacing: -.03em; color: #1F4FD8; font-variant-numeric: tabular-nums; }
.as-cb-t__rata b span { font-size: calc(14 * var(--u)); font-weight: 500; letter-spacing: -.01em; }

/* gli orari di sabato */
.as-cb-t__orari { display: flex; gap: calc(6 * var(--u)); width: calc(90% - calc(33 * var(--u))); margin-left: calc(33 * var(--u)) !important; }
.as-cb-t__orari span { position: relative; flex: 1; padding: calc(8 * var(--u)) 0; border-radius: calc(11 * var(--u)); background: #fff; box-shadow: inset 0 0 0 calc(1 * var(--u)) rgba(31, 79, 216, .3); color: #1F4FD8; font-size: calc(14 * var(--u)); font-weight: 600; text-align: center; font-variant-numeric: tabular-nums; transition: background .25s ease, color .25s ease, box-shadow .25s ease; }
.as-cb-t__orari .is-preso { color: rgba(15, 15, 16, .3); box-shadow: inset 0 0 0 calc(1 * var(--u)) rgba(15, 15, 16, .1); text-decoration: line-through; }
.as-cb.is-ora .as-cb-t__orari .is-scelto { background: #1F4FD8; color: #fff; box-shadow: none; }
.as-cb-t__bot .as-cb-t__orari { margin-left: 0 !important; }

/* la prova fissata */
.as-cb-t__fatto { width: calc(90% - calc(33 * var(--u))); padding: calc(12 * var(--u)) calc(14 * var(--u)) calc(14 * var(--u)); border-radius: calc(18 * var(--u)); background: #fff; box-shadow: 0 calc(8 * var(--u)) calc(20 * var(--u)) calc(-10 * var(--u)) rgba(15, 15, 16, .3), 0 0 0 calc(.5 * var(--u)) rgba(15, 15, 16, .08); }
.as-cb-t__fatto-h { display: flex; align-items: center; gap: calc(7 * var(--u)); margin-bottom: calc(6 * var(--u)) !important; font-size: calc(12.5 * var(--u)); font-weight: 600; color: #1E7A45; }
.as-cb-t__fatto-ok { display: grid; place-items: center; width: calc(19 * var(--u)); height: calc(19 * var(--u)); border-radius: 50%; background: #34A065; color: #fff; }
.as-cb-t__fatto-ok .as-k-chat__ic { width: calc(15 * var(--u)); height: calc(15 * var(--u)); }
.as-cb-t__fatto-q { margin-bottom: calc(10 * var(--u)) !important; font-size: calc(19 * var(--u)); font-weight: 600; line-height: 1.15; letter-spacing: -.02em; }
.as-cb-t__fatto-chi { display: flex; align-items: center; gap: calc(9 * var(--u)); font-size: calc(13 * var(--u)); line-height: 1.3; }
.as-cb-t__volto { flex: none; width: calc(34 * var(--u)); height: calc(34 * var(--u)); border-radius: 50%; object-fit: cover; }
.as-cb-t__fatto-chi small { display: block; font-size: calc(11.5 * var(--u)); color: rgba(15, 15, 16, .55); }

/* il campo: cresce con quello che si scrive, come i campi delle chat vere */
.as-cb-t__piede { flex: none; padding: calc(8 * var(--u)) calc(10 * var(--u)) calc(7 * var(--u)); background: #fff; box-shadow: 0 calc(-.5 * var(--u)) 0 rgba(15, 15, 16, .1); }
.as-cb-t__campo { display: flex; align-items: flex-end; gap: calc(8 * var(--u)); }
.as-cb-t__campo-t { position: relative; flex: 1; min-width: 0; min-height: calc(38 * var(--u)); padding: calc(9 * var(--u)) calc(14 * var(--u)); border-radius: calc(19 * var(--u)); background: #F1EFE8; font-size: calc(15 * var(--u)); line-height: 1.33; letter-spacing: -.012em; }
.as-cb-t__segna { color: rgba(15, 15, 16, .4); white-space: nowrap; }
.as-cb-t__digita { display: none; color: #0F0F10; }
.as-cb.is-digita .as-cb-t__segna { display: none; }
.as-cb.is-digita .as-cb-t__digita { display: inline; }
.as-cb.is-digita .as-cb-t__digita::after { content: ""; display: inline-block; width: calc(2 * var(--u)); height: calc(18 * var(--u)); margin-left: calc(1 * var(--u)); vertical-align: calc(-3 * var(--u)); border-radius: 1px; background: #1F4FD8; animation: as-cb-cursore 1s steps(1) infinite; }
@keyframes as-cb-cursore { 50% { opacity: 0; } }
.as-cb-t__invia { flex: none; display: grid; place-items: center; width: calc(38 * var(--u)); height: calc(38 * var(--u)); border-radius: 50%; background: #1F4FD8; color: #fff; transition: opacity .2s ease; }
.as-cb:not(.is-digita) .as-cb-t__invia { opacity: .45; }
.as-cb-t__invia .as-k-chat__ic { width: calc(20 * var(--u)); height: calc(20 * var(--u)); }
.as-cb-t__firma { margin-top: calc(6 * var(--u)) !important; text-align: center; font-size: calc(10.5 * var(--u)); color: rgba(15, 15, 16, .4); }

/* la tastiera di iOS 26: esce solo mentre Giorgio scrive */
.as-cb-t__tastiera { position: absolute; z-index: 11; left: 0; right: 0; bottom: 0; height: calc(300 * var(--u)); padding: calc(6 * var(--u)) calc(3 * var(--u)) 0; border-radius: calc(30 * var(--u)) calc(30 * var(--u)) 0 0; background: #D6D8DE; box-shadow: 0 calc(-.5 * var(--u)) 0 rgba(0, 0, 0, .1); color: #000; transform: translateY(105%); transition: transform .38s cubic-bezier(.2, .8, .2, 1); }
.as-cb.is-tastiera .as-cb-t__tastiera { transform: none; }
.as-cb-t__sugg { display: flex; height: calc(40 * var(--u)); margin: 0 calc(8 * var(--u)) calc(6 * var(--u)) !important; }
.as-cb-t__sugg span { flex: 1; display: grid; place-items: center; font-size: calc(16 * var(--u)); }
.as-cb-t__sugg span + span { box-shadow: calc(-.5 * var(--u)) 0 0 rgba(0, 0, 0, .16); }
.as-cb-t__fila { display: flex; justify-content: center; gap: calc(6 * var(--u)); margin-bottom: calc(11 * var(--u)) !important; }
.as-cb-t__fila span { display: grid; place-items: center; width: calc(33.6 * var(--u)); height: calc(42 * var(--u)); border-radius: calc(9 * var(--u)); background: #fff; box-shadow: 0 calc(1 * var(--u)) 0 rgba(0, 0, 0, .26); font-size: calc(22 * var(--u)); line-height: 1; }
.as-cb-t__fila.is-2 { padding: 0 calc(18 * var(--u)); }
.as-cb-t__fila .is-mod { width: calc(44 * var(--u)); background: #B8BDC6; font-size: calc(15 * var(--u)); }
.as-cb-t__fila .is-maiusc { margin-right: calc(10 * var(--u)); }
.as-cb-t__fila .is-canc { margin-left: calc(10 * var(--u)); }
.as-cb-t__fila.is-4 .is-mod { width: calc(88 * var(--u)); }
.as-cb-t__fila .is-spazio { flex: 1; max-width: calc(192 * var(--u)); font-size: calc(15 * var(--u)); }

/* la barra di Safari di iOS 26, layout Compatto: tre vetri chiari sospesi sopra la pagina */
.as-cb-t__safari { position: absolute; z-index: 10; left: calc(14 * var(--u)); right: calc(14 * var(--u)); bottom: calc(22 * var(--u)); display: flex; align-items: center; gap: calc(8 * var(--u)); height: calc(48 * var(--u)); }
.as-cb-t__sf-tondo, .as-cb-t__sf-indirizzo { height: calc(48 * var(--u)); border-radius: calc(24 * var(--u)); background: rgba(255, 255, 255, .82); box-shadow: inset 0 calc(.8 * var(--u)) 0 rgba(255, 255, 255, .9), 0 0 0 calc(.5 * var(--u)) rgba(15, 15, 16, .1), 0 calc(8 * var(--u)) calc(22 * var(--u)) calc(-8 * var(--u)) rgba(15, 15, 16, .35); color: #111; }
.as-cb-t__sf-tondo { flex: none; display: grid; place-items: center; width: calc(48 * var(--u)); }
.as-cb-t__sf-tondo .as-k-chat__ic { width: calc(22 * var(--u)); height: calc(22 * var(--u)); }
.as-cb-t__sf-indirizzo { flex: 1; display: flex; align-items: center; justify-content: center; gap: calc(5 * var(--u)); font-size: calc(16 * var(--u)); letter-spacing: -.012em; }
.as-cb-t__sf-indirizzo .as-cb-ic { width: calc(13 * var(--u)); height: calc(13 * var(--u)); opacity: .7; }

/* il dito: il polpastrello dei video Apple, un disco di vetro piatto */
.as-cb-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, 200px), var(--ty, 600px)) scale(.7); transition: transform .55s cubic-bezier(.45, 0, .2, 1), opacity .25s ease; }
.as-cb-dito.is-su { opacity: 1; transform: translate(var(--tx, 200px), var(--ty, 600px)); }
.as-cb-dito.is-premi { animation: as-cb-premi .42s ease; }
@keyframes as-cb-premi { 40% { transform: translate(var(--tx), var(--ty)) scale(.8); background: rgba(255, 255, 255, .75); } }

/* ══ IL MAC DI MATTEO: Google Calendar in Chrome (la cornice è quella della posta, .as-gm__) ══ */
.as-cb-c { --c-bordo: #DDE1E6; --c-pavone: #039BE5; --c-basilico: #0B8043; --c-mandarino: #F4511E; --c-mirtillo: #3F51B5; background: #F8FAFD; }
.as-cb-c__fav-ab { background: #F1EFE8; color: #0F0F10; }
.as-cb-c__fav-ab .as-cb-segno { width: 90%; height: auto; }
.as-cb-c__ic-cal { display: block; flex: none; width: 100%; height: 100%; }
.as-cb-c__cal { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; background: #F8FAFD; }
.as-cb-c__testa { flex: none; display: flex; align-items: center; height: calc(64 * var(--q)); padding: 0 calc(12 * var(--q)) 0 calc(16 * var(--q)); color: var(--g-grigio); }
.as-cb-c__marchio { flex: none; display: flex; align-items: center; gap: calc(16 * var(--q)); width: calc(238 * var(--q)); }
.as-cb-c__marchio > .as-gm__ic { width: calc(24 * var(--q)); height: calc(24 * var(--q)); }
.as-cb-c__logo { display: flex; align-items: center; gap: calc(8 * var(--q)); }
.as-cb-c__logo .as-cb-c__ic-cal { width: calc(40 * var(--q)); height: calc(40 * var(--q)); }
.as-cb-c__logo b { font-size: calc(22 * var(--q)); font-weight: 400; color: #444746; }
.as-cb-c__naviga { display: flex; align-items: center; gap: calc(14 * var(--q)); }
.as-cb-c__oggi { display: inline-flex; align-items: center; height: calc(36 * var(--q)); padding: 0 calc(16 * var(--q)); border-radius: 999px; box-shadow: inset 0 0 0 1px #747775; font-size: calc(14 * var(--q)); font-weight: 500; color: var(--g-testo); }
.as-cb-c__naviga .as-gm__ic { width: calc(22 * var(--q)); height: calc(22 * var(--q)); }
.as-cb-c__naviga b { margin-left: calc(6 * var(--q)); font-size: calc(22 * var(--q)); font-weight: 400; color: var(--g-testo); }
.as-cb-c__attrezzi { display: flex; align-items: center; gap: calc(18 * var(--q)); margin-left: auto; }
.as-cb-c__attrezzi > .as-gm__ic { width: calc(22 * var(--q)); height: calc(22 * var(--q)); }
.as-cb-c__vista { display: inline-flex; align-items: center; gap: calc(6 * var(--q)); height: calc(36 * var(--q)); padding: 0 calc(10 * var(--q)) 0 calc(16 * var(--q)); border-radius: 999px; box-shadow: inset 0 0 0 1px #747775; font-size: calc(14 * var(--q)); font-weight: 500; color: var(--g-testo); }
.as-cb-c__vista .as-gm__ic { width: calc(18 * var(--q)); height: calc(18 * var(--q)); }
.as-cb-c__corpo { flex: 1; min-height: 0; display: flex; }

.as-cb-c__lato { flex: none; width: calc(256 * var(--q)); padding: 0 calc(16 * var(--q)) 0 calc(8 * var(--q)); }
.as-cb-c__crea { display: inline-flex; align-items: center; gap: calc(12 * var(--q)); height: calc(56 * var(--q)); margin: calc(8 * var(--q)) 0 calc(20 * var(--q)) calc(8 * var(--q)); padding: 0 calc(16 * var(--q)) 0 calc(16 * var(--q)); border-radius: calc(16 * var(--q)); background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .3), 0 calc(4 * var(--q)) calc(8 * var(--q)) calc(3 * var(--q)) rgba(0, 0, 0, .15); font-size: calc(14 * var(--q)); font-weight: 500; color: var(--g-testo); }
.as-cb-c__crea .as-gm__ic.is-piu { width: calc(24 * var(--q)); height: calc(24 * var(--q)); color: #1A73E8; stroke-width: 2.4; }
.as-cb-c__crea .as-gm__ic.is-giu { width: calc(18 * var(--q)); height: calc(18 * var(--q)); margin-left: calc(10 * var(--q)); }
.as-cb-c__mini { padding: 0 calc(6 * var(--q)) 0 calc(14 * var(--q)); }
.as-cb-c__mini-t { display: flex; align-items: center; gap: calc(14 * var(--q)); margin-bottom: calc(6 * var(--q)) !important; font-size: calc(14 * var(--q)); color: var(--g-testo); }
.as-cb-c__mini-t b { flex: 1; font-weight: 500; }
.as-cb-c__mini-t .as-gm__ic { width: calc(18 * var(--q)); height: calc(18 * var(--q)); color: var(--g-grigio); }
.as-cb-c__mini-g { display: grid; grid-template-columns: repeat(7, 1fr); row-gap: calc(2 * var(--q)); }
.as-cb-c__mini-g span { display: grid; place-items: center; height: calc(26 * var(--q)); font-size: calc(10.5 * var(--q)); color: var(--g-testo); font-variant-numeric: tabular-nums; }
.as-cb-c__mini-g .is-gs { font-weight: 500; color: #70757A; }
.as-cb-c__mini-g .is-fuori { color: #70757A; }
.as-cb-c__mini-g .is-sett { background: #D3E3FD; }
.as-cb-c__mini-g .is-sett:nth-child(15) { border-radius: 999px 0 0 999px; }
.as-cb-c__mini-g .is-sett:nth-child(21) { border-radius: 0 999px 999px 0; }
.as-cb-c__mini-g .is-oggi { position: relative; background: #D3E3FD; color: #fff; font-weight: 500; }
.as-cb-c__mini-g .is-oggi::before { content: ""; position: absolute; z-index: -1; width: calc(24 * var(--q)); height: calc(24 * var(--q)); border-radius: 50%; background: #0B57D0; }
.as-cb-c__mini-g .is-oggi { isolation: isolate; }
.as-cb-c__cal-h { display: flex; align-items: center; justify-content: space-between; margin: calc(22 * var(--q)) 0 calc(4 * var(--q)) calc(14 * var(--q)) !important; font-size: calc(14 * var(--q)); font-weight: 500; color: var(--g-testo); }
.as-cb-c__cal-h .as-gm__ic { width: calc(18 * var(--q)); height: calc(18 * var(--q)); transform: rotate(180deg); }
.as-cb-c__cal-v { display: flex; align-items: center; gap: calc(14 * var(--q)); height: calc(32 * var(--q)); padding-left: calc(18 * var(--q)); font-size: calc(14 * var(--q)); color: var(--g-testo); }
.as-cb-c__cal-v i { position: relative; flex: none; width: calc(17 * var(--q)); height: calc(17 * var(--q)); border-radius: calc(3 * var(--q)); background: var(--c); }
.as-cb-c__cal-v i::after { content: ""; position: absolute; left: 32%; top: 14%; width: 26%; height: 52%; border: solid #fff; border-width: 0 calc(2 * var(--q)) calc(2 * var(--q)) 0; transform: rotate(45deg); }
.as-cb-c :is(.is-pavone) { --c: var(--c-pavone); }
.as-cb-c :is(.is-basilico) { --c: var(--c-basilico); }
.as-cb-c :is(.is-mandarino) { --c: var(--c-mandarino); }
.as-cb-c :is(.is-mirtillo) { --c: var(--c-mirtillo); }

/* la settimana: la carta bianca con gli angoli tondi, i giorni, le ore da 48 punti */
.as-cb-c__griglia { flex: 1; min-width: 0; display: flex; flex-direction: column; overflow: hidden; border-radius: calc(24 * var(--q)) calc(24 * var(--q)) 0 0; background: #fff; }
.as-cb-c__giorni { position: relative; flex: none; display: flex; height: calc(86 * var(--q)); padding-left: calc(56 * var(--q)); box-shadow: 0 1px 0 var(--c-bordo); }
.as-cb-c__fuso { position: absolute; left: calc(8 * var(--q)); bottom: calc(6 * var(--q)); font-size: calc(10 * var(--q)); color: #70757A; }
.as-cb-c__giorno { flex: 1; display: grid; justify-items: center; align-content: center; gap: calc(4 * var(--q)); box-shadow: -1px 0 0 var(--c-bordo); }
.as-cb-c__giorno small { font-size: calc(11 * var(--q)); font-weight: 500; letter-spacing: .06em; color: var(--g-grigio); }
.as-cb-c__giorno b { display: grid; place-items: center; width: calc(46 * var(--q)); height: calc(46 * var(--q)); border-radius: 50%; font-size: calc(25 * var(--q)); font-weight: 400; color: var(--g-testo); }
.as-cb-c__giorno.is-oggi small { color: #0B57D0; }
.as-cb-c__giorno.is-oggi b { background: #0B57D0; color: #fff; }
.as-cb-c__ore { position: relative; flex: 1; display: flex; }
.as-cb-c__orario { position: relative; flex: none; width: calc(56 * var(--q)); }
.as-cb-c__orario span { position: absolute; right: calc(8 * var(--q)); top: calc(var(--h) * 48 * var(--q) - 7 * var(--q)); font-size: calc(10 * var(--q)); color: #70757A; font-variant-numeric: tabular-nums; }
.as-cb-c__colonne { flex: 1; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); background-image: linear-gradient(var(--c-bordo) 1px, transparent 1px); background-size: 100% calc(48 * var(--q)); }
.as-cb-c__col { position: relative; box-shadow: -1px 0 0 var(--c-bordo); }
.as-cb-c__ev { position: absolute; left: calc(1 * var(--q)); right: calc(8 * var(--q)); top: calc(var(--da) * 48 * var(--q) + 1px); height: calc(var(--dur) * 48 * var(--q) - 2px); overflow: hidden; padding: calc(3 * var(--q)) calc(7 * var(--q)); border-radius: calc(5 * var(--q)); background: var(--c); color: #fff; font-size: calc(11.5 * var(--q)); line-height: 1.25; }
.as-cb-c__ev b { display: block; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.as-cb-c__ev span { display: block; opacity: .92; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.as-cb-c__ev.is-nuovo { z-index: 2; transition: opacity .4s ease, transform .55s cubic-bezier(.34, 1.56, .64, 1), box-shadow .3s ease; }
.as-cb:not(.is-evento) .as-cb-c__ev.is-nuovo { opacity: 0; transform: scale(.85); }
.as-cb.is-evento .as-cb-c__ev.is-nuovo { animation: as-cb-nuovo 1.6s ease-out .3s 2; }
.as-cb.is-dettaglio .as-cb-c__ev.is-nuovo { box-shadow: 0 calc(6 * var(--q)) calc(12 * var(--q)) rgba(11, 128, 67, .35), 0 0 0 calc(2 * var(--q)) #fff; }
@keyframes as-cb-nuovo { 0% { box-shadow: 0 0 0 0 rgba(11, 128, 67, .55); } 100% { box-shadow: 0 0 0 calc(14 * var(--q)) rgba(11, 128, 67, 0); } }
.as-cb-c__adesso { position: absolute; z-index: 3; left: 0; right: 0; top: calc(var(--da) * 48 * var(--q)); height: calc(2 * var(--q)); background: #EA4335; }
.as-cb-c__adesso::before { content: ""; position: absolute; left: calc(-6 * var(--q)); top: calc(-5 * var(--q)); width: calc(12 * var(--q)); height: calc(12 * var(--q)); border-radius: 50%; background: #EA4335; }
.as-cb-c__rail { padding-top: calc(10 * var(--q)); }

/* il dettaglio dell'evento: la carta di Calendar, a sinistra del sabato */
.as-cb-c__pop { position: absolute; z-index: 6; left: calc(500 * var(--q)); top: calc(120 * var(--q)); width: calc(456 * var(--q)); padding-bottom: calc(14 * var(--q)); border-radius: calc(24 * var(--q)); background: #F0F4F9; color: var(--g-testo); box-shadow: 0 calc(4 * var(--q)) calc(8 * var(--q)) calc(3 * var(--q)) rgba(0, 0, 0, .15), 0 1px 3px rgba(0, 0, 0, .3); transform-origin: 100% 50%; transition: opacity .3s ease, transform .45s cubic-bezier(.2, .9, .25, 1); }
.as-cb:not(.is-dettaglio) .as-cb-c__pop { opacity: 0; transform: scale(.94) translateX(calc(10 * var(--q))); }
.as-cb-c__pop-attrezzi { display: flex; align-items: center; justify-content: flex-end; gap: calc(20 * var(--q)); padding: calc(14 * var(--q)) calc(18 * var(--q)) calc(4 * var(--q)); color: var(--g-grigio); }
.as-cb-c__pop-attrezzi .as-gm__ic { width: calc(20 * var(--q)); height: calc(20 * var(--q)); }
.as-cb-c__pop-x { display: block; }
.as-cb-c__pop-r { display: grid; grid-template-columns: calc(40 * var(--q)) minmax(0, 1fr); align-items: start; padding: calc(7 * var(--q)) calc(24 * var(--q)) calc(7 * var(--q)) calc(22 * var(--q)); font-size: calc(14 * var(--q)); line-height: 1.43; }
.as-cb-c__pop-r > .as-cb-ic, .as-cb-c__pop-r > .as-gm__ic { width: calc(20 * var(--q)); height: calc(20 * var(--q)); color: var(--g-grigio); }
.as-cb-c__pop-r .is-tenue { font-size: calc(12.5 * var(--q)); color: var(--g-grigio); }
.as-cb-c__pop-r.is-titolo { align-items: start; padding-bottom: calc(10 * var(--q)); }
.as-cb-c__pop-colore { display: block; width: calc(16 * var(--q)); height: calc(16 * var(--q)); margin-top: calc(8 * var(--q)); border-radius: calc(4 * var(--q)); background: var(--c-basilico); }
.as-cb-c__pop-h { font-size: calc(22 * var(--q)); line-height: 1.3; }
.as-cb-c__pop-r.is-titolo p + p { color: var(--g-grigio); }
.as-cb-c__pop-chi { display: flex; align-items: center; gap: calc(10 * var(--q)); margin-top: calc(8 * var(--q)) !important; }
.as-cb-c__pop-chi small { margin-left: auto; font-size: calc(12 * var(--q)); color: var(--g-grigio); }
.as-cb-c__pop-av { flex: none; width: calc(28 * var(--q)); height: calc(28 * var(--q)); overflow: hidden; border-radius: 50%; }
.as-cb-c__pop-av img { display: block; width: 100%; height: 100%; object-fit: cover; }
.as-cb-c__pop-r.is-nota p { font-size: calc(13.5 * var(--q)); }
.as-cb-c__pop-r.is-nota p + p { margin-top: calc(4 * var(--q)) !important; }
.as-cb-c__pop-da { display: inline-flex; align-items: center; gap: calc(6 * var(--q)); margin-bottom: calc(2 * var(--q)) !important; padding: calc(3 * var(--q)) calc(10 * var(--q)) calc(3 * var(--q)) calc(7 * var(--q)); border-radius: 999px; background: #D3E3FD; color: #0B57D0; font-weight: 500; font-size: calc(12.5 * var(--q)) !important; }
.as-cb-c__pop-da .as-k-chat__ic { width: calc(15 * var(--q)); height: calc(15 * var(--q)); }
.as-cb-c__pop-link { color: #0B57D0; font-weight: 500; }

/* ══ LA SEZIONE (site/prova, demo «salone»): titolo, la scena, i capitoli sotto (come la posta) ══ */
.as-prova--salone .as-prova__demo { display: block; padding: 0; border-radius: 0; background: none; overflow: visible; }
@media (min-width: 1000px) {
	.as-prova--salone .as-prova__testa { display: block; }
	.as-prova--salone .as-prova__titolo { max-width: none; }
}