/*
 * Studio Arfia · caso «Eventi su Excel» · v0.97 · 04/11/2026 (inc/casi/eventi.php)
 * Il telefono dello scanner (markup e stile di demo.css, .as-demo--eventi) con la sua corsa da una volta, e accanto l'iPad
 * fotografico vero del kit, FERMO (Rami, 04/11: «non farla animata, usa un mockup di iPad reale»): solo l'immagine composta.
 * Sotto, l'app dell'organizzatore per la pagina nuda (si fotografa e si monta): misure vere di iPad (834 × 1194 punti,
 * --u = 1/834), la cura di un'app di alta gamma: copertina con la foto della villa e il titolo grande di iPadOS (SF Pro bold;
 * fino alla v0.97 era in Instrument Serif), riepilogo sobrio, Giulia Ferri in una sezione sua, colori di sistema e uno solo della villa.
 */

/* ── La scena ── */
.as-k-eventi { container-type: inline-size; display: flex; align-items: flex-end; justify-content: center; gap: 3.6cqw; width: 100%; padding-bottom: 1.4cqw; }
/* Le proporzioni: l'iPad più grande del telefono (dal vero sarebbe 1,7 volte; qui 1,3, perché il telefono resti leggibile) */
.as-k-eventi .as-k-eventi__tel .as-app-tel { flex: none; margin: 0; font-size: calc(30cqw / 19); }
.as-k-eventi__tel { flex: none; }
.as-k-eventi__ipad { position: relative; flex: none; width: 58.6cqw; margin: 0; }
.as-k-eventi__ipad > img { display: block; width: 100%; height: auto; filter: drop-shadow(0 22px 26px rgba(40, 30, 70, .26)) drop-shadow(0 4px 6px rgba(20, 20, 30, .16)); }

/* Gli angoli dello schermo (Rami, 04/11, scatto dall'iPhone: «il mockup dentro l'iPhone esce in alto fuori dall'iPhone, come
   vedi dagli angoli»). In Safari su iPhone un figlio con backdrop-filter (la testata in vetro dello scanner) sfugge al taglio
   arrotondato di overflow: hidden del genitore, e i suoi angoli quadrati sporgono. Due cure insieme: lo schermo taglia con
   clip-path (che in WebKit taglia anche i vetri), e testata, lampo e foglio hanno gli stessi raggi dello schermo (62 punti
   del telefono = 60,6 nelle unità dell'app, che contano 393 punti sulla stessa larghezza), così anche senza taglio combaciano. */
.as-k-eventi .as-iphone__schermo { clip-path: inset(0 round calc(62 * var(--u))); }
.as-k-eventi .as-ev__barra { border-radius: calc(60.6 * var(--u)) calc(60.6 * var(--u)) 0 0; }
.as-k-eventi .as-ev__lampo { border-radius: calc(60.6 * var(--u)); }
.as-k-eventi .as-ev__esito { border-radius: calc(22 * var(--u)) calc(22 * var(--u)) calc(60.6 * var(--u)) calc(60.6 * var(--u)); }

/* ── La corsa del telefono: UNA volta, all'apertura della tab (regola del 03/11) ──
   Al posto del giro infinito di demo.css: mira 0,4-2 s, lampo 2,05 s, foglio verde 2,2-2,85 s, 98 a 2,6 s. L'iPad non si muove. */
