/* ==========================================================================
   Motion & hover effects — matched to the design preview
   (sey-commerce-hub.vercel.app). Loaded after the other theme styles.
   Everything here is decoration: content stays usable without it, and
   prefers-reduced-motion turns the movement off.
   ========================================================================== */

/* Keyframes ---------------------------------------------------------------- */
@keyframes sey-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes sey-fade-up { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes sey-pop-scale { 0% { transform: scale(1); } 45% { transform: scale(1.28); } 100% { transform: scale(1); } }
@keyframes sey-hero-drift { from { transform: scale(1) translateX(.6%); } to { transform: scale(1.04) translate(-.6%, -.4%); } }
@keyframes sey-hero-sweep {
	0% { opacity: 0; transform: translateX(-70%) skewX(-12deg); }
	12% { opacity: 1; }
	55%, 100% { opacity: 0; transform: translateX(70%) skewX(-12deg); }
}
@keyframes sey-marquee { to { transform: translateX(-50%); } }

/* Scroll reveal: sections fade up, titles rise, grids stagger, images unmask */
.sey-js .reveal { opacity: 0; transform: translateY(14px); transition: opacity .6s, transform .6s cubic-bezier(.2,.7,.2,1); }
.sey-js .reveal.is-in { opacity: 1; transform: none; }
.rise-mask { display: block; overflow: hidden; padding-bottom: .04em; }
.rise-mask .rise { display: block; }
.sey-js .reveal .rise { transform: translateY(105%); transition: transform .9s cubic-bezier(.2,.7,.2,1) 50ms; }
.sey-js .reveal.is-in .rise { transform: none; }
.sey-js .reveal :is(.cat-tiles, .products-grid, .pbc__grid, .collections, .sell-cta__points, .carousel__track) > * {
	opacity: 0; transform: translateY(18px);
	transition: opacity .7s, transform .8s cubic-bezier(.2,.7,.2,1);
	transition-delay: calc(var(--i, 0) * 70ms);
}
.sey-js .reveal.is-in :is(.cat-tiles, .products-grid, .pbc__grid, .collections, .sell-cta__points, .carousel__track) > * { opacity: 1; transform: none; }
.img-reveal { position: absolute; inset: 0; z-index: 0; display: block; overflow: hidden; }
.sey-js .reveal .img-reveal {
	clip-path: inset(18% 0 0); transform: scale(1.05);
	transition: clip-path 1.1s cubic-bezier(.2,.7,.2,1), transform 1.4s cubic-bezier(.2,.7,.2,1);
	transition-delay: calc(var(--i, 0) * 70ms);
}
.sey-js .reveal.is-in .img-reveal { clip-path: inset(0); transform: none; }

/* Header ------------------------------------------------------------------- */
.search-form__box { border-width: 2px; transition: box-shadow .15s var(--ease); }
.search-form__box:focus-within { box-shadow: 0 0 0 4px rgba(255,212,0,.5); }
.search-form__submit { transition: background-color .15s var(--ease), color .15s var(--ease); }
.search-form__submit:hover { background: var(--c-accent); color: var(--c-text); }
.header-action__label { color: rgba(26,26,26,.8); font-weight: 600; transition: color .15s var(--ease); }
.header-action:hover .header-action__label { color: var(--c-text); }
.header-action .icon.is-popping { animation: sey-pop-scale .35s cubic-bezier(.3,1.4,.5,1) both; }

/* Section links: underline grows from the left, arrow nudges right */
.section-head .link-arrow {
	padding-bottom: 4px; font-size: 12px; letter-spacing: .04em;
	background: linear-gradient(currentColor, currentColor) left calc(100% - 2px) / 0 1px no-repeat;
	transition: background-size .3s var(--ease);
}
.section-head .link-arrow:hover { background-size: calc(100% - 20px) 1px; }
.link-arrow:hover .icon { transform: translateX(4px); }

/* Hero: slow drift, light sweep, pointer parallax, text slides up ---------- */
.hero__slide { transition: opacity 1s ease-out, visibility 1s; }
.hero__media { inset: -16px; transform: translate3d(calc(var(--px, 0) * -14px), calc(var(--py, 0) * -10px), 0); transition: transform .7s ease-out; }
.hero__media img { will-change: transform; animation: sey-hero-drift 26s ease-in-out infinite alternate; }
.hero__sweep { position: absolute; inset: 0; overflow: hidden; pointer-events: none; mix-blend-mode: soft-light; }
.hero__sweep span {
	position: absolute; top: 0; bottom: 0; left: 25%; width: 50%; opacity: 0;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,.45), transparent);
	animation: sey-hero-sweep 11s ease-in-out 1.5s infinite;
}
.hero__media::after { z-index: 1; }
.hero__content { opacity: 0; transform: translateY(16px); transition: opacity .7s ease-out, transform .7s ease-out; }
.hero__slide.is-active .hero__content { opacity: 1; transform: none; transition-delay: .15s; }
.hero__btn { background: rgba(255,255,255,.1); transition: background-color .15s var(--ease), color .15s var(--ease); }
.hero__cta { transition: background-color .15s var(--ease), color .15s var(--ease), border-color .15s var(--ease); }
.hero__cta .icon, .btn .icon { transition: transform .15s var(--ease); }
.hero__cta:hover .icon { transform: translateX(2px); }
.hero__cta:hover { --btn-bg: var(--c-accent); --btn-bd: var(--c-accent); --btn-fg: var(--c-text); }

