/*
 * Storefront Experience Runtime (dev.26). Presentation layer only:
 * transform/opacity/filter, never layout properties, so nothing shifts.
 * Everything is gated by body classes written by DBL_LPOS_Experience_Runtime
 * (dbl-motion-off | subtle | cinematic, dbl-xp-arrival/discovery/product/
 * purchase) and by prefers-reduced-motion. With motion off, or if this file
 * or its script never loads, the storefront is the complete approved design.
 */
body.dbl-motion-subtle { --dbl-xp-rise: 14px; --dbl-xp-dur: .65s; --dbl-xp-stagger: 70ms; --dbl-xp-scale: 1; }
body.dbl-motion-cinematic { --dbl-xp-rise: 38px; --dbl-xp-dur: 1.05s; --dbl-xp-stagger: 120ms; --dbl-xp-scale: .965; }

@media (prefers-reduced-motion: no-preference) {
	/* A. Arrival — hero pieces settle into place in order. Pure CSS: no JS needed. */
	body.dbl-xp-arrival.dbl-motion-subtle .dbl-lpos-hero__eyebrow,
	body.dbl-xp-arrival.dbl-motion-cinematic .dbl-lpos-hero__eyebrow { animation: dbl-xp-arrive var(--dbl-xp-dur) cubic-bezier(.2,.8,.2,1) .05s backwards; }
	body.dbl-xp-arrival .dbl-lpos-hero__slogan { animation: dbl-xp-arrive var(--dbl-xp-dur) cubic-bezier(.2,.8,.2,1) calc(var(--dbl-xp-stagger) * 1) backwards; }
	body.dbl-xp-arrival .dbl-lpos-hero__intro { animation: dbl-xp-arrive var(--dbl-xp-dur) cubic-bezier(.2,.8,.2,1) calc(var(--dbl-xp-stagger) * 2) backwards; }
	body.dbl-xp-arrival .dbl-lpos-hero__actions { animation: dbl-xp-arrive var(--dbl-xp-dur) cubic-bezier(.2,.8,.2,1) calc(var(--dbl-xp-stagger) * 3) backwards; }
	body.dbl-xp-arrival .dbl-lpos-hero__featured { animation: dbl-xp-arrive-photo calc(var(--dbl-xp-dur) * 1.3) cubic-bezier(.2,.8,.2,1) calc(var(--dbl-xp-stagger) * 2) backwards; }
	body.dbl-xp-arrival.dbl-motion-cinematic .dbl-lpos-hero__art { animation: dbl-xp-art-settle 2.2s cubic-bezier(.2,.7,.2,1) backwards; }
	@keyframes dbl-xp-arrive { from { opacity: 0; transform: translate3d(0, var(--dbl-xp-rise), 0); } to { opacity: 1; transform: none; } }
	@keyframes dbl-xp-arrive-photo { from { opacity: 0; transform: translate3d(0, var(--dbl-xp-rise), 0) scale(var(--dbl-xp-scale)); } to { opacity: 1; transform: none; } }
	@keyframes dbl-xp-art-settle { from { opacity: .35; transform: scale(1.06); } to { opacity: 1; transform: none; } }

	/* Cinematic light sweep across the hero (decorative, non-interactive). */
	.dbl-xp-sweep { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 1; }
	.dbl-xp-sweep::before { content: ""; position: absolute; top: -20%; bottom: -20%; left: -40%; width: 38%; background: linear-gradient(100deg, transparent, rgba(242,206,135,.22), rgba(255,244,221,.32), rgba(242,206,135,.16), transparent); transform: translate3d(0,0,0) skewX(-14deg); animation: dbl-xp-sweep 2.8s cubic-bezier(.4,.1,.2,1) .5s 1 both; }
	@keyframes dbl-xp-sweep { from { transform: translate3d(0,0,0) skewX(-14deg); opacity: 0; } 15% { opacity: 1; } to { transform: translate3d(420%,0,0) skewX(-14deg); opacity: 0; } }

	/* B. Discovery — below-the-fold merchandise reveals. The hidden state is set
	   only by the script, only for items not yet on screen, and is removed by a
	   fallback timer, so content can never stay hidden. */
	.dbl-xp-hidden { opacity: 0; transform: translate3d(0, var(--dbl-xp-rise), 0) scale(var(--dbl-xp-scale)); }
	.dbl-xp-reveal { transition: opacity var(--dbl-xp-dur) cubic-bezier(.2,.8,.2,1) var(--dbl-xp-delay, 0ms), transform var(--dbl-xp-dur) cubic-bezier(.2,.8,.2,1) var(--dbl-xp-delay, 0ms); will-change: opacity, transform; }
	.dbl-xp-reveal.is-in { opacity: 1; transform: none; }
	.dbl-xp-done { will-change: auto; }

	/* C. Product interaction — pointer-follow light + gentle lift (fine pointers only). */
	@media (hover: hover) and (pointer: fine) {
		body.dbl-xp-product .dbl-xp-card:not(.dbl-xp-reveal), body.dbl-xp-product .dbl-xp-card.dbl-xp-done { transition: transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease; }
		body.dbl-xp-product .dbl-xp-card:hover,
		body.dbl-xp-product .dbl-xp-card:focus-within { transform: translate3d(0,-4px,0); box-shadow: 0 18px 38px -16px rgba(23,36,42,.35); }
		body.dbl-xp-product.dbl-motion-cinematic .dbl-xp-card:hover { transform: translate3d(0,-7px,0); }
		.dbl-xp-glare { position: absolute; inset: 0; pointer-events: none; opacity: 0; z-index: 2; border-radius: inherit; background: radial-gradient(240px circle at var(--dbl-mx, 50%) var(--dbl-my, 30%), rgba(255,236,190,.38), rgba(242,206,135,.12) 45%, transparent 70%); transition: opacity .3s ease; mix-blend-mode: soft-light; }
		.dbl-xp-card:hover > .dbl-xp-glare { opacity: 1; }
	}

	/* E. Purchase — quick, light feedback while WooCommerce adds the item. */
	body.dbl-xp-purchase .single_add_to_cart_button.loading,
	body.dbl-xp-purchase .add_to_cart_button.loading,
	body.dbl-xp-purchase .dbl-lpos-quick-view-modal .single_add_to_cart_button.loading { animation: dbl-xp-working .8s ease-in-out infinite alternate; }
	@keyframes dbl-xp-working { from { filter: brightness(1); } to { filter: brightness(1.22) saturate(1.1); } }
	body.dbl-xp-purchase.woocommerce-cart .woocommerce-cart-form .cart_item { animation: dbl-xp-arrive var(--dbl-xp-dur) cubic-bezier(.2,.8,.2,1) backwards; }
	body.dbl-xp-purchase.woocommerce-cart .woocommerce-cart-form .cart_item:nth-child(2) { animation-delay: var(--dbl-xp-stagger); }
	body.dbl-xp-purchase.woocommerce-cart .woocommerce-cart-form .cart_item:nth-child(3) { animation-delay: calc(var(--dbl-xp-stagger) * 2); }
	body.dbl-xp-purchase.woocommerce-cart .cart_totals { animation: dbl-xp-arrive var(--dbl-xp-dur) cubic-bezier(.2,.8,.2,1) calc(var(--dbl-xp-stagger) * 3) backwards; }
}

