/* Storefront cards: consistent surfaces, fixed media frames and gentle motion. */
body.pn-site {
	--pn-card-edge: #e0e5ef;
	--pn-card-hover-edge: #b8afd9;
	--pn-card-wash: #f8f7fc;
	--pn-card-shadow: 0 3px 6px rgb(26 38 69 / 3%), 0 10px 26px rgb(26 38 69 / 5%);
	--pn-card-hover-shadow: 0 6px 12px rgb(26 38 69 / 5%), 0 18px 36px rgb(71 54 126 / 13%);
	--pn-card-ease: cubic-bezier(.22, .61, .36, 1);
}
@supports (color: color-mix(in srgb, red, white)) {
	body.pn-site {
		--pn-card-edge: color-mix(in srgb, var(--pn-accent) 17%, #eaf0f7);
		--pn-card-hover-edge: color-mix(in srgb, var(--pn-accent) 58%, #fff);
		--pn-card-wash: color-mix(in srgb, var(--pn-accent) 4%, #fff);
	}
}

body.pn-site .pn-category-grid > .pn-category,
body.pn-site .pn-brand-showcase--compact .pn-brand-card,
body.pn-site :is(.pn-blog-section, .pn-blog-archive.pn-blog-archive-page--with-sidebar) .pn-post-card,
:is(body.pn-site.woocommerce, body.pn-site .woocommerce, body.pn-site .pn-cart-recommendations) ul.products li.product {
	position: relative;
	border: 1px solid var(--pn-card-edge);
	border-radius: 16px;
	background: linear-gradient(180deg, #fff 65%, var(--pn-card-wash));
	box-shadow: var(--pn-card-shadow);
	transform: none;
	transition: transform .3s var(--pn-card-ease), box-shadow .3s ease, border-color .3s ease;
}

/* Each native product link keeps a separate, source-independent image stage. */
.pn-site ul.products li.product .pn-product-media {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	margin: 0 0 10px;
	padding: 0;
	overflow: hidden;
	isolation: isolate;
	background: #fff;
}
:is(body.pn-site.woocommerce, body.pn-site .woocommerce, body.pn-site .pn-cart-recommendations) ul.products li.product .pn-product-media img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	max-height: 100%;
	aspect-ratio: auto;
	margin: 0;
	padding: 0;
	border-radius: 0;
	object-fit:contain;
	transform: none;
	transform-origin: center;
	transition: transform .45s var(--pn-card-ease);
}
.pn-site ul.products li.product .pn-product-media picture { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.pn-site ul.products li.product .pn-product-media::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	box-shadow: inset 0 -1px 0 rgb(25 40 70 / 5%);
}
:is(body.pn-site.woocommerce, body.pn-site .woocommerce, body.pn-site .pn-cart-recommendations) ul.products li.product .woocommerce-loop-product__title {
	padding-inline: 14px;
	margin-bottom: 6px;
	color: var(--pn-ink);
	font-size: 15px;
	font-weight: 650;
	line-height: 1.5;
}
:is(body.pn-site.woocommerce, body.pn-site .woocommerce, body.pn-site .pn-cart-recommendations) ul.products li.product .pn-loop-rating {
	padding-inline: 14px;
	gap: 5px;
	margin-bottom: 7px;
}
:is(body.pn-site.woocommerce, body.pn-site .woocommerce) ul.products li.product .pn-loop-review-count { font-size: 12px; }
:is(body.pn-site.woocommerce, body.pn-site .woocommerce, body.pn-site .pn-cart-recommendations) ul.products li.product .price {
	padding-inline: 14px;
	margin: 0 0 11px;
	color: var(--pn-accent);
	font-size: 21px;
	font-weight: 750;
	letter-spacing: -.025em;
}
:is(body.pn-site.woocommerce, body.pn-site .woocommerce, body.pn-site .pn-cart-recommendations) ul.products li.product .button {
	min-height: 40px;
	margin: auto 12px 12px;
	padding: 9px 12px;
	color: #fff;
	font-size: 16px;
	font-weight: 650;
	letter-spacing: .01em;
	box-shadow: 0 4px 10px rgb(47 37 91 / 10%);
	transition: box-shadow .25s ease, filter .25s ease;
}
@supports (color: color-mix(in srgb, red, white)) {
	:is(body.pn-site.woocommerce, body.pn-site .woocommerce, body.pn-site .pn-cart-recommendations) ul.products li.product .button {
		background-image: linear-gradient(115deg, color-mix(in srgb, var(--pn-accent) 85%, #fff), var(--pn-accent)) !important;
	}
}
.pn-site ul.products li.product .onsale {
	z-index: 2;
	min-height: 28px;
	min-width: 0;
	padding: 5px 10px;
	border-radius: 9px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.5;
	box-shadow: 0 4px 12px rgb(24 39 70 / 12%);
}

/* Category and brand media already have fixed, independently clipped stages. */
body.pn-site .pn-category-grid > .pn-category { border-radius: 15px; }
body.pn-site .pn-category-grid > .pn-category > span { border-radius: 11px; }
body.pn-site .pn-category-grid > .pn-category strong { font-size: 13px; font-weight: 650; transition: color .25s ease; }
body.pn-site .pn-category-grid > .pn-category img.pn-category-image { transition: transform .45s var(--pn-card-ease); }
body.pn-site .pn-brand-showcase--compact .pn-brand-card { border-radius: 15px; }
body.pn-site .pn-brand-showcase--compact .pn-brand-card__media { border-radius: 10px; }
body.pn-site .pn-brand-showcase--compact .pn-brand-card__logo img { transition: transform .45s var(--pn-card-ease); }
body.pn-site .pn-brand-showcase--compact .pn-brand-card__title { transition: color .25s ease; }

/* A post's image can zoom without entering its title/date area. */
body.pn-site .pn-post-media { position: relative; display: block; height: 150px; overflow: hidden; isolation: isolate; }
body.pn-site .pn-post-card > a > .pn-post-media { width: 100%; margin: 0; padding: 0; }
body.pn-site .pn-post-media :is(img, .pn-post-placeholder) { display: block; width: 100%; height: 100%; object-fit:contain; }
body.pn-site .pn-post-media .pn-post-placeholder { display: grid; place-items: center; }
body.pn-site .pn-blog-archive.pn-blog-archive-page--with-sidebar .pn-post-media { height: 175px; }
body.pn-site .pn-blog-section .pn-post-media { position: absolute; inset: 0; height: 100%; }
body.pn-site :is(.pn-blog-section, .pn-blog-archive.pn-blog-archive-page--with-sidebar) .pn-post-media img {
	transform: none;
	filter: none;
	transition: transform .5s var(--pn-card-ease);
}
body.pn-site .pn-post-card .pn-post-overlay { position: relative; }
body.pn-site .pn-blog-section .pn-post-card .pn-post-overlay { position: absolute; padding: 12px; }
body.pn-site .pn-blog-section .pn-post-card > a::before { background: linear-gradient(180deg, rgb(12 24 45 / 0%) 25%, rgb(12 24 45 / 24%) 50%, rgb(12 24 45 / 82%) 100%); }
body.pn-site .pn-blog-section .pn-post-card .pn-post-date { color: #e1eaf5; }
body.pn-site .pn-blog-section .pn-post-card .pn-readmore { color: #fff; font-weight: 650; }
body.pn-site :is(.pn-blog-section, .pn-blog-archive.pn-blog-archive-page--with-sidebar) .pn-post-badge { border-radius: 8px; box-shadow: 0 3px 10px rgb(15 30 55 / 15%); }
body.pn-site .pn-blog-archive.pn-blog-archive-page--with-sidebar .pn-post-card h3 { font-size: 16px; font-weight: 650; }

/* Small campaign movements remain behind the independently positioned copy. */
body.pn-site .pn-promo { border: 1px solid rgb(34 67 55 / 5%); border-radius: 16px; transition: box-shadow .3s ease, transform .3s var(--pn-card-ease); }
body.pn-site :is(.pn-hero, .pn-wide-banner) { border-radius: 18px; }
body.pn-site :is(.pn-promo img, .pn-hero-image, .pn-wide-banner img) { transition: transform .5s var(--pn-card-ease); }

/* Neutralize older hover rules on touch; pointer effects are enabled below. */
body.pn-site .pn-category-grid > .pn-category:hover,
body.pn-site .pn-brand-showcase--compact .pn-brand-card:hover,
body.pn-site :is(.pn-blog-section, .pn-blog-archive.pn-blog-archive-page--with-sidebar) .pn-post-card:hover,
:is(body.pn-site.woocommerce, body.pn-site .woocommerce, body.pn-site .pn-cart-recommendations) ul.products li.product:hover { transform: none; }

body.pn-site .pn-category-grid > .pn-category:focus-visible,
body.pn-site .pn-brand-showcase--compact .pn-brand-card:focus-visible,
body.pn-site :is(.pn-blog-section, .pn-blog-archive.pn-blog-archive-page--with-sidebar) .pn-post-card:has(:focus-visible),
:is(body.pn-site.woocommerce, body.pn-site .woocommerce, body.pn-site .pn-cart-recommendations) ul.products li.product:has(:focus-visible) {
	border-color: var(--pn-card-hover-edge);
	box-shadow: var(--pn-card-hover-shadow);
}

@media (hover: hover) and (pointer: fine) {
	body.pn-site .pn-category-grid > .pn-category:hover,
	body.pn-site .pn-brand-showcase--compact .pn-brand-card:hover,
	body.pn-site :is(.pn-blog-section, .pn-blog-archive.pn-blog-archive-page--with-sidebar) .pn-post-card:hover,
	:is(body.pn-site.woocommerce, body.pn-site .woocommerce, body.pn-site .pn-cart-recommendations) ul.products li.product:hover {
		transform: translateY(-4px);
		border-color: var(--pn-card-hover-edge);
		box-shadow: var(--pn-card-hover-shadow);
	}
	:is(body.pn-site.woocommerce, body.pn-site .woocommerce, body.pn-site .pn-cart-recommendations) ul.products li.product:hover .pn-product-media img { transform: scale(1.055); }
	body.pn-site .pn-category-grid > .pn-category:hover img.pn-category-image { transform: scale(1.06) !important; }
	body.pn-site .pn-brand-showcase--compact .pn-brand-card:hover .pn-brand-card__logo img { transform: scale(1.04); }
	body.pn-site :is(.pn-blog-section, .pn-blog-archive.pn-blog-archive-page--with-sidebar) .pn-post-card:hover .pn-post-media img { transform: scale(1.045); }
	body.pn-site .pn-promo:hover { transform: translateY(-3px); box-shadow: var(--pn-card-hover-shadow); }
	body.pn-site .pn-promo:hover img { transform: scale(1.035); }
	body.pn-site .pn-hero:hover .pn-hero-image,
	body.pn-site .pn-wide-banner:hover img { transform: scale(1.025); }
	:is(body.pn-site.woocommerce, body.pn-site .woocommerce) ul.products li.product:hover .button { color: #fff; box-shadow: 0 6px 16px rgb(47 37 91 / 20%); }
	:is(body.pn-site.woocommerce, body.pn-site .woocommerce) ul.products li.product:hover .price { color: var(--pn-accent); }
	:is(body.pn-site.woocommerce, body.pn-site .woocommerce) ul.products li.product:hover .woocommerce-loop-product__title,
	body.pn-site .pn-category-grid > .pn-category:hover strong,
	body.pn-site .pn-brand-showcase--compact .pn-brand-card:hover .pn-brand-card__title { color: var(--pn-accent); }
	body.pn-site .pn-blog-section .pn-post-card:hover h3,
	body.pn-site .pn-blog-section .pn-post-card:hover .pn-post-date { color: #fff; }
}

/* Keyboard navigation has the same visual emphasis without requiring a mouse. */
:is(body.pn-site.woocommerce, body.pn-site .woocommerce) ul.products li.product:has(:focus-visible) .pn-product-media img { transform: scale(1.035); }
body.pn-site .pn-category-grid > .pn-category:focus-visible img.pn-category-image { transform: scale(1.035) !important; }
body.pn-site .pn-brand-showcase--compact .pn-brand-card:focus-visible .pn-brand-card__logo img { transform: scale(1.035); }
body.pn-site :is(.pn-blog-section, .pn-blog-archive.pn-blog-archive-page--with-sidebar) .pn-post-card:has(:focus-visible) .pn-post-media img { transform: scale(1.035); }

/* Respect the panel's catalog choices as well as the preferred motion setting. */
body.pn-site.pn-catalog-modern ul.products li.product { border-radius: 20px !important; }
@media (hover: hover) and (pointer: fine) {
	body.pn-site.pn-catalog-modern ul.products li.product:hover { box-shadow: var(--pn-card-hover-shadow) !important; }
}
body.pn-site.pn-catalog-minimal ul.products li.product { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; background: transparent !important; }
@media (max-width: 600px) {
	:is(body.pn-site.woocommerce, body.pn-site .woocommerce) ul.products li.product .woocommerce-loop-product__title { font-size: 13px; padding-inline: 11px; }
	:is(body.pn-site.woocommerce, body.pn-site .woocommerce) ul.products li.product .pn-loop-rating,
	:is(body.pn-site.woocommerce, body.pn-site .woocommerce) ul.products li.product .price { padding-inline: 11px; }
	:is(body.pn-site.woocommerce, body.pn-site .woocommerce) ul.products li.product .price { font-size: 18px; }
	:is(body.pn-site.woocommerce, body.pn-site .woocommerce) ul.products li.product .button { min-height: 40px; padding-inline: 7px; margin-inline: 9px; font-size: 15px; }
	body.pn-site .pn-category-grid > .pn-category strong { font-size: 12px; }
}
@media (max-width: 440px) {
	body.pn-site .pn-post-media { height: 120px; }
	body.pn-site .pn-blog-section .pn-post-media { height: 100%; }
}
@media (prefers-reduced-motion: reduce) {
	body.pn-site :is(.pn-category, .pn-brand-card, .pn-post-card, .pn-promo, .pn-hero, .pn-wide-banner),
	body.pn-site ul.products li.product,
	body.pn-site :is(.pn-product-media, .pn-post-media, .pn-brand-card__logo) img,
	body.pn-site .pn-category img.pn-category-image,
	body.pn-site .pn-category-grid > .pn-category:is(:hover, :focus-visible) img.pn-category-image,
	body.pn-site .pn-category .pn-icon,
	body.pn-site :is(.pn-promo img, .pn-hero-image, .pn-wide-banner img) {
		transform: none !important;
		transition: none !important;
	}
}