/* Shop-by-category tiles ---------------------------------------------------- */
.cat-tile a::after { background: linear-gradient(0deg, rgba(0,0,0,.7) 0%, rgba(0,0,0,.1) 50%, transparent 100%); }
.cat-tile img { transition: transform 1.4s cubic-bezier(.2,.7,.2,1); }
.cat-tile a:hover img { transform: scale(1.07); }
.cat-tile__go {
	position: absolute; z-index: 2; top: 10px; right: 10px; display: grid; place-items: center; width: 32px; height: 32px;
	border-radius: var(--r-sm); background: var(--c-white); color: var(--c-text); opacity: 0; transition: opacity .3s var(--ease);
}
.cat-tile__go .icon { width: 16px; height: 16px; }
.cat-tile a:hover .cat-tile__go, .cat-tile a:focus-visible .cat-tile__go { opacity: 1; }

/* Products by category panels -------------------------------------------- */
.pbc-panel__img img { transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.pbc-panel__items a:hover img { transform: scale(1.06); }
.pbc-panel__name { color: rgba(26,26,26,.75); transition: color .15s var(--ease); }
.pbc-panel__items a:hover .pbc-panel__name { color: var(--c-text); }
.pbc-panel__head .link-arrow { color: rgba(26,26,26,.7); transition: color .15s var(--ease); }
.pbc-panel__head .link-arrow:hover { color: var(--c-text); }
.pbc-panel__head .link-arrow .icon { transition: transform .3s var(--ease); }
.pbc-panel__head .link-arrow:hover .icon { transform: rotate(90deg); }

/* Tourist collections -------------------------------------------------------- */
.collection img { transition: transform 1.6s cubic-bezier(.2,.7,.2,1); }
.collection a:hover img { transform: scale(1.06); }
.collection a::after { background: linear-gradient(180deg, rgba(0,0,0,.25) 0%, transparent 30%, transparent 45%, rgba(0,0,0,.75) 100%); }
.collection__btn { margin-top: 12px; transition: background-color .3s var(--ease), border-color .3s var(--ease); }
.collection a:hover .collection__btn { --btn-bg: var(--c-accent); --btn-bd: var(--c-accent); background: var(--c-accent); border-color: var(--c-accent); }

/* Footer: marquee trust strip, link and badge hovers ------------------------ */
.trustbar { overflow: hidden; }
.trustbar__list.marquee { display: flex; justify-content: flex-start; gap: 0; width: max-content; max-width: none; margin: 0; padding-block: 20px; animation: sey-marquee 32s linear infinite; }
.trustbar__list.marquee:hover { animation-play-state: paused; }
.trustbar .trustbar__list.marquee { flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; gap: 0; }
@media (max-width: 767px) { .trustbar .trustbar__list.marquee { padding-block: 16px; font-size: 11px; } .trustbar__list.marquee li { padding-right: 40px; } }
.trustbar__list.marquee li { flex-shrink: 0; gap: 12px; padding-right: 56px; }
.trustbar__list .icon { width: 16px; height: 16px; }
.footer-col a { color: rgba(255,255,255,.8); transition: color .15s var(--ease); }
.footer-col a:hover { color: var(--c-accent); text-decoration: none; }
.socials a { width: 36px; height: 36px; border-radius: 50%; border: 1px solid rgba(255,255,255,.15); color: rgba(255,255,255,.8); transition: background-color .15s var(--ease), border-color .15s var(--ease), color .15s var(--ease); }
.socials a:hover { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-text); }
.app-badge { border-radius: 12px; border: 1px solid rgba(255,255,255,.15); background: rgba(255,255,255,.04); transition: background-color .15s var(--ease), border-color .15s var(--ease); }
.app-badge:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.4); }