/* Reduced motion / Off: nothing animates; content is simply present. */
@media (prefers-reduced-motion: reduce) {
	.dbl-xp-sweep, .dbl-xp-glare { display: none; }
	.dbl-xp-hidden { opacity: 1 !important; transform: none !important; }
}
body.dbl-motion-off .dbl-xp-sweep, body.dbl-motion-off .dbl-xp-glare { display: none; }

/* Dev.27 Experience Director v1: independent, admin-controlled settings. */
@media (prefers-reduced-motion: no-preference) {
  body.dbl-xp-discovery.dbl-motion-subtle { --dbl-xp-rise: 14px; }
  body.dbl-xp-discovery.dbl-motion-cinematic { --dbl-xp-rise: 38px; }
  body.dbl-xp-light-warm .dbl-lpos-homepage .dbl-lpos-hero { filter: saturate(1.04); }
  body.dbl-xp-light-prismatic .dbl-lpos-homepage .dbl-lpos-hero { box-shadow: inset 0 0 62px rgba(156,91,211,.22), inset -45px 10px 62px rgba(255,174,61,.13); }
  body.dbl-xp-light-prismatic .dbl-xp-sweep::before { background: linear-gradient(100deg,transparent,rgba(186,112,235,.25),rgba(243,217,126,.31),rgba(92,207,219,.20),transparent); }
  body.dbl-xp-hero-gentle .dbl-lpos-hero__art, body.dbl-xp-hero-cinematic .dbl-lpos-hero__art { translate: 0 var(--dbl-xp-parallax,0px); }
  body.dbl-xp-section-light .dbl-lpos-homepage-section, body.dbl-xp-section-cinematic .dbl-lpos-homepage-section { transition: filter .75s ease; }
  body.dbl-xp-section-light .dbl-lpos-homepage-section:hover { filter: brightness(1.025); }
  body.dbl-xp-section-cinematic .dbl-lpos-homepage-section:hover { filter: brightness(1.045); }
  body.dbl-xp-card-glow .dbl-xp-card:hover, body.dbl-xp-card-glow .dbl-xp-card:focus-within { box-shadow: 0 0 0 1px rgba(242,206,135,.78),0 15px 39px -14px rgba(185,128,48,.4); }
  body.dbl-xp-quickview-light .dbl-lpos-quick-view-modal__panel { box-shadow: 0 0 0 2px rgba(242,206,135,.72),0 15px 55px rgba(0,0,0,.24); }
  body.dbl-xp-quickview-light .dbl-lpos-quick-view { outline-offset: 2px; }
  body.dbl-xp-purchase :is(.dbl-lpos-launch-chip,.dbl-lpos-launch-ring,.dbl-lpos-launch-spark) { filter: brightness(1.18) saturate(1.15); }
  body.dbl-motion-off .dbl-xp-sweep, body.dbl-motion-off .dbl-xp-glare { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  body .dbl-xp-sweep, body .dbl-xp-glare { display:none !important; }
  body .dbl-xp-reveal, body .dbl-xp-hidden { opacity:1!important; transform:none!important; animation:none!important; transition:none!important; }
  body .dbl-lpos-hero__art { translate:none!important; }
}

@media (prefers-reduced-motion: no-preference) {
  body.dbl-xp-arrival-cinematic { --dbl-xp-rise:38px; --dbl-xp-dur:1.1s; --dbl-xp-stagger:140ms; }
  body.dbl-xp-reveal-fade .dbl-xp-hidden { transform:none; }
}
body.dbl-xp-motion-reduced .dbl-xp-sweep,body.dbl-xp-motion-reduced .dbl-xp-glare {display:none!important}
body.dbl-xp-motion-reduced .dbl-xp-hidden,body.dbl-xp-motion-reduced .dbl-xp-reveal {opacity:1!important;transform:none!important;transition:none!important;animation:none!important}
body.dbl-xp-motion-reduced .dbl-lpos-hero :is(.dbl-lpos-hero__eyebrow,.dbl-lpos-hero__slogan,.dbl-lpos-hero__intro,.dbl-lpos-hero__actions,.dbl-lpos-hero__featured,.dbl-lpos-hero__art) {animation:none!important;translate:none!important}