/* via i giri infiniti di demo.css (specificità 0,4,0: le corse qui sotto, uguali e dopo, vincono) */
.as-demo-vivo .as-k-eventi .as-demo--eventi :is(.as-ev__camera, .as-ev__mirino, .as-ev__lampo, .as-ev__esito, .as-ev__aiuto, .as-ev__tasti) { animation: none; }
.as-demo-vivo .as-k-eventi .as-demo--eventi .as-ev__camera { animation: as-k-ev-cam 1.6s cubic-bezier(.3, 0, .2, 1) .4s 1 both; }
.as-demo-vivo .as-k-eventi .as-demo--eventi .as-ev__mirino { animation: as-k-ev-aggancia 1.2s ease-out 1.8s 1 both; }
.as-demo-vivo .as-k-eventi .as-demo--eventi .as-ev__lampo { animation: as-k-ev-lampo .5s ease-out 2.05s 1 both; }
.as-demo-vivo .as-k-eventi .as-demo--eventi .as-ev__esito.is-ok { animation: as-k-ev-ok .65s cubic-bezier(.2, .9, .3, 1.12) 2.2s 1 both; }
.as-demo-vivo .as-k-eventi .as-demo--eventi :is(.as-ev__aiuto, .as-ev__tasti) { animation: as-k-ev-aiuto 2.2s linear 0s 1 both; }
.as-demo-vivo .as-k-eventi .as-demo--eventi .as-ev__num > .is-prima { animation: as-k-ev-via .01s linear 2.6s 1 both; }
.as-demo-vivo .as-k-eventi .as-demo--eventi .as-ev__num > .is-dopo { animation: as-k-ev-su .01s linear 2.6s 1 both; }
@keyframes as-k-ev-cam { from { transform: scale(.93) translate(calc(10 * var(--u)), calc(14 * var(--u))); } to { transform: none; } }
@keyframes as-k-ev-aggancia { 0% { transform: none; } 18%, 55% { transform: scale(.93); } 100% { transform: none; } }
@keyframes as-k-ev-lampo { 0% { opacity: 0; } 12% { opacity: .75; } 100% { opacity: 0; } }
@keyframes as-k-ev-ok { from { transform: translateY(104%); } to { transform: none; } }
@keyframes as-k-ev-aiuto { 0%, 92% { opacity: 1; } 100% { opacity: 0; } }
@keyframes as-k-ev-via { from { opacity: 1; } to { opacity: 0; } }
@keyframes as-k-ev-su { from { opacity: 0; } to { opacity: 1; } }

/* ── La schermata da fotografare (pagina nuda) ──
   v0.98 (Rami: «ancora più premium»): stessa struttura, più cura. Tipografia di sistema con le scale vere di iPadOS (titolo
   grande 40 bold, intestazioni 15 semibold, corpo 17, note 13,5), grigi di sistema per i testi secondari, più aria tra i
   blocchi, la barra delle schede in vetro di iPadOS 26 sopra la foto, i volti degli ospiti, gli stati piccoli sotto l'ora. */
