/* Adjust these values to tune the storefront cards. */
:root { --emotion-card-border: #deded9; --emotion-card-paper: #fafaf8; --emotion-card-radius: 8px; --emotion-card-duration: 320ms; }
.emotion-product-link { display: flex; flex-direction: column; height: 100%; color: inherit; text-decoration: none; }
.emotion-product-link:hover { color: inherit; }
.emotion-product-link:focus-visible { outline: 2px solid #333; outline-offset: -3px; }
.emotion-card-cta { display: flex; justify-content: space-between; border-top: 1px solid var(--emotion-card-border); margin-top: 18px; padding-top: 12px; font-size: 11px; letter-spacing: .08em; }
.emotion-card-cta > span { transition: transform var(--emotion-card-duration) ease; }
.emotion-product-link:hover .emotion-card-cta > span { transform: translate(3px,-3px); }
#emotion-product-track .emotion-product-price { font-size: 16px; color: #171717; line-height: 1.6; }
.emotion-card-pending { color: #777; }
.emotion-shop-intro { clear: both; padding: 24px 0 40px; margin-bottom: 28px; border-bottom: 1px solid var(--emotion-card-border); }
.emotion-shop-intro > p { font-size: 11px; letter-spacing: .2em; color: #777; }
.emotion-shop-intro h2 { font-size: clamp(22px,3vw,36px); font-weight: 300; letter-spacing: .06em; }
.emotion-shop-intro > span { font-size: 10px; letter-spacing: .08em; color: #777; }
body.woocommerce ul.products { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; }
body.woocommerce ul.products::before, body.woocommerce ul.products::after { display: none; }
body.woocommerce ul.products li.product { float: none !important; width: auto !important; margin: 0 !important; min-width: 0; text-align: left; display: flex; flex-direction: column; padding: 22px; border: 1px solid var(--emotion-card-border); border-radius: var(--emotion-card-radius); background: linear-gradient(145deg,#fff,var(--emotion-card-paper)); box-shadow: 0 5px 18px #00000004; transition: transform var(--emotion-card-duration) ease, box-shadow var(--emotion-card-duration) ease, border-color var(--emotion-card-duration) ease; }
body.woocommerce ul.products li.product .woocommerce-LoopProduct-link { display: flex; flex-direction: column; flex: 1; color: #242424; }
body.woocommerce ul.products li.product img { width: 100%; aspect-ratio: 1; object-fit: contain; margin: 18px 0 22px; border-radius: 4px; background: #fff; }
.emotion-shop-label { display: block; font-size: 10px; letter-spacing: .15em; color: #777; border-bottom: 1px solid var(--emotion-card-border); padding-bottom: 12px; }
body.woocommerce ul.products li.product .woocommerce-loop-product__title { font-family: inherit; font-size: 17px; line-height: 1.7; font-weight: 400; letter-spacing: .025em; }
.emotion-shop-size { display: block; color: #777; font-size: 12px; margin: 6px 0; }
body.woocommerce ul.products li.product .price { font-size: 17px; font-weight: 400; margin: 8px 0 18px; }
.emotion-shop-detail { display: flex; justify-content: space-between; margin-top: auto; padding-top: 16px; border-top: 1px solid var(--emotion-card-border); font-size: 11px; letter-spacing: .08em; }
body.woocommerce ul.products li.product .button { margin: 18px 0 0; align-self: stretch; text-align: center; background: transparent; border: 1px solid #aaa; border-radius: 30px; color: #222; font-size: 12px; padding: 12px 10px; min-height: 44px; }
body.woocommerce ul.products li.product .button:hover { background: #222; color: #fff; }
body.woocommerce ul.products li.product a:focus-visible { outline: 2px solid #333; outline-offset: 4px; }
@media (hover:hover) { body.woocommerce ul.products li.product:hover { transform: translateY(-5px); border-color: #aaa; box-shadow: 0 16px 32px #0000000c; } }
@media (max-width: 767px) {
 body.woocommerce ul.products { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
 body.woocommerce ul.products li.product { padding: 12px; }
 body.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 13px; }
 body.woocommerce ul.products li.product .price { font-size: 14px; }
 .emotion-shop-label { font-size: 8px; letter-spacing: .06em; }
 .emotion-shop-size, .emotion-shop-detail { font-size: 10px; }
 .emotion-shop-intro > span { display: block; line-height: 2; }
 #emotion-product-track .emotion-product-price { font-size: 12px; }
 .emotion-card-cta { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
 body.woocommerce ul.products li.product, .emotion-card-cta > span { transition: none; }
 body.woocommerce ul.products li.product:hover, .emotion-product-link:hover .emotion-card-cta > span { transform: none; }
}

/* v2.4.2: restrained image zoom, clipped inside a stable square frame. */
:root { --emotion-image-zoom: 1.045; --emotion-image-zoom-duration: 480ms; }
.emotion-product-image-frame { display: block; overflow: hidden; aspect-ratio: 1; flex-shrink: 0; background: #fff; }
body.woocommerce ul.products li.product .emotion-product-image-frame { margin: 18px 0 22px; border-radius: 4px; }
body.woocommerce ul.products li.product .emotion-product-image-frame img,
#emotion-product-track .emotion-product-image-frame img { display: block; width: 100%; height: 100%; margin: 0; object-fit: contain; }
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
 .emotion-product-image-frame img { transition: transform var(--emotion-image-zoom-duration) cubic-bezier(.22,1,.36,1); }
 #emotion-product-track .emotion-home-product:hover .emotion-product-image-frame img,
 #emotion-product-track .emotion-home-product:focus-within .emotion-product-image-frame img,
 body.woocommerce ul.products li.product:hover .emotion-product-image-frame img,
 body.woocommerce ul.products li.product:focus-within .emotion-product-image-frame img { transform: scale(var(--emotion-image-zoom)); }
}

/* v2.7.3: fade each HOME card as one unit, without separate text entrances. */
#emotion-product-track .emotion-home-product[data-emotion-reveal] h3,
#emotion-product-track .emotion-home-product[data-emotion-reveal] p {
 animation: none; transform: none; clip-path: none;
}
@media (prefers-reduced-motion: no-preference) {
 #emotion-product-track .emotion-home-product.emotion-revealing[data-emotion-reveal] {
  animation: emotion-whole-card-fade 850ms ease both;
 }
}
@keyframes emotion-whole-card-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
 #emotion-product-track .emotion-home-product[data-emotion-reveal] { animation: none; }
}
/* Shrink the catalog sorting control visually to 70%, preserving native operation. */
body.woocommerce .woocommerce-ordering {
 transform: scale(.7); transform-origin: left center;
}

/* Mobile card motion: layout stays fixed, links and swipe remain native. */
:root { --emotion-mobile-lift: 22px; --emotion-mobile-duration: 750ms; --emotion-mobile-zoom: 1.06; }
@media(max-width:767px) and (prefers-reduced-motion:no-preference) {
 #emotion-product-track .emotion-home-product.emotion-revealing[data-emotion-reveal],
 body.woocommerce ul.products li.product.emotion-mobile-product-enter {
  animation:emotion-mobile-card-pop var(--emotion-mobile-duration) cubic-bezier(.22,1,.36,1) backwards;
 }
 .emotion-product-image-frame img { transition:transform 280ms cubic-bezier(.22,1,.36,1); }
 #emotion-product-track .emotion-home-product:active .emotion-product-image-frame img,
 body.woocommerce ul.products li.product:active .emotion-product-image-frame img { transform:scale(var(--emotion-mobile-zoom)); }
}
@keyframes emotion-mobile-card-pop {
 from { opacity:.15; transform:translateY(var(--emotion-mobile-lift)) scale(.96); }
 to { opacity:1; transform:translateY(0) scale(1); }
}
@media(prefers-reduced-motion:reduce) {
 body.woocommerce ul.products li.product.emotion-mobile-product-enter { animation:none; }
}

/* Sale presentation: retain price sizes and badge typography. */
:root { --emotion-sale-color: #b42332; }
#emotion-product-track .emotion-product-price ins,
#emotion-product-track .emotion-product-price ins .amount,
body.woocommerce .product .price ins,
body.woocommerce .product .price ins .amount {
 color: var(--emotion-sale-color);
 background: transparent;
 text-decoration: none;
}
/* Flex product links otherwise stretch the badge across the whole card. */
body.woocommerce .product .onsale,
body.woocommerce ul.products li.product .onsale {
 display: inline-block;
 align-self: flex-start;
 flex: 0 0 auto;
 width: auto;
 min-width: 0;
 height: auto;
 min-height: 0;
 padding: 4px 9px;
 color: var(--emotion-sale-color);
 line-height: 1.25;
 white-space: nowrap;
 text-transform: none;
}
