.tg { position: relative; overflow: hidden; container-type: size; height: clamp(440px, 52vw, 640px); margin-top: clamp(56px, 7vw, 96px); }
.tg-band { position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .5s; }
.tg.is-ready .tg-band { opacity: 1; }
.tg-tile { position: absolute; transform-style: preserve-3d; }
.tg-strip { position: absolute; top: 0; overflow: hidden; background: #E5E5E5; backface-visibility: hidden; }
.tg-strip:first-child { border-radius: 8px 0 0 8px; }
.tg-strip:last-child { border-radius: 0 8px 8px 0; }
.tg-strip img { position: absolute; top: 0; max-width: none; object-fit: cover; user-select: none; }
.tg-over { position: relative; z-index: 1; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 40px 24px; text-align: center; }
.tg-over h2 { max-width: 20ch; text-wrap: balance; }
.tg-over p { max-width: 44ch; text-wrap: balance; font-size: .9375rem; color: var(--fg-2); }
html.motion-off .tg-tile { animation-play-state: paused; }