.as-k-eventi-schermo { position: relative; overflow: hidden; container-type: inline-size; }
.as-k-eventi-app {
	--u: calc(100cqw / 834);
	--villa: #7A2233;
	--ink: #1C1C1E;
	--sec: rgba(60, 60, 67, .62);
	--ter: rgba(60, 60, 67, .36);
	--sep: rgba(60, 60, 67, .14);
	--carta: #F9F7F5;
	position: absolute;
	inset: 0;
	overflow: hidden;
	background: var(--carta);
	color: var(--ink);
	font-family: -apple-system, 'SF Pro Text', system-ui, 'Helvetica Neue', Arial, sans-serif;
	font-size: calc(17 * var(--u));
	line-height: 1.29;
	letter-spacing: -.022em;
	font-variant-numeric: tabular-nums;
	-webkit-font-smoothing: antialiased;
}
.as-k-eventi-app p { margin: 0; }
.as-k-eventi-app :is(b, small, em, i, u) { font-style: normal; text-decoration: none; }
.as-k-eventi-app img { display: block; width: 100%; height: 100%; object-fit: cover; }
.as-k-eventi-app svg { display: block; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* La copertina della serata */
.as-k-eventi-app__copertina { position: relative; height: calc(440 * var(--u)); overflow: hidden; color: #fff; }
.as-k-eventi-app__copertina > img { position: absolute; inset: 0; object-position: 50% 22%; }
.as-k-eventi-app__copertina::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10, 12, 10, .6) 0%, rgba(10, 12, 10, .16) 14%, rgba(10, 12, 10, 0) 28%, rgba(10, 12, 10, .04) 46%, rgba(10, 12, 10, .8) 100%); }
.as-k-eventi-app__copertina > * { position: relative; z-index: 1; }
.as-k-eventi-app__stato { display: flex; align-items: center; justify-content: space-between; height: calc(24 * var(--u)); padding: 0 calc(22 * var(--u)) 0 calc(24 * var(--u)); font-size: calc(15 * var(--u)); letter-spacing: -.01em; text-shadow: 0 1px 8px rgba(0, 0, 0, .6), 0 0 2px rgba(0, 0, 0, .3); }
.as-k-eventi-app__stato > span:first-child { display: flex; gap: calc(7 * var(--u)); font-weight: 500; }
.as-k-eventi-app__stato > span:first-child b { font-weight: 600; }
.as-k-eventi-app__icone { display: flex; align-items: center; gap: calc(6 * var(--u)); }
.as-k-eventi-app__icone b { font-size: calc(14 * var(--u)); font-weight: 600; }
.as-k-eventi-app__icone svg { height: calc(12 * var(--u)); width: auto; fill: #fff; stroke: #fff; }
.as-k-eventi-app__icone svg:first-child circle { stroke: none; }
.as-k-eventi-app__icone svg:last-child { height: calc(13 * var(--u)); stroke: none; }
.as-k-eventi-app__icone svg:last-child .is-guscio { fill: none; stroke: rgba(255, 255, 255, .5); }
.as-k-eventi-app__icone svg:last-child .is-nasello { fill: rgba(255, 255, 255, .5); }
/* la barra: il ritorno, la barra delle schede di iPadOS 26 al centro, «Scansiona»: tutto in vetro sopra la foto */
.as-k-eventi-app__barra { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: calc(60 * var(--u)); padding: 0 calc(22 * var(--u)); }
.as-k-eventi-app__vetro, .as-k-eventi-app__schede { -webkit-backdrop-filter: blur(16px) saturate(1.6); backdrop-filter: blur(16px) saturate(1.6); background: rgba(24, 24, 22, .26); box-shadow: inset 0 0 0 .5px rgba(255, 255, 255, .5), inset 0 1px 0 rgba(255, 255, 255, .4), 0 calc(6 * var(--u)) calc(18 * var(--u)) rgba(0, 0, 0, .12); }
.as-k-eventi-app__vetro { display: inline-flex; align-items: center; justify-self: end; gap: calc(7 * var(--u)); height: calc(44 * var(--u)); padding: 0 calc(17 * var(--u)) 0 calc(14 * var(--u)); border-radius: 999px; font-size: calc(16 * var(--u)); font-weight: 600; color: #fff; }
.as-k-eventi-app__vetro.is-tondo { justify-self: start; width: calc(44 * var(--u)); padding: 0; justify-content: center; }
.as-k-eventi-app__vetro svg { width: calc(20 * var(--u)); height: calc(20 * var(--u)); stroke-width: 2.1; }
.as-k-eventi-app__schede { display: flex; gap: calc(2 * var(--u)); padding: calc(4 * var(--u)); border-radius: 999px; }
.as-k-eventi-app__schede span { display: grid; place-items: center; height: calc(36 * var(--u)); padding: 0 calc(18 * var(--u)); border-radius: 999px; font-size: calc(15 * var(--u)); font-weight: 600; color: rgba(255, 255, 255, .92); }
.as-k-eventi-app__schede span.is-on { background: rgba(255, 255, 255, .92); color: var(--villa); }
/* il titolo grande di iPadOS e le due informazioni con le loro icone */
.as-k-eventi-app__titolo { position: absolute !important; left: calc(32 * var(--u)); right: calc(32 * var(--u)); bottom: calc(30 * var(--u)); }
.as-k-eventi-app__nome-serata { font-size: calc(40 * var(--u)); font-weight: 700; line-height: 1.12; letter-spacing: -.032em; text-shadow: 0 2px 20px rgba(0, 0, 0, .28); }
.as-k-eventi-app__dove { display: flex; gap: calc(20 * var(--u)); margin-top: calc(10 * var(--u)) !important; font-size: calc(15 * var(--u)); font-weight: 500; letter-spacing: -.012em; color: rgba(255, 255, 255, .9); }
.as-k-eventi-app__dove span { display: inline-flex; align-items: center; gap: calc(6 * var(--u)); }
.as-k-eventi-app__dove svg { width: calc(16 * var(--u)); height: calc(16 * var(--u)); stroke-width: 1.9; opacity: .9; }

/* Il corpo */
.as-k-eventi-app__corpo { padding: calc(28 * var(--u)) calc(32 * var(--u)) 0; }
.as-k-eventi-app__riepilogo { display: grid; grid-template-columns: repeat(4, 1fr); }
.as-k-eventi-app__riepilogo p { display: grid; gap: calc(3 * var(--u)); padding-left: calc(20 * var(--u)); border-left: .5px solid var(--sep); }
.as-k-eventi-app__riepilogo p:first-child { padding-left: 0; border-left: 0; }
.as-k-eventi-app__riepilogo b { font-size: calc(28 * var(--u)); font-weight: 600; line-height: 1.1; letter-spacing: -.035em; }
.as-k-eventi-app__riepilogo span { font-size: calc(13.5 * var(--u)); color: var(--sec); letter-spacing: -.005em; }
.as-k-eventi-app__progresso { position: relative; margin-top: calc(20 * var(--u)) !important; padding-top: calc(8 * var(--u)); }
.as-k-eventi-app__progresso::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: calc(3 * var(--u)); border-radius: 999px; background: rgba(60, 60, 67, .1); }
.as-k-eventi-app__progresso i { position: absolute; top: 0; left: 0; width: 76.6%; height: calc(3 * var(--u)); border-radius: 999px; background: var(--villa); }
.as-k-eventi-app__progresso span { display: block; text-align: right; font-size: calc(12.5 * var(--u)); color: var(--ter); }
.as-k-eventi-app__strumenti { display: grid; grid-template-columns: minmax(0, 1fr) calc(300 * var(--u)); gap: calc(12 * var(--u)); margin-top: calc(16 * var(--u)); }
.as-k-eventi-app__cerca { display: flex; align-items: center; gap: calc(7 * var(--u)); height: calc(38 * var(--u)); padding: 0 calc(12 * var(--u)); border-radius: 999px; background: rgba(118, 118, 128, .09); font-size: calc(16 * var(--u)); color: var(--ter); }
.as-k-eventi-app__cerca svg { width: calc(17 * var(--u)); height: calc(17 * var(--u)); stroke-width: 2.1; color: var(--sec); }
.as-k-eventi-app__seg { display: grid; grid-template-columns: repeat(3, 1fr); height: calc(38 * var(--u)); padding: calc(3 * var(--u)); border-radius: 999px; background: rgba(118, 118, 128, .09); }
.as-k-eventi-app__seg > span { display: grid; place-items: center; border-radius: 999px; font-size: calc(14 * var(--u)); font-weight: 500; color: #3A3A3C; }
.as-k-eventi-app__seg > span.is-on { background: #fff; font-weight: 600; color: var(--villa); box-shadow: 0 calc(2 * var(--u)) calc(8 * var(--u)) rgba(0, 0, 0, .07), 0 0 0 .5px rgba(0, 0, 0, .04); }
.as-k-eventi-app__sezione { display: flex; align-items: baseline; justify-content: space-between; margin: calc(28 * var(--u)) calc(4 * var(--u)) calc(10 * var(--u)) !important; font-size: calc(15 * var(--u)); font-weight: 600; letter-spacing: -.015em; color: var(--ink); }
.as-k-eventi-app__sezione span:last-child { font-size: calc(14 * var(--u)); font-weight: 400; color: var(--ter); }
.as-k-eventi-app__sezione.is-villa span:first-child { color: var(--villa); }
.as-k-eventi-app__sezione span.is-link { color: var(--villa); font-weight: 500; }
/* Giulia, appena entrata: una scheda sua; il filo verde sottile intorno al volto dice «adesso», senza effetti */
.as-k-eventi-app__appena { display: grid; grid-template-columns: calc(58 * var(--u)) minmax(0, 1fr) auto; align-items: center; column-gap: calc(16 * var(--u)); height: calc(90 * var(--u)); padding: 0 calc(22 * var(--u)) 0 calc(18 * var(--u)); border-radius: calc(20 * var(--u)); background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05), 0 calc(10 * var(--u)) calc(30 * var(--u)) calc(-14 * var(--u)) rgba(60, 30, 40, .2); }
.as-k-eventi-app__appena .as-k-eventi-app__av { width: calc(58 * var(--u)); height: calc(58 * var(--u)); box-shadow: 0 0 0 calc(2.5 * var(--u)) #fff, 0 0 0 calc(4.5 * var(--u)) #34C759; }
.as-k-eventi-app__appena .as-k-eventi-app__nome b { font-size: calc(20 * var(--u)); font-weight: 600; letter-spacing: -.025em; }
.as-k-eventi-app__appena .as-k-eventi-app__quando b { font-size: calc(17 * var(--u)); color: var(--ink); }
.as-k-eventi-app__quando small.is-ok { display: inline-flex; align-items: center; gap: calc(4 * var(--u)); color: #248A3D; font-weight: 500; }
.as-k-eventi-app__quando small.is-ok svg { width: calc(14 * var(--u)); height: calc(14 * var(--u)); stroke-width: 2.6; }
/* La lista: righe da 68 punti, volti e iniziali, l'ora a destra e sotto, piccolo, «Da saldare» */
.as-k-eventi-app__lista { overflow: hidden; border-radius: calc(20 * var(--u)); background: #fff; box-shadow: 0 0 0 .5px rgba(0, 0, 0, .05); }
.as-k-eventi-app__riga { position: relative; display: grid; grid-template-columns: calc(44 * var(--u)) minmax(0, 1fr) auto; align-items: center; column-gap: calc(16 * var(--u)); height: calc(68 * var(--u)); padding: 0 calc(22 * var(--u)) 0 calc(18 * var(--u)); }
.as-k-eventi-app__riga + .as-k-eventi-app__riga::before { content: ''; position: absolute; top: 0; left: calc(78 * var(--u)); right: 0; height: .5px; background: var(--sep); }
.as-k-eventi-app__av { display: grid; place-items: center; width: calc(44 * var(--u)); height: calc(44 * var(--u)); overflow: hidden; border-radius: 50%; background: #EFE8E4; font-size: calc(15 * var(--u)); font-weight: 600; color: #8A6A5F; letter-spacing: .02em; }
.as-k-eventi-app__nome { display: grid; gap: calc(2 * var(--u)); min-width: 0; }
.as-k-eventi-app__nome b { overflow: hidden; font-size: calc(17 * var(--u)); font-weight: 500; white-space: nowrap; text-overflow: ellipsis; }
.as-k-eventi-app__nome small { overflow: hidden; font-size: calc(13.5 * var(--u)); color: var(--sec); white-space: nowrap; text-overflow: ellipsis; }
.as-k-eventi-app__quando { display: grid; justify-items: end; gap: calc(2 * var(--u)); }
.as-k-eventi-app__quando b { font-size: calc(15 * var(--u)); font-weight: 500; color: var(--sec); }
.as-k-eventi-app__quando small { font-size: calc(12.5 * var(--u)); }
.as-k-eventi-app__quando small.is-saldo { color: #B4233C; font-weight: 500; }
.as-k-eventi-app__home { position: absolute; left: 50%; bottom: calc(8 * var(--u)); width: calc(140 * var(--u)); height: calc(5 * var(--u)); border-radius: 999px; background: rgba(0, 0, 0, .8); transform: translateX(-50%); }

/* v0.99 (Rami, 04/11): via la composizione da telefono di questo caso («mockup giganteschi»): da telefono la scena
   è quella da computer, rimpicciolita come una foto nella card della fila (soluzioni.css, motion.js «fila»). */