/* Pagina Food Delivery: fasce fotografiche con parallasse, galleria di siti, elementi che appaiono allo scorrimento. */
.tw-food-band { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: flex-end; min-height: clamp(380px, 62vh, 640px); color: #fff; background: var(--tw-ink); }
.tw-food-band__media { position: absolute; inset: -16% 0; z-index: -2; will-change: transform; }
.tw-food-band__media img { display: block; width: 100%; height: 100%; object-fit: cover; animation: tw-food-zoom 28s ease-in-out infinite alternate; }
.tw-food-band::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(8, 24, 33, .05) 0%, rgba(8, 24, 33, .72) 100%); }
.tw-food-band__copy { padding-block: clamp(36px, 6vw, 84px); }
.tw-food-band__copy .tw-kicker { color: rgba(255, 255, 255, .86); }
.tw-food-band__copy h2 { max-width: 16ch; margin: 0 0 14px; color: #fff; font-size: clamp(36px, 5.4vw, 76px); line-height: .98; letter-spacing: -.04em; text-wrap: balance; }
.tw-food-band__copy p:last-child { max-width: 46ch; margin: 0; color: rgba(255, 255, 255, .9); font-size: clamp(17px, 1.5vw, 21px); line-height: 1.5; }

.tw-food-gallery { position: relative; isolation: isolate; overflow: hidden; padding: clamp(64px, 8vw, 128px) 0; color: #fff; background: #0b2430; }
.tw-food-gallery__bg { position: absolute; inset: -14% 0; z-index: -2; will-change: transform; }
.tw-food-gallery__bg img { display: block; width: 100%; height: 100%; object-fit: cover; opacity: .34; }
.tw-food-gallery::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(11, 36, 48, .86), rgba(11, 36, 48, .62) 50%, rgba(11, 36, 48, .9)); }
.tw-food-gallery header { max-width: 62ch; margin-bottom: clamp(28px, 4vw, 56px); }
.tw-food-gallery .tw-kicker { color: rgba(255, 255, 255, .8); }
.tw-food-gallery h2 { margin: 0 0 14px; color: #fff; font-size: clamp(32px, 4.4vw, 60px); line-height: 1; letter-spacing: -.04em; text-wrap: balance; }
.tw-food-gallery header p:last-child { margin: 0; color: rgba(255, 255, 255, .88); font-size: 18px; line-height: 1.55; }
.tw-food-gallery__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: clamp(16px, 2.2vw, 32px); margin: 0; padding: 0; list-style: none; }
.tw-food-gallery__grid li { grid-column: span 2; }
.tw-food-shot { display: block; overflow: hidden; background: #fff; border-radius: 10px; box-shadow: 0 24px 60px rgba(0, 0, 0, .38); transition: transform .35s ease, box-shadow .35s ease; text-decoration: none; }
.tw-food-shot:hover, .tw-food-shot:focus-visible { transform: translateY(-8px) rotate(-.4deg); box-shadow: 0 34px 70px rgba(0, 0, 0, .5); }
.tw-food-shot:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.tw-food-shot__bar { display: flex; align-items: center; gap: 6px; padding: 9px 12px; background: #e9e7e0; color: #4a5b64; font-size: 12px; }
.tw-food-shot__bar i { width: 9px; height: 9px; border-radius: 50%; background: #c9c6bd; }
.tw-food-shot__bar b { margin-left: 8px; padding: 2px 12px; border-radius: 99px; background: #fff; font-weight: 600; }
.tw-food-shot img { display: block; width: 100%; height: auto; }

/* Comparsa allo scorrimento: attiva solo con JavaScript, così senza script nulla resta nascosto. */
.tw-food-js [data-tw-reveal] { opacity: 0; transform: translateY(34px); transition: opacity .8s ease, transform .8s cubic-bezier(.2, .7, .2, 1); }
.tw-food-js [data-tw-reveal].is-in { opacity: 1; transform: none; }
.tw-food-js .tw-food-gallery__grid li:nth-child(2) { transition-delay: .1s; }
.tw-food-js .tw-food-gallery__grid li:nth-child(3) { transition-delay: .2s; }
.tw-food-js .tw-food-gallery__grid li:nth-child(5) { transition-delay: .1s; }
.tw-food-js .tw-food-gallery__grid li:nth-child(6) { transition-delay: .2s; }

@keyframes tw-food-zoom { from { transform: scale(1); } to { transform: scale(1.08); } }

@media (max-width: 860px) {
	.tw-food-gallery__grid { grid-template-columns: 1fr; }
	.tw-food-gallery__grid li { grid-column: auto; }
	.tw-food-band { min-height: 340px; }
}
@media (prefers-reduced-motion: reduce) {
	.tw-food-band__media img { animation: none; }
	.tw-food-js [data-tw-reveal] { opacity: 1; transform: none; transition: none; }
	.tw-food-shot { transition: none; }
}

/* Hero: foto di chi ordina dal telefono accanto al testo */
.tw-web-service--food .tw-web-hero--service.has-no-media .tw-web-hero__service-grid { grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); }
.tw-food-hero-photo { position: relative; isolation: isolate; margin: 0; justify-self: end; width: min(100%, 460px); }
.tw-food-hero-photo::before { content: ""; position: absolute; inset: 18px -18px -18px 18px; z-index: -1; background: var(--tw-line, #d9d6cc); }
.tw-food-hero-photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 62%; }
@media (max-width: 860px) {
	.tw-web-service--food .tw-web-hero--service.has-no-media .tw-web-hero__service-grid { grid-template-columns: 1fr; }
	.tw-food-hero-photo { justify-self: start; width: min(100%, 380px); margin-right: 18px; }
}

/* Sfondo fotografico in parallasse dietro una sezione chiara: foto sfumata, testo sempre leggibile */
.tw-parallax-backdrop { position: absolute; inset: -12% 0; z-index: -2; will-change: transform; }
.tw-parallax-backdrop img { display: block; width: 100%; height: 100%; object-fit: cover; opacity: .16; filter: grayscale(.2); }
.tw-web-overview-types:has(.tw-parallax-backdrop)::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, var(--tw-surface-cool, #f2f4f3) 0%, rgba(242, 244, 243, .35) 45%, var(--tw-surface-cool, #f2f4f3) 100%); }

/* Loghi delle tecnologie e esempi (pagine Servizio con extra) */
.tw-tech, .tw-svc-examples { position: relative; isolation: isolate; overflow: hidden; padding: clamp(56px, 7vw, 108px) 0; }
.tw-tech header, .tw-svc-examples header { max-width: 60ch; margin-bottom: clamp(24px, 3.4vw, 44px); }
.tw-tech h2, .tw-svc-examples h2 { margin: 0 0 12px; font-size: clamp(30px, 3.8vw, 52px); line-height: 1; letter-spacing: -.04em; }
.tw-tech header p, .tw-svc-examples header p { margin: 0; color: var(--tw-ink-soft, #3d5560); font-size: 18px; line-height: 1.55; }
.tw-tech .tw-parallax-backdrop img { opacity: .1; }
.tw-tech::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, var(--tw-paper, #f5f3ed) 0%, rgba(245, 243, 237, .55) 50%, var(--tw-paper, #f5f3ed) 100%); }
.tw-tech__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: clamp(12px, 1.6vw, 20px); margin: 0; padding: 0; list-style: none; }
.tw-tech__grid li { display: grid; justify-items: center; gap: 12px; padding: 26px 14px 22px; border: 1px solid var(--tw-line, rgba(7, 31, 42, .16)); border-radius: 16px; background: rgba(255, 255, 255, .72); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); text-align: center; transition: transform .25s ease, box-shadow .25s ease; }
.tw-tech__grid li:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(7, 31, 42, .12); }
.tw-tech__grid span { font-weight: 700; font-size: 15px; letter-spacing: -.01em; }
.tw-svc-examples__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 44px); margin: 0; padding: 0; list-style: none; }
.tw-svc-examples__grid .tw-food-shot { box-shadow: 0 18px 44px rgba(7, 31, 42, .22); }
.tw-svc-examples__grid p { margin: 16px 2px 0; color: var(--tw-ink-soft, #3d5560); font-size: 16px; line-height: 1.55; }
@media (max-width: 860px) { .tw-svc-examples__grid { grid-template-columns: 1fr; } }
.tw-tech__grid { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); }
.tw-tech__grid li { padding: 20px 10px 16px; }
.tw-tech__grid svg { width: 38px; height: 38px; }