/* Aureum motion v3 — 2026-09-11
   One signature moment (the vial glides from the catalog card into the product
   page via cross-document View Transitions) plus quiet choreography everywhere
   else. Tokens only. Every effect is transform/opacity, every effect has a
   reduced-motion fallback, nothing touches the LCP element.                */

/* ---- 1. Cross-document view transitions (progressive: Chrome/Edge/Safari 18.2+) */
@view-transition { navigation: auto; }

::view-transition-old(root),
::view-transition-new(root) {
	animation-duration: 340ms;
	animation-timing-function: var(--au-ease);
}
::view-transition-old(root) { animation-name: au-vt-out; }
::view-transition-new(root) { animation-name: au-vt-in; }
@keyframes au-vt-out { to { opacity: 0; } }
@keyframes au-vt-in  { from { opacity: 0; transform: translateY(10px); } }

/* The header is pinned outside the cross-fade so the chrome never blinks. */
header.au-nav-top { view-transition-name: au-header; }
::view-transition-group(au-header) { animation-duration: 0s; }

/* Shared vial: catalog card image ↔ product hero image. The element names are
   set inline per product (view-transition-name: au-p-<id>). */
::view-transition-group(*) {
	animation-duration: 520ms;
	animation-timing-function: var(--au-ease);
}
::view-transition-old(*):only-child,
::view-transition-new(*):only-child { animation-duration: 340ms; }
/* Cover ↔ contain images would otherwise stretch during the morph. */
::view-transition-old(*),
::view-transition-new(*) { object-fit: contain; mix-blend-mode: normal; }

/* ---- 2. Below-fold reveal (JS adds .au-rv only to elements under the fold) */
.au-rv {
	opacity: 0;
	transform: translateY(18px);
	transition: opacity var(--au-dur-slow, 900ms) var(--au-ease), transform var(--au-dur-slow, 900ms) var(--au-ease);
	transition-delay: calc(var(--au-i, 0) * 55ms);
}
.au-rv.is-in { opacity: 1; transform: none; }

/* ---- 3. Buttons: lift + one soft light sweep on hover (no colour change) */
.au-btn, .au-card__buy, .au-tab-cta, .single_add_to_cart_button {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	transition: transform var(--au-dur-fast, 250ms) var(--au-ease), box-shadow var(--au-dur-fast, 250ms) var(--au-ease);
}
.au-btn::after, .au-card__buy::after, .au-tab-cta::after, .single_add_to_cart_button::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(115deg, transparent 35%, rgba(255, 255, 255, 0.22) 50%, transparent 65%);
	transform: translateX(-130%);
	transition: none;
	z-index: 1;
}
.au-btn:hover::after, .au-card__buy:hover::after, .au-tab-cta:hover::after, .single_add_to_cart_button:hover::after {
	transform: translateX(130%);
	transition: transform 720ms var(--au-ease);
}
.au-btn:hover, .single_add_to_cart_button:hover { transform: translateY(-1px); }
.au-btn:active, .single_add_to_cart_button:active { transform: translateY(0); }

/* ---- 4. Lot page: the seal stamps, the QR settles, the hero rises */
.au-coa__hero .au-eyebrow,
.au-coa__hero h1,
.au-coa__lotline { animation: au-rise 700ms var(--au-ease) both; }
.au-coa__hero h1 { animation-delay: 80ms; }
.au-coa__lotline { animation-delay: 160ms; }
.au-coa__badge--pass { animation: au-stamp 560ms var(--au-ease) 420ms both; }
.au-coa__qrbox .au-qr { animation: au-settle 800ms var(--au-ease) 260ms both; }
.au-coa__table tr { animation: au-rise 600ms var(--au-ease) both; animation-delay: calc(200ms + var(--au-i, 0) * 45ms); }
@keyframes au-rise   { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes au-stamp  { 0% { opacity: 0; transform: scale(1.5) rotate(-8deg); } 60% { opacity: 1; } 100% { opacity: 1; transform: none; } }
@keyframes au-settle { from { opacity: 0; transform: scale(0.94); } to { opacity: 1; transform: none; } }

/* ---- 5. Product page: the lot line's check draws itself once */
.au-pdp-lotline .au-tick { width: 14px; height: 14px; flex: 0 0 auto; align-self: center; }
.au-pdp-lotline .au-tick path {
	fill: none;
	stroke: var(--au-gold);
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-dasharray: 22;
	stroke-dashoffset: 22;
	animation: au-draw 600ms var(--au-ease) 500ms forwards;
}
@keyframes au-draw { to { stroke-dashoffset: 0; } }

/* ---- 6. Catalog cards: the "View" affordance slides in with the lift */
.au-card__buy { transition: transform var(--au-dur-fast, 250ms) var(--au-ease), background var(--au-dur-fast, 250ms) var(--au-ease), color var(--au-dur-fast, 250ms) var(--au-ease); }
.au-card:hover .au-card__buy { transform: translateX(2px); }

/* ---- Reduced motion: everything lands instantly, nothing moves */
@media (prefers-reduced-motion: reduce) {
	@view-transition { navigation: none; }
	::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
	.au-rv { opacity: 1; transform: none; transition: none; }
	.au-coa__hero .au-eyebrow, .au-coa__hero h1, .au-coa__lotline, .au-coa__badge--pass, .au-coa__qrbox .au-qr, .au-coa__table tr, .au-pdp-lotline .au-tick path { animation: none; opacity: 1; transform: none; stroke-dashoffset: 0; }
	.au-btn::after, .au-card__buy::after, .au-tab-cta::after, .single_add_to_cart_button::after { display: none; }
	.au-btn:hover, .single_add_to_cart_button:hover, .au-card:hover .au-card__buy { transform: none; }
}