/* Shop / category page ------------------------------------------------------ */
.subcat { border: 0; border-radius: 16px; gap: 8px; font-weight: 500; transition: box-shadow .15s var(--ease); }
.subcat:hover { box-shadow: 0 1px 2px rgba(10,10,10,.04), 0 8px 24px -12px rgba(10,10,10,.12); }
.subcat:focus-visible { outline: none; box-shadow: 0 0 0 4px rgba(255,212,0,.5); }
.subcat.is-active { font-weight: 600; box-shadow: none; }
.subcat__img { width: 100%; height: 60px; }
.subcat__img img { width: auto; height: 100%; max-width: 96px; max-height: 60px; object-fit: contain; transition: transform .5s var(--ease); }
.subcat:hover .subcat__img img { transform: scale(1.1); }
.subcat__img--icon, .subcat.is-active .subcat__img--icon { width: 56px; height: 56px; border-radius: 50%; background: var(--c-white); color: var(--c-text); }
.subcat__img--icon .icon { width: 24px; height: 24px; }
.subcat__name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 14px; line-height: 1.25; }
.filter { padding-block: 14px; }
.filter__summary { padding: 0; font-size: 13.5px; font-weight: 600; }
.filter__summary .icon { width: 16px; height: 16px; transition: transform .2s var(--ease); }
.filter__body { padding: 12px 0 0; }
.filter__opt { min-height: 0; padding-block: 4px; font-size: 13px; color: rgba(26,26,26,.85); transition: color .15s var(--ease); }
.filter__opt:hover { color: var(--c-text); }
.filter__count { font-size: 11.5px; }
.filter__price input { min-height: 40px; height: 40px; padding-inline: 12px; border-radius: 8px; font-size: 13px; }
.filter__chips { gap: 6px; margin-top: 10px; }
.filter__chips .chip { min-height: 0; padding: 4px 10px; font-size: 11.5px; font-weight: 600; }
.shop-toolbar__count { font-size: 13.5px; color: var(--c-muted); }
.shop-toolbar__count b { color: var(--c-text); font-weight: 700; }
.woocommerce-ordering label { font-size: 13px; color: var(--c-muted); }
.woocommerce-ordering select { height: 40px; min-height: 40px; min-width: 0; padding: 0 36px 0 16px; border-radius: var(--r-pill); border-color: var(--c-line); font-size: 13px; font-weight: 700; }
.woocommerce-ordering select:focus { border-color: var(--c-text); }
.load-more .btn--outline:hover { --btn-bg: var(--c-text); --btn-fg: var(--c-white); --btn-bd: var(--c-text); }
@media (max-width: 767px) { .subcat { width: 112px; height: 108px; padding: 10px; } .subcat__img { height: 48px; } .subcat__img img { max-width: 80px; max-height: 48px; } .subcat__name { font-size: 12.5px; } }

/* Product page ------------------------------------------------------------- */
.pdp-gallery__slide.is-fading img { animation: sey-fade-in .2s ease both; }
.pdp-gallery__thumb { border: 0; border-radius: 12px; background: var(--c-line-2); box-shadow: 0 0 0 2px transparent; transition: box-shadow .15s var(--ease); }
.pdp-gallery__thumb:hover { box-shadow: 0 0 0 2px var(--c-line); }
.pdp-gallery__thumb.is-active { box-shadow: 0 0 0 2px var(--c-text); }
.pdp-gallery__thumbs { padding: 2px; }
.pdp-gallery__nav.icon-btn { width: 40px; height: 40px; background: rgba(255,255,255,.95); box-shadow: 0 1px 2px rgba(10,10,10,.04), 0 8px 24px -12px rgba(10,10,10,.12); transition: background-color .15s var(--ease); }
.pdp-gallery__nav.icon-btn:hover { background: var(--c-accent); }
.pdp-gallery__nav--prev { left: 12px; }
.pdp-gallery__nav--next { right: 12px; }
.pdp-buy .single_add_to_cart_button, .pdp-buy__now { height: 48px; min-height: 48px; border-radius: var(--r-pill); font-size: 14.5px; font-weight: 700; transition: background-color .15s var(--ease), transform .1s var(--ease); }
.pdp-buy .single_add_to_cart_button:hover { --btn-bg: var(--c-dark-2); --btn-bd: var(--c-dark-2); }
.pdp-buy .single_add_to_cart_button:active, .pdp-buy__now:active { transform: scale(.98); }
.pdp-buy__now:hover { --btn-bg: #f2c200; --btn-bd: #f2c200; }
.pdp-buy__wish { transition: border-color .15s var(--ease); }
.pdp-buy__wish:hover { border-color: var(--c-text); }
.price .woocommerce-Price-currencySymbol { margin-right: 0; }

/* Cart & shared controls -------------------------------------------------- */
.shop-hero .container, .cart-page, .pdp__top { animation: sey-fade-in .35s ease both; }
.product-remove .remove.text-button { transition: color .15s var(--ease); }
.product-remove .remove.text-button:hover { color: var(--c-sale); text-decoration: none; }
.wc-proceed-to-checkout .checkout-button:hover { --btn-bg: #f2c200; --btn-bd: #f2c200; }
.carousel__nav.icon-btn { transition: background-color .15s var(--ease), opacity .15s; }
.carousel__nav.icon-btn:hover { background: var(--c-accent); }
.breadcrumb a, .woocommerce-breadcrumb a { transition: color .15s var(--ease); }
.breadcrumb a:hover, .woocommerce-breadcrumb a:hover { color: var(--c-text); text-decoration: underline; }

/* Reduced motion: keep everything visible and still ------------------------- */
@media (prefers-reduced-motion: reduce) {
	.sey-js .reveal, .sey-js .reveal .rise, .sey-js .reveal .img-reveal,
	.sey-js .reveal :is(.cat-tiles, .products-grid, .pbc__grid, .collections, .sell-cta__points, .carousel__track) > * {
		opacity: 1 !important; transform: none !important; clip-path: none !important;
	}
	.hero__media img, .hero__sweep span, .trustbar__list.marquee { animation: none !important; }
	.hero__sweep { display: none; }
	.hero__media { transform: none; }
}