/**
 * 9XO Motta Child ? main stylesheet.
 *
 * Phase 2C: product-card UI refinement (shop / category / loops).
 * Phase 2D: category / catalog page refinement (header, toolbar, empty, grid).
 * Header responsive: snap to Motta desktop/mobile layouts without mid-width scatter.
 * Visual presentation only ? Motta behaviour and SEO content remain intact.
 */

:root {
	--nxo-card-radius: 8px;
	--nxo-card-gap-mobile: 18px;
	--nxo-card-text: #1d2128;
	--nxo-card-muted: #7c818b;
	--nxo-card-sale: #e11d48;
	--nxo-card-surface: #f7f6f9;
	--nxo-card-atc: #1d2128;
	--nxo-card-atc-text: #ffffff;
	--nxo-catalog-border: #ecf0f4;
	--nxo-catalog-surface: #f7f6f9;
	--nxo-catalog-radius: 8px;
}

/* ==========================================================================
   Phase 3A ? Help Center visual redesign (page ID 328)
   Presentation-only treatment of the existing Elementor/Motta content.
   ========================================================================== */

body.page-id-328 {
	--nxo-help-accent: #65558f;
	--nxo-help-accent-dark: #493a70;
	--nxo-help-accent-soft: #eee9f7;
	--nxo-help-rose-soft: #fff0f5;
	--nxo-help-surface: #ffffff;
	--nxo-help-page: #fbfafc;
	--nxo-help-text: #1d2128;
	--nxo-help-muted: #59606c;
	--nxo-help-border: #e5e1eb;
	background: var(--nxo-help-page);
}

/* Hero: clearer hierarchy, less empty height, and a brand-soft backdrop. */
body.page-id-328 .elementor-328 .elementor-element.elementor-element-25c68cd7 {
	overflow: hidden;
	padding: 82px 24px 132px !important;
	background-color: #f5f1fa !important;
	background-image:
		radial-gradient(circle at 12% 18%, rgba(225, 29, 72, 0.1), transparent 28%),
		radial-gradient(circle at 88% 8%, rgba(101, 85, 143, 0.16), transparent 30%) !important;
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-3111fe1a > .elementor-widget-container {
	padding-bottom: 14px !important;
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-3111fe1a .motta-heading {
	max-width: 760px;
	margin-inline: auto;
	color: var(--nxo-help-text);
	font-size: clamp(2.5rem, 5vw, 3.75rem) !important;
	line-height: 1.08;
	letter-spacing: -0.035em;
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-29e80fec > .elementor-widget-container {
	padding-bottom: 32px !important;
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-29e80fec .motta-heading {
	color: var(--nxo-help-muted);
	font-size: 1.0625rem !important;
	line-height: 1.55;
}

/* Help search: preserve Motta behaviour while making focus and touch states clear. */
body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .motta-search__wrapper {
	max-width: 680px !important;
	margin-inline: auto;
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .header-search__form {
	padding: 5px;
	border: 1px solid rgba(101, 85, 143, 0.24);
	border-radius: 999px;
	background: var(--nxo-help-surface);
	box-shadow: 0 16px 40px rgba(73, 58, 112, 0.13);
	transition: border-color 180ms ease, box-shadow 180ms ease;
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .header-search__form:focus-within {
	border-color: var(--nxo-help-accent);
	box-shadow:
		0 16px 40px rgba(73, 58, 112, 0.13),
		0 0 0 3px rgba(101, 85, 143, 0.2);
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .header-search__field {
	min-height: 48px;
	padding-inline: 20px;
	color: var(--nxo-help-text);
	font-size: 1rem;
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .header-search__field::placeholder {
	color: #676e79;
	opacity: 1;
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .motta-search__button {
	width: 48px;
	min-width: 48px;
	height: 48px;
	border-radius: 50%;
	background: var(--nxo-help-text);
	color: #fff;
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .header-search__trending {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 8px 10px;
	margin-top: 18px;
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .header-search__trending--title {
	color: var(--nxo-help-muted);
	font-size: 0.8125rem !important;
	font-weight: 600;
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .header-search__trending-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin: 0;
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .header-search__trending-links li {
	margin: 0;
}

body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .header-search__trending-links li a {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	padding: 6px 12px;
	border: 1px solid rgba(101, 85, 143, 0.2);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.68);
	color: var(--nxo-help-accent-dark);
	font-size: 0.8125rem !important;
	line-height: 1.2;
	text-decoration: none;
}

/* Support/FAQ category cards. */
body.page-id-328 .elementor-328 .elementor-element.elementor-element-6cedb591 {
	margin-top: -72px !important;
	padding: 0 0 80px !important;
}

body.page-id-328 .motta-articles-grid__items {
	margin: -10px;
}

body.page-id-328 .motta-articles-grid__item {
	padding: 10px;
}

body.page-id-328 .motta-articles-grid__wrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 100%;
	overflow: hidden;
	padding: 30px !important;
	border: 1px solid var(--nxo-help-border);
	border-radius: 18px;
	background: var(--nxo-help-surface);
	box-shadow: 0 10px 28px rgba(40, 32, 60, 0.07);
	transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

body.page-id-328 .motta-articles-grid__wrapper::after {
	position: absolute;
	inset: 0 0 auto;
	height: 3px;
	background: linear-gradient(90deg, var(--nxo-help-accent), #d96b8d);
	content: "";
}

body.page-id-328 .motta-articles-grid__category {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 16px;
}

body.page-id-328 .motta-articles-grid__category::before {
	display: inline-grid;
	width: 42px;
	height: 42px;
	flex: 0 0 42px;
	place-items: center;
	border-radius: 12px;
	background: var(--nxo-help-accent-soft);
	color: var(--nxo-help-accent-dark);
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1;
	content: "?";
}

body.page-id-328 .motta-articles-grid__item:nth-child(1) .motta-articles-grid__category::before {
	content: "?";
}

body.page-id-328 .motta-articles-grid__item:nth-child(2) .motta-articles-grid__category::before {
	content: "?";
}

body.page-id-328 .motta-articles-grid__item:nth-child(3) .motta-articles-grid__category::before {
	content: "?";
}

body.page-id-328 .motta-articles-grid__item:nth-child(4) .motta-articles-grid__category::before {
	content: "?";
}

body.page-id-328 .motta-articles-grid__item:nth-child(5) .motta-articles-grid__category::before {
	content: "?";
}

body.page-id-328 .motta-articles-grid__category a {
	color: var(--nxo-help-text);
	font-size: 1.125rem;
	line-height: 1.3;
	text-decoration: none;
}

body.page-id-328 .motta-articles-grid__list {
	flex: 1 1 auto;
	margin: 0 0 20px;
}

body.page-id-328 .motta-articles-grid__list-item {
	border-bottom: 1px solid #efedf3;
}

body.page-id-328 .motta-articles-grid__list-item:last-child {
	border-bottom: 0;
}

body.page-id-328 .motta-articles-grid__list a {
	display: block;
	padding: 8px 0;
	color: var(--nxo-help-muted);
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.45;
	text-decoration: none;
}

body.page-id-328 .motta-articles-grid__wrapper .motta-button--view-more {
	align-self: flex-start;
	min-height: 40px;
	margin-top: auto;
	padding: 9px 17px;
	border: 1px solid var(--nxo-help-accent);
	border-radius: 999px;
	background: transparent;
	color: var(--nxo-help-accent-dark);
	font-weight: 600;
	line-height: 1.2;
}

body.page-id-328 .motta-articles-grid a:focus-visible,
body.page-id-328 .header-search__trending-links a:focus-visible,
body.page-id-328 .motta-search__button:focus-visible {
	outline: 3px solid rgba(101, 85, 143, 0.55);
	outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
	body.page-id-328 .motta-articles-grid__wrapper:hover {
		transform: translateY(-3px);
		border-color: rgba(101, 85, 143, 0.32);
		box-shadow: 0 16px 36px rgba(40, 32, 60, 0.12);
	}

	body.page-id-328 .motta-articles-grid__list a:hover {
		color: var(--nxo-help-accent-dark);
	}

	body.page-id-328 .motta-articles-grid__wrapper .motta-button--view-more:hover {
		background: var(--nxo-help-accent);
		color: #fff;
	}
}

@media (max-width: 767px) {
	body.page-id-328 .elementor-328 .elementor-element.elementor-element-25c68cd7 {
		padding: 48px 18px 88px !important;
	}

	body.page-id-328 .elementor-328 .elementor-element.elementor-element-3111fe1a .motta-heading {
		font-size: 2rem !important;
		letter-spacing: -0.025em;
	}

	body.page-id-328 .elementor-328 .elementor-element.elementor-element-29e80fec > .elementor-widget-container {
		padding-bottom: 24px !important;
	}

	body.page-id-328 .elementor-328 .elementor-element.elementor-element-29e80fec .motta-heading {
		font-size: 0.9375rem !important;
	}

	body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .header-search__field {
		min-height: 44px;
		padding-inline: 14px;
		font-size: 0.9375rem;
	}

	body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .motta-search__button {
		width: 44px;
		min-width: 44px;
		height: 44px;
	}

	body.page-id-328 .elementor-328 .elementor-element.elementor-element-18ef081b .header-search__trending {
		margin-top: 14px;
	}

	body.page-id-328 .elementor-328 .elementor-element.elementor-element-6cedb591 {
		margin-top: -48px !important;
		padding: 0 0 56px !important;
	}

	body.page-id-328 .motta-articles-grid__items {
		margin: -7px;
	}

	body.page-id-328 .motta-articles-grid__item {
		padding: 7px;
	}

	body.page-id-328 .motta-articles-grid__wrapper {
		padding: 22px !important;
		border-radius: 14px;
	}

	body.page-id-328 .motta-articles-grid__category {
		margin-bottom: 12px;
	}

	body.page-id-328 .motta-articles-grid__category::before {
		width: 38px;
		height: 38px;
		flex-basis: 38px;
		border-radius: 10px;
		font-size: 1.125rem;
	}

	body.page-id-328 .motta-articles-grid__list {
		margin-bottom: 16px;
	}
}

/* ==========================================================================
   Help article + help category pages
   Matches Phase 3A Help Center visual identity for Motta single/archive
   templates (e.g. /help-article/how-do-i-place-an-order/).
   ========================================================================== */

body.single-motta_help_article,
body.motta-help-archive {
	--nxo-help-accent: #65558f;
	--nxo-help-accent-dark: #493a70;
	--nxo-help-accent-soft: #eee9f7;
	--nxo-help-surface: #ffffff;
	--nxo-help-page: #fbfafc;
	--nxo-help-text: #1d2128;
	--nxo-help-muted: #59606c;
	--nxo-help-border: #e5e1eb;
	background: var(--nxo-help-page);
}

/* Shared help search strip above breadcrumbs. */
body.single-motta_help_article .search-bar-hc,
body.motta-help-archive .search-bar-hc {
	padding: 36px 20px 42px;
	background-color: #f5f1fa;
	background-image:
		radial-gradient(circle at 12% 18%, rgba(225, 29, 72, 0.08), transparent 28%),
		radial-gradient(circle at 88% 8%, rgba(101, 85, 143, 0.14), transparent 30%);
}

body.single-motta_help_article .search-bar-hc__title,
body.motta-help-archive .search-bar-hc__title {
	margin-bottom: 16px;
	color: var(--nxo-help-text);
	font-size: clamp(1.5rem, 3vw, 1.875rem);
	letter-spacing: -0.02em;
}

body.single-motta_help_article .search-bar-hc > .container,
body.motta-help-archive .search-bar-hc > .container {
	max-width: 680px;
}

body.single-motta_help_article .search-bar-hc__form,
body.motta-help-archive .search-bar-hc__form {
	padding: 5px;
	border: 1px solid rgba(101, 85, 143, 0.24);
	border-radius: 999px;
	background: var(--nxo-help-surface);
	box-shadow: 0 14px 36px rgba(73, 58, 112, 0.12);
	transition: border-color 180ms ease, box-shadow 180ms ease;
}

body.single-motta_help_article .search-bar-hc__form:focus-within,
body.motta-help-archive .search-bar-hc__form:focus-within {
	border-color: var(--nxo-help-accent);
	box-shadow:
		0 14px 36px rgba(73, 58, 112, 0.12),
		0 0 0 3px rgba(101, 85, 143, 0.2);
}

body.single-motta_help_article .search-bar-hc__field,
body.motta-help-archive .search-bar-hc__field {
	min-height: 48px;
	padding: 0 20px;
	padding-right: 64px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: var(--nxo-help-text);
	font-size: 1rem;
	box-shadow: none;
}

body.single-motta_help_article .search-bar-hc__field::placeholder,
body.motta-help-archive .search-bar-hc__field::placeholder {
	color: #676e79;
	opacity: 1;
}

body.single-motta_help_article .search-bar-hc__submit,
body.motta-help-archive .search-bar-hc__submit {
	top: 5px;
	right: 5px;
	bottom: 5px;
	width: 48px;
	min-width: 48px;
	height: auto;
	border-radius: 50%;
	background: var(--nxo-help-text);
	color: #fff;
}

/* Breadcrumbs + category header. */
body.single-motta_help_article .page-header-hc,
body.motta-help-archive .page-header-hc {
	background: transparent;
}

body.single-motta_help_article .page-header-hc > .container,
body.motta-help-archive .page-header-hc > .container,
body.single-motta_help_article .site-content > .container,
body.motta-help-archive .site-content > .container {
	max-width: 820px;
}

body.single-motta_help_article .page-header-hc .site-breadcrumb,
body.motta-help-archive .page-header-hc .site-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	padding: 18px 0 12px;
	color: var(--nxo-help-muted);
	font-size: 0.8125rem;
	line-height: 1.4;
}

body.single-motta_help_article .page-header-hc .site-breadcrumb a,
body.motta-help-archive .page-header-hc .site-breadcrumb a {
	color: var(--nxo-help-accent-dark);
	text-decoration: none;
}

body.single-motta_help_article .page-header-hc .site-breadcrumb a:hover,
body.motta-help-archive .page-header-hc .site-breadcrumb a:hover {
	color: var(--nxo-help-accent);
	text-decoration: underline;
}

body.single-motta_help_article .page-header-hc .site-breadcrumb .motta-svg-icon,
body.motta-help-archive .page-header-hc .site-breadcrumb .motta-svg-icon {
	width: 12px;
	height: 12px;
	color: #9aa0aa;
}

body.single-motta_help_article .page-header__content,
body.motta-help-archive .page-header__content {
	padding-bottom: 18px !important;
	border-bottom: 0 !important;
}

body.single-motta_help_article .page-header__title,
body.motta-help-archive .page-header__title {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 8px 14px;
	border-radius: 999px;
	background: var(--nxo-help-accent-soft);
	color: var(--nxo-help-accent-dark);
	font-size: 0.875rem !important;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.01em;
}

/* Single article body as a readable card. */
body.single-motta_help_article .site-content {
	padding-top: 8px !important;
	padding-bottom: 64px !important;
}

body.single-motta_help_article .content-area > article.type-motta_help_article {
	padding: 32px 36px 36px;
	border: 1px solid var(--nxo-help-border);
	border-radius: 18px;
	background: var(--nxo-help-surface);
	box-shadow: 0 10px 28px rgba(40, 32, 60, 0.06);
}

body.single-motta_help_article .entry-header {
	margin-bottom: 16px;
}

body.single-motta_help_article .entry-title {
	margin: 0;
	color: var(--nxo-help-text);
	font-size: clamp(1.75rem, 3.2vw, 2.25rem);
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.03em;
}

body.single-motta_help_article .entry-title a {
	color: inherit;
	text-decoration: none;
}

body.single-motta_help_article .entry-content {
	color: var(--nxo-help-muted);
	font-size: 1.0625rem;
	line-height: 1.7;
}

body.single-motta_help_article .entry-content > *:first-child {
	margin-top: 0;
}

body.single-motta_help_article .entry-content > *:last-child {
	margin-bottom: 0;
}

body.single-motta_help_article .entry-content a {
	color: var(--nxo-help-accent-dark);
	text-decoration: underline;
	text-underline-offset: 2px;
}

body.single-motta_help_article .entry-content a:focus-visible,
body.single-motta_help_article .page-header-hc .site-breadcrumb a:focus-visible,
body.single-motta_help_article .search-bar-hc__submit:focus-visible,
body.motta-help-archive .page-header-hc .site-breadcrumb a:focus-visible,
body.motta-help-archive .search-bar-hc__submit:focus-visible,
body.motta-help-archive .hentry .help-title:focus-visible {
	outline: 3px solid rgba(101, 85, 143, 0.55);
	outline-offset: 3px;
}

/* Category archive article rows as compact cards. */
body.motta-help-archive .site-content {
	padding-top: 8px !important;
	padding-bottom: 64px !important;
}

body.motta-help-archive .hentry {
	padding: 20px 22px !important;
	margin-bottom: 12px !important;
	border: 1px solid var(--nxo-help-border) !important;
	border-radius: 14px;
	background: var(--nxo-help-surface);
	box-shadow: 0 6px 18px rgba(40, 32, 60, 0.05);
	transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

body.motta-help-archive .hentry:first-child {
	border-top: 1px solid var(--nxo-help-border) !important;
}

body.motta-help-archive .hentry .help-title {
	display: block;
	margin-bottom: 6px;
	color: var(--nxo-help-text);
	font-size: 1.125rem;
	font-weight: 650;
	line-height: 1.35;
	text-decoration: none;
}

body.motta-help-archive .hentry .help-short-description {
	margin-top: 0;
	color: var(--nxo-help-muted);
	font-size: 0.9375rem !important;
	line-height: 1.55;
}

body.motta-help-archive .hentry .help-short-description p {
	margin: 0;
}

@media (hover: hover) and (pointer: fine) {
	body.motta-help-archive .hentry:hover {
		transform: translateY(-2px);
		border-color: rgba(101, 85, 143, 0.32) !important;
		box-shadow: 0 12px 28px rgba(40, 32, 60, 0.1);
	}

	body.motta-help-archive .hentry .help-title:hover {
		color: var(--nxo-help-accent-dark);
	}
}

@media (max-width: 767px) {
	body.single-motta_help_article .search-bar-hc,
	body.motta-help-archive .search-bar-hc {
		padding: 28px 16px 32px;
	}

	body.single-motta_help_article .search-bar-hc__field,
	body.motta-help-archive .search-bar-hc__field {
		min-height: 44px;
		padding-inline: 14px 56px;
		font-size: 0.9375rem;
	}

	body.single-motta_help_article .search-bar-hc__submit,
	body.motta-help-archive .search-bar-hc__submit {
		width: 44px;
		min-width: 44px;
	}

	body.single-motta_help_article .page-header-hc .site-breadcrumb,
	body.motta-help-archive .page-header-hc .site-breadcrumb {
		padding-top: 14px;
		padding-bottom: 10px;
	}

	body.single-motta_help_article .content-area > article.type-motta_help_article {
		padding: 22px 18px 24px;
		border-radius: 14px;
	}

	body.single-motta_help_article .entry-title {
		font-size: 1.5rem;
	}

	body.single-motta_help_article .entry-content {
		font-size: 1rem;
	}

	body.motta-help-archive .hentry {
		padding: 16px !important;
		border-radius: 12px;
	}

	body.motta-help-archive .hentry .help-title {
		font-size: 1rem;
	}
}

/* -------------------------------------------------------------------------- */
/* Image consistency                                                          */
/* -------------------------------------------------------------------------- */

ul.products li.product .product-thumbnail {
	aspect-ratio: 1 / 1;
	/* Keep Motta wishlist/compare icons visible (they sit near the top-right). */
	overflow: visible;
	border-radius: var(--nxo-card-radius);
	background-color: var(--nxo-card-surface);
}

ul.products li.product .product-thumbnail .woocommerce-loop-product__link {
	display: block;
	height: 100%;
	overflow: hidden;
	border-radius: var(--nxo-card-radius);
}

ul.products li.product .product-thumbnail img {
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center;
	vertical-align: middle;
}

/*
 * Motta places wishlist/compare at top: -11px, which gets clipped when the
 * thumbnail uses overflow clipping for image hover. Keep icons inside the image.
 */
ul.products li.product .product-thumbnail .product-featured-icons {
	top: 10px;
	right: 10px;
	z-index: 10;
}

/* -------------------------------------------------------------------------- */
/* Stacking: hover ATC panel must sit above neighbouring cards                */
/* -------------------------------------------------------------------------- */

ul.products.product-card-layout-1 li.product .product-inner,
ul.products.product-card-layout-2 li.product .product-inner {
	isolation: isolate;
}

ul.products.product-card-layout-1 li.product .product-inner:hover,
ul.products.product-card-layout-1 li.product .product-inner:focus-within,
ul.products.product-card-layout-2 li.product .product-inner:hover,
ul.products.product-card-layout-2 li.product .product-inner:focus-within {
	z-index: 12;
	border-radius: var(--nxo-card-radius);
}

ul.products.product-card-layout-1 li.product div.product-inner .product-actions,
ul.products.product-card-layout-2 li.product div.product-inner .product-actions {
	border-radius: 0 0 var(--nxo-card-radius) var(--nxo-card-radius);
	padding: 4px 12px 10px;
}

/*
 * Desktop: anchor the hover panel to the card's own bottom edge instead of
 * letting it flow below the card (Motta default overlaps the next row's
 * category/title). The panel shows its own price, so covering the card's
 * price row loses nothing and neighbouring cards stay untouched.
 */
@media (hover: hover) and (pointer: fine) {
	ul.products.product-card-layout-1 li.product div.product-inner .product-actions,
	ul.products.product-card-layout-2 li.product div.product-inner .product-actions {
		top: auto;
		bottom: 0;
		box-shadow: none;
	}

	ul.products.product-card-layout-1 li.product div.product-inner:hover,
	ul.products.product-card-layout-1 li.product div.product-inner:focus-within,
	ul.products.product-card-layout-2 li.product div.product-inner:hover,
	ul.products.product-card-layout-2 li.product div.product-inner:focus-within {
		height: 100%;
	}
}

/* -------------------------------------------------------------------------- */
/* Title spacing                                                              */
/* -------------------------------------------------------------------------- */

ul.products li.product .meta-wrapper {
	margin-top: 2px;
}

ul.products li.product .meta-cat {
	letter-spacing: 0.01em;
}

ul.products li.product div.product-inner .woocommerce-loop-product__title {
	margin-top: 5px;
	margin-bottom: 0;
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1.35;
	color: var(--nxo-card-text);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	min-height: calc(1.35em * 2);
}

ul.products.product-card-layout-1 li.product .product-summary {
	padding-top: 8px;
	padding-left: 6px;
	padding-right: 6px;
	padding-bottom: 2px;
}

/* -------------------------------------------------------------------------- */
/* Price hierarchy                                                            */
/* -------------------------------------------------------------------------- */

ul.products li.product div.product-inner .product-summary .price {
	margin-top: 5px;
	align-items: baseline;
	gap: 6px 8px;
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.35;
	color: var(--nxo-card-text);
}

ul.products li.product .product-summary .price ins {
	order: 1;
	margin-right: 0;
	font-weight: 600;
	text-decoration: none;
	color: var(--nxo-card-text);
}

ul.products li.product .product-summary .price del {
	order: 2;
	font-size: 0.8125rem;
	font-weight: 400;
	color: var(--nxo-card-muted);
	opacity: 0.95;
}

ul.products.product-card-layout-1 li.product div.product-inner .woocommerce-loop-product__title + .price {
	margin-top: 5px;
}

/* -------------------------------------------------------------------------- */
/* Sale / stock badges                                                        */
/* -------------------------------------------------------------------------- */

ul.products li.product .woocommerce-badges {
	top: 10px;
	left: 10px;
	z-index: 4;
	gap: 4px;
}

ul.products li.product .woocommerce-badge {
	padding: 6px 9px 5px;
	border-radius: 6px;
	font-weight: 600;
	letter-spacing: 0.02em;
	line-height: 1.1;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

ul.products li.product .woocommerce-badge.onsale {
	background-color: var(--nxo-card-sale);
}

ul.products li.product .woocommerce-badge.sold-out {
	background-color: rgba(29, 33, 40, 0.72);
	color: #fff;
}

/* -------------------------------------------------------------------------- */
/* Add to Cart / Select options                                               */
/* -------------------------------------------------------------------------- */

ul.products li.product div.product-inner .product-actions > a.button {
	margin-top: 2px;
	min-height: 38px;
	line-height: 38px;
	border-radius: 999px;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	background-color: var(--nxo-card-atc);
	color: var(--nxo-card-atc-text);
	border: none;
	transition: background-color 0.2s ease, transform 0.2s ease;
}

ul.products li.product div.product-inner .product-actions > a.button:hover,
ul.products li.product div.product-inner .product-actions > a.button:focus {
	background-color: #343a44;
	color: var(--nxo-card-atc-text);
}

ul.products li.product div.product-inner .product-actions > a.button:focus-visible {
	outline: 2px solid #8b7aaa;
	outline-offset: 2px;
}

/* -------------------------------------------------------------------------- */
/* Hero slider Shop Now ? capsule                                             */
/* -------------------------------------------------------------------------- */

.elementor-widget-motta-slides .motta-button {
	border-radius: 999px;
}

/* -------------------------------------------------------------------------- */
/* ?See All Products? / ?See All? section links ? ghost capsule buttons       */
/* -------------------------------------------------------------------------- */

.motta-product-deals__button .motta-button.motta-button--subtle,
.motta-heading-elementor .motta-button.motta-button--subtle {
	padding: 7px 18px;
	border: 1.5px solid #1d2128;
	border-radius: 999px;
	background-color: transparent;
	color: #1d2128;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	line-height: 1.2;
	text-decoration: none;
	box-shadow: none;
	transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

/* Remove Motta's subtle-button underline effect. */
.motta-product-deals__button .motta-button.motta-button--subtle .motta-button__text,
.motta-heading-elementor .motta-button.motta-button--subtle .motta-button__text {
	text-decoration: none;
	border-bottom: 0;
	box-shadow: none;
	background: none;
}

.motta-product-deals__button .motta-button.motta-button--subtle:hover,
.motta-product-deals__button .motta-button.motta-button--subtle:focus,
.motta-heading-elementor .motta-button.motta-button--subtle:hover,
.motta-heading-elementor .motta-button.motta-button--subtle:focus {
	background-color: #1d2128;
	border-color: #1d2128;
	color: #ffffff;
}

/* -------------------------------------------------------------------------- */
/* Mobile card spacing                                                        */
/* -------------------------------------------------------------------------- */

@media (max-width: 767px) {
	ul.products li.product {
		margin-bottom: var(--nxo-card-gap-mobile);
	}

	ul.products.product-card-layout-1 li.product .product-summary {
		padding-left: 4px;
		padding-right: 4px;
	}

	ul.products li.product .woocommerce-loop-product__title {
		font-size: 0.875rem;
		min-height: calc(1.35em * 2);
	}

	ul.products li.product .price {
		font-size: 0.875rem;
	}

	ul.products li.product .woocommerce-badges {
		top: 8px;
		left: 8px;
	}

	ul.products li.product .woocommerce-badge {
		padding: 5px 8px 4px;
	}
}

@media (prefers-reduced-motion: reduce) {
	ul.products li.product .product-actions > a.button {
		transition: none;
	}
}

/* ========================================================================== */
/* Phase 2D ? Category / catalog page refinement                              */
/* Scoped to Motta catalog pages; does not hide titles or SEO descriptions.   */
/* ========================================================================== */

/* -------------------------------------------------------------------------- */
/* Category header                                                            */
/* -------------------------------------------------------------------------- */

.motta-catalog-page .page-header--products {
	margin-bottom: 20px;
}

.motta-catalog-page .page-header--products.page-header--minimal {
	margin-bottom: 18px;
}

.motta-catalog-page .page-header--products .site-breadcrumb {
	font-size: 0.8125rem;
	line-height: 1.4;
	color: var(--nxo-card-muted);
}

.motta-catalog-page .page-header--products .site-breadcrumb a {
	color: var(--nxo-card-muted);
	text-decoration: none;
}

.motta-catalog-page .page-header--products .site-breadcrumb a:hover,
.motta-catalog-page .page-header--products .site-breadcrumb a:focus {
	color: var(--nxo-card-text);
}

.motta-catalog-page .page-header--products .page-header__title {
	font-size: clamp(1.75rem, 2.4vw, 2.25rem);
	line-height: 1.15;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--nxo-card-text);
}

.motta-catalog-page .page-header--products .page-header__description,
.motta-catalog-page .page-header--products .term-description,
.motta-catalog-page .page-header--products .woocommerce-product-details__short-description {
	margin-top: 10px;
	max-width: 42rem;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: var(--nxo-card-muted);
}

.motta-catalog-page .page-header--products.page-header--center .page-header__description {
	margin-left: auto;
	margin-right: auto;
}

.motta-catalog-page .page-header--products .page-header__description p {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.motta-catalog-page .page-header--products .page-header__description p:first-child {
	margin-top: 0;
}

.motta-catalog-page .page-header--products .page-header__description p:last-child {
	margin-bottom: 0;
}

/* -------------------------------------------------------------------------- */
/* Toolbar: results, sorting, view toggles                                    */
/* -------------------------------------------------------------------------- */

.motta-catalog-page .catalog-toolbar {
	padding-top: 12px;
	padding-bottom: 12px;
	margin-bottom: 16px;
	min-height: 52px;
	border-bottom-color: var(--nxo-catalog-border);
	gap: 10px 16px;
}

.motta-catalog-page .motta-result-count {
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--nxo-card-muted);
}

.motta-catalog-page .catalog-toolbar__toolbar .woocommerce-ordering__label {
	font-size: 0.875rem;
	font-weight: 500;
	color: var(--nxo-card-muted);
}

.motta-catalog-page .catalog-toolbar__toolbar .woocommerce-ordering select {
	font-weight: 600;
	color: var(--nxo-card-text);
	padding-right: 36px;
}

.motta-catalog-page .motta-toolbar-view a {
	color: var(--nxo-card-muted);
	border-radius: 4px;
}

.motta-catalog-page .motta-toolbar-view a:hover,
.motta-catalog-page .motta-toolbar-view a:focus,
.motta-catalog-page .motta-toolbar-view a.current {
	color: var(--nxo-card-text);
}

.motta-catalog-page .motta-toolbar-view a:focus-visible {
	outline: 2px solid #8b7aaa;
	outline-offset: 2px;
}

/* Top toolbar (filter + sort strip when Motta enables it) */
.motta-catalog-page .catalog-toolbar--top {
	padding: 16px 20px;
	margin-bottom: 8px;
	background-color: var(--nxo-catalog-surface);
	border-radius: var(--nxo-catalog-radius);
	gap: 12px;
}

.motta-catalog-page .catalog-toolbar--top .button-filters,
.motta-catalog-page .catalog-toolbar--top .mobile-catalog-toolbar__sort-button,
.motta-catalog-page .mobile-catalog-toolbar__sort-button,
.motta-catalog-page .mobile-catalog-toolbar__filter-button {
	min-height: 44px;
	border-radius: var(--nxo-catalog-radius);
	font-weight: 600;
	letter-spacing: 0.01em;
}

.motta-catalog-page .catalog-toolbar--top .button-filters,
.motta-catalog-page .catalog-toolbar--top .mobile-catalog-toolbar__sort-button {
	box-shadow: 0 1px 3px rgba(29, 33, 40, 0.08);
}

.motta-catalog-page .catalog-toolbar--top .catalog-order .select2-selection {
	border-radius: var(--nxo-catalog-radius);
	box-shadow: 0 1px 3px rgba(29, 33, 40, 0.08);
}

.motta-catalog-page .mobile-catalog-toolbar__sort-button.motta-button--ghost {
	border: 1px solid var(--nxo-catalog-border);
	border-radius: var(--nxo-catalog-radius);
	padding-left: 14px;
	padding-right: 14px;
	background-color: #fff;
	color: var(--nxo-card-text);
}

.motta-catalog-page .mobile-catalog-toolbar__sort-button .name {
	font-weight: 600;
	color: var(--nxo-card-text);
}

/* -------------------------------------------------------------------------- */
/* Filters: active chips + sidebar / panel presentation                       */
/* -------------------------------------------------------------------------- */

.motta-catalog-page .catalog-toolbar__filters-actived {
	padding-top: 16px;
	padding-bottom: 8px;
	border-bottom-color: var(--nxo-catalog-border);
}

.motta-catalog-page .catalog-toolbar__filters-actived .remove-filtered {
	border-radius: 6px;
	padding: 8px 12px;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	background-color: var(--nxo-card-text);
}

.motta-catalog-page .catalog-toolbar__filters-actived .remove-filtered-all {
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.motta-catalog-page .catalog-sidebar .widget {
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom-color: var(--nxo-catalog-border);
}

.motta-catalog-page .catalog-sidebar .widget-title,
.motta-catalog-page .filter-sidebar-panel .panel__header {
	font-size: 0.9375rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	color: var(--nxo-card-text);
}

.motta-catalog-page .filter-sidebar-panel .panel__container {
	border-radius: var(--nxo-catalog-radius) 0 0 var(--nxo-catalog-radius);
}

.motta-catalog-page .filter-sidebar-panel .products-filter__button .filter-button,
.motta-catalog-page .catalog-sidebar .products-filter-widget .filter-button {
	min-height: 44px;
	border-radius: var(--nxo-catalog-radius);
	font-weight: 600;
}

/* -------------------------------------------------------------------------- */
/* Empty states                                                               */
/* -------------------------------------------------------------------------- */

.motta-catalog-page .woocommerce-no-products-found {
	margin: 8px 0 40px;
}

.motta-catalog-page .woocommerce-no-products-found .woocommerce-info {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 88px;
	padding: 28px 24px;
	margin-bottom: 0;
	border-radius: var(--nxo-catalog-radius);
	background-color: var(--nxo-catalog-surface);
	color: var(--nxo-card-text);
	font-size: 0.9375rem;
	font-weight: 500;
	line-height: 1.5;
	text-align: center;
	border: 1px solid var(--nxo-catalog-border);
	box-shadow: none;
}

.motta-catalog-page .woocommerce-no-products-found .woocommerce-info::before,
.motta-catalog-page .woocommerce-no-products-found .woocommerce-info::after {
	display: none;
}

/* -------------------------------------------------------------------------- */
/* Responsive product grid                                                    */
/* -------------------------------------------------------------------------- */

.motta-catalog-page ul.products {
	--nxo-catalog-gap: 20px;
	margin-top: 4px;
	column-gap: var(--nxo-catalog-gap);
	row-gap: 8px;
}

.motta-catalog-page ul.products li.product {
	margin-bottom: 12px;
}

/*
 * Motta uses % widths on product cards. Adding column-gap without adjusting
 * widths wraps one column short (4?3, 5?4). Match gap with calc().
 */
@media screen and (min-width: 48em) {
	.motta-catalog-page ul.products.columns-2 > li.product {
		width: calc((100% - var(--nxo-catalog-gap)) / 2);
	}

	.motta-catalog-page ul.products.columns-3 > li.product {
		width: calc((100% - (2 * var(--nxo-catalog-gap))) / 3);
	}

	.motta-catalog-page ul.products.columns-4 > li.product {
		width: calc((100% - (3 * var(--nxo-catalog-gap))) / 4);
	}

	.motta-catalog-page ul.products.columns-5 > li.product {
		width: calc((100% - (4 * var(--nxo-catalog-gap))) / 5);
	}

	.motta-catalog-page ul.products.columns-6 > li.product {
		width: calc((100% - (5 * var(--nxo-catalog-gap))) / 6);
	}
}

@media (max-width: 991px) {
	.motta-catalog-page .page-header--products .page-header__title {
		font-size: 1.875rem;
	}

	.motta-catalog-page .catalog-toolbar {
		margin-bottom: 14px;
	}

	.motta-catalog-page ul.products {
		--nxo-catalog-gap: 16px;
	}
}

@media (max-width: 767px) {
	.motta-catalog-page .page-header--products {
		margin-bottom: 14px;
	}

	.motta-catalog-page .page-header--products .page-header__title {
		font-size: 1.625rem;
	}

	.motta-catalog-page .page-header--products .page-header__description {
		font-size: 0.875rem;
		margin-top: 8px;
	}

	.motta-catalog-page .catalog-toolbar {
		padding-top: 8px;
		padding-bottom: 10px;
		margin-bottom: 12px;
	}

	.motta-catalog-page .mobile-catalog-toolbar {
		margin-bottom: 4px;
	}

	.motta-catalog-page .mobile-catalog-toolbar button {
		margin-bottom: 10px;
		width: 100%;
		justify-content: center;
	}

	.motta-catalog-page ul.products {
		--nxo-catalog-gap: 12px;
		row-gap: 4px;
		/*
		 * Motta offsets the grid with -8px side margins, expecting 8px padding
		 * on each tile. We removed that padding, so keep the list flush or the
		 * outer tiles get masked by the page container's overflow clip.
		 */
		margin-left: 0;
		margin-right: 0;
	}

	/*
	 * Motta mobile-col-2 uses width:50%. With column-gap that wraps to 1 column.
	 * Match gap with calc(), same as desktop columns fix.
	 */
	.motta-catalog-page ul.products.mobile-col-2 > li.product {
		width: calc((100% - var(--nxo-catalog-gap)) / 2);
		padding-left: 0;
		padding-right: 0;
		margin-bottom: 12px;
	}

	.motta-catalog-page ul.products.mobile-col-1 > li.product,
	.motta-catalog-page.catalog-view-list ul.products > li.product {
		width: 100%;
		padding-left: 0;
		padding-right: 0;
	}

	.motta-catalog-page:not(.catalog-view-list) ul.products li.product .product-inner {
		padding-left: 0;
		padding-right: 0;
	}

	.motta-catalog-page:not(.catalog-view-list) ul.products li.product .product-summary {
		padding-left: 4px;
		padding-right: 4px;
	}

	.motta-catalog-page .woocommerce-no-products-found .woocommerce-info {
		min-height: 72px;
		padding: 22px 18px;
		font-size: 0.875rem;
	}
}

/* -------------------------------------------------------------------------- */
/* List view ? compact spacing (undo square thumb + hover-panel rules)        */
/* -------------------------------------------------------------------------- */

.catalog-view-list ul.products:not(.swiper-wrapper) li.product {
	margin-bottom: 0;
	width: 100%;
}

.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-inner {
	padding: 16px 20px;
	align-items: flex-start;
	gap: 16px;
	flex-wrap: nowrap;
}

/* No underline on product title hover in list view (Motta adds inset shadow). */
.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-inner:hover .woocommerce-loop-product__title a,
.catalog-view-list ul.products:not(.swiper-wrapper) li.product .woocommerce-loop-product__title a:hover {
	box-shadow: none;
	text-decoration: none;
}

.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-thumbnail {
	aspect-ratio: auto;
	overflow: visible;
	width: 140px;
	flex: 0 0 140px;
	max-width: 140px;
	padding-right: 0;
	border-radius: var(--nxo-card-radius);
}

.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-thumbnail .woocommerce-loop-product__link {
	height: auto;
	overflow: hidden;
	border-radius: var(--nxo-card-radius);
}

.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-thumbnail img {
	width: 100%;
	height: auto;
	max-height: 140px;
	object-fit: cover;
}

.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-summary {
	padding-top: 0;
	padding-bottom: 0;
	padding-right: 24px;
	padding-left: 0;
	min-width: 0;
	flex: 1 1 auto;
	width: auto;
}

/* Motta shows price in the actions column; keep summary price hidden. */
.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-summary .price {
	display: none;
}

.catalog-view-list ul.products:not(.swiper-wrapper) li.product .woocommerce-loop-product__title {
	min-height: 0;
	margin-top: 0;
	margin-bottom: 6px;
	-webkit-line-clamp: 2;
}

.catalog-view-list ul.products:not(.swiper-wrapper) li.product .short-description {
	margin-bottom: 0;
}

.catalog-view-list ul.products:not(.swiper-wrapper) li.product div.product-inner .product-actions {
	position: static;
	top: auto;
	bottom: auto;
	left: auto;
	right: auto;
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	box-shadow: none;
	background: transparent;
	padding: 0;
	width: 180px;
	flex: 0 0 180px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	border-radius: 0;
}

.catalog-view-list ul.products:not(.swiper-wrapper) li.product div.product-inner .product-actions > a.button {
	margin-top: 0;
	width: 100%;
	text-align: center;
}

.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-actions .product-featured-icons {
	display: flex;
	margin-top: 4px;
	gap: 8px;
}

@media (hover: hover) and (pointer: fine) {
	.catalog-view-list ul.products.product-card-layout-1 li.product div.product-inner:hover,
	.catalog-view-list ul.products.product-card-layout-1 li.product div.product-inner:focus-within,
	.catalog-view-list ul.products.product-card-layout-2 li.product div.product-inner:hover,
	.catalog-view-list ul.products.product-card-layout-2 li.product div.product-inner:focus-within {
		height: auto;
	}
}

/* Mobile list ? thumb left; title/price/ATC stacked in the right column */
@media (max-width: 767px) {
	.catalog-view-list ul.products:not(.swiper-wrapper) li.product {
		padding-left: 0;
		padding-right: 0;
		margin-bottom: 0;
	}

	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-inner {
		display: grid;
		grid-template-columns: 100px minmax(0, 1fr);
		grid-template-rows: auto auto;
		align-items: start;
		column-gap: 12px;
		row-gap: 8px;
		padding: 14px 0;
	}

	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .woocommerce-badges {
		top: 8px;
		left: 8px;
	}

	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-thumbnail {
		grid-column: 1;
		grid-row: 1 / span 2;
		width: 100px;
		flex: none;
		max-width: 100px;
		align-self: start;
	}

	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-thumbnail img {
		max-height: 100px;
	}

	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-summary {
		grid-column: 2;
		grid-row: 1;
		flex: none;
		width: auto;
		max-width: none;
		padding: 0;
		min-width: 0;
	}

	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .woocommerce-loop-product__title {
		font-size: 0.875rem;
		line-height: 1.35;
		margin: 0 0 2px;
	}

	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .meta-wrapper {
		margin-bottom: 0;
	}

	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .short-description {
		display: none;
	}

	.catalog-view-list ul.products:not(.swiper-wrapper) li.product div.product-inner .product-actions {
		grid-column: 2;
		grid-row: 2;
		flex: none;
		width: auto;
		max-width: none;
		margin-left: 0;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		gap: 8px 10px;
	}

	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-actions .price {
		margin: 0;
		font-size: 0.875rem;
		width: 100%;
		line-height: 1.3;
	}

	.catalog-view-list ul.products:not(.swiper-wrapper) li.product div.product-inner .product-actions > a.button {
		width: auto;
		min-width: 0;
		flex: 1 1 auto;
		max-width: calc(100% - 76px);
		min-height: 30px;
		line-height: 30px;
		padding: 0 14px;
		font-size: 0.75rem;
	}

	/* Wishlist + compare: icon-only, beside the compact ATC button. */
	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-actions .product-featured-icons {
		display: flex;
		flex: 0 0 auto;
		margin-top: 0;
		padding-top: 0;
		gap: 4px;
		align-items: center;
	}

	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-actions .product-featured-icons .wcboost-products-compare-button__text,
	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-actions .product-featured-icons .wcboost-wishlist-button__text,
	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-actions .product-featured-icons .motta-button__text,
	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-actions .product-featured-icons .button-text {
		display: none;
	}

	.catalog-view-list ul.products:not(.swiper-wrapper) li.product .product-actions .motta-button--quickview {
		display: none;
	}
}

/* ========================================================================== */
/* Header / navbar ? fit Motta desktop ? mobile without mid-width scatter     */
/* Motta breakpoint: mobile ?1199px, desktop ?1200px (dynamic CSS).           */
/* ========================================================================== */

.site-header {
	overflow-x: clip;
}

.site-header__desktop .header-main .site-header__container,
.site-header__desktop .header-bottom .site-header__container {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	min-width: 0;
	/* No forced width: Motta's .container is 1172px centered at ?1200px;
	   forcing 100% here pushed the logo to the viewport edge. */
	max-width: 100%;
	box-sizing: border-box;
}

.site-header__desktop .header-left-items,
.site-header__desktop .header-right-items,
.site-header__desktop .header-center-items {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	min-width: 0;
}

.site-header__desktop .header-left-items.has-search {
	flex: 1 1 auto;
	min-width: 0;
}

.site-header__desktop .header-right-items {
	flex: 0 0 auto;
}

.site-header__desktop .header-logo {
	flex: 0 0 auto;
}

.site-header__desktop .header-category-menu {
	flex: 0 0 auto;
}

/* Categories label: Additional CSS sometimes strips \ from content:"\25BE" ? literal "25BE". */
.header-category-menu.header-category--icon .header-category__title::after {
	content: "?" !important;
}

.site-header__desktop .header-search {
	flex: 1 1 auto;
	min-width: 0;
	max-width: min(420px, 100%);
}

.site-header__desktop .header-search.header-search--form {
	max-width: min(420px, 100%) !important;
}

.site-header__desktop .header-search .header-search__form,
.site-header__desktop .header-search .header-search__container {
	width: 100%;
	min-width: 0;
	max-width: 100%;
}

.site-header__desktop .header-search .header-search__field {
	min-width: 0;
	width: 100%;
}

.site-header__desktop .header-bottom .primary-navigation,
.site-header__desktop .header-bottom .main-navigation {
	min-width: 0;
	max-width: 100%;
}

.site-header__desktop .header-bottom .nav-menu {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0;
	margin: 0;
	padding: 0;
}

.site-header__desktop .header-bottom .nav-menu > li > a {
	white-space: nowrap;
}

.site-header__mobile .header-mobile-main .site-header__container {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	min-width: 0;
	width: 100%;
	gap: 8px;
}

.site-header__mobile .header-left-items,
.site-header__mobile .header-right-items {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	min-width: 0;
}

/* Motta sets logo flex: 1 0 100% which stretches into empty space on tablet. */
.site-header__mobile .header-mobile-contents .header-logo {
	flex: 1 1 auto !important;
	min-width: 0;
	max-width: 100%;
}

.site-header__mobile .header-mobile-contents .header-left-items {
	flex: 1 1 auto;
	min-width: 0;
	gap: 10px;
}

.site-header__mobile .header-mobile-contents .header-right-items {
	flex: 0 0 auto;
}

.site-header__mobile .header-logo > a {
	display: inline-flex;
	align-items: center;
	max-width: 100%;
}

.site-header__mobile .header-logo img,
.site-header__mobile .header-logo svg {
	display: block;
	width: auto;
	max-width: 140px;
	height: auto;
	max-height: 40px;
}

.site-header__mobile .header-mobile-bottom .site-header__container {
	display: flex;
	align-items: center;
	min-width: 0;
	width: 100%;
}

.site-header__mobile .header-mobile-bottom .header-search {
	flex: 1 1 auto;
	min-width: 0;
	width: 100%;
	max-width: 100%;
}

.site-header__mobile .header-mobile-bottom .header-search .header-search__form,
.site-header__mobile .header-mobile-bottom .header-search .header-search__container {
	width: 100%;
	min-width: 0;
}


/* Narrow desktop: keep one row; shrink search / hide cart label before wrap. */
@media (min-width: 1200px) and (max-width: 1399px) {
	.site-header__desktop .header-search.header-search--form {
		max-width: min(280px, 100%) !important;
	}

	.site-header__desktop .header-cart .motta-button__text {
		display: none;
	}

	.site-header__desktop .header-bottom .nav-menu > li > a {
		padding-left: 10px;
		padding-right: 10px;
	}
}

@media (min-width: 1200px) and (max-width: 1279px) {
	.site-header__desktop .header-search.header-search--form {
		max-width: min(220px, 100%) !important;
	}
}


/* -------------------------------------------------------------------------
   Homepage "Works" category banners (Acrylic / Engraving / Sublimation / UV)
   Cards are fully static: Shop Now buttons, category links, and the hover
   lift/gradient were removed at the Elementor content level (row 48094d1).
   ------------------------------------------------------------------------- */


/* -------------------------------------------------------------------------
   ?What are you shopping today?? icon-box carousel
   Ghost Shop Now button overlaid on the bottom of each card image.
   Only the first Elementor repeater item has button text; fill the empty
   spans via CSS so all cards match (auto-disabled if text is added later).
   The wrapper sits directly below the image, so `bottom: 100%` on an
   absolutely positioned button anchors it over the image ? no JS reparenting.
   ------------------------------------------------------------------------- */

.motta-icons-box-carousel__item .motta-button__text:empty::before {
	content: "Shop Now";
}

.motta-icons-box-carousel__item .motta-icon-box-carousel__wrapper {
	position: relative;
}

.motta-icons-box-carousel__item .motta-icon-box-carousel__wrapper .motta-button {
	position: absolute;
	bottom: calc(100% + 26px);
	left: 50%;
	transform: translateX(-50%);
	z-index: 2;
	margin: 0;
	padding: 8px 22px;
	border: 1.5px solid #ffffff;
	border-radius: 999px;
	background-color: transparent;
	color: #ffffff;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1.2;
	text-transform: capitalize;
	text-decoration: none;
	text-shadow: 0 1px 6px rgba(29, 33, 40, 0.4);
	box-shadow: 0 2px 10px rgba(29, 33, 40, 0.12);
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
	white-space: nowrap;
	transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.motta-icons-box-carousel__item .motta-icon-box-carousel__wrapper .motta-button .motta-button__text {
	text-decoration: none;
	border-bottom: 0;
	box-shadow: none;
}

.motta-icons-box-carousel__item .motta-icon-box-carousel__icon {
	transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.motta-icons-box-carousel__item .motta-icon-box-carousel__title {
	transition: color 0.25s ease;
}

@media (hover: hover) and (pointer: fine) {
	.motta-icons-box-carousel__item a:hover .motta-icon-box-carousel__icon {
		transform: translateY(-4px) scale(1.02);
	}

	.motta-icons-box-carousel__item a:hover .motta-button,
	.motta-icons-box-carousel__item .motta-button:hover {
		background-color: rgba(255, 255, 255, 0.88);
		border-color: rgba(255, 255, 255, 0.88);
		color: #1d2128;
		text-shadow: none;
	}
}

/* Tap feedback (mobile / coarse pointers). */
.motta-icons-box-carousel__item a:active .motta-icon-box-carousel__icon {
	transform: scale(0.97);
}

.motta-icons-box-carousel__item a:active .motta-button {
	background-color: rgba(255, 255, 255, 0.88);
	border-color: rgba(255, 255, 255, 0.88);
	color: #1d2128;
	text-shadow: none;
}


/* -------------------------------------------------------------------------
   Recent / Featured / Top products listing (motta-products-listing)
   Hover lift on desktop + press feedback on touch.
   ------------------------------------------------------------------------- */

.motta-products-listing__box {
	border-radius: var(--nxo-card-radius);
	padding: 6px;
	margin: -6px;
	transition:
		background-color 0.25s ease,
		box-shadow 0.25s ease,
		transform 0.25s ease;
}

.motta-products-listing__box .motta-products-listing__image {
	border-radius: 6px;
	transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.motta-products-listing__box .motta-products-listing__title {
	transition: color 0.2s ease;
}

@media (hover: hover) and (pointer: fine) {
	.motta-products-listing__box:hover {
		background-color: #f7f6f9;
		box-shadow: 0 6px 18px rgba(29, 33, 40, 0.08);
		transform: translateY(-2px);
	}

	.motta-products-listing__box:hover .motta-products-listing__image {
		transform: scale(1.05);
	}
}

/* Press feedback works on both mouse and touch. */
.motta-products-listing__box:active {
	background-color: #efedf4;
	transform: scale(0.98);
	box-shadow: 0 3px 10px rgba(29, 33, 40, 0.08);
}

@media (prefers-reduced-motion: reduce) {
	.motta-icons-box-carousel__item .motta-icon-box-carousel__icon,
	.motta-icons-box-carousel__item .motta-button,
	.motta-products-listing__box,
	.motta-products-listing__box .motta-products-listing__image {
		transition: none;
	}

	.motta-icons-box-carousel__item a:hover .motta-icon-box-carousel__icon,
	.motta-products-listing__box:hover,
	.motta-products-listing__box:hover .motta-products-listing__image,
	.motta-products-listing__box:active {
		transform: none;
	}
}


/* ==========================================================================
   Footer ? compact spacing (Elementor footer template #300)
   The footer had oversized vertical gaps: section paddings, 14?19px divider
   paddings, and 8px link-item margins on a 24px line box.
   Spacing only ? colors, typography and layout are unchanged.
   `!important` is required where Elementor's post-300.css sets the value.
   ========================================================================== */

/* --- Section paddings ----------------------------------------------------- */

/* Icon-box strip (All India Delivery / Secure Payment / ?): 23px ? 14px top. */
.elementor-location-footer .elementor-element.elementor-element-4dd06ad3 {
	padding-top: 14px !important;
}

/* Full-width dividers between footer sections: 14px ? 6px each side. */
.elementor-location-footer .elementor-element.elementor-element-1ef84e0e .elementor-divider,
.elementor-location-footer .elementor-element.elementor-element-5a531c45 .elementor-divider {
	padding-block-start: 6px !important;
	padding-block-end: 6px !important;
}

/* Footer link-columns section: 18px ? 10px top. */
.elementor-location-footer .elementor-element.elementor-element-1591c560 {
	padding-top: 10px !important;
}

/* Column inner padding in the links section: 12px ? 6px vertical. */
.elementor-location-footer .elementor-element-1591c560 > .elementor-container > .elementor-column > .elementor-widget-wrap {
	padding-top: 6px;
	padding-bottom: 6px;
}

/* Bottom bar (copyright + payment badges). */
.elementor-location-footer .elementor-element.elementor-element-69376663 {
	padding-bottom: 6px !important;
}

.elementor-location-footer .elementor-element-69376663 > .elementor-container > .elementor-column > .elementor-widget-wrap {
	padding-top: 6px;
	padding-bottom: 6px;
}

/* --- Link columns ---------------------------------------------------------- */

/* Gap between column heading and its link list: 10px ? 6px. */
.elementor-location-footer .motta-navigation-menu--column .motta-navigation-menu {
	margin-top: 6px !important;
}

/* Link rows: 8px margin on a 24px line box ? 4px margin, tighter line box. */
.elementor-location-footer .motta-navigation-menu--column .motta-navigation-menu li {
	margin-bottom: 4px;
	line-height: 1.4;
}

/* ?Stay Connected? heading: 11px ? 8px bottom. */
.elementor-location-footer .elementor-element.elementor-element-423d2048 .motta-heading {
	padding-bottom: 8px !important;
}

/* --- Mobile (footer columns stack; menus become accordions) ----------------- */

@media (max-width: 767px) {
	/* Icon-box strip: 18/10px ? 12/6px section padding, 16px ? 8px per box. */
	.elementor-location-footer .elementor-element.elementor-element-4dd06ad3 {
		padding-top: 12px !important;
		padding-bottom: 6px !important;
	}

	.elementor-location-footer .elementor-element-4dd06ad3 > .elementor-container > .elementor-column > .elementor-widget-wrap {
		padding-top: 8px !important;
		padding-bottom: 8px !important;
	}

	/* Links section: 10px ? 6px top; first column loses its extra 16px pad. */
	.elementor-location-footer .elementor-element.elementor-element-1591c560 {
		padding-top: 6px !important;
	}

	.elementor-location-footer .elementor-element.elementor-element-2fd5254f > .elementor-element-populated {
		padding-top: 8px !important;
	}

	/* Accordion row dividers under each menu title: 19px ? 8px each side. */
	.elementor-location-footer .elementor-element-1591c560 .elementor-widget-divider .elementor-divider {
		padding-block-start: 8px !important;
		padding-block-end: 8px !important;
	}

	/* Expanded accordion links: 5px ? 3px vertical margins. */
	.elementor-location-footer .motta-navigation-menu--column .motta-navigation-menu__title--toggle + .motta-navigation-menu li {
		margin-top: 3px;
		margin-bottom: 3px;
	}

	/* Social column: 14px ? 8px bottom padding. */
	.elementor-location-footer .elementor-element.elementor-element-1d1d4d9 > .elementor-element-populated {
		padding-bottom: 8px !important;
	}

	/* Bottom bar: copyright margin 18px ? 10px, column pad 16px ? 8px. */
	.elementor-location-footer .elementor-element.elementor-element-c285073 > .elementor-element-populated {
		padding-top: 8px !important;
	}

	.elementor-location-footer .elementor-element.elementor-element-18732ce {
		margin-bottom: calc(var(--kit-widget-spacing, 0px) + 10px) !important;
	}

	/* --- Badges strip (All India Delivery / Secure Payment / ?) ------------
	   Smaller icons + text so the 2?2 grid reads as one compact block. */
	.elementor-location-footer .elementor-element-4dd06ad3 .motta-icon-box__icon {
		--motta-icon-box-margin: 6px;
	}

	.elementor-location-footer .elementor-element-4dd06ad3 .motta-icon-box__icon svg {
		width: 24px;
		height: 24px;
	}

	/* `!important` beats Elementor's post-300.css 0,4,0 selectors. */
	.elementor-location-footer .elementor-element-4dd06ad3 .motta-icon-box__title {
		font-size: 0.8125rem !important;
		margin-bottom: 3px !important;
	}

	.elementor-location-footer .elementor-element-4dd06ad3 .motta-icon-box__content {
		font-size: 0.6875rem !important;
		line-height: 1.35 !important;
	}

	/* --- Social icons: tighter ----------------------------------------------
	   post-300.css spreads them full-width (space-between, 25px paddings).
	   Icon membership and order are managed in Elementor footer template 300. */
	.elementor-location-footer .motta-social-icons__wrapper {
		justify-content: flex-start !important;
		margin-left: -6px !important;
		margin-right: -6px !important;
	}

	.elementor-location-footer .motta-social-icons__item {
		padding: 6px !important;
	}

	/* --- Payment badges: pull the icons together ----------------------------
	   post-300.css spreads them full-width (space-between, 11px paddings). */
	.elementor-location-footer .motta-image-grid {
		justify-content: center !important;
		margin: 0 -2px !important;
	}

	.elementor-location-footer .motta-image-grid__item {
		padding: 0 2px !important;
	}
}


/* ==========================================================================
   About page (ID 1064) ? capsule buttons
   The page's Elementor custom CSS gives .nxo-button a 9px radius; the child
   theme rounds them into full capsules. `!important` beats post-1064.css.
   ========================================================================== */

body.page-id-1064 .nxo-button {
	border-radius: 999px !important;
}

/* --- "Start Your Journey" CTA product artwork -------------------------------
   The page markup ships two placeholder <img> tags pointing at a dead
   yourwebsite.com URL. Hide them and paint the real artwork (shipped with the
   child theme) as bottom-aligned backgrounds; multiply blending melts the
   flat lavender photo backdrop into the section gradient. */

body.page-id-1064 .nxo-cta-product img {
	display: none;
}

body.page-id-1064 .nxo-cta-product {
	height: 300px;
	background-position: center bottom;
	background-repeat: no-repeat;
	background-size: contain;
	mix-blend-mode: multiply;
}

body.page-id-1064 .nxo-cta-product-left {
	background-image: url(../images/about/cta-product-left.jpg);
}

body.page-id-1064 .nxo-cta-product-right {
	background-image: url(../images/about/cta-product-right.jpg);
}

/* ==========================================================================
   Single product page polish (body.single-product)
   Capsule CTAs, harmonized quantity/wishlist controls, brand-toned price and
   badge, and restrained tab/related-heading typography so the product detail
   page matches the catalog design language. Presentation only ? Motta's
   gallery, tabs, sticky add-to-cart, and AJAX behaviours are untouched.
   ========================================================================== */

body.single-product {
	--nxo-pdp-text: #1d2128;
	--nxo-pdp-muted: #7c818b;
	--nxo-pdp-border: #ecf0f4;
	--nxo-pdp-accent: #65558f;
	--nxo-pdp-accent-dark: #493a70;
	--nxo-pdp-accent-soft: #eee9f7;
	--nxo-pdp-sale: #e11d48;
	--nxo-pdp-cta-h: 52px;
}

/* --- Summary: title, meta, price, badge ---------------------------------- */

body.single-product div.product .product_title {
	font-weight: 600;
	letter-spacing: -0.01em;
	line-height: 1.2;
}

body.single-product div.product .product-meta-wrapper .meta {
	color: var(--nxo-pdp-muted);
	font-size: 0.875rem;
}

body.single-product div.product .product-meta-wrapper .meta a {
	color: var(--nxo-pdp-accent);
	font-weight: 500;
}

body.single-product div.product .product-meta-wrapper .meta a:hover {
	color: var(--nxo-pdp-accent-dark);
}

/* Sale badge: match the catalog cards (rounded, brand sale red). */
body.single-product div.product .entry-summary .woocommerce-badges .woocommerce-badge {
	padding: 6px 9px 5px;
	border-radius: 6px;
	font-weight: 600;
	letter-spacing: 0.02em;
	line-height: 1.1;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
}

body.single-product div.product .entry-summary .woocommerce-badges .onsale {
	background-color: var(--nxo-pdp-sale);
}

body.single-product div.product .entry-summary p.price del {
	color: var(--nxo-pdp-muted);
}

/* "Save ?x (y%)" ? soft rose chip instead of loose inline text. */
body.single-product div.product .entry-summary .price__save {
	padding: 3px 12px;
	border-radius: 999px;
	background-color: #fff0f5;
	color: var(--nxo-pdp-sale);
	font-size: 0.8125rem;
	font-weight: 600;
}

body.single-product div.product .entry-summary p.stock {
	font-weight: 600;
}

/* --- Personalization upload dropzone ------------------------------------- */

body.single-product div.product form.cart .codedropz-upload-handler {
	border: 1.5px dashed #d6cfe6;
	border-radius: 14px;
	background-color: #fbfafc;
	transition: border-color 0.2s ease, background-color 0.2s ease;
}

body.single-product div.product form.cart .codedropz-upload-handler:hover {
	border-color: var(--nxo-pdp-accent);
	background-color: var(--nxo-pdp-accent-soft);
}

body.single-product div.product form.cart .cd-upload-btn {
	border-radius: 999px;
}

/* --- Quantity selector: capsule, height-aligned with the CTAs ------------ */

/* No `overflow: hidden` here: it would zero the flex item's implicit
   min-width and collapse the control inside Motta's flex form. */
body.single-product div.product form.cart div.quantity {
	height: var(--nxo-pdp-cta-h);
	flex-shrink: 0;
	border: 1.5px solid #dadfe3;
	border-radius: 999px;
	transition: border-color 0.2s ease;
}

body.single-product div.product form.cart div.quantity:focus-within {
	border-color: var(--nxo-pdp-accent);
}

body.single-product div.product form.cart div.quantity .qty {
	height: calc(var(--nxo-pdp-cta-h) - 4px);
	font-weight: 600;
}

body.single-product div.product form.cart div.quantity .motta-qty-button {
	color: var(--nxo-pdp-text);
	transition: color 0.2s ease;
}

body.single-product div.product form.cart div.quantity .motta-qty-button:hover {
	color: var(--nxo-pdp-accent);
}

/* --- Add to Cart (filled dark, like catalog cards) / Buy Now (ghost) ----- */

body.single-product div.product form.cart .single_add_to_cart_button.button {
	height: var(--nxo-pdp-cta-h);
	line-height: var(--nxo-pdp-cta-h);
	border-radius: 999px;
	background-color: #1d2128;
	color: #fff;
	font-weight: 600;
	letter-spacing: 0.01em;
	transition: background-color 0.2s ease;
}

body.single-product div.product form.cart .single_add_to_cart_button.button:hover,
body.single-product div.product form.cart .single_add_to_cart_button.button:focus {
	background-color: #343a44;
	color: #fff;
}

body.single-product div.product form.cart .motta-buy-now-button {
	height: var(--nxo-pdp-cta-h);
	line-height: calc(var(--nxo-pdp-cta-h) - 3px);
	border-radius: 999px;
	border: 1.5px solid var(--nxo-pdp-text);
	background-color: transparent;
	color: var(--nxo-pdp-text);
	font-weight: 600;
	letter-spacing: 0.01em;
	transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

body.single-product div.product form.cart .motta-buy-now-button:hover,
body.single-product div.product form.cart .motta-buy-now-button:focus {
	border-color: var(--nxo-pdp-accent);
	background-color: var(--nxo-pdp-accent-soft);
	color: var(--nxo-pdp-accent-dark);
}

body.single-product div.product form.cart .single_add_to_cart_button.button:focus-visible,
body.single-product div.product form.cart .motta-buy-now-button:focus-visible {
	outline: 2px solid #8b7aaa;
	outline-offset: 2px;
}

/* --- Wishlist / Compare: quiet capsule chips ------------------------------ */

body.single-product div.product .entry-summary .product-featured-icons {
	gap: 10px;
}

body.single-product div.product .entry-summary .product-featured-icons > a {
	padding: 9px 18px;
	border: 1px solid var(--nxo-pdp-border);
	border-radius: 999px;
	color: var(--nxo-pdp-muted);
	transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

body.single-product div.product .entry-summary .product-featured-icons > a:hover,
body.single-product div.product .entry-summary .product-featured-icons > a:focus {
	border-color: #d6cfe6;
	background-color: var(--nxo-pdp-accent-soft);
	color: var(--nxo-pdp-accent-dark);
}

body.single-product div.product .entry-summary .product-featured-icons > a:focus-visible {
	outline: 2px solid #8b7aaa;
	outline-offset: 2px;
}

body.single-product div.product .entry-summary .product_meta {
	border-top: 1px solid var(--nxo-pdp-border);
	color: var(--nxo-pdp-muted);
	font-size: 0.875rem;
}

body.single-product div.product .entry-summary .product_meta a {
	color: var(--nxo-pdp-accent);
	font-weight: 500;
}

/* --- Tabs: lighter chrome, muted inactive labels -------------------------- */

body.single-product .woocommerce-tabs .motta-tabs-heading li a {
	padding-top: 24px;
	padding-bottom: 20px;
	color: var(--nxo-pdp-muted);
	font-size: 1.0625rem;
	transition: color 0.2s ease;
}

body.single-product .woocommerce-tabs .motta-tabs-heading li.active a,
body.single-product .woocommerce-tabs .motta-tabs-heading li a:hover {
	color: var(--nxo-pdp-text);
}

/* --- Related / upsell headings: match catalog section titles -------------- */

body.single-product .related.products > h2,
body.single-product .up-sells.products > h2 {
	font-weight: 600;
	letter-spacing: -0.01em;
}

/* --- Sticky add-to-cart bar: same capsule language ------------------------ */

body.single-product .motta-sticky-add-to-cart .motta-sticky-add-to-cart__button,
body.single-product .motta-sticky-add-to-cart .motta-sticky-add-to-cart__button-group .motta-button {
	border-radius: 999px;
}

body.single-product .motta-sticky-add-to-cart .motta-sticky-add-to-cart__button.add_to_cart_button {
	background-color: #1d2128;
	color: #fff;
	font-weight: 600;
	transition: background-color 0.2s ease;
}

body.single-product .motta-sticky-add-to-cart .motta-sticky-add-to-cart__button.add_to_cart_button:hover {
	background-color: #343a44;
}

body.single-product .motta-sticky-add-to-cart .motta-buy-now-button {
	border: 1.5px solid var(--nxo-pdp-text, #1d2128);
	background-color: transparent;
	color: var(--nxo-pdp-text, #1d2128);
	font-weight: 600;
}

body.single-product .motta-sticky-add-to-cart .motta-buy-now-button:hover {
	border-color: var(--nxo-pdp-accent, #65558f);
	background-color: var(--nxo-pdp-accent-soft, #eee9f7);
	color: var(--nxo-pdp-accent-dark, #493a70);
}

/* --- Mobile: compact CTAs, >=44px touch targets, no overflow -------------- */

@media (max-width: 767px) {
	body.single-product {
		--nxo-pdp-cta-h: 48px;
	}

	body.single-product div.product form.cart div.quantity .qty {
		height: calc(var(--nxo-pdp-cta-h) - 4px);
	}

	body.single-product .woocommerce-tabs .motta-tabs-heading li a {
		padding-top: 18px;
		padding-bottom: 14px;
		font-size: 1rem;
	}
}

/* --- Linked-product carousels (upsells / related), gallery inset, section gaps
   Motta wraps the upsells ("You Might Also Like") and related ("Similar
   Products") lists in Swiper markup, but Swiper never initialises on this
   site (pre-existing; an inline head style already forces the slides
   visible). Motta's layout-1 config uses spaceBetween: 0, so without Swiper
   the flex nowrap row has zero gutters and card borders touch. Motta's
   -200px shadow-spill margin also collapses section boxes vertically.
   These rules convert un-initialised carousels into native horizontal
   scrollers with real gutters (12px mobile / 20px desktop, ~4 cards), and
   stand down via `:not(.swiper-container-initialized)` if Swiper ever
   starts working. */

/* Desktop / tablet: uninitialised carousel ? flex row with 20px gaps. */
@media (min-width: 768px) {
	body.single-product .up-sells.products .linked-products-carousel:not(.swiper-container-initialized):not(.swiper-initialized),
	body.single-product .related.products .linked-products-carousel:not(.swiper-container-initialized):not(.swiper-initialized) {
		pointer-events: auto;
		margin: 0;
		padding: 0;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: thin;
	}

	body.single-product .up-sells.products .linked-products-carousel:not(.swiper-container-initialized) ul.products,
	body.single-product .related.products .linked-products-carousel:not(.swiper-container-initialized) ul.products {
		display: flex;
		flex-wrap: nowrap;
		width: 100%;
		gap: 20px;
		pointer-events: auto;
	}

	/* ~4 cards across: (100% - 3?20px gutters) / 4. Extra items scroll. */
	body.single-product .up-sells.products .linked-products-carousel:not(.swiper-container-initialized) ul.products li.product,
	body.single-product .related.products .linked-products-carousel:not(.swiper-container-initialized) ul.products li.product {
		width: calc((100% - 60px) / 4);
		flex: 0 0 calc((100% - 60px) / 4);
		max-width: calc((100% - 60px) / 4);
		margin: 0;
		margin-bottom: 0;
		box-sizing: border-box;
	}

	body.single-product .up-sells.products .linked-products-carousel:not(.swiper-container-initialized) ul.products li.product .product-inner,
	body.single-product .related.products .linked-products-carousel:not(.swiper-container-initialized) ul.products li.product .product-inner {
		pointer-events: auto;
		opacity: 1;
	}

	/* Dead Swiper chrome when the carousel never initialises. */
	body.single-product .up-sells.products:has(.linked-products-carousel:not(.swiper-container-initialized)) .motta-swiper-button,
	body.single-product .related.products:has(.linked-products-carousel:not(.swiper-container-initialized)) .motta-swiper-button,
	body.single-product .up-sells.products:has(.linked-products-carousel:not(.swiper-container-initialized)) .swiper-pagination,
	body.single-product .related.products:has(.linked-products-carousel:not(.swiper-container-initialized)) .swiper-pagination {
		display: none;
	}

	/* Section rhythm: 56px between upsells / related (and after tabs).
	   `div.product` beats Motta's `.single-product div.product ? > h2`. */
	body.single-product div.product .up-sells.products > h2,
	body.single-product div.product .related.products > h2 {
		margin-top: 56px;
		margin-bottom: 24px;
	}

	body.single-product div.product .related.products {
		margin-top: 0;
		padding-top: 0;
	}
}

@media (max-width: 767px) {
	body.single-product .up-sells.products .linked-products-carousel:not(.swiper-container-initialized):not(.swiper-initialized),
	body.single-product .related.products .linked-products-carousel:not(.swiper-container-initialized):not(.swiper-initialized) {
		pointer-events: auto;
		margin: 0 -16px;
		padding: 4px 16px 8px;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	body.single-product .up-sells.products .linked-products-carousel:not(.swiper-container-initialized)::-webkit-scrollbar,
	body.single-product .related.products .linked-products-carousel:not(.swiper-container-initialized)::-webkit-scrollbar {
		display: none;
	}

	body.single-product .up-sells.products .linked-products-carousel:not(.swiper-container-initialized) ul.products,
	body.single-product .related.products .linked-products-carousel:not(.swiper-container-initialized) ul.products {
		width: -moz-max-content;
		width: max-content;
		min-width: 100%;
		gap: 12px;
	}

	/* 50vw - 36px ? two cards + gutter visible, plus a peek of the third as
	   a scroll affordance (159px at 390w, 144px at 360w). */
	body.single-product .up-sells.products .linked-products-carousel:not(.swiper-container-initialized) ul.products li.product,
	body.single-product .related.products .linked-products-carousel:not(.swiper-container-initialized) ul.products li.product {
		width: calc(50vw - 36px);
		flex: 0 0 calc(50vw - 36px);
		margin-bottom: 0;
	}

	/* Empty pagination / dead nav for the never-initialised Swiper. */
	body.single-product .up-sells.products .swiper-pagination,
	body.single-product .related.products .swiper-pagination,
	body.single-product .up-sells.products:has(.linked-products-carousel:not(.swiper-container-initialized)) .motta-swiper-button,
	body.single-product .related.products:has(.linked-products-carousel:not(.swiper-container-initialized)) .motta-swiper-button {
		display: none;
	}

	/* Gallery: symmetric breathing room instead of Motta's edge-to-edge
	   bleed; radius matches the site's card language. `height: auto` lets
	   flexslider's viewport follow the narrower image. */
	/* `!important` beats Motta's mobile `width: 100vw !important` bleed. */
	body.single-product div.product .woocommerce-product-gallery {
		margin-left: 0;
		margin-right: 0;
		width: 100% !important;
	}

	body.single-product div.product .woocommerce-product-gallery .flex-viewport {
		height: auto !important;
		border-radius: 14px;
	}

	/* Section rhythm: ~40px between upsells / related on mobile.
	   `div.product` beats Motta's mobile `margin-top: 0` on these h2s and
	   the 26px sibling gap on `.upsells + .related`. */
	body.single-product .woocommerce-tabs {
		margin-bottom: 8px;
	}

	body.single-product div.product .up-sells.products > h2,
	body.single-product div.product .related.products > h2 {
		margin-top: 40px;
		margin-bottom: 12px;
	}

	body.single-product div.product .up-sells.products + .related.products,
	body.single-product div.product .related.products {
		margin-top: 0;
		padding-top: 0;
	}
}



/* ==========================================================================
   9XO UNIFIED CAPSULE SEARCH ? header (site-wide chrome)          child 1.4.7
   Appended section; do not merge into earlier blocks.
   One search spec across navbar + Help Center + help articles:
   capsule white field (border #e9e6ef, focus ring rgba(108,53,232,.16))
   and capsule gradient submit (#6c35e8 -> #5222c4, white, 600).
   ========================================================================== */

.site-header .header-search--form .header-search__form {
	border-radius: 999px;
	border: 1px solid #e9e6ef;
	background: #fff;
	padding: 4px 4px 4px 6px;
	align-items: center;
	transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.site-header .header-search--form .header-search__form:focus-within {
	border-color: #6c35e8;
	box-shadow: 0 0 0 3px rgba(108, 53, 232, 0.16);
}

.site-header .header-search--form .header-search__container {
	height: 38px;
}

.site-header .header-search--form .header-search__field {
	height: 38px;
	border-radius: 999px;
	background: transparent;
}

.site-header .header-search--form .header-search__button.motta-button {
	height: 38px;
	min-height: 38px;
	padding: 0 22px;
	border-radius: 999px;
	background: linear-gradient(135deg, #6c35e8, #5222c4);
	color: #fff;
	font-weight: 600;
	box-shadow: none;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* Motta's global button:hover swaps in its dark-blue primary; keep the
   brand gradient and lift instead. */
.site-header .header-search--form .header-search__button.motta-button:hover {
	background: linear-gradient(135deg, #6c35e8, #5222c4);
	color: #fff;
	transform: translateY(-1px);
	box-shadow: 0 8px 18px rgba(108, 53, 232, 0.3);
}

/* Suggestions dropdown should not fight the capsule. */
.site-header .header-search--form .header-search__results {
	border-radius: 16px;
	margin-top: 8px;
}


/* ==========================================================================
   LEGAL PAGES (PRIVACY / TERMS / REFUND)                         child 1.4.10
   Page IDs 3, 1423, and 14 only. Content-first legal documents with the site's
   lavender hero, capsule navigation, white article card, and purple accents.
   ========================================================================== */

body.page-id-3,
body.page-id-1423,
body.page-id-14 {
	--nxo-legal-primary: #6c35e8;
	--nxo-legal-primary-dark: #5222c4;
	--nxo-legal-text: #1d2128;
	--nxo-legal-muted: #59606c;
	--nxo-legal-soft: #eee9f7;
	--nxo-legal-border: #e7e2ef;
	background: #f8f7fb;
	color: var(--nxo-legal-text);
}

body.page-id-3 .site-content,
body.page-id-1423 .site-content,
body.page-id-14 .site-content {
	padding-top: 0;
	padding-bottom: 0;
}

body.page-id-3 .site-content > .container,
body.page-id-1423 .site-content > .container,
body.page-id-14 .site-content > .container,
body.page-id-3 .content-area,
body.page-id-1423 .content-area,
body.page-id-14 .content-area {
	width: 100%;
	max-width: none;
	padding: 0;
}

body.page-id-3 article.page > .entry-header,
body.page-id-1423 article.page > .entry-header,
body.page-id-14 article.page > .entry-header,
body.page-id-3 .page-header,
body.page-id-1423 .page-header,
body.page-id-14 .page-header {
	display: none;
}

body.page-id-3 article.page,
body.page-id-1423 article.page,
body.page-id-14 article.page,
body.page-id-3 .entry-content,
body.page-id-1423 .entry-content,
body.page-id-14 .entry-content {
	margin: 0;
	padding: 0;
}

body.page-id-3 .nxo-legal-page,
body.page-id-1423 .nxo-legal-page,
body.page-id-14 .nxo-legal-page {
	width: 100%;
	overflow: hidden;
	color: var(--nxo-legal-text);
	font-size: 17px;
	line-height: 1.72;
}

body.page-id-3 .nxo-legal-shell,
body.page-id-1423 .nxo-legal-shell,
body.page-id-14 .nxo-legal-shell {
	width: min(1080px, calc(100% - 48px));
	margin-right: auto;
	margin-left: auto;
}

body.page-id-3 .nxo-legal-hero,
body.page-id-1423 .nxo-legal-hero,
body.page-id-14 .nxo-legal-hero {
	position: relative;
	margin-right: calc(50% - 50vw);
	margin-left: calc(50% - 50vw);
	padding: clamp(58px, 7vw, 88px) 0 clamp(54px, 6vw, 76px);
	overflow: hidden;
	background:
		radial-gradient(circle at 82% 18%, rgba(108, 53, 232, 0.14), transparent 26%),
		radial-gradient(circle at 12% 88%, rgba(82, 34, 196, 0.08), transparent 30%),
		linear-gradient(145deg, #f7f3ff 0%, var(--nxo-legal-soft) 100%);
	text-align: center;
}

body.page-id-3 .nxo-legal-hero::after,
body.page-id-1423 .nxo-legal-hero::after,
body.page-id-14 .nxo-legal-hero::after {
	position: absolute;
	right: -58px;
	bottom: -86px;
	width: 220px;
	height: 220px;
	border: 1px solid rgba(108, 53, 232, 0.12);
	border-radius: 50%;
	content: "";
}

body.page-id-3 .nxo-legal-eyebrow,
body.page-id-1423 .nxo-legal-eyebrow,
body.page-id-14 .nxo-legal-eyebrow {
	margin: 0 0 12px;
	color: var(--nxo-legal-primary-dark);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.12em;
	line-height: 1.4;
	text-transform: uppercase;
}

body.page-id-3 .nxo-legal-hero h1,
body.page-id-1423 .nxo-legal-hero h1,
body.page-id-14 .nxo-legal-hero h1 {
	margin: 0;
	color: var(--nxo-legal-text);
	font-size: clamp(2.5rem, 5vw, 4rem);
	font-weight: 700;
	letter-spacing: -0.045em;
	line-height: 1.06;
}

body.page-id-3 .nxo-legal-intro,
body.page-id-1423 .nxo-legal-intro,
body.page-id-14 .nxo-legal-intro {
	max-width: 760px;
	margin: 20px auto 0;
	color: var(--nxo-legal-muted);
	font-size: clamp(1rem, 1.4vw, 1.125rem);
	line-height: 1.65;
}

body.page-id-3 .nxo-legal-updated,
body.page-id-1423 .nxo-legal-updated,
body.page-id-14 .nxo-legal-updated {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	margin: 22px 0 0;
	padding: 6px 14px;
	border: 1px solid rgba(108, 53, 232, 0.16);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.72);
	color: var(--nxo-legal-muted);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
}

body.page-id-3 .nxo-legal-main,
body.page-id-1423 .nxo-legal-main,
body.page-id-14 .nxo-legal-main {
	padding-top: 28px;
	padding-bottom: 72px;
}

body.page-id-3 .nxo-legal-toc,
body.page-id-1423 .nxo-legal-toc,
body.page-id-14 .nxo-legal-toc {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 9px;
	margin: 0 auto 22px;
}

body.page-id-3 .nxo-legal-toc a,
body.page-id-1423 .nxo-legal-toc a,
body.page-id-14 .nxo-legal-toc a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 8px 16px;
	border: 1px solid #dcd4ea;
	border-radius: 999px;
	background: #fff;
	color: #493a70;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

body.page-id-3 .nxo-legal-toc a:hover,
body.page-id-1423 .nxo-legal-toc a:hover,
body.page-id-14 .nxo-legal-toc a:hover {
	border-color: #c7b8e2;
	background: var(--nxo-legal-soft);
	color: var(--nxo-legal-primary-dark);
	transform: translateY(-1px);
}

body.page-id-3 .nxo-legal-toc a:focus-visible,
body.page-id-1423 .nxo-legal-toc a:focus-visible,
body.page-id-14 .nxo-legal-toc a:focus-visible,
body.page-id-3 .nxo-legal-card a:focus-visible,
body.page-id-1423 .nxo-legal-card a:focus-visible,
body.page-id-14 .nxo-legal-card a:focus-visible {
	outline: 2px solid var(--nxo-legal-primary);
	outline-offset: 3px;
}

body.page-id-3 .nxo-legal-card,
body.page-id-1423 .nxo-legal-card,
body.page-id-14 .nxo-legal-card {
	max-width: 920px;
	margin: 0 auto;
	padding: clamp(32px, 5vw, 58px);
	border: 1px solid rgba(231, 226, 239, 0.9);
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 18px 48px rgba(42, 31, 69, 0.08);
}

body.page-id-3 .nxo-legal-card section,
body.page-id-1423 .nxo-legal-card section,
body.page-id-14 .nxo-legal-card section {
	scroll-margin-top: 112px;
}

body.page-id-3 .nxo-legal-card section + section,
body.page-id-1423 .nxo-legal-card section + section,
body.page-id-14 .nxo-legal-card section + section {
	margin-top: 36px;
	padding-top: 36px;
	border-top: 1px solid var(--nxo-legal-border);
}

body.page-id-3 .nxo-legal-card h2,
body.page-id-1423 .nxo-legal-card h2,
body.page-id-14 .nxo-legal-card h2 {
	margin: 0 0 16px;
	color: var(--nxo-legal-text);
	font-size: clamp(1.5rem, 2.5vw, 1.875rem);
	font-weight: 700;
	letter-spacing: -0.025em;
	line-height: 1.25;
}

body.page-id-3 .nxo-legal-card h3,
body.page-id-1423 .nxo-legal-card h3,
body.page-id-14 .nxo-legal-card h3 {
	margin: 24px 0 8px;
	color: #282d36;
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.45;
}

body.page-id-3 .nxo-legal-card p,
body.page-id-1423 .nxo-legal-card p,
body.page-id-14 .nxo-legal-card p {
	margin: 0 0 14px;
	color: var(--nxo-legal-muted);
}

body.page-id-3 .nxo-legal-card p:last-child,
body.page-id-1423 .nxo-legal-card p:last-child,
body.page-id-14 .nxo-legal-card p:last-child {
	margin-bottom: 0;
}

body.page-id-3 .nxo-legal-card ul,
body.page-id-1423 .nxo-legal-card ul,
body.page-id-14 .nxo-legal-card ul {
	margin: 12px 0 18px;
	padding-left: 24px;
	color: var(--nxo-legal-muted);
}

body.page-id-3 .nxo-legal-card li,
body.page-id-1423 .nxo-legal-card li,
body.page-id-14 .nxo-legal-card li {
	margin: 8px 0;
	padding-left: 4px;
}

body.page-id-3 .nxo-legal-card li::marker,
body.page-id-1423 .nxo-legal-card li::marker,
body.page-id-14 .nxo-legal-card li::marker {
	color: var(--nxo-legal-primary);
}

body.page-id-3 .nxo-legal-card a,
body.page-id-1423 .nxo-legal-card a,
body.page-id-14 .nxo-legal-card a {
	color: var(--nxo-legal-primary);
	font-weight: 600;
	text-decoration: none;
	transition: color 0.2s ease;
}

body.page-id-3 .nxo-legal-card a:hover,
body.page-id-1423 .nxo-legal-card a:hover,
body.page-id-14 .nxo-legal-card a:hover {
	color: var(--nxo-legal-primary-dark);
	text-decoration: none;
}

body.page-id-3 .nxo-legal-note,
body.page-id-1423 .nxo-legal-note,
body.page-id-14 .nxo-legal-note {
	margin: 20px 0;
	padding: 18px 20px;
	border: 1px solid #ded5ee;
	border-left: 4px solid var(--nxo-legal-primary);
	border-radius: 0 14px 14px 0;
	background: #f7f3fc;
	color: #4b435c;
	line-height: 1.65;
}

body.page-id-3 .nxo-legal-note strong,
body.page-id-1423 .nxo-legal-note strong,
body.page-id-14 .nxo-legal-note strong {
	color: var(--nxo-legal-primary-dark);
}

@media (max-width: 767px) {
	body.page-id-3 .nxo-legal-page,
	body.page-id-1423 .nxo-legal-page,
	body.page-id-14 .nxo-legal-page {
		font-size: 16px;
		line-height: 1.68;
	}

	body.page-id-3 .nxo-legal-shell,
	body.page-id-1423 .nxo-legal-shell,
	body.page-id-14 .nxo-legal-shell {
		width: min(100% - 32px, 1080px);
	}

	body.page-id-3 .nxo-legal-hero,
	body.page-id-1423 .nxo-legal-hero,
	body.page-id-14 .nxo-legal-hero {
		padding: 46px 0 42px;
	}

	body.page-id-3 .nxo-legal-hero h1,
	body.page-id-1423 .nxo-legal-hero h1,
	body.page-id-14 .nxo-legal-hero h1 {
		font-size: clamp(2.25rem, 12vw, 3rem);
	}

	body.page-id-3 .nxo-legal-intro,
	body.page-id-1423 .nxo-legal-intro,
	body.page-id-14 .nxo-legal-intro {
		margin-top: 16px;
	}

	body.page-id-3 .nxo-legal-main,
	body.page-id-1423 .nxo-legal-main,
	body.page-id-14 .nxo-legal-main {
		padding-top: 20px;
		padding-bottom: 48px;
	}

	body.page-id-3 .nxo-legal-toc,
	body.page-id-1423 .nxo-legal-toc,
	body.page-id-14 .nxo-legal-toc {
		justify-content: flex-start;
		flex-wrap: nowrap;
		margin-right: -16px;
		margin-left: -16px;
		padding: 2px 16px 8px;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	body.page-id-3 .nxo-legal-toc::-webkit-scrollbar,
	body.page-id-1423 .nxo-legal-toc::-webkit-scrollbar,
	body.page-id-14 .nxo-legal-toc::-webkit-scrollbar {
		display: none;
	}

	body.page-id-3 .nxo-legal-toc a,
	body.page-id-1423 .nxo-legal-toc a,
	body.page-id-14 .nxo-legal-toc a {
		flex: 0 0 auto;
		min-height: 44px;
	}

	body.page-id-3 .nxo-legal-card,
	body.page-id-1423 .nxo-legal-card,
	body.page-id-14 .nxo-legal-card {
		padding: 26px 20px;
		border-radius: 16px;
		box-shadow: 0 12px 30px rgba(42, 31, 69, 0.07);
	}

	body.page-id-3 .nxo-legal-card section + section,
	body.page-id-1423 .nxo-legal-card section + section,
	body.page-id-14 .nxo-legal-card section + section {
		margin-top: 28px;
		padding-top: 28px;
	}

	body.page-id-3 .nxo-legal-card h2,
	body.page-id-1423 .nxo-legal-card h2,
	body.page-id-14 .nxo-legal-card h2 {
		font-size: 1.45rem;
	}

	body.page-id-3 .nxo-legal-note,
	body.page-id-1423 .nxo-legal-note,
	body.page-id-14 .nxo-legal-note {
		padding: 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.page-id-3 .nxo-legal-toc a,
	body.page-id-1423 .nxo-legal-toc a,
	body.page-id-14 .nxo-legal-toc a,
	body.page-id-3 .nxo-legal-card a,
	body.page-id-1423 .nxo-legal-card a,
	body.page-id-14 .nxo-legal-card a {
		transition: none;
	}
}


/* ==========================================================================
   9XO UNIFIED CAPSULE SEARCH ? mobile search modal                child 1.4.14
   Appended section; do not merge into earlier blocks.
   Motta's #search-modal is the search surface behind every compact icon
   search on mobile (top-right header icon + the 9xo-core contextual sticky
   bar on home / shop / account / cart ? on My Account it is the only
   search UI). It still rendered Motta's default treatment: a bare
   `motta-input--raised` field (drop shadow, 2px radius) with a plain grey
   magnifier. Restyle it to the site-wide capsule spec used by the header,
   Help Center, and blog searches: 48px white capsule (1px #e9e6ef border),
   borderless transparent field, 38px gradient submit (#6c35e8 -> #5222c4),
   purple focus ring. The gradient icon pill matches the mobile header-v1
   search button on shop / cart.
   ========================================================================== */

.search-modal .search-modal__form {
	display: flex;
	align-items: center;
	min-height: 48px;
	background: #fff;
	border: 1px solid #e9e6ef;
	border-radius: 999px;
	/* Right padding reserves room for the absolutely positioned submit. */
	padding: 4px 72px 4px 6px;
	transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

.search-modal .search-modal__form:focus-within {
	border-color: #6c35e8;
	box-shadow: 0 0 0 3px rgba(108, 53, 232, 0.16);
}

/* Field: quiet and transparent inside the capsule (Motta gave it its own
   raised shadow + 48px height + 40px icon padding). */
.search-modal .search-modal__form .search-modal__field {
	height: 38px;
	margin: 0;
	padding: 0 8px 0 14px;
	border: 0;
	border-radius: 999px;
	background: transparent;
	box-shadow: none;
}

.search-modal .search-modal__form .search-modal__field:focus {
	box-shadow: none;
	outline: none;
}

.search-modal .search-modal__form .search-modal__field::placeholder {
	color: #7c818b;
}

/* Submit: gradient capsule pill, same 60x38 as the shop/cart mobile header
   search button. Keeps Motta's absolute centering (top 50% + translateY). */
.search-modal .search-modal__form .search-modal__submit {
	right: 5px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 38px;
	min-height: 38px;
	padding: 0;
	border-radius: 999px;
	background: linear-gradient(135deg, #6c35e8, #5222c4);
	color: #fff;
	box-shadow: none;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

/* Motta's button:hover swaps in its dark-blue primary; keep the gradient. */
.search-modal .search-modal__form .search-modal__submit:hover {
	background: linear-gradient(135deg, #6c35e8, #5222c4);
	color: #fff;
	box-shadow: 0 8px 18px rgba(108, 53, 232, 0.3);
}

.search-modal .search-modal__form .search-modal__submit span {
	font-size: 16px;
}

/* Breathing room consistent with the mobile headers' search row. */
.search-modal .modal__header {
	padding: 16px 16px 8px;
}


/* ==========================================================================
   9XO PDP MOBILE FIXES ? header search chrome + summary overflow  child 1.4.15
   Appended section; do not merge into earlier blocks.
   1) Mobile inline header search (header-mobile-bottom, all pages): the
      unified capsule section (1.4.7) styles the form / field / button, but
      Motta's default input chrome still painted the inner
      .header-search__container (.motta-type--input-text): a white
      2px-radius box with a 0 2px 6px rgba(0,0,0,.16) drop shadow rendered
      inside the capsule (double-border look), a stray 24px right padding,
      and a dark #1d2128 border + shadow on focus fighting the purple focus
      ring. Neutralize the container so only the capsule paints, and ease
      Motta's 22px field indent. Desktop uses the --inside variant whose
      container is already chromeless, so this is scoped to the mobile
      header only.
   2) Product page (<=767px): Motta full-bleeds .entry-summary with
      width: 100vw + margin: 0 -16px. 100vw includes the scrollbar width,
      so whenever a classic scrollbar is present the summary is wider than
      the visible area and its right-aligned children (quantity, Buy Now,
      Add to cart) are cropped at the right edge. Full-bleed relative to
      the 16px-padded container instead: calc(100% + 32px) equals the real
      container width, restoring symmetric 16px side margins.
   ========================================================================== */

.site-header__mobile .header-search--form .header-search__container {
	align-items: center;
	padding-right: 0;
	border: 0;
	border-radius: 999px;
	background: transparent;
	box-shadow: none;
}

/* Motta's focused state re-adds the dark border + drop shadow on the
   container; the capsule form's own purple ring is the only focus cue. */
.site-header__mobile .header-search__form--focused .header-search__container,
.site-header__mobile .header-search__form.header-search__form--focused .motta-type--input-text {
	border-color: transparent;
	box-shadow: none;
}

.site-header__mobile .header-search--form .header-search__field {
	margin-left: 16px;
}

@media (max-width: 767px) {
	body.single-product div.product .entry-summary {
		width: calc(100% + 32px);
	}

	/* Same 100vw full-bleed pattern on Motta's icon-box strip under the CTAs. */
	body.single-product div.product .motta-icon-box-widget {
		width: calc(100% + 32px);
	}
}