/* UV DTF: scoped diagonal 3D image grid based on the supplied reference. */
.uvdtf-banner.shop-intro--flyer {
	--uv-surface:#f8fafc;
	--uv-ink:#111827;
	--uv-accent:#e8325b;
	--uv-accent-hover:#c91e49;
	--uv-control:rgba(255,255,255,.88);
	--uv-border:rgba(15,23,42,.13);
	--uv-veil:rgba(255,255,255,.97);
	--uv-grid:rgba(15,23,42,.19);
	isolation:isolate;
	background:linear-gradient(180deg,#fff,var(--uv-surface));
	border-color:var(--uv-border);
	box-shadow:0 14px 34px rgba(15,23,42,.08);
}
.uvdtf-banner.shop-intro--flyer::before,
.uvdtf-banner.shop-intro--flyer::after { display:none; }
.dark .uvdtf-banner.shop-intro--flyer {
	--uv-surface:#07090d;
	--uv-ink:#fff;
	--uv-accent:#ff426b;
	--uv-accent-hover:#ff6383;
	--uv-control:rgba(8,10,14,.84);
	--uv-border:rgba(255,255,255,.14);
	--uv-veil:rgba(8,10,14,.97);
	--uv-grid:rgba(255,255,255,.22);
	background:linear-gradient(180deg,#101319,var(--uv-surface));
	border-color:var(--uv-border);
	box-shadow:0 18px 46px rgba(0,0,0,.28);
}
.uvdtf-banner__stage { position:absolute; inset:-130px -80px; z-index:1; overflow:hidden; perspective:920px; pointer-events:none; }
.uvdtf-banner__plane { position:absolute; top:50%; left:50%; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; width:clamp(760px,140vw,1650px); height:690px; transform:translate(-50%,-50%) rotateX(55deg) rotateZ(-35deg) scale(.78); transform-style:preserve-3d; }
.uvdtf-banner__column { position:relative; display:flex; flex-direction:column; gap:18px; transform-style:preserve-3d; will-change:transform; }
.uvdtf-banner__card { position:relative; flex:none; width:100%; height:118px; margin:0; overflow:visible; background:#fff; border:4px solid var(--uv-surface); border-radius:10px; box-shadow:0 10px 24px rgba(15,23,42,.2); transform:translateZ(0); }
.dark .uvdtf-banner__card { background:#0d1016; box-shadow:0 12px 28px rgba(0,0,0,.55); }
.uvdtf-banner__card img { display:block; width:100%; height:100%; object-fit:cover; opacity:1; border-radius:6px; filter:saturate(1.06) contrast(1.02); }
.uvdtf-banner__guide { position:absolute; z-index:3; pointer-events:none; opacity:.42; }
.uvdtf-banner__guide--vertical { top:-42px; bottom:-42px; left:-11px; width:1px; background:repeating-linear-gradient(to bottom,var(--uv-grid) 0 5px,transparent 5px 10px); mask-image:linear-gradient(transparent,#000 10%,#000 90%,transparent); }
.uvdtf-banner__guide--horizontal { top:-11px; right:-22px; left:-22px; height:1px; background:repeating-linear-gradient(to right,var(--uv-grid) 0 5px,transparent 5px 10px); mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); }
.uvdtf-banner__veil { position:absolute; inset:0; z-index:2; pointer-events:none; background:radial-gradient(ellipse at center,var(--uv-veil) 0 18%,rgba(255,255,255,.78) 29%,transparent 55%),linear-gradient(90deg,rgba(248,250,252,.42),transparent 8%,transparent 92%,rgba(248,250,252,.42)); }
.dark .uvdtf-banner__veil { background:radial-gradient(ellipse at center,var(--uv-veil) 0 18%,rgba(8,10,14,.8) 29%,transparent 55%),linear-gradient(90deg,rgba(7,9,13,.58),transparent 8%,transparent 92%,rgba(7,9,13,.58)); }
.uvdtf-banner__content { position:absolute; inset:0; z-index:4; display:grid; place-content:center; justify-items:center; padding:12px 90px; color:var(--uv-ink); text-align:center; pointer-events:none; }
.uvdtf-banner__content h1 { display:flex; flex-wrap:wrap; justify-content:center; gap:0 .26em; max-width:620px; margin:0; color:inherit; font-size:clamp(23px,2.15vw,33px); font-weight:700; line-height:1.04; letter-spacing:-.025em; text-shadow:0 1px 0 #fff,0 4px 18px rgba(255,255,255,.96); }
.dark .uvdtf-banner__content h1 { text-shadow:0 2px 4px rgba(0,0,0,.95),0 5px 22px #000; }
.uvdtf-banner__content h1 span { display:inline-block; }
.uvdtf-banner__cta { pointer-events:auto; display:inline-flex; align-items:center; gap:5px; min-height:27px; margin-top:8px; padding:6px 13px; color:#fff; background:var(--uv-accent); border:1px solid rgba(255,255,255,.4); border-radius:999px; box-shadow:0 6px 16px rgba(190,24,67,.3); font-size:10px; font-weight:600; line-height:1; letter-spacing:.02em; text-decoration:none; transition:background-color .2s ease,box-shadow .2s ease,transform .2s ease; }
.uvdtf-banner__cta svg { width:12px; height:12px; transition:transform .2s ease; }
.uvdtf-banner__cta:hover,
.uvdtf-banner__cta:focus-visible { color:#fff; background:var(--uv-accent-hover); box-shadow:0 8px 20px rgba(190,24,67,.42); transform:translateY(-1px); text-decoration:none; }
.uvdtf-banner__cta:hover svg,
.uvdtf-banner__cta:focus-visible svg { transform:translateX(2px); }
.uvdtf-banner__cta:focus-visible,
.uvdtf-banner__pause:focus-visible { outline:2px solid #fb7185; outline-offset:2px; }
.uvdtf-banner__pause { position:absolute; z-index:6; top:9px; right:9px; display:grid; place-items:center; width:30px; height:30px; padding:0; color:var(--uv-ink); background:var(--uv-control); border:1px solid var(--uv-border); border-radius:50%; box-shadow:0 5px 14px rgba(15,23,42,.16); cursor:pointer; backdrop-filter:blur(7px); }
.uvdtf-banner__icon { width:15px; height:15px; }
.uvdtf-banner__icon--play { display:none; }
.uvdtf-banner__pause[aria-pressed="true"] .uvdtf-banner__icon--pause { display:none; }
.uvdtf-banner__pause[aria-pressed="true"] .uvdtf-banner__icon--play { display:block; }
.uvdtf-banner.is-enhanced .uvdtf-banner__column { animation:uvdtf-column-drift 10s ease-in-out infinite alternate; animation-delay:calc(var(--column) * -1.15s); }
.uvdtf-banner.is-enhanced .uvdtf-banner__column:nth-child(even) { animation-duration:15s; animation-direction:alternate-reverse; }
.uvdtf-banner.is-paused .uvdtf-banner__column,
.uvdtf-banner.is-offscreen .uvdtf-banner__column,
.uvdtf-banner:hover .uvdtf-banner__column,
.uvdtf-banner:focus-within .uvdtf-banner__column { animation-play-state:paused; }
.uvdtf-banner.is-enhanced:not(.is-ready) .uvdtf-banner__content h1 span,
.uvdtf-banner.is-enhanced:not(.is-ready) .uvdtf-banner__cta { opacity:0; }
.uvdtf-banner.is-ready .uvdtf-banner__content h1 span { animation:uvdtf-word-write .58s steps(10,end) calc(.12s + var(--word-index) * .24s) both; }
.uvdtf-banner.is-ready .uvdtf-banner__cta { animation:uvdtf-cta-enter .65s cubic-bezier(.16,1,.3,1) 1.05s both; }
@keyframes uvdtf-column-drift { to { transform:translate3d(0,86px,0); } }
@keyframes uvdtf-word-write {
	0% { opacity:0; clip-path:inset(0 100% 0 0); transform:translateY(6px); filter:blur(3px); }
	15% { opacity:1; }
	100% { opacity:1; clip-path:inset(0 0 0 0); transform:translateY(0); filter:blur(0); }
}
@keyframes uvdtf-cta-enter {
	0% { opacity:0; transform:translateY(9px) scale(.88); filter:blur(4px); }
	72% { opacity:1; transform:translateY(-1px) scale(1.03); filter:blur(0); }
	100% { opacity:1; transform:translateY(0) scale(1); filter:blur(0); }
}
@media (max-width:900px) {
	.uvdtf-banner__stage { inset:-110px -65px; }
	.uvdtf-banner__plane { gap:14px; width:clamp(700px,145vw,1050px); transform:translate(-50%,-50%) rotateX(54deg) rotateZ(-35deg) scale(.72); }
	.uvdtf-banner__column { gap:14px; }
	.uvdtf-banner__card { height:98px; border-width:3px; border-radius:8px; }
	.uvdtf-banner__content { padding:8px 62px; }
	.uvdtf-banner__content h1 { font-size:clamp(18px,4vw,27px); }
	.uvdtf-banner__cta { min-height:23px; margin-top:5px; padding:4px 10px; font-size:9px; }
	.uvdtf-banner__pause { top:6px; right:6px; width:27px; height:27px; }
	.uvdtf-banner__icon { width:14px; height:14px; }
}
@media (max-width:560px) {
	.uvdtf-banner__stage { inset:-90px -55px; }
	.uvdtf-banner__plane { width:700px; gap:11px; transform:translate(-50%,-50%) rotateX(52deg) rotateZ(-34deg) scale(.66); }
	.uvdtf-banner__column { gap:11px; }
	.uvdtf-banner__card { height:86px; border-radius:7px; }
	.uvdtf-banner__content { padding:6px 40px; }
	.uvdtf-banner__content h1 { font-size:clamp(15px,5vw,20px); }
	.uvdtf-banner__cta { min-height:20px; margin-top:4px; padding:3px 9px; font-size:8px; }
	.uvdtf-banner__cta svg { width:10px; height:10px; }
	.uvdtf-banner__pause { top:5px; right:5px; width:24px; height:24px; }
	.uvdtf-banner__icon { width:12px; height:12px; }
}
@media (prefers-reduced-motion:reduce) {
	.uvdtf-banner.is-enhanced .uvdtf-banner__column { animation-play-state:paused; }
	.uvdtf-banner__content h1 span,
	.uvdtf-banner__cta { opacity:1!important; clip-path:none!important; transform:none!important; filter:none!important; animation:none!important; }
	.uvdtf-banner__pause { display:none; }
}