/* Entrance choreography and user-triggered control feedback. Scroll content stays still.
   Content is visible by default. JavaScript never gates rendering or navigation. */
:root { --motion-ease: cubic-bezier(.2, .75, .2, 1); --motion-quick: 180ms; }
.hero-motion-line { display: inline-block; vertical-align: top; overflow: hidden; overflow: clip; padding: 0 .08em .12em 0; margin: 0 -.08em -.12em 0; }
.hero-motion-line > :is(span, em) { display: inline-block; }
.basket-flight { position: fixed; width: 48px; height: 64px; pointer-events: none; z-index: 1000; }
.basket-flight > img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 2px; }
/* Success already provides View basket in the live announcement. Woo's extra
   catalogue link otherwise pushes the next mobile card down after an AJAX add. */
#main .products .added_to_cart { display: none; }
.motion-price { position: relative; display: inline-block; white-space: nowrap; font-variant-numeric: tabular-nums; }
.motion-price-source { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; }
number-flow { font: inherit; color: inherit; vertical-align: baseline; font-variant-numeric: tabular-nums; --number-flow-mask-height: 0em; --number-flow-mask-width: 0em; }
.motion-quantity { display: inline-grid; position: relative; }
.motion-quantity > input, .motion-quantity__value { grid-area: 1 / 1; }
.motion-quantity__value { align-self: center; justify-self: center; pointer-events: none; font: inherit; }
#main .motion-quantity.has-number-flow input.qty:not(:focus) { color: transparent; }
.motion-quantity:focus-within .motion-quantity__value { visibility: hidden; }

/* Component transitions keep navigation and buying controls immediately interactive. */
@media (prefers-reduced-motion: no-preference) {
 @view-transition { navigation: auto; }
 img[data-bottle-id] { view-transition-name: var(--bottle-transition); }
 .site-header { view-transition-name: tholos-header; }
 .site-footer { view-transition-name: tholos-footer; }
 /* No UA width/height interpolation: shared photographs use transform FLIP. */
 ::view-transition-group(*) { animation: none; }
 ::view-transition-old(root) { animation: tholos-page-out 220ms var(--motion-ease) both; }
 ::view-transition-new(root) { animation: tholos-page-in 220ms var(--motion-ease) both; }
 ::view-transition-old(tholos-header), ::view-transition-old(tholos-footer) { animation: none; opacity: 0; }
 ::view-transition-new(tholos-header), ::view-transition-new(tholos-footer) { animation: none; opacity: 1; }
 ::view-transition { pointer-events: none; }
 .tholos-page-transition :is(.header-logo__piece, .header-wreath) { animation: none; }
 :is(.woocommerce-checkout, .woocommerce-account) .header-logo__piece { animation: none; }
 @keyframes tholos-page-in { from { opacity: 0; } to { opacity: 1; } }
 @keyframes tholos-page-out { from { opacity: 1; } to { opacity: 0; } }
 #main :is(a.button, button.button, input.button, a.added_to_cart), .quantity-step, .bottle-choices__options a,
 .site-header .main-nav a, .commerce-page :is(input, textarea, select), .enquiry-form :is(input, textarea, select),
 .select2-selection--single, .contact-page .enquiry-panel,
 .woocommerce-MyAccount-navigation a, .product-remove a { transition: none; }
 .contact-page .enquiry-panel:focus-within { border-top-color: var(--gold); box-shadow: inset 0 1px 0 var(--gold); }
 .basket-announcement { transition: opacity var(--motion-quick) var(--motion-ease); }
 .image-zoom[open]::backdrop { animation: tholos-page-in 220ms var(--motion-ease); }
}
@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
 .products .woocommerce-loop-product__title { text-decoration: underline; text-decoration-color: transparent; text-decoration-thickness: 1px; text-underline-offset: .17em; }
 .products li.product:is(:hover, :focus-within) .woocommerce-loop-product__title { text-decoration-color: var(--gold); }
}
@media (prefers-reduced-motion: no-preference) and (max-width: 960px) {
 .main-nav.is-open { animation: tholos-menu-open 160ms var(--motion-ease); }
 @keyframes tholos-menu-open { from { opacity: .7; } to { opacity: 1; } }
}
@media (prefers-reduced-motion: reduce) {
 .hero-motion-line { overflow: visible; }
}
@media print {
 .hero-motion-line { overflow: visible; }
}