/*
Theme Name: Logniture
Theme URI: https://logniture.com/
Author: Logniture
Description: Custom block theme for the Logniture website and WooCommerce store.
Version: 0.6.31
Requires at least: 7.0
Requires PHP: 8.3
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: logniture
Tags: block-patterns, full-site-editing, wide-blocks, e-commerce
*/

:root {
	--logniture-canvas: #f5f2ec;
	--logniture-paper: #fbfaf7;
	--logniture-ink: #181714;
	--logniture-muted: #6d6860;
	--logniture-line: rgba(24, 23, 20, 0.16);
	--logniture-dark: #1a1714;
	--logniture-warm: #a65f2b;
	--logniture-serif: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, Baskerville, Georgia, serif;
	--logniture-sans: Inter, "Helvetica Neue", Helvetica, Arial, sans-serif;
	--logniture-page-padding: clamp(1.25rem, 3.25vw, 3.5rem);
	--logniture-focus: #9b5525;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	background: var(--logniture-canvas);
	color: var(--logniture-ink);
	font-family: var(--logniture-serif);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

img {
	display: block;
	max-width: 100%;
}

a {
	color: inherit;
	text-underline-offset: 0.2em;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
.wp-element-button:focus-visible {
	outline: 2px solid var(--logniture-focus);
	outline-offset: 4px;
}

.wp-site-blocks {
	padding: 0;
}

.wp-site-blocks > * {
	margin-block-start: 0;
}

/* Header */

.logniture-site-header {
	position: relative;
	z-index: 100;
	width: 100%;
	background: rgba(251, 250, 247, 0.98);
	border-bottom: 1px solid var(--logniture-line);
}

.logniture-header-top {
	display: grid !important;
	grid-template-columns: minmax(14rem, 1fr) auto minmax(14rem, 1fr);
	align-items: center;
	min-height: 5.75rem;
	padding: 0.65rem var(--logniture-page-padding) 0.55rem;
}

.logniture-brand-column {
	display: block;
	min-width: 0;
}

.logniture-brand-note {
	margin: 0;
	font-family: var(--logniture-sans);
	font-size: 0.6rem;
	font-weight: 500;
	letter-spacing: 0.065em;
	line-height: 1.55;
	text-transform: uppercase;
}

/* Header social icons (theme 0.6.25): small, monochrome, subtle -- sits
   under the brand note at desktop/tablet. Kept independently visible
   (not gated by .logniture-brand-note's own display: none below 64rem,
   see that breakpoint further down) since a compact icon row still fits
   comfortably in the header's mobile layout. */
.logniture-social-links {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin-top: 0.45rem;
}

.logniture-social-links a {
	display: inline-flex;
	color: var(--logniture-ink);
	opacity: 0.6;
	transition: opacity 0.2s ease;
}

.logniture-social-links a:hover,
.logniture-social-links a:focus-visible {
	opacity: 1;
}

.logniture-social-links svg {
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.45;
}

.logniture-brand-lockup {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.05rem;
	min-width: 10.5rem;
	text-decoration: none;
}

.logniture-logo-mark {
	width: 2.7rem;
	height: 2.15rem;
	overflow: hidden;
	margin: 0;
}

.logniture-logo-mark img {
	width: 100% !important;
	height: auto !important;
	transform: translateY(-0.6rem);
}

.logniture-wordmark {
	margin: -0.1rem 0 0;
	font-family: var(--logniture-serif);
	font-size: 1.25rem;
	font-weight: 400;
	letter-spacing: 0.13em;
	line-height: 1;
	text-transform: uppercase;
}

.logniture-header-actions {
	display: flex !important;
	align-items: center;
	justify-content: flex-end;
	gap: clamp(0.85rem, 1.8vw, 1.7rem);
	font-family: var(--logniture-sans);
	font-size: 0.61rem;
	letter-spacing: 0.035em;
	text-transform: uppercase;
}

.logniture-header-actions p {
	margin: 0;
}

.logniture-header-action {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	text-decoration: none;
	white-space: nowrap;
}

.logniture-header-action::after {
	display: inline-block;
	width: 0.72rem;
	height: 0.72rem;
	content: "";
}

.logniture-header-action--search::after {
	border: 1px solid currentColor;
	border-radius: 50%;
	box-shadow: 0.32rem 0.32rem 0 -0.27rem currentColor;
}

.logniture-header-actions .wc-block-mini-cart {
	margin: 0;
}

.logniture-header-actions .wc-block-mini-cart__button {
	min-height: auto;
	padding: 0.3rem;
	color: var(--logniture-ink);
}

.logniture-header-actions .wc-block-mini-cart__badge {
	background: var(--logniture-ink);
	color: var(--logniture-paper);
	font-size: 0.55rem;
}

.logniture-nav-shell {
	min-height: 3rem;
	border-top: 1px solid var(--logniture-line);
}

.logniture-primary-navigation {
	width: 100%;
	min-height: 3rem;
	font-family: var(--logniture-serif);
	font-size: 0.77rem;
	letter-spacing: 0.035em;
	text-transform: uppercase;
}

.logniture-primary-navigation .wp-block-navigation__container {
	gap: clamp(1.65rem, 4vw, 3.4rem);
}

.logniture-primary-navigation .wp-block-navigation-item__content {
	padding-block: 0.95rem;
	text-decoration: none;
}

.logniture-primary-navigation .wp-block-navigation-item__content:hover {
	opacity: 0.62;
}

.logniture-primary-navigation .wp-block-navigation__submenu-icon {
	width: 0.62rem;
	height: 0.62rem;
	margin-left: 0.4rem;
}

.logniture-primary-navigation .wp-block-navigation__submenu-container {
	min-width: 21rem !important;
	padding: 0.75rem 0 !important;
	background: var(--logniture-paper) !important;
	border: 1px solid var(--logniture-line) !important;
	box-shadow: 0 1.25rem 2.5rem rgba(16, 14, 12, 0.12);
}

.logniture-primary-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 0.55rem 1.15rem;
	font-family: var(--logniture-sans);
	font-size: 0.66rem;
	letter-spacing: 0.045em;
	line-height: 1.35;
}

/* Hero */

.logniture-hero {
	position: relative;
	min-height: clamp(35rem, 43vw, 42rem) !important;
	overflow: hidden;
	background: var(--logniture-dark);
}

.logniture-hero .wp-block-cover__image-background {
	object-fit: cover;
	object-position: 66% center;
}

.logniture-hero::after {
	position: absolute;
	z-index: 1;
	inset: 0;
	background:
		linear-gradient(
			90deg,
			rgba(24, 21, 18, 0.93) 0%,
			rgba(24, 21, 18, 0.78) 25%,
			rgba(24, 21, 18, 0.24) 50%,
			rgba(24, 21, 18, 0.02) 72%
		);
	content: "";
	pointer-events: none;
}

.logniture-hero .wp-block-cover__inner-container {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	width: 100%;
	max-width: none;
	min-height: inherit;
	padding: clamp(3rem, 6vw, 6.25rem) var(--logniture-page-padding);
}

.logniture-hero-copy {
	width: min(30rem, 42vw);
	margin: 0 !important;
	color: #fff;
}

.logniture-eyebrow {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	margin: 0 0 1.55rem;
	font-family: var(--logniture-sans);
	font-size: 0.69rem;
	font-weight: 500;
	letter-spacing: 0.145em;
	line-height: 1.35;
	text-transform: uppercase;
}

.logniture-eyebrow::after {
	width: 3.1rem;
	height: 1px;
	background: currentColor;
	content: "";
	opacity: 0.55;
}

.logniture-hero-title {
	max-width: 8.25em;
	margin: 0 0 1.2rem;
	font-family: var(--logniture-serif);
	font-size: clamp(3.45rem, 5.3vw, 5.35rem);
	font-weight: 400;
	letter-spacing: -0.035em;
	line-height: 0.96;
}

.logniture-hero-subtitle {
	max-width: 20rem;
	margin: 0 0 1.65rem;
	font-size: clamp(1rem, 1.25vw, 1.18rem);
	line-height: 1.42;
}

.logniture-hero-actions {
	display: flex !important;
	flex-wrap: wrap;
	gap: 0.7rem;
}

.logniture-hero-actions .wp-block-button__link {
	min-width: 10.5rem;
	padding: 0.95rem 1.45rem;
	border: 1px solid rgba(255, 255, 255, 0.72);
	border-radius: 0;
	font-family: var(--logniture-sans);
	font-size: 0.68rem;
	font-weight: 500;
	letter-spacing: 0.055em;
	text-transform: uppercase;
	transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
}

.logniture-hero-actions .is-style-fill .wp-block-button__link {
	background: var(--logniture-paper);
	border-color: var(--logniture-paper);
	color: var(--logniture-ink);
}

.logniture-hero-actions .is-style-outline .wp-block-button__link {
	background: rgba(255, 255, 255, 0.04);
	color: #fff;
}

.logniture-hero-actions .wp-block-button__link:hover {
	background: #fff;
	border-color: #fff;
	color: var(--logniture-ink);
}

/* Collections */

.logniture-collections {
	padding: 1.35rem var(--logniture-page-padding) 1.7rem;
	background: var(--logniture-paper);
}

.logniture-section-intro {
	margin-bottom: 1.1rem !important;
	text-align: center;
}

.logniture-section-kicker {
	margin: 0 0 0.4rem;
	font-family: var(--logniture-sans);
	font-size: 0.62rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.logniture-section-kicker a {
	text-decoration: none;
}

.logniture-section-title {
	margin: 0;
	font-family: var(--logniture-serif);
	font-size: clamp(1.9rem, 3.2vw, 3rem);
	font-weight: 400;
	letter-spacing: -0.02em;
	line-height: 1.1;
}

.logniture-category-grid {
	display: grid !important;
	grid-template-columns: repeat(9, minmax(7.5rem, 1fr));
	gap: clamp(0.7rem, 1.2vw, 1.15rem);
	width: 100%;
	max-width: 112rem;
	margin-inline: auto !important;
	padding-bottom: 0.4rem;
}

.logniture-category-card {
	min-width: 0;
	margin: 0 !important;
}

.logniture-category-card .wp-block-image {
	overflow: hidden;
	margin: 0 0 0.7rem;
	background: #ece8e1;
	aspect-ratio: 0.88;
}

.logniture-category-card .wp-block-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.logniture-category-card:hover .wp-block-image img {
	transform: scale(1.025);
}

.logniture-category-card--photography .wp-block-image img {
	filter: grayscale(1) contrast(1.08);
}

.logniture-category-name {
	margin: 0;
	font-family: var(--logniture-sans);
	font-size: 0.65rem;
	font-weight: 500;
	letter-spacing: 0.015em;
	line-height: 1.35;
	text-transform: uppercase;
}

.logniture-category-name a {
	text-decoration: none;
}

.logniture-category-meta {
	margin: 0.12rem 0 0;
	color: var(--logniture-muted);
	font-family: var(--logniture-sans);
	font-size: 0.55rem;
	letter-spacing: 0.03em;
	line-height: 1.35;
	text-transform: uppercase;
}

.logniture-category-arrow {
	margin: 0.15rem 0 0;
	font-size: 1rem;
	line-height: 1;
}

/* Brand values */

.logniture-values {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	max-width: 82rem;
	margin: 0 auto !important;
	padding: 1.35rem 0 0.15rem;
	border-top: 1px solid var(--logniture-line);
}

.logniture-value {
	position: relative;
	display: grid !important;
	grid-template-columns: auto 1fr;
	gap: 1.1rem;
	align-items: start;
	min-width: 0;
	padding: 0.15rem clamp(1rem, 2vw, 2rem);
}

.logniture-value + .logniture-value {
	border-left: 1px solid var(--logniture-line);
}

.logniture-value-index {
	display: grid;
	width: 2.55rem;
	height: 2.55rem;
	margin: 0;
	border: 1px solid var(--logniture-ink);
	border-radius: 50%;
	font-family: var(--logniture-sans);
	font-size: 0.62rem;
	letter-spacing: 0.05em;
	place-items: center;
}

.logniture-value-title {
	margin: 0 0 0.25rem;
	font-family: var(--logniture-sans);
	font-size: 0.68rem;
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.logniture-value-copy {
	margin: 0;
	font-size: 0.88rem;
	line-height: 1.45;
}

/* Featured works rendered by Logniture Core */

.logniture-featured-works {
	padding: clamp(4rem, 7vw, 7rem) var(--logniture-page-padding);
	background: var(--logniture-canvas);
}

.logniture-featured-works__header {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 2rem;
	max-width: 96rem;
	margin: 0 auto 1.8rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--logniture-line);
}

.logniture-featured-works__eyebrow {
	margin: 0 0 0.5rem;
	font-family: var(--logniture-sans);
	font-size: 0.65rem;
	letter-spacing: 0.13em;
	text-transform: uppercase;
}

.logniture-featured-works__title {
	margin: 0;
	font-family: var(--logniture-serif);
	font-size: clamp(2.35rem, 4vw, 4.2rem);
	font-weight: 400;
	letter-spacing: -0.03em;
	line-height: 1;
}

.logniture-featured-works__intro {
	max-width: 24rem;
	margin: 0;
	color: var(--logniture-muted);
	font-size: 0.95rem;
	line-height: 1.5;
}

.logniture-product-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(0.85rem, 1.6vw, 1.45rem);
	max-width: 96rem;
	margin: 0 auto;
}

.logniture-product-card {
	position: relative;
	min-width: 0;
}

.logniture-product-card__media {
	position: relative;
	display: block;
	overflow: hidden;
	margin-bottom: 0.95rem;
	background: #e9e4dc;
	aspect-ratio: 0.82;
}

.logniture-product-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.logniture-product-card:hover .logniture-product-card__media img {
	transform: scale(1.025);
}

.logniture-product-status {
	position: absolute;
	z-index: 2;
	top: 0.7rem;
	right: 0.7rem;
	padding: 0.42rem 0.58rem;
	background: rgba(251, 250, 247, 0.94);
	font-family: var(--logniture-sans);
	font-size: 0.55rem;
	font-weight: 600;
	letter-spacing: 0.075em;
	line-height: 1;
	text-transform: uppercase;
}

.logniture-product-status--available {
	color: #3e6640;
}

.logniture-product-status--made_to_order {
	background: #a95d22;
	color: #fff;
}

.logniture-product-status--sold {
	background: #9b2f28;
	color: #fff;
}

.logniture-product-card__title {
	margin: 0 0 0.35rem;
	font-family: var(--logniture-serif);
	font-size: clamp(1.15rem, 1.6vw, 1.5rem);
	font-weight: 400;
	line-height: 1.2;
}

.logniture-product-card__title a {
	text-decoration: none;
}

.logniture-product-card__price {
	margin: 0 0 0.4rem;
	font-family: var(--logniture-sans);
	font-size: 0.74rem;
	font-weight: 500;
}

.logniture-product-card__description,
.logniture-product-card__lead-time {
	margin: 0 0 0.65rem;
	color: var(--logniture-muted);
	font-size: 0.82rem;
	line-height: 1.45;
}

.logniture-product-card__lead-time {
	font-style: italic;
}

.logniture-product-card__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.65rem;
	padding: 0.7rem 1rem;
	border: 1px solid var(--logniture-ink);
	background: transparent;
	color: var(--logniture-ink);
	font-family: var(--logniture-sans);
	font-size: 0.63rem;
	font-weight: 500;
	letter-spacing: 0.065em;
	text-decoration: none;
	text-transform: uppercase;
	transition: background-color 160ms ease, color 160ms ease;
}

.logniture-product-card__button:hover {
	background: var(--logniture-ink);
	color: var(--logniture-paper);
}

.logniture-product-card__button[aria-disabled="true"] {
	cursor: not-allowed;
	opacity: 0.45;
}

/* Footer */

.logniture-site-footer {
	padding: 2.5rem var(--logniture-page-padding);
	background: var(--logniture-dark);
	color: #fff;
}

.logniture-footer-inner {
	display: flex !important;
	align-items: end;
	justify-content: space-between;
	gap: 2rem;
	max-width: 96rem;
	margin: 0 auto !important;
}

.logniture-footer-brand {
	margin: 0 0 0.35rem;
	font-size: 1.6rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.logniture-footer-copy,
.logniture-footer-note {
	margin: 0;
	color: rgba(255, 255, 255, 0.68);
	font-family: var(--logniture-sans);
	font-size: 0.63rem;
	letter-spacing: 0.04em;
	line-height: 1.5;
	text-transform: uppercase;
}

.logniture-footer-links {
	display: flex;
	gap: 1.5rem;
}

.logniture-footer-links a {
	color: rgba(255, 255, 255, 0.68);
	font-family: var(--logniture-sans);
	font-size: 0.63rem;
	letter-spacing: 0.08em;
	text-decoration: none;
	text-transform: uppercase;
}

.logniture-footer-links a:hover {
	color: #fff;
}

/* Basic content templates */

.logniture-content-shell {
	max-width: 76rem;
	min-height: 55vh;
	padding: clamp(3rem, 7vw, 7rem) var(--logniture-page-padding);
}

.logniture-content-shell > h1,
.logniture-content-shell .wp-block-post-title {
	font-size: clamp(2.75rem, 6vw, 5.5rem);
	font-weight: 400;
	letter-spacing: -0.03em;
	line-height: 1;
}

/* Responsive */

@media (max-width: 74rem) {
	.logniture-category-grid {
		grid-auto-columns: minmax(9.25rem, 18vw);
		grid-auto-flow: column;
		grid-template-columns: none;
		overflow-x: auto;
		overscroll-behavior-inline: contain;
		scroll-snap-type: inline proximity;
		scrollbar-width: thin;
	}

	.logniture-category-card {
		scroll-snap-align: start;
	}
}

@media (max-width: 64rem) {
	.logniture-header-top {
		grid-template-columns: 1fr auto 1fr;
		min-height: 4.7rem;
		padding-block: 0.45rem;
	}

	.logniture-brand-note {
		display: none;
	}

	.logniture-brand-lockup {
		grid-column: 2;
		min-width: 8rem;
	}

	.logniture-logo-mark {
		width: 2.25rem;
		height: 1.8rem;
	}

	.logniture-logo-mark img {
		transform: translateY(-0.5rem);
	}

	.logniture-wordmark {
		font-size: 1rem;
	}

	.logniture-header-actions {
		grid-column: 3;
		gap: 0.65rem;
	}

	.logniture-header-action--search {
		display: none;
	}

	.logniture-header-action {
		font-size: 0;
	}

	.logniture-header-action::after {
		width: 0.9rem;
		height: 0.9rem;
	}

	.logniture-nav-shell {
		min-height: 2.8rem;
	}

	.logniture-primary-navigation {
		justify-content: flex-start !important;
		min-height: 2.8rem;
		padding-inline: var(--logniture-page-padding);
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container-open {
		display: flex;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open {
		padding: 1.25rem var(--logniture-page-padding) 2.5rem;
		background: var(--logniture-paper);
		color: var(--logniture-ink);
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		padding-top: 3rem;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
		gap: 0;
		align-items: stretch;
		width: 100%;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
		width: 100%;
		border-bottom: 1px solid var(--logniture-line);
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
		width: 100%;
		padding: 0.9rem 0;
		font-size: 0.95rem;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
		position: static !important;
		width: 100% !important;
		min-width: 0 !important;
		padding: 0 0 0.7rem 1rem !important;
		border: 0 !important;
		box-shadow: none;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item {
		border: 0;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		padding: 0.45rem 0;
		font-size: 0.7rem;
	}

	.logniture-hero {
		min-height: 44rem !important;
	}

	.logniture-hero .wp-block-cover__image-background {
		top: auto;
		bottom: 0;
		height: 57%;
		object-position: 68% center;
	}

	.logniture-hero::after {
		background:
			linear-gradient(
				180deg,
				rgba(24, 21, 18, 1) 0%,
				rgba(24, 21, 18, 0.96) 38%,
				rgba(24, 21, 18, 0.38) 62%,
				rgba(24, 21, 18, 0.08) 100%
			);
	}

	.logniture-hero .wp-block-cover__inner-container {
		align-items: flex-start;
		padding-top: 3.5rem;
	}

	.logniture-hero-copy {
		width: min(34rem, 100%);
	}

	.logniture-hero-title {
		font-size: clamp(3.2rem, 12vw, 4.5rem);
	}

	.logniture-values {
		grid-template-columns: 1fr;
		gap: 1.25rem;
	}

	.logniture-value {
		padding: 0.75rem 0;
	}

	.logniture-value + .logniture-value {
		border-top: 1px solid var(--logniture-line);
		border-left: 0;
	}

	.logniture-featured-works__header {
		display: block;
	}

	.logniture-featured-works__intro {
		margin-top: 1rem;
	}

	.logniture-product-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: 2.5rem;
	}
}

@media (max-width: 34rem) {
	.logniture-header-actions .wc-block-mini-cart__amount {
		display: none;
	}

	.logniture-hero {
		min-height: 43rem !important;
	}

	.logniture-hero .wp-block-cover__image-background {
		height: 54%;
		object-position: 69% center;
	}

	.logniture-eyebrow {
		margin-bottom: 1.15rem;
		font-size: 0.6rem;
	}

	.logniture-hero-title {
		font-size: clamp(3rem, 15vw, 4rem);
	}

	.logniture-hero-subtitle {
		max-width: 18rem;
		font-size: 0.98rem;
	}

	.logniture-hero-actions {
		display: grid !important;
		grid-template-columns: 1fr;
		width: min(19rem, 100%);
	}

	.logniture-hero-actions .wp-block-button,
	.logniture-hero-actions .wp-block-button__link {
		width: 100%;
	}

	.logniture-collections {
		padding-top: 1.75rem;
	}

	.logniture-section-title {
		font-size: 2rem;
	}

	.logniture-category-grid {
		grid-auto-columns: minmax(9.4rem, 64vw);
	}

	.logniture-product-grid {
		grid-template-columns: 1fr;
	}

	.logniture-footer-inner {
		display: block !important;
	}

	.logniture-footer-links {
		margin-top: 1.25rem;
		/* Base rule has no flex-wrap, so it inherits the flex default of
		   nowrap -- fine on wider screens where all seven links fit on one
		   line, but at this width their combined intrinsic size exceeds the
		   column and forces the whole page to scroll horizontally. Wrapping
		   is the correct mobile behaviour for a footer link list. */
		flex-wrap: wrap;
	}

	.logniture-footer-note {
		margin-top: 1.5rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	.logniture-category-card .wp-block-image img,
	.logniture-product-card__media img,
	.logniture-family-card__media img,
	.logniture-product-card__button,
	.logniture-hero-actions .wp-block-button__link {
		transition: none;
	}
}

/* Phase 2B refinements */

body.logniture-search-is-open,
body.logniture-lightbox-is-open {
	overflow: hidden;
}

.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.screen-reader-text:focus {
	position: fixed;
	top: 1rem;
	left: 1rem;
	z-index: 100001;
	width: auto;
	height: auto;
	padding: 0.75rem 1rem;
	clip: auto;
	background: var(--logniture-paper);
	color: var(--logniture-ink);
}

.logniture-header-top {
	min-height: 6.3rem;
	padding-block: 0.75rem;
}

.logniture-brand-lockup {
	gap: 0.38rem;
	min-width: 12rem;
}

.logniture-logo-mark {
	position: relative;
	width: 2.85rem;
	height: 2.5rem;
	overflow: hidden;
	background: transparent;
}

.logniture-logo-mark img {
	width: 100% !important;
	height: auto !important;
	transform: translateY(-0.62rem);
}

.logniture-logo-mark::after {
	position: absolute;
	right: 0.18rem;
	bottom: 0;
	left: 0.18rem;
	height: 1px;
	background: currentColor;
	content: "";
}

.logniture-wordmark {
	margin: 0;
	font-size: 1.22rem;
	line-height: 1;
}

.logniture-header-actions {
	gap: clamp(0.75rem, 1.6vw, 1.45rem);
}

.logniture-header-action {
	padding: 0.35rem 0;
	border: 0;
	background: transparent;
	color: var(--logniture-ink);
	font: inherit;
	cursor: pointer;
}

.logniture-header-action::after {
	display: none;
}

.logniture-header-action svg,
.logniture-search-panel svg {
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.45;
}

.logniture-header-actions .wc-block-mini-cart__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.25rem;
	height: 2.25rem;
	padding: 0.3rem;
}

.logniture-header-actions .wc-block-mini-cart__button svg {
	width: 1.35rem;
	height: 1.35rem;
}

.logniture-primary-navigation .wp-block-navigation__submenu-container {
	min-width: 22rem !important;
}

.logniture-primary-navigation .logniture-nav-family {
	display: block;
}

.logniture-primary-navigation .logniture-nav-family > .wp-block-navigation-item__content {
	padding-bottom: 0.25rem;
	font-weight: 600;
}

.logniture-primary-navigation .logniture-nav-family > .wp-block-navigation__submenu-icon {
	display: none;
}

.logniture-primary-navigation .logniture-nav-family > .wp-block-navigation__submenu-container {
	position: static !important;
	display: block !important;
	visibility: visible !important;
	width: auto !important;
	min-width: 0 !important;
	height: auto !important;
	padding: 0.05rem 0 0.55rem 1.9rem !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none;
	opacity: 1 !important;
	transform: none !important;
}

.logniture-primary-navigation .logniture-nav-subcategory .wp-block-navigation-item__content {
	padding: 0.28rem 0;
	color: var(--logniture-muted);
	font-size: 0.58rem;
	font-weight: 400;
	letter-spacing: 0.08em;
}

/* Search panel */

.logniture-search-panel[hidden] {
	display: none !important;
}

.logniture-search-panel {
	position: fixed;
	z-index: 1000;
	inset: 0;
	display: grid;
	place-items: start center;
	padding: clamp(5.5rem, 12vh, 9rem) var(--logniture-page-padding);
}

.logniture-search-panel__backdrop {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	background: rgba(17, 15, 13, 0.66);
	backdrop-filter: blur(4px);
	cursor: default;
}

.logniture-search-panel__dialog {
	position: relative;
	z-index: 1;
	width: min(46rem, 100%);
	padding: clamp(1.6rem, 4vw, 3.25rem);
	background: var(--logniture-paper);
	box-shadow: 0 2rem 6rem rgba(0, 0, 0, 0.25);
}

.logniture-search-panel__heading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: clamp(1.75rem, 4vw, 3rem);
}

.logniture-search-panel__eyebrow {
	margin: 0;
	font-family: var(--logniture-sans);
	font-size: 0.65rem;
	letter-spacing: 0.15em;
	text-transform: uppercase;
}

.logniture-search-panel__close {
	display: grid;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 1px solid var(--logniture-line);
	background: transparent;
	color: var(--logniture-ink);
	cursor: pointer;
	place-items: center;
}

.logniture-search-panel__title {
	max-width: 10em;
	margin: 0 0 1.75rem;
	font-size: clamp(2.3rem, 5vw, 4.5rem);
	font-weight: 400;
	letter-spacing: -0.035em;
	line-height: 0.98;
}

.logniture-search-form {
	display: grid;
	grid-template-columns: 1fr auto;
	border-bottom: 1px solid var(--logniture-ink);
}

.logniture-search-form input {
	min-width: 0;
	padding: 1rem 0;
	border: 0;
	background: transparent;
	color: var(--logniture-ink);
	font-family: var(--logniture-serif);
	font-size: clamp(1.1rem, 2vw, 1.55rem);
}

.logniture-search-form input::placeholder {
	color: var(--logniture-muted);
	opacity: 0.8;
}

.logniture-search-form input:focus {
	outline: 0;
}

.logniture-search-form button {
	padding: 0.85rem 0 0.85rem 1.25rem;
	border: 0;
	background: transparent;
	color: var(--logniture-ink);
	font-family: var(--logniture-sans);
	font-size: 0.67rem;
	font-weight: 600;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	cursor: pointer;
}

/* Hero with separate mobile media */

.logniture-hero {
	position: relative;
	display: flex;
	align-items: center;
	min-height: clamp(35rem, 43vw, 42rem) !important;
	overflow: hidden;
	padding: clamp(3rem, 6vw, 6.25rem) var(--logniture-page-padding);
	background: var(--logniture-dark);
	color: #fff;
	isolation: isolate;
}

.logniture-hero::after {
	position: absolute;
	z-index: -1;
	inset: 0;
	background:
		linear-gradient(
			90deg,
			rgba(24, 21, 18, 0.93) 0%,
			rgba(24, 21, 18, 0.78) 25%,
			rgba(24, 21, 18, 0.24) 50%,
			rgba(24, 21, 18, 0.02) 72%
		);
	content: "";
	pointer-events: none;
}

.logniture-hero-media--desktop {
	position: absolute;
	z-index: -2;
	inset: 0;
	display: block;
}

.logniture-hero-media--desktop img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 66% center;
}

.logniture-hero-media--mobile {
	display: none;
}

.logniture-hero-copy {
	position: relative;
	width: min(30rem, 42vw);
	margin: 0 !important;
}

.logniture-eyebrow {
	display: block;
	margin-bottom: 1.55rem;
}

.logniture-eyebrow::after {
	display: none;
}

.logniture-hero-button {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.1rem;
	min-width: 10.5rem;
	padding: 0.95rem 1.35rem;
	border: 1px solid rgba(255, 255, 255, 0.72);
	color: #fff;
	font-family: var(--logniture-sans);
	font-size: 0.68rem;
	font-weight: 500;
	letter-spacing: 0.075em;
	line-height: 1.15;
	text-decoration: none;
	text-transform: uppercase;
	transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease;
}

.logniture-hero-button--primary {
	background: var(--logniture-paper);
	border-color: var(--logniture-paper);
	color: var(--logniture-ink);
}

.logniture-hero-button:hover {
	background: #fff;
	border-color: #fff;
	color: var(--logniture-ink);
}

/* Contained category and product photography */

.logniture-category-card .wp-block-image,
.logniture-product-card__media {
	background: #efebe4;
}

.logniture-category-card .wp-block-image a {
	display: grid;
	width: 100%;
	height: 100%;
	padding: clamp(0.45rem, 1.1vw, 0.95rem);
	place-items: center;
}

.logniture-category-card .wp-block-image img,
.logniture-product-card__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

.logniture-product-card__media {
	display: grid;
	padding: clamp(0.6rem, 1.2vw, 1rem);
	place-items: center;
}

.logniture-product-card__media .logniture-product-status {
	position: absolute;
}

.logniture-product-card__body {
	min-width: 0;
}

/* Commerce landing and archives */

.logniture-commerce-shell {
	width: 100%;
	padding: clamp(3.5rem, 7vw, 7rem) var(--logniture-page-padding);
	background: var(--logniture-paper);
}

.logniture-commerce-intro {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(18rem, 0.65fr);
	column-gap: clamp(2rem, 8vw, 8rem);
	align-items: end;
	max-width: 96rem;
	margin: 0 auto clamp(3rem, 6vw, 5rem);
	padding-bottom: clamp(1.5rem, 3vw, 2.5rem);
	border-bottom: 1px solid var(--logniture-line);
}

.logniture-commerce-eyebrow {
	grid-column: 1 / -1;
	margin: 0 0 1rem;
	font-family: var(--logniture-sans);
	font-size: 0.65rem;
	font-weight: 500;
	letter-spacing: 0.15em;
	text-transform: uppercase;
}

.logniture-commerce-intro h1 {
	margin: 0;
	/* Brought down to match the scale .logniture-commerce-intro--bathtubs h1
	   already uses (theme 0.6.27) -- the original clamp(3.5rem, 8vw, 8rem)
	   was unchanged since Phase 2B (git blame confirms this exact rule was
	   never touched by any later round, so this is a deliberate refinement,
	   not a regression fix), but an up-to-8rem archive H1 reads as
	   disproportionate now that Related Works/card titles render at their
	   correct, modest size -- e.g. "Decorative Pieces - Stools/Side Tables"
	   already wraps to two lines well before hitting the old cap. Reusing
	   the bathtubs value keeps every archive on one consistent scale
	   instead of introducing a third number. */
	font-size: clamp(3rem, 6.6vw, 6.75rem);
	font-weight: 400;
	letter-spacing: -0.05em;
	line-height: 0.86;
}

.logniture-commerce-intro > p:last-child {
	max-width: 34rem;
	margin: 0;
	color: var(--logniture-muted);
	font-size: clamp(1rem, 1.4vw, 1.25rem);
	line-height: 1.5;
}

.logniture-products-landing__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1rem, 2.3vw, 2.4rem);
	max-width: 96rem;
	margin: 0 auto;
}

/* Outer card and media frame deliberately reuse the same proven values as
   the homepage "Explore our collections" cards (.logniture-category-card /
   .wp-block-image, see below) -- same border/radius/background/padding on
   the card, same aspect-ratio media frame. The frame img rule mirrors the
   homepage's own width/height:auto + max-width/max-height:100% pattern
   (not width/height:100%) because a live measurement on /shop/ proved the
   old width/height:100% pattern loses a CSS specificity tie against
   WooCommerce's own ".woocommerce img { height: auto }" (equal specificity,
   Woo wins ties in this stylesheet's load order) -- the portrait Chairs
   photo was rendering ~35% taller than its frame as a result. Matching the
   homepage's already-working auto+max pattern (plus !important, exactly as
   the homepage rule already does) sidesteps that tie entirely instead of
   fighting it. The frame also needs explicit grid-template-columns/rows:
   minmax(0, 1fr) -- confirmed by a live measurement that omitting it (as
   this rule originally did) lets the grid's implicit auto-sized row grow
   to the img's own aspect-ratio-derived height instead of being clamped to
   the aspect-ratio frame, silently defeating max-height entirely; both the
   homepage rule and the already-working .logniture-product-card__media
   (.logniture-product-grid--archive) rule below already declare this.
   Shop keeps its own distinct body content (index, title, description,
   subcategory links) -- only the outer card and media frame are visually
   aligned. */
.logniture-family-card {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	min-width: 0;
	padding: 0.72rem;
	border: 1px solid rgba(55, 48, 41, 0.12);
	border-radius: 0.5rem;
	background: #fbf9f5;
	box-shadow: 0 0.65rem 1.8rem rgba(39, 32, 26, 0.025);
}

.logniture-family-card__media {
	position: relative;
	display: grid;
	box-sizing: border-box;
	width: 100%;
	margin: 0 0 1rem;
	padding: 0.625rem;
	border: 1px solid rgba(55, 48, 41, 0.07);
	border-radius: 0.4rem;
	background: #eeebe5;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: minmax(0, 1fr);
	place-items: center;
}

.logniture-family-card__media img {
	position: static !important;
	display: block;
	width: auto !important;
	height: auto !important;
	max-width: 100% !important;
	max-height: 100% !important;
	border-radius: 0.3rem;
	object-fit: contain;
	object-position: center;
	transition: transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* Same subtle hover/focus polish as the homepage "Explore our collections"
   cards (.logniture-category-card:hover .wp-block-image img { transform:
   scale(1.012); }, 420ms cubic-bezier(0.22, 1, 0.36, 1)) -- same token,
   same scale, no card-level lift/shadow/border change, because the
   homepage system itself doesn't animate those either (confirmed live: the
   card's own transform/box-shadow/border-color are static, only the image
   scales and the arrow nudges -- and shop cards have no arrow element to
   nudge). :focus-within is added in addition to :hover (homepage only
   scales on :hover) so keyboard focus on the media link, title link, or
   any subcategory link gets the same emphasis; this only extends shop's
   own selector and does not change homepage's :hover-only behaviour.
   Scale happens inside .logniture-family-card__media's own overflow:
   hidden, so containment (verified in Theme 0.6.2) is unaffected. */
.logniture-family-card:hover .logniture-family-card__media img,
.logniture-family-card:focus-within .logniture-family-card__media img {
	transform: scale(1.012);
}

/* Defence-in-depth only: the real fix is the clean, single-line markup in
   logniture_render_products_landing() (no bare newline for wpautop to
   convert). This just guards against the same class of artifact
   reappearing, without masking a markup regression -- scoped to a direct
   <br> child of the media link specifically, never a broad ".../br"
   selector that could also hide a legitimate text line-break elsewhere in
   the card. */
.logniture-family-card__media > br {
	display: none;
}

.logniture-family-card__body {
	display: grid;
	grid-template-columns: auto 1fr;
	column-gap: 1rem;
	padding: 1.1rem 0 2rem;
}

.logniture-family-card__index {
	grid-row: 1 / span 4;
	margin: 0.15rem 0 0;
	font-family: var(--logniture-sans);
	font-size: 0.58rem;
	letter-spacing: 0.08em;
}

.logniture-family-card h2 {
	margin: 0 0 0.55rem;
	font-size: clamp(1.35rem, 2vw, 2rem);
	font-weight: 400;
	line-height: 1.08;
}

.logniture-family-card h2 a {
	text-decoration: none;
}

.logniture-family-card__body > p:not(.logniture-family-card__index) {
	margin: 0;
	color: var(--logniture-muted);
	font-size: 0.88rem;
	line-height: 1.5;
}

.logniture-family-card__children {
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem 0.9rem;
	margin-top: 1rem;
}

.logniture-family-card__children a {
	font-family: var(--logniture-sans);
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-decoration: none;
	text-transform: uppercase;
}

.logniture-commerce-intro--bathtubs h1 {
	font-size: clamp(3rem, 6.6vw, 6.75rem);
	line-height: 0.92;
}

.logniture-archive-key {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 1.75rem;
	max-width: 96rem;
	margin: -2rem auto 2rem;
	font-family: var(--logniture-sans);
	font-size: 0.62rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.logniture-archive-key span {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.logniture-archive-key i {
	width: 0.55rem;
	height: 0.55rem;
	border-radius: 50%;
	background: #3e6640;
}

.logniture-archive-key .is-made-to-order {
	background: #a95d22;
}

.logniture-archive-key .is-sold {
	background: #9b2f28;
}

.logniture-product-grid--archive {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.logniture-product-grid--archive .logniture-product-card__media {
	aspect-ratio: 1 / 0.88;
}

/* Standard product prototype */

.logniture-breadcrumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
	max-width: 96rem;
	margin: 0 auto 2rem;
	color: var(--logniture-muted);
	font-family: var(--logniture-sans);
	font-size: 0.62rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.logniture-breadcrumbs a {
	text-decoration: none;
}

/* Single product — redesigned hero (theme 0.4.0) */

.logniture-single-product__hero {
	display: grid;
	grid-template-columns: minmax(0, 1.45fr) minmax(19rem, 0.62fr);
	grid-template-areas:
		"gallery summary"
		"story   summary";
	gap: clamp(1.75rem, 4vw, 5rem);
	max-width: 96rem;
	margin: 0 auto;
	align-items: start;
}

/* Explicit grid-area placement (theme 0.6.25): the story section is a
   grid item of the hero (see logniture_render_standard_product()), not a
   full-width sibling below it, so it can start under the gallery column
   without waiting for the taller summary column -- which spans both rows
   -- to finish. Grid placement guarantees the story and summary columns
   never overlap regardless of either one's content height. */
.logniture-single-product__hero > .logniture-gallery {
	grid-area: gallery;
}

.logniture-single-product__hero > .logniture-product-summary {
	grid-area: summary;
}

.logniture-single-product__hero > .logniture-product-story {
	grid-area: story;
	margin: 0;
}

/* Gallery: one large contained image, thumbnail rail, counter, nav */

.logniture-gallery {
	min-width: 0;
}

.logniture-gallery__stage {
	position: relative;
	background: var(--logniture-paper);
	border: 1px solid var(--logniture-line);
}

/* position: relative (not display: grid + place-items: center) is
   deliberate: confirmed live on SKU 691 that a percentage-height img
   inside this box, sized only via CSS Grid + aspect-ratio, does not get a
   definite containing-block height in the deployed browser engine, so
   `height: 100%` on the image fell back to its used value of `auto` and
   the image rendered at its full intrinsic 683x1024 ratio — taller than
   this box — and was clipped by overflow: hidden. Absolutely positioning
   the image with inset: 0 gives it an unambiguous, always-definite box to
   fit into, verified live to resolve to the box's exact 881.56x661.17px
   size with nothing clipped. */
.logniture-gallery__main {
	position: relative;
	display: block;
	width: 100%;
	margin: 0;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	cursor: zoom-in;
}

/* Two class-level selectors here (not one) deliberately outweigh
   WooCommerce's own `.woocommerce img, .woocommerce-page img { height:
   auto; max-width: 100%; }` (woocommerce-layout.css), which otherwise wins
   the cascade over a single-class selector regardless of load order. */
.logniture-gallery__main .logniture-gallery__image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center;
}

/* Two-layer double buffer (theme 0.5.7): both the server-rendered main
   image and its JS-created twin (site.js) carry this class permanently --
   neither is ever removed from the DOM. Position/size come from the
   shared .logniture-gallery__image rule above (both layers carry that
   class too), so they exactly overlap; only opacity/scale differ,
   toggled by .is-active-buffer. Exactly one layer has .is-active-buffer
   at rest; a navigation request decodes into the *other* one, then both
   opacities crossfade together -- both images are on screen for the
   whole transition, so there is never a blank/flashed frame, and neither
   layer's `src` is ever touched while it is still fading (see site.js). */
.logniture-gallery__buffer {
	opacity: 0;
	transform: scale(0.995);
	transition: opacity 240ms ease, transform 240ms ease;
	pointer-events: none;
}

.logniture-gallery__buffer.is-active-buffer {
	opacity: 1;
	transform: scale(1);
	pointer-events: auto;
}

@media (prefers-reduced-motion: reduce) {
	.logniture-gallery__buffer {
		transition: none;
	}
}

.logniture-gallery__nav {
	position: absolute;
	top: 50%;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	border: 1px solid var(--logniture-line);
	border-radius: 50%;
	background: rgba(251, 250, 247, 0.92);
	color: var(--logniture-ink);
	line-height: 0;
	cursor: pointer;
	transform: translateY(-50%);
	transition: background 0.2s ease, border-color 0.2s ease;
}

.logniture-gallery__nav:hover,
.logniture-gallery__nav:focus-visible {
	background: var(--logniture-paper);
	border-color: var(--logniture-ink);
}

.logniture-gallery__nav:focus-visible {
	outline: 2px solid var(--logniture-ink);
	outline-offset: 2px;
}

.logniture-chevron-icon {
	display: block;
}

.logniture-gallery__nav--prev {
	left: 0.75rem;
}

.logniture-gallery__nav--next {
	right: 0.75rem;
}

/* One chevron shape for both directions (see logniture_render_chevron_icon()
   / CHEVRON_SVG): "next" is this exact same markup mirrored horizontally,
   not a second hand-authored point set, so the two can never drift out of
   being exact mirror images of each other. A pure scaleX(-1) keeps the
   icon centered on its own box (no positional offset introduced). */
.logniture-gallery__nav--next .logniture-chevron-icon {
	transform: scaleX(-1);
}

.logniture-gallery__counter {
	position: absolute;
	right: 0.85rem;
	bottom: 0.75rem;
	margin: 0;
	padding: 0.2rem 0.6rem;
	background: rgba(24, 23, 20, 0.72);
	color: #fff;
	font-family: var(--logniture-sans);
	font-size: 0.68rem;
	letter-spacing: 0.05em;
}

.logniture-gallery__thumbs {
	display: flex;
	gap: 0.5rem;
	margin: 0.6rem 0 0;
	padding: 0.15rem 0 0.5rem;
	list-style: none;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x proximity;
	/* Soften the rail's scrollbar without hiding it — wheel/trackpad, touch
	   swipe and keyboard (Tab between the thumbnail links) all keep working
	   regardless of how the scrollbar itself is painted. */
	scrollbar-width: thin;
	scrollbar-color: var(--logniture-line) transparent;
}

.logniture-gallery__thumbs::-webkit-scrollbar {
	height: 6px;
}

.logniture-gallery__thumbs::-webkit-scrollbar-track {
	background: transparent;
}

.logniture-gallery__thumbs::-webkit-scrollbar-thumb {
	background: var(--logniture-line);
	border-radius: 3px;
}

.logniture-gallery__thumb-item {
	flex: 0 0 auto;
	margin: 0;
	scroll-snap-align: start;
}

.logniture-gallery__thumb {
	position: relative;
	display: block;
	width: 4.25rem;
	height: 4.25rem;
	background: var(--logniture-paper);
	border: 1px solid var(--logniture-line);
	opacity: 0.72;
	transition: opacity 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

/* position: absolute with an explicit calc() box (not display: grid +
   place-items: center, and not width/height: auto with inset) is
   deliberate: confirmed live that a percentage- or auto-sized child of a
   place-items: center box does not reliably get a definite size for
   object-fit to work with in the deployed engine — the same class of bug
   fixed for the main image in 0.4.1. top/left + calc() gives the image an
   unambiguous box inset from the frame edge (the visual "small padding"),
   which object-fit: contain then letterboxes into without cropping or
   stretching, verified live on a real vertical photo.
   Two class-level selectors also deliberately outweigh WooCommerce's own
   `.woocommerce img, .woocommerce-page img { height: auto; ... }`
   (woocommerce-layout.css) regardless of stylesheet load order. */
.logniture-gallery__thumbs .logniture-gallery__thumb img {
	position: absolute;
	top: 0.3rem;
	left: 0.3rem;
	width: calc(100% - 0.6rem);
	height: calc(100% - 0.6rem);
	object-fit: contain;
	object-position: center;
}

.logniture-gallery__thumb.is-active {
	opacity: 1;
	border-color: var(--logniture-ink);
	box-shadow: 0 0 0 1px var(--logniture-ink);
}

.logniture-gallery__thumb:hover,
.logniture-gallery__thumb:focus-visible {
	opacity: 1;
}

/* Summary column (sticky only on wide desktop, see media query) */

.logniture-product-summary {
	align-self: start;
}

.logniture-product-summary > .logniture-product-status,
.logniture-bathtub-hero__content > .logniture-product-status {
	position: static;
	display: inline-flex;
	margin-bottom: 1.25rem;
}

/* Bathtub hero only: a discreet dot + label instead of the white capsule
   badge used elsewhere (product cards, archive grid overlays) -- those
   stay untouched, since a solid pill is what keeps the badge legible over
   a photo whose background varies from card to card. The hero already
   sits on one deliberately controlled dark background, so a quieter
   indicator reads as premium instead of like a generic webshop badge.
   Font-size/weight/text-transform/letter-spacing are inherited from the
   shared .logniture-product-status rule on purpose, not redeclared. */
.logniture-bathtub-hero__content > .logniture-product-status {
	align-items: center;
	gap: 0.5rem;
	padding: 0;
	background: none;
	color: rgba(255, 255, 255, 0.68);
}

.logniture-bathtub-hero__content > .logniture-product-status::before {
	content: "";
	display: inline-block;
	width: 0.4rem;
	height: 0.4rem;
	flex: 0 0 auto;
	border-radius: 50%;
	background: #7fb37f;
}

.logniture-bathtub-hero__content > .logniture-product-status--made_to_order::before {
	background: #e0904a;
}

.logniture-bathtub-hero__content > .logniture-product-status--sold::before {
	background: #d67169;
}

.logniture-product-summary__title {
	margin: 0 0 1.1rem;
	font-size: clamp(2rem, 3vw, 3rem);
	font-weight: 400;
	letter-spacing: -0.02em;
	line-height: 1.05;
	max-width: 22ch;
	overflow-wrap: break-word;
	hyphens: auto;
}

.logniture-product-summary__meta {
	margin: 0 0 1.75rem;
}

.logniture-product-summary__price {
	margin: 0 0 0.6rem;
	font-family: var(--logniture-sans);
	font-size: 1.1rem;
	font-weight: 600;
}

.logniture-product-summary__vat-note {
	margin: 0 0 0.6rem;
	color: var(--logniture-muted);
	font-family: var(--logniture-sans);
	font-size: 0.85rem;
}

.logniture-product-summary__lead {
	margin: 0;
	color: var(--logniture-muted);
	font-size: 1rem;
	line-height: 1.55;
}

/* CTA — full-width premium button */

.logniture-purchase-action {
	margin: 0 0 2.25rem;
}

.logniture-add-to-cart {
	display: flex;
	gap: 0.75rem;
	align-items: stretch;
	margin: 0;
}

.logniture-quantity {
	flex: 0 0 auto;
}

.logniture-quantity__input {
	width: 4rem;
	min-height: 3.5rem;
	padding: 0 0.5rem;
	border: 1px solid var(--logniture-ink);
	background: transparent;
	font-family: var(--logniture-sans);
	font-size: 1rem;
	text-align: center;
}

.logniture-cta,
.logniture-purchase-action .logniture-product-card__button,
.logniture-purchase-action .logniture-inquiry-trigger {
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	justify-content: center;
	gap: 0.6rem;
	width: 100%;
	min-width: 0;
	min-height: 3.5rem;
	margin: 0;
	padding: 0.9rem 1.5rem;
	border: 1px solid var(--logniture-ink);
	background: var(--logniture-ink);
	color: var(--logniture-paper);
	font-family: var(--logniture-sans);
	font-size: 0.82rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.logniture-cta:hover,
.logniture-cta:focus-visible,
.logniture-purchase-action .logniture-product-card__button:hover,
.logniture-purchase-action .logniture-product-card__button:focus-visible,
.logniture-purchase-action .logniture-inquiry-trigger:hover,
.logniture-purchase-action .logniture-inquiry-trigger:focus-visible {
	background: var(--logniture-warm);
	border-color: var(--logniture-warm);
	color: #fff;
}

.logniture-cta__arrow,
.logniture-purchase-action .logniture-product-card__button::after,
.logniture-purchase-action .logniture-inquiry-trigger::after {
	margin-left: 0;
	content: "\2192";
	transition: transform 0.2s ease;
}

/* .logniture-cta already prints its own arrow span, so suppress the
   pseudo-arrow the shared card-button rule would otherwise add to it. */
.logniture-cta::after {
	content: none;
}

.logniture-cta:hover .logniture-cta__arrow {
	transform: translateX(0.25rem);
}

.logniture-purchase-action__lead-time {
	margin: 0.7rem 0 0;
	color: var(--logniture-muted);
	font-size: 0.82rem;
	font-style: italic;
}

/* Technical specifications — labelled rows with horizontal rules */

.logniture-product-facts,
.logniture-product-specs {
	margin: 0;
	border-top: 1px solid var(--logniture-line);
}

.logniture-product-facts div,
.logniture-product-specs__row {
	display: grid;
	grid-template-columns: 7rem 1fr;
	gap: 1rem;
	padding: 0.9rem 0;
	border-bottom: 1px solid var(--logniture-line);
}

.logniture-product-facts dt,
.logniture-product-specs dt {
	font-family: var(--logniture-sans);
	font-size: 0.6rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.logniture-product-facts dd,
.logniture-product-specs dd {
	margin: 0;
	color: var(--logniture-muted);
	font-size: 0.9rem;
	line-height: 1.45;
}

.logniture-product-specs__dimension {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
}

.logniture-product-specs__dimension + .logniture-product-specs__dimension {
	margin-top: 0.25rem;
}

.logniture-product-specs__dimension-label {
	color: var(--logniture-ink);
}

/* Universal post-Technical-Details inquiry CTA (standard product layout).
   Button only, no heading/description copy. Reuses the exact anchor
   Product_Inquiries::render_trigger() renders
   (.logniture-product-card__button.logniture-inquiry-trigger) -- this
   block only adds placement/spacing and the secondary/primary sizing
   treatment, mirroring the same override pattern already used for the
   premium Technical Details CTA (.logniture-premium-details__specs
   .logniture-cta). */
.logniture-product-inquiry-cta {
	margin-top: 2rem;
}

.logniture-product-inquiry-cta .logniture-inquiry-trigger {
	display: flex;
	width: 100%;
	max-width: 23.75rem;
	min-height: 3.5rem;
	align-items: center;
	justify-content: center;
	padding: 0.9rem 1.5rem;
	font-size: 0.72rem;
	text-align: center;
}

/* Secondary: an otherwise checkout-enabled product's "Send Inquiry" —
   same content-column width and vertical rhythm as Add to Cart above it
   (so it reads as a real, findable option, not an afterthought), but an
   outlined, unfilled treatment and a gentler hover so it never competes
   with Add to Cart's solid black weight. */
.logniture-product-inquiry-cta--secondary .logniture-inquiry-trigger {
	max-width: 100%;
	min-height: 3.5rem;
	padding: 0.9rem 1.5rem;
	justify-content: space-between;
	background: var(--logniture-canvas);
	border-color: var(--logniture-ink);
	color: var(--logniture-ink);
}
.logniture-product-inquiry-cta--secondary .logniture-inquiry-trigger::after {
	margin-left: 0.6rem;
	content: "\2192";
	transition: transform 0.2s ease;
}
.logniture-product-inquiry-cta--secondary .logniture-inquiry-trigger:hover {
	/* A mixed shade of the existing canvas/ink tokens (not var(--logniture-paper),
	   which is LIGHTER than the resting canvas fill and was reading as a
	   washed-out/whiter hover instead of a clear pressed affordance). */
	background: color-mix(in srgb, var(--logniture-canvas) 82%, var(--logniture-ink) 18%);
	border-color: var(--logniture-warm);
}
.logniture-product-inquiry-cta--secondary .logniture-inquiry-trigger:focus-visible {
	border-color: var(--logniture-focus);
	outline: 2px solid var(--logniture-focus);
	outline-offset: 1px;
}

/* Primary: a Sold Out product has no Add to Cart, so "Inquire About
   Similar Work" is the only and therefore primary available action --
   filled, matching .logniture-cta's own primary treatment. */
.logniture-product-inquiry-cta--primary .logniture-inquiry-trigger {
	background: var(--logniture-ink);
	border-color: var(--logniture-ink);
	color: var(--logniture-paper);
}
.logniture-product-inquiry-cta--primary .logniture-inquiry-trigger:hover,
.logniture-product-inquiry-cta--primary .logniture-inquiry-trigger:focus-visible {
	background: var(--logniture-warm);
	border-color: var(--logniture-warm);
	color: #fff;
}

/* Checkout CTA override -- visual/accessible substitute for the "Complete
   Purchase" label; never touches the real button text node React
   manages. See assets/js/checkout-cta.js for why. */

.logniture-cta-override .wc-block-components-checkout-place-order-button__text {
	visibility: hidden;
	position: relative;
}

.logniture-cta-override .wc-block-components-checkout-place-order-button__text::after {
	content: "Complete Purchase";
	visibility: visible;
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	white-space: nowrap;
}

/* THE PIECE — editorial description */

/* Same site container as the product hero grid (max-width: 96rem, centered
   in the page), so the inner text column's left edge lines up with the
   gallery/product-info grid's left edge instead of centering independently. */
.logniture-product-story {
	max-width: 96rem;
	margin: clamp(2.5rem, 5vw, 4.5rem) auto 0;
}

.logniture-product-story__inner {
	max-width: 52.5rem;
	margin-right: auto;
}

.logniture-product-story__header {
	margin-bottom: 1.4rem;
}

.logniture-product-story__copy {
	font-size: clamp(1.05rem, 1.15vw, 1.25rem);
	line-height: 1.7;
}

.logniture-product-story__copy > :first-child {
	margin-top: 0;
}

.logniture-product-story__copy h2,
.logniture-product-story__copy h3,
.logniture-product-story__copy h4 {
	margin: 2rem 0 0.75rem;
	font-size: 1.35rem;
	font-weight: 400;
	line-height: 1.2;
}

.logniture-product-story__copy ul,
.logniture-product-story__copy ol {
	padding-left: 1.25rem;
}

/* Lightbox */

.logniture-lightbox {
	position: fixed;
	inset: 0;
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: clamp(1rem, 4vw, 3rem);
	background: rgba(18, 17, 15, 0.94);
}

.logniture-lightbox[hidden] {
	display: none;
}

.logniture-lightbox__figure {
	position: relative;
	margin: 0;
	max-width: 100%;
	max-height: 100%;
	overflow: hidden;
}

/* Two-layer double buffer (theme 0.5.7): two permanent <img> elements
   (site.js) share this class, replacing the previous single base image
   plus transient crossfade overlay. Exactly one is ever the "active"
   layer (normal document flow, opacity 1 -- this is what gives `figure`
   its natural, image-shaped box) at rest; the other is "parked"
   (position: absolute, inset: 0, opacity 0, sized to exactly match
   whatever box the active layer currently defines). A navigation request
   decodes into the parked layer -- the active layer's `src` is never
   touched -- then both opacities crossfade together while the active
   layer, still in normal flow, keeps the box stable for the whole
   transition. Only once the fade completes do the two layers swap roles
   (see site.js): the newly-visible one takes over flow/sizing duty, the
   other becomes parked, ready for next time. */
.logniture-lightbox__image {
	display: block;
	max-width: 100%;
	max-height: 86vh;
	object-fit: contain;
	cursor: zoom-in;
	touch-action: none;
	transform-origin: center center;
	/* Belt-and-braces alongside the draggable="false" attribute/dragstart
	   guard in site.js -- scoped to the lightbox image only, never applied
	   site-wide, so ordinary content images keep their normal drag/select
	   behaviour. */
	-webkit-user-drag: none;
	user-select: none;
	-webkit-user-select: none;
	opacity: 0;
}

.logniture-lightbox__image.is-active-buffer {
	opacity: 1;
}

.logniture-lightbox__image.is-parked-buffer {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

@media (prefers-reduced-motion: no-preference) {
	.logniture-lightbox__image {
		transition: opacity 200ms ease, transform 0.2s ease;
	}
}

.logniture-lightbox__image.is-zoomed {
	cursor: grab;
}

.logniture-lightbox__image.is-dragging {
	cursor: grabbing;
	transition: none;
}

.logniture-lightbox__spinner {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 2rem;
	height: 2rem;
	margin: -1rem 0 0 -1rem;
	border: 2px solid rgba(255, 255, 255, 0.35);
	border-top-color: #fff;
	border-radius: 50%;
	display: none;
}

@media (prefers-reduced-motion: no-preference) {
	.logniture-lightbox__spinner {
		animation: logniture-lightbox-spin 0.8s linear infinite;
	}
}

.logniture-lightbox.is-loading .logniture-lightbox__spinner {
	display: block;
}

@keyframes logniture-lightbox-spin {
	to {
		transform: rotate(360deg);
	}
}

.logniture-lightbox__close,
.logniture-lightbox__zoom,
.logniture-lightbox__nav {
	position: absolute;
	display: grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	padding: 0;
	border: 1px solid rgba(255, 255, 255, 0.4);
	border-radius: 50%;
	background: rgba(24, 23, 20, 0.5);
	color: #fff;
	font-size: 1.5rem;
	line-height: 1;
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease;
}

.logniture-lightbox__nav {
	line-height: 0;
}

.logniture-lightbox__nav .logniture-chevron-icon {
	display: block;
}

/* Same single-shape-plus-mirror approach as the main gallery nav. */
.logniture-lightbox__nav--next .logniture-chevron-icon {
	transform: scaleX(-1);
}

.logniture-lightbox__close:hover,
.logniture-lightbox__close:focus-visible,
.logniture-lightbox__zoom:hover,
.logniture-lightbox__zoom:focus-visible,
.logniture-lightbox__nav:hover,
.logniture-lightbox__nav:focus-visible {
	background: rgba(24, 23, 20, 0.85);
	border-color: #fff;
}

.logniture-lightbox__close:focus-visible,
.logniture-lightbox__zoom:focus-visible,
.logniture-lightbox__nav:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

.logniture-lightbox__zoom[aria-pressed="true"] {
	background: rgba(24, 23, 20, 0.85);
	border-color: #fff;
}

.logniture-lightbox__close {
	top: 1rem;
	right: 1rem;
}

.logniture-lightbox__zoom {
	top: 1rem;
	right: 4.75rem;
}

.logniture-lightbox__zoom .logniture-zoom-icon {
	display: block;
}

.logniture-lightbox__nav {
	top: 50%;
	transform: translateY(-50%);
}

.logniture-lightbox__nav--prev {
	left: clamp(0.75rem, 3vw, 2rem);
}

.logniture-lightbox__nav--next {
	right: clamp(0.75rem, 3vw, 2rem);
}

.logniture-lightbox__counter {
	position: absolute;
	bottom: 1.15rem;
	left: 50%;
	margin: 0;
	color: rgba(255, 255, 255, 0.85);
	font-family: var(--logniture-sans);
	font-size: 0.72rem;
	letter-spacing: 0.05em;
	transform: translateX(-50%);
}

/* Premium narrative/detail sections (bathtub layout) */

.logniture-premium-story,
.logniture-premium-details {
	display: grid;
	margin: clamp(5rem, 10vw, 10rem) auto 0;
	padding-top: clamp(2rem, 4vw, 4rem);
	border-top: 1px solid var(--logniture-line);
}

.logniture-premium-story {
	grid-template-columns: minmax(0, 0.75fr) minmax(22rem, 1.25fr);
	gap: clamp(2rem, 8vw, 9rem);
	max-width: 96rem;
}

/* Technical Details (theme 0.5.7): matches the premium gallery's own
   max-width (.logniture-premium-gallery-section, 100rem). Both columns
   are capped at a fixed max width -- left 32rem (~512px, ~32-34% of the
   100rem/1600px section), specs 50rem (~800px, within the 760-850px
   target, ~50-54% of the section) -- and `justify-content: space-between`
   sends any width left over once both columns are at their cap into the
   *gap between* them instead of trailing, unclaimed space after the last
   column. This is the same mechanism as 0.5.5/0.5.6, just with wider caps
   (that round's 34rem/44rem specs column still left visible empty space
   on wide desktop): fr-based tracks were the actual original bug (no
   ceiling on the container's own max-width vs. very wide viewports
   translating into unclaimed trailing space), and space-between keeps the
   right column's right edge flush with the section's own right edge
   regardless of how much leftover there is, however the caps are tuned. */
.logniture-premium-details {
	grid-template-columns: minmax(18rem, 32rem) minmax(28rem, 50rem);
	justify-content: space-between;
	gap: clamp(1.5rem, 4vw, 4rem);
	max-width: 100rem;
}

.logniture-product-story__header h2,
.logniture-premium-story h2,
.logniture-premium-details h2,
.logniture-related-products header h2 {
	margin: 0;
	font-size: clamp(2.4rem, 4.5vw, 5rem);
	font-weight: 400;
	letter-spacing: -0.04em;
	line-height: 0.96;
}

.logniture-premium-story__copy {
	font-size: clamp(1.05rem, 1.6vw, 1.4rem);
	line-height: 1.6;
}

.logniture-premium-story__copy p:first-child {
	margin-top: 0;
}

/* Sticky product info only on wide desktop, where the gallery is tall
   enough for it to feel intentional. Never on tablet/mobile. */

@media (min-width: 1200px) {
	.logniture-product-summary {
		position: sticky;
		top: 1.5rem;
	}
}

/* Premium bathtub prototype */

.logniture-single-product--premium {
	background: var(--logniture-paper);
}

/* Bathtub hero (theme 0.5.0): a real two-column grid, text and image in
   separate tracks that can never overlap regardless of where the subject
   sits within the product photo -- replaces the old single-image overlay
   composition (.logniture-premium-product-hero*, removed), which only ever
   worked by coincidence on one curated marketing image and collided with
   every real, centered bathtub photo (confirmed live on SKU 611). */

.logniture-bathtub-hero {
	display: grid;
	grid-template-columns: minmax(20rem, 38%) 1fr;
	align-items: stretch;
	min-height: min(66rem, 78vh);
	overflow: hidden;
	background: #171411;
	color: #fff;
}

/* Full-bleed hero: only used when a curated hero image exists (see
   $has_curated_hero in logniture_render_premium_product()). The image is
   art-directed for exactly this treatment -- empty dark space built into
   its own composition -- so object-fit: cover can fill the entire section
   edge to edge with no letterboxing gaps and therefore nothing to blend or
   fade; a plain left-side readability gradient is the only overlay. This
   never applies to a product's own un-curated featured image, which keeps
   the safe, never-crop two-column layout above instead. */
.logniture-bathtub-hero.logniture-bathtub-hero--full-bleed {
	display: block;
	position: relative;
}

.logniture-bathtub-hero__bg {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.logniture-bathtub-hero__bg-image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* The source photo's own empty space sits on its left third, subject
	   right-of-center -- confirmed against the real SKU 611 hero asset. */
	object-position: 70% center;
}

.logniture-bathtub-hero__scrim {
	position: absolute;
	inset: 0;
	z-index: 1;
	background: linear-gradient(90deg, rgba(23, 20, 17, 0.9) 0%, rgba(23, 20, 17, 0.55) 34%, rgba(23, 20, 17, 0) 62%);
	pointer-events: none;
}

.logniture-bathtub-hero--full-bleed .logniture-bathtub-hero__content {
	position: relative;
	z-index: 2;
	max-width: 34rem;
	padding: 4rem clamp(1.5rem, 4vw, 4rem) 4rem var(--logniture-page-padding);
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: inherit;
	gap: 0.1rem;
}

.logniture-bathtub-hero__content {
	display: flex;
	flex-direction: column;
	align-self: center;
	justify-content: center;
	gap: 0.1rem;
	padding: 4rem clamp(1.5rem, 4vw, 4rem) 4rem var(--logniture-page-padding);
}

.logniture-bathtub-hero__title {
	margin: 0 0 1.1rem;
	font-size: clamp(2.5rem, 4.2vw, 4.5rem);
	font-weight: 400;
	letter-spacing: -0.045em;
	line-height: 0.98;
	/* Never a fixed pixel line count: long real product names (e.g. "Live
	   Edge Bathtub Carved from Single Piece of Wood") must be able to wrap
	   to as many lines as needed without spilling into the media column --
	   the grid track width is the only thing constraining this, not a
	   max-width tuned to one short invented name. */
	overflow-wrap: break-word;
}

.logniture-bathtub-hero__content .logniture-product-summary__price {
	margin: 0 0 1rem;
	font-size: clamp(1.1rem, 1.4vw, 1.4rem);
}

.logniture-bathtub-hero__content .logniture-product-summary__vat-note {
	margin: 0 0 1rem;
}

.logniture-bathtub-hero__intro {
	max-width: 30rem;
	margin: 0 0 1.75rem;
	font-size: clamp(1rem, 1.3vw, 1.2rem);
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.82);
}

.logniture-bathtub-hero__media {
	position: relative;
	min-width: 0;
	/* Exactly the same tone as .logniture-bathtub-hero's own background
	   (not a separate near-black shade): with a dedicated dark-background
	   hero photo, the image's own backdrop and the section's backdrop read
	   as one continuous canvas instead of a "boxed" light rectangle sitting
	   inside a dark panel. */
	background: #171411;
}

.logniture-bathtub-hero__media picture {
	display: block;
	width: 100%;
	height: 100%;
}

/* A soft blend at the seam between the text column and the image, so the
   two never read as two flatly glued-together rectangles -- purely a
   visual aid; it never affects text legibility (the text column has its
   own solid background) and never sits over any part of the product image
   the way the old veil overlay used to. */
.logniture-bathtub-hero__media::before {
	content: "";
	position: absolute;
	inset: 0 auto 0 0;
	width: clamp(2rem, 6vw, 6rem);
	background: linear-gradient(90deg, #171411 0%, rgba(23, 20, 17, 0) 100%);
	pointer-events: none;
	z-index: 1;
}

/* A soft fade along the bottom edge, so the photo's own hard horizontal
   edge never reads as an abrupt cut against the hero background. Mostly
   transparent until 84% down (the tub's base/legs stay clearly visible),
   then resolves fully to the same background color by the very bottom --
   deliberately shallow, not a heavy vignette. */
.logniture-bathtub-hero__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(23, 20, 17, 0) 0%, rgba(23, 20, 17, 0) 82%, #171411 100%);
	pointer-events: none;
	z-index: 1;
}

.logniture-bathtub-hero__image {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	/* contain, never cover: the whole bathtub must always be visible,
	   never cropped, regardless of the source photo's own aspect ratio. */
	object-fit: contain;
	object-position: center;
}

/* The shared .logniture-cta rule fills with var(--logniture-ink) (near-
   black) at rest -- correct on the light standard-product page, but nearly
   invisible against this hero's own near-black background. Scoped to the
   hero only, restyled with the palette's existing warm accent so "Request
   More Information" is unmistakably the primary action, not a fix that
   touches the shared button styling used everywhere else on the site. */
.logniture-bathtub-hero__content .logniture-purchase-action {
	margin-top: 0.5rem;
}

.logniture-bathtub-hero__content .logniture-cta,
.logniture-bathtub-hero__content .logniture-inquiry-trigger {
	min-height: 3.85rem;
	padding: 1.1rem 2.25rem;
	background: var(--logniture-warm);
	border-color: var(--logniture-warm);
	color: #fff;
	font-size: 0.88rem;
	letter-spacing: 0.1em;
	box-shadow: 0 0.75rem 2rem rgba(166, 95, 43, 0.32);
}

.logniture-bathtub-hero__content .logniture-cta:hover,
.logniture-bathtub-hero__content .logniture-cta:focus-visible,
.logniture-bathtub-hero__content .logniture-inquiry-trigger:hover,
.logniture-bathtub-hero__content .logniture-inquiry-trigger:focus-visible {
	background: #fff;
	border-color: #fff;
	color: var(--logniture-ink);
}

/* Specs column of the Technical Details section: the facts table plus a
   single primary inquiry CTA directly beneath it (replaces the separate
   dark .logniture-secondary-cta panel, removed -- one inquiry entry point
   per scroll position instead of two competing ones). Visually matches the
   hero CTA's warm-accent treatment so both buttons read as the same
   action. */
.logniture-premium-details__specs {
	display: flex;
	flex-direction: column;
	gap: 2.5rem;
	align-self: start;
}

/* Theme 0.5.8: the CTA previously matched the full (now much wider, since
   0.5.5-0.5.7) specs column width, reading as a banner rather than a
   button. Capped to a fixed compact width and right-aligned (margin-left:
   auto, a flex item pushed to the end of the column's cross axis) instead
   -- max-width: 100% keeps it safe on narrower viewports before the
   tablet/mobile reset below restores full width there. Height, color,
   hover/focus and the inquiry trigger's own functionality are all
   untouched (see .logniture-cta / .logniture-inquiry-trigger below). */
.logniture-premium-details__specs .logniture-purchase-action {
	width: 23.75rem;
	max-width: 100%;
	margin-left: auto;
}

.logniture-premium-details__specs .logniture-cta,
.logniture-premium-details__specs .logniture-inquiry-trigger {
	width: 100%;
	min-height: 3.85rem;
	padding: 1.1rem 2.25rem;
	background: var(--logniture-warm);
	border-color: var(--logniture-warm);
	color: #fff;
	font-size: 0.88rem;
	letter-spacing: 0.1em;
	box-shadow: 0 0.75rem 2rem rgba(166, 95, 43, 0.18);
}

.logniture-premium-details__specs .logniture-cta:hover,
.logniture-premium-details__specs .logniture-cta:focus-visible,
.logniture-premium-details__specs .logniture-inquiry-trigger:hover,
.logniture-premium-details__specs .logniture-inquiry-trigger:focus-visible {
	background: var(--logniture-ink);
	border-color: var(--logniture-ink);
	color: #fff;
}

.logniture-premium-story,
.logniture-premium-details,
.logniture-related-products {
	padding-inline: var(--logniture-page-padding);
}

/* Premium gallery section (theme 0.5.0): the same QA-verified gallery
   component the standard furniture layout uses
   (logniture_render_product_gallery(), .logniture-gallery*), restyled here
   for a more spacious, calmer, less utilitarian feel -- a bigger active
   stage and a quieter thumbnail rail -- without touching the shared
   component's own rules, so the furniture product page is unaffected. */

.logniture-premium-gallery-section {
	max-width: 100rem;
	margin: clamp(4rem, 8vw, 8rem) auto 0;
	padding-inline: var(--logniture-page-padding);
}

.logniture-premium-gallery-section .logniture-gallery__stage {
	background: #f4f1ec;
}

.logniture-premium-gallery-section .logniture-gallery__main {
	aspect-ratio: 16 / 10;
}

.logniture-premium-gallery-section .logniture-gallery__thumbs {
	margin-top: 1.25rem;
	gap: 0.6rem;
}

.logniture-premium-gallery-section .logniture-gallery__thumb {
	opacity: 0.55;
	transition: opacity 0.2s ease;
}

.logniture-premium-gallery-section .logniture-gallery__thumb:hover,
.logniture-premium-gallery-section .logniture-gallery__thumb.is-active {
	opacity: 1;
}

/* Product video (theme 0.6.0): an optional per-product video, rendered
   either as a dedicated section (premium bathtub layout, Auto placement --
   see logniture_render_video_section()) or as a tile inside the existing
   image thumbnail rail (standard layout, Auto placement -- see
   logniture_render_gallery_video_tile()), both in inc/prototype-views.php.
   Product_Video::get_video() returns null for a video-less product, so
   none of this markup exists at all in that case -- nothing here ever
   creates empty space on its own. */

.logniture-product-video {
	max-width: 100rem;
	margin: clamp(3rem, 6vw, 6rem) auto 0;
	padding-inline: var(--logniture-page-padding);
}

.logniture-product-video__caption {
	margin-top: 0.5rem;
	max-width: 40rem;
	color: var(--logniture-muted);
	font-family: var(--logniture-sans);
}

.logniture-product-video__frame {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	margin-top: 1.5rem;
	padding: 0;
	border: 1px solid var(--logniture-line);
	background: #f4f1ec;
	font: inherit;
	appearance: none;
	cursor: pointer;
	overflow: hidden;
}

.logniture-product-video__poster {
	position: absolute;
	inset: 0;
}

.logniture-product-video__poster-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.logniture-product-video__play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 4rem;
	height: 4rem;
	min-width: 44px;
	min-height: 44px;
	border-radius: 50%;
	background: rgba(251, 250, 247, 0.92);
	color: var(--logniture-ink);
	transition: transform 0.2s ease, background 0.2s ease;
}

.logniture-product-video__frame:hover .logniture-product-video__play,
.logniture-product-video__frame:focus-visible .logniture-product-video__play {
	transform: translate(-50%, -50%) scale(1.06);
	background: #fff;
}

.logniture-product-video__play .logniture-play-icon {
	width: 22px;
	height: 22px;
	/* Optical centering: a triangle's visual weight sits left of its own
	   bounding box, so a small nudge right keeps it looking centered inside
	   the round button instead of reading as off-center. */
	margin-left: 2px;
}

/* Gallery video tile (standard layout, Auto placement): same footprint as
   an image thumbnail (.logniture-gallery__thumb is a 4.25rem square), but
   a <button>, not an <a>, and never carries data-logniture-gallery-thumb --
   invisible to site.js's thumbs query by construction (see
   logniture_render_gallery_video_tile()'s own doc comment), so it can never
   affect the image counter, active-thumb state, or crossfade slide list. */

.logniture-gallery__video-tile {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 4.25rem;
	height: 4.25rem;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
	background: var(--logniture-ink);
	border: 1px solid var(--logniture-ink);
	color: #fff;
	font: inherit;
	appearance: none;
	cursor: pointer;
	overflow: hidden;
}

.logniture-gallery__video-tile-poster {
	position: absolute;
	inset: 0;
	opacity: 0.55;
}

.logniture-gallery__video-tile-poster-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.logniture-gallery__video-tile-play {
	position: relative;
	z-index: 1;
	display: flex;
}

.logniture-gallery__video-tile-play .logniture-play-icon {
	width: 18px;
	height: 18px;
}

.logniture-gallery__video-tile-label {
	position: relative;
	z-index: 1;
	margin-top: 0.15rem;
	font-family: var(--logniture-sans);
	font-size: 0.6rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.logniture-gallery__video-tile:hover,
.logniture-gallery__video-tile:focus-visible {
	border-color: var(--logniture-focus);
}

/* Product video modal (theme 0.6.0): a single reusable dialog appended to
   <body> by product-video.js -- entirely separate DOM and JS state from the
   image lightbox (.logniture-lightbox), by design (see product-video.js's
   own doc comment). */

body.logniture-video-modal-is-open {
	overflow: hidden;
}

.logniture-video-modal {
	position: fixed;
	inset: 0;
	z-index: 200;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.5rem;
	background: rgba(24, 23, 20, 0.92);
}

.logniture-video-modal[hidden] {
	display: none;
}

.logniture-video-modal__stage {
	position: relative;
	width: min(100%, 68rem);
	aspect-ratio: 16 / 9;
	background: #000;
}

.logniture-video-modal__video,
.logniture-video-modal__iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.logniture-video-modal__close {
	position: absolute;
	top: 1.25rem;
	right: 1.25rem;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(251, 250, 247, 0.12);
	color: #fff;
	font: inherit;
	appearance: none;
	cursor: pointer;
	transition: background 0.2s ease;
}

.logniture-video-modal__close:hover,
.logniture-video-modal__close:focus-visible {
	background: rgba(251, 250, 247, 0.24);
}

@media (prefers-reduced-motion: reduce) {
	.logniture-product-video__play,
	.logniture-video-modal__close {
		transition: none;
	}
}

/* Theme 0.5.8: the inherited `align-self: start` here was overriding the
   flex column's own default cross-axis stretch (.logniture-premium-details__specs
   is flex-direction: column, so align-self controls the *horizontal* size
   here, not vertical) -- it shrank the whole specs `dl`, every row's grid
   and every horizontal separator down to their own content width instead
   of the full specs column, leaving a large unused gap on the right that
   the width fix in 0.5.5-0.5.7 had allocated to the column but never
   actually reached the rows themselves. `width: 100%` is added on top of
   `stretch` as a second, explicit guarantee. Scoped to the premium
   layout's own .logniture-product-facts only -- the standard (non-
   premium) product page's specs list is untouched. */
.logniture-premium-details .logniture-product-facts {
	align-self: stretch;
	width: 100%;
}

.logniture-premium-links {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	max-width: 96rem;
	margin: clamp(5rem, 9vw, 9rem) auto 0;
	padding-inline: var(--logniture-page-padding);
}

.logniture-premium-links a {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 14rem;
	padding: clamp(1.4rem, 3vw, 2.5rem);
	border: 1px solid var(--logniture-line);
	text-decoration: none;
}

.logniture-premium-links a + a {
	border-left: 0;
}

.logniture-premium-links span {
	color: var(--logniture-muted);
	font-family: var(--logniture-sans);
	font-size: 0.63rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.logniture-premium-links strong {
	font-size: clamp(1.6rem, 3vw, 3rem);
	font-weight: 400;
}

.logniture-related-products {
	max-width: 96rem;
	margin: clamp(5rem, 10vw, 10rem) auto 0;
	padding-bottom: clamp(5rem, 9vw, 9rem);
}

.logniture-related-products > header {
	margin-bottom: 2rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid var(--logniture-line);
}

.logniture-product-grid--related {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 64rem) {
	.logniture-site-header {
		min-height: 5.8rem;
	}

	.logniture-header-top {
		grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
		min-height: 5.8rem;
		padding: 0.45rem 0.9rem 0.45rem 3.6rem;
	}

	.logniture-brand-lockup {
		grid-column: 2;
		gap: 0.28rem;
		min-width: 7.5rem;
	}

	.logniture-logo-mark {
		width: 2.45rem;
		height: 2.15rem;
	}

	.logniture-logo-mark img {
		transform: translateY(-0.53rem);
	}

	.logniture-wordmark {
		font-size: 0.94rem;
		letter-spacing: 0.15em;
	}

	.logniture-header-actions {
		grid-column: 3;
		gap: 0.25rem;
	}

	.logniture-header-action--search {
		display: inline-flex;
	}

	.logniture-action-label {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		clip-path: inset(50%);
		white-space: nowrap;
	}

	.logniture-header-action {
		width: 2rem;
		height: 2.4rem;
		justify-content: center;
		padding: 0.25rem;
		font-size: 0;
	}

	.logniture-header-action svg {
		width: 1.2rem;
		height: 1.2rem;
	}

	.logniture-header-actions .wc-block-mini-cart__button {
		width: 2rem;
		height: 2.4rem;
	}

	.logniture-header-actions .wc-block-mini-cart__button svg {
		width: 1.2rem;
		height: 1.2rem;
	}

	.logniture-nav-shell {
		position: absolute;
		z-index: 2;
		top: 0;
		left: 0.9rem;
		width: 2.6rem;
		min-height: 5.8rem;
		border-top: 0;
	}

	.logniture-primary-navigation {
		min-height: 5.8rem;
		padding: 0 !important;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container-open {
		align-items: center;
		justify-content: center;
		width: 2.5rem;
		height: 5.8rem;
		padding: 0;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open {
		position: fixed;
		z-index: 1001;
		inset: 0;
		width: 100vw;
		min-height: 100dvh;
		padding: 1.2rem var(--logniture-page-padding) 2.5rem;
		overflow-y: auto;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		padding-top: 3.25rem;
	}

	.logniture-primary-navigation .logniture-nav-family > .wp-block-navigation-item__content {
		padding-bottom: 0.2rem !important;
		font-size: 0.72rem !important;
	}

	.logniture-primary-navigation .logniture-nav-family > .wp-block-navigation__submenu-container {
		padding: 0 0 0.65rem 1rem !important;
	}

	.logniture-primary-navigation .logniture-nav-subcategory .wp-block-navigation-item__content {
		padding: 0.32rem 0 !important;
		font-size: 0.62rem !important;
	}

	.logniture-hero {
		display: block;
		min-height: 0 !important;
		padding: 0;
		background: #171411;
	}

	.logniture-hero::after,
	.logniture-hero-media--desktop {
		display: none;
	}

	.logniture-hero-copy {
		width: 100%;
		padding: clamp(3rem, 11vw, 4.2rem) var(--logniture-page-padding) 1.8rem;
	}

	.logniture-eyebrow {
		margin-bottom: 1.15rem;
		font-size: 0.61rem;
	}

	.logniture-hero-title {
		max-width: 9em;
		margin-bottom: 1rem;
		font-size: clamp(2.75rem, 12.5vw, 4rem);
		line-height: 0.96;
	}

	.logniture-hero-subtitle {
		max-width: 19rem;
		margin-bottom: 1.4rem;
		font-size: 1rem;
		line-height: 1.48;
	}

	.logniture-hero-actions {
		display: grid !important;
		grid-template-columns: 1fr;
		gap: 0.7rem;
		width: min(23rem, 100%);
	}

	.logniture-hero-button {
		width: 100%;
		min-height: 3.35rem;
		padding: 0.85rem 1.15rem;
		font-size: 0.67rem;
	}

	.logniture-hero-media--mobile {
		display: block;
		width: 100%;
		margin-top: 0;
	}

	.logniture-hero-media--mobile img {
		width: 100%;
		height: auto;
		max-height: 34rem;
		object-fit: contain;
		object-position: center top;
	}

	.logniture-commerce-intro,
	.logniture-premium-story,
	.logniture-premium-details {
		grid-template-columns: 1fr;
		row-gap: 1.5rem;
	}

	/* Theme 0.5.8: the desktop-only compact/right-aligned CTA (see
	   .logniture-premium-details__specs .logniture-purchase-action above)
	   reverts to full-width here, matching the stacked single-column
	   layout this same breakpoint puts the whole section into. */
	.logniture-premium-details__specs .logniture-purchase-action {
		width: 100%;
		max-width: 100%;
		margin-left: 0;
	}

	.logniture-commerce-intro h1 {
		font-size: clamp(3.4rem, 14vw, 6rem);
	}

	.logniture-products-landing__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.logniture-product-grid--archive {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.logniture-single-product__hero {
		grid-template-columns: 1fr;
		grid-template-areas:
			"gallery"
			"summary"
			"story";
	}

	.logniture-product-summary {
		position: static;
	}

	/* Restores the story section's original standalone top spacing (it
	   loses the desktop grid's row gap once stacked to one column here,
	   and was never captured by that gap at these widths in the first
	   place -- see the bare .logniture-product-story rule this mirrors). */
	.logniture-single-product__hero > .logniture-product-story {
		margin-top: clamp(2.5rem, 5vw, 4.5rem);
	}

	/* Matches the desktop-compact-to-full-width reset above: at and below
	   this breakpoint the post-specs inquiry CTA drops its 23.75rem cap
	   and runs the full column width, same as Add to Cart above it. */
	.logniture-product-inquiry-cta .logniture-inquiry-trigger {
		max-width: 100%;
	}

	/* .logniture-bathtub-hero deliberately keeps its two-column grid at this
	   tablet breakpoint (unlike .logniture-single-product__hero above) --
	   "stable split while there's enough width, then controlled stacking"
	   per the 0.5.0 brief. Its minmax(20rem, 38%) text track already
	   guarantees the two columns never overlap at any width down to
	   mobile, where it switches to a vertical stack instead (see the
	   34rem breakpoint below). The desktop min-height (min(66rem, 78vh))
	   was tuned for wide desktop viewports and left a large empty dark
	   area above/below the photo at tablet portrait heights (confirmed at
	   768x1024); shrunk here to keep deliberate premium breathing room
	   without that dead space. */

	.logniture-bathtub-hero {
		min-height: min(42rem, 62vh);
	}

	.logniture-bathtub-hero__title {
		font-size: clamp(2.1rem, 5.4vw, 3.5rem);
	}

	/* Small tablet-only correction, not a redesign: a live measurement on
	   SKU 611 at 768px found the fully undarkened photo zone had shrunk to
	   ~28% of the section width (content column + scrim easing zone leave
	   little of the right side clear). Nudging object-position further
	   right shows more of the product/less of the photo's own built-in
	   empty space, the same technique the (now-removed) sub-544px override
	   already used for the same reason, just a smaller shift since tablet
	   has more width to work with than old-mobile did. */
	.logniture-bathtub-hero--full-bleed .logniture-bathtub-hero__bg-image {
		object-position: 74% center;
	}

	.logniture-premium-links {
		grid-template-columns: 1fr;
	}

	.logniture-premium-links a + a {
		border-top: 0;
		border-left: 1px solid var(--logniture-line);
	}
}

/* Premium bathtub hero, mobile redesign: below 768px both hero variants
   collapse into two clearly separated, non-overlapping blocks -- a clean,
   uncropped product photo on top (no dark overlay), then the existing dark
   content panel below it. Reuses the exact same <picture>/<img> the PHP
   already renders (no markup change, no second image request); only
   position/object-fit/order change. A literal px breakpoint (not this
   file's usual rem breakpoints) because the spec calls out an exact 768px
   cutoff: 768px and up must keep today's concept completely unchanged. */
@media (max-width: 767px) {
	.logniture-bathtub-hero {
		display: flex;
		flex-direction: column;
		min-height: 0;
	}

	.logniture-bathtub-hero__content {
		order: 2;
		max-width: none;
		padding: 2rem var(--logniture-page-padding) 2.5rem;
	}

	.logniture-bathtub-hero__title {
		font-size: clamp(2rem, 8vw, 2.75rem);
	}

	.logniture-bathtub-hero__intro {
		max-width: none;
	}

	.logniture-bathtub-hero__media {
		order: 1;
		min-height: 0;
	}

	/* Defined aspect-ratio box (not the desktop grid's implicit stretched
	   height) so the picture has a real height to work with while stacked;
	   the dark fill shows as deliberate letterboxing around a contain-fit
	   photo, never a bare gap. */
	.logniture-bathtub-hero__media picture {
		display: block;
		width: 100%;
		height: auto;
		aspect-ratio: 4 / 3;
		overflow: hidden;
		background: #0d0b09;
	}

	/* The side-seam blend and bottom bleed fade only make sense when the
	   photo bleeds directly into the hero's own dark background along an
	   edge it shares with adjacent content; once the image sits in its own
	   framed, letterboxed block above the content, both would just paint a
	   stray dark band across the photo itself. */
	.logniture-bathtub-hero__media::before,
	.logniture-bathtub-hero__media::after {
		display: none;
	}

	/* Full-bleed variant: neutralise the absolutely-positioned cover/scrim
	   treatment entirely so it collapses into the same two-block layout as
	   the safe variant above -- same <picture>/<img>, now in normal flow
	   instead of a full-section background layer. Two-class compound
	   selectors (matching this file's existing convention for full-bleed
	   overrides, e.g. the tablet object-position rule above) so these
	   reliably win regardless of source order. */
	.logniture-bathtub-hero.logniture-bathtub-hero--full-bleed {
		display: flex;
		flex-direction: column;
		min-height: 0;
	}

	.logniture-bathtub-hero--full-bleed .logniture-bathtub-hero__bg {
		position: static;
		order: 1;
		display: block;
		width: 100%;
		aspect-ratio: 4 / 3;
		overflow: hidden;
		background: #0d0b09;
	}

	.logniture-bathtub-hero--full-bleed .logniture-bathtub-hero__bg-image {
		width: 100%;
		height: 100%;
		object-fit: contain;
		object-position: center;
	}

	.logniture-bathtub-hero--full-bleed .logniture-bathtub-hero__scrim {
		display: none;
	}

	.logniture-bathtub-hero--full-bleed .logniture-bathtub-hero__content {
		order: 2;
		position: static;
		z-index: auto;
		max-width: none;
		padding: 2rem var(--logniture-page-padding) 2.5rem;
	}
}

@media (max-width: 34rem) {
	.logniture-header-top {
		padding-right: 0.45rem;
		padding-left: 3.15rem;
	}

	.logniture-nav-shell {
		left: 0.45rem;
	}

	.logniture-brand-lockup {
		min-width: 6.3rem;
	}

	.logniture-logo-mark {
		width: 2.2rem;
		height: 1.9rem;
	}

	.logniture-logo-mark img {
		transform: translateY(-0.48rem);
	}

	.logniture-wordmark {
		font-size: 0.82rem;
		letter-spacing: 0.13em;
	}

	.logniture-header-actions {
		gap: 0;
	}

	.logniture-header-action,
	.logniture-header-actions .wc-block-mini-cart__button {
		width: 1.85rem;
	}

	.logniture-search-panel {
		padding: 0;
		place-items: stretch;
	}

	.logniture-search-panel__dialog {
		width: 100%;
		min-height: 100dvh;
		padding: 1.25rem var(--logniture-page-padding) 3rem;
	}

	.logniture-search-panel__title {
		margin-top: 5rem;
	}

	.logniture-search-form {
		grid-template-columns: 1fr;
	}

	.logniture-search-form button {
		justify-self: start;
		padding-left: 0;
	}

	.logniture-hero-copy {
		padding-top: 3rem;
		padding-bottom: 1.25rem;
	}

	.logniture-hero-title {
		font-size: clamp(2.65rem, 12vw, 3.55rem);
	}

	.logniture-hero-button {
		min-height: 3.15rem;
	}

	.logniture-hero-media--mobile img {
		max-height: none;
	}

	.logniture-commerce-shell {
		padding-top: 3.25rem;
	}

	.logniture-products-landing__grid,
	.logniture-product-grid--archive,
	.logniture-product-grid--related {
		grid-template-columns: 1fr;
	}

	.logniture-gallery__main {
		aspect-ratio: 3 / 4;
	}

	.logniture-product-summary__title {
		font-size: clamp(1.9rem, 8vw, 2.6rem);
	}

	/* Bathtub hero mobile layout (both variants) now lives in its own
	   @media (max-width: 767px) block below, matching the spec's exact
	   768px cutoff instead of this block's 34rem/544px one -- see that
	   block for the image-block-then-content two-block redesign. */

	.logniture-product-facts div,
	.logniture-product-specs__row {
		grid-template-columns: 5.25rem 1fr;
	}

	.logniture-product-specs__dimension {
		flex-direction: column;
		gap: 0.1rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.logniture-hero-button {
		transition: none;
	}
}

/* Phase 2B visual corrections pending approval */

.logniture-brand-lockup {
	gap: 0.46rem;
	margin: 0 !important;
}

.logniture-logo-mark {
	width: 3rem;
	height: 2.45rem;
	overflow: hidden;
	background: transparent;
}

.logniture-logo-mark img {
	width: 100% !important;
	height: auto !important;
	transform: translateY(-0.62rem);
}

.logniture-logo-mark::after {
	display: none;
}

.logniture-wordmark {
	margin: 0;
}

.logniture-header-actions {
	position: relative;
	margin: 0 !important;
}

.logniture-header-action {
	justify-content: center;
	min-width: 2.75rem;
	min-height: 2.75rem;
	padding: 0.4rem;
}

.logniture-header-actions .wc-block-customer-account {
	display: none !important;
}

.logniture-header-actions .wc-block-mini-cart__button {
	width: 2.75rem;
	height: 2.75rem;
}

/* Compact search */

.logniture-search-panel[hidden] {
	display: none !important;
}

.logniture-search-panel {
	position: static;
	z-index: auto;
	inset: auto;
	display: block;
	flex: 0 1 17rem;
	width: clamp(13.75rem, 18vw, 18.75rem);
	margin: 0;
	padding: 0;
	place-items: initial;
}

.logniture-search-form {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 2.45rem 2.45rem;
	align-items: center;
	width: 100%;
	height: 2.75rem;
	overflow: hidden;
	background: #fff;
	border: 1px solid var(--logniture-line);
}

.logniture-search-form input {
	min-width: 0;
	height: 100%;
	padding: 0 0.8rem;
	border: 0;
	background: transparent;
	color: var(--logniture-ink);
	font-family: var(--logniture-sans);
	font-size: 0.78rem;
}

.logniture-search-form input:focus {
	outline: 0;
}

.logniture-search-form .logniture-search-form__submit,
.logniture-search-form .logniture-search-form__close {
	display: grid;
	width: 2.45rem;
	height: 2.75rem;
	padding: 0;
	border: 0;
	border-left: 1px solid var(--logniture-line);
	background: transparent;
	color: var(--logniture-ink);
	cursor: pointer;
	place-items: center;
}

.logniture-search-form svg {
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.45;
}

/* Unified collection and Featured Works media frames */

.logniture-category-card .wp-block-image {
	position: relative;
	display: grid !important;
	width: 100%;
	overflow: hidden;
	margin: 0 0 0.7rem;
	background: #efebe4;
	aspect-ratio: 1 / 1;
	place-items: center;
}

.logniture-category-card .wp-block-image > a {
	position: absolute;
	inset: 0;
	display: grid !important;
	width: 100%;
	height: 100%;
	min-width: 0;
	min-height: 0;
	overflow: hidden;
	padding: clamp(0.55rem, 1vw, 0.9rem);
	place-items: center;
}

.logniture-category-card .wp-block-image img {
	position: absolute;
	top: 6%;
	left: 6%;
	width: 88% !important;
	height: 88% !important;
	max-width: none;
	max-height: none;
	object-fit: contain;
	object-position: center;
}

.logniture-product-card {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.logniture-product-card__media {
	display: grid;
	width: 100%;
	overflow: hidden;
	margin-bottom: 0.95rem;
	padding: clamp(0.7rem, 1.2vw, 1.05rem);
	background: #efebe4;
	aspect-ratio: 1 / 1.08;
	place-items: center;
}

.logniture-product-card__media img {
	position: absolute;
	top: 6%;
	left: 6%;
	width: 88% !important;
	height: 88% !important;
	max-width: none;
	max-height: none;
	object-fit: contain;
	object-position: center;
}

.logniture-product-card__button {
	align-self: flex-start;
	margin-top: auto;
}

@media (max-width: 64rem) {
	.logniture-site-header {
		min-height: 5.8rem;
	}

	.logniture-header-top {
		position: relative;
		display: flex !important;
		align-items: center;
		justify-content: center;
		min-height: 5.8rem;
		padding: 0.45rem;
	}

	.logniture-brand-lockup {
		grid-column: auto;
		gap: 0.34rem;
		min-width: 0;
	}

	.logniture-logo-mark {
		width: 2.45rem;
		height: 2rem;
	}

	.logniture-logo-mark img {
		transform: translateY(-0.51rem);
	}

	.logniture-wordmark {
		font-size: 0.86rem;
		letter-spacing: 0.14em;
	}

	.logniture-header-actions {
		position: absolute;
		top: 50%;
		right: 0.45rem;
		grid-column: auto;
		gap: 0;
		transform: translateY(-50%);
	}

	.logniture-header-action,
	.logniture-header-actions .wc-block-mini-cart,
	.logniture-header-actions .wc-block-mini-cart__button {
		width: 2.75rem;
		min-width: 2.75rem;
		height: 2.75rem;
		min-height: 2.75rem;
	}

	.logniture-header-action svg,
	.logniture-header-actions .wc-block-mini-cart__button svg {
		width: 1.25rem;
		height: 1.25rem;
	}

	.logniture-nav-shell {
		display: block !important;
		left: 1.25rem;
		width: 2.75rem;
		min-height: 5.8rem;
		margin: 0 !important;
	}

	.logniture-primary-navigation {
		position: absolute !important;
		inset: 0 auto auto 0 !important;
		margin: 0 !important;
	}

	.logniture-primary-navigation,
	.logniture-primary-navigation .wp-block-navigation__responsive-container-open {
		width: 2.75rem;
		min-width: 2.75rem;
		height: 5.8rem;
		min-height: 5.8rem;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container-open {
		position: absolute;
		top: 50%;
		left: 0;
		height: 2.75rem;
		min-height: 2.75rem;
		transform: translateY(-50%);
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container-open svg {
		width: 1.5rem;
		height: 1.5rem;
	}

	.logniture-search-panel {
		position: absolute;
		z-index: 6;
		top: calc(50% + 2.9rem);
		right: -0.45rem;
		width: 100vw;
		padding: 0.65rem var(--logniture-page-padding);
		background: var(--logniture-paper);
		border-top: 1px solid var(--logniture-line);
		border-bottom: 1px solid var(--logniture-line);
		box-shadow: 0 0.7rem 1.4rem rgba(17, 15, 13, 0.08);
		transform: none;
	}

	.logniture-search-form {
		grid-template-columns: minmax(0, 1fr) 2.75rem 2.75rem;
		max-width: none;
		margin: 0;
	}

	.logniture-search-form .logniture-search-form__submit,
	.logniture-search-form .logniture-search-form__close {
		width: 2.75rem;
	}

	.logniture-hero-copy {
		padding: clamp(2.2rem, 8vw, 3rem) var(--logniture-page-padding) 1rem;
	}

	.logniture-eyebrow {
		margin-bottom: 0.8rem;
		font-size: 0.59rem;
	}

	.logniture-hero-title {
		max-width: 6.45em;
		margin-bottom: 0.72rem;
		font-size: clamp(2.75rem, 12vw, 3rem);
		line-height: 0.97;
	}

	.logniture-hero-subtitle {
		max-width: 18rem;
		margin-bottom: 1rem;
		font-size: 0.94rem;
		line-height: 1.42;
	}

	.logniture-hero-actions {
		gap: 0.6rem;
	}

	.logniture-hero-media--mobile img {
		width: 100%;
		height: auto;
		max-height: none;
		object-fit: contain;
		object-position: center;
	}
}

@media (max-width: 27rem) {
	.logniture-header-actions {
		right: 0.25rem;
	}

	.logniture-brand-lockup {
		width: 5.7rem;
	}

	.logniture-logo-mark {
		width: 2.2rem;
		height: 1.8rem;
	}

	.logniture-logo-mark img {
		transform: translateY(-0.46rem);
	}

	.logniture-wordmark {
		font-size: 0.7rem;
		letter-spacing: 0.12em;
	}

	.logniture-nav-shell {
		left: 1.25rem;
	}

	.logniture-hero-title {
		font-size: clamp(2.7rem, 11.75vw, 2.92rem);
	}
}

/* Phase 2B approval corrections: logo, media frames, and mobile overlay */

.logniture-brand-lockup {
	gap: 0.72rem;
}

.logniture-logo-mark,
.logniture-logo-mark img {
	background: transparent !important;
}

.logniture-category-card .wp-block-image,
.logniture-product-card__media {
	border-radius: 0.28rem;
	background: #efebe4;
}

.logniture-category-card .wp-block-image > a,
.logniture-product-card__media {
	padding: 0.35rem;
}

.logniture-category-card .wp-block-image img,
.logniture-product-card__media img {
	top: 3%;
	left: 3%;
	width: 94% !important;
	height: 94% !important;
	object-fit: contain;
	object-position: center;
}

.logniture-product-card__media,
.logniture-product-grid--archive .logniture-product-card__media {
	aspect-ratio: 1 / 1.02;
}

body.logniture-mobile-menu-is-open {
	overflow: hidden;
}

@media (max-width: 64rem) {
	.logniture-brand-lockup {
		gap: 0.48rem;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open {
		position: fixed !important;
		inset: 0 !important;
		box-sizing: border-box;
		width: auto !important;
		max-width: 100vw !important;
		height: 100dvh;
		min-height: 100dvh;
		padding: 1.2rem var(--logniture-page-padding) 2.5rem !important;
		overflow-x: hidden !important;
		overflow-y: auto !important;
		background: var(--logniture-paper);
		transform: none !important;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container-close {
		position: absolute;
		z-index: 2;
		top: 1.1rem;
		right: var(--logniture-page-padding);
		display: grid;
		width: 2.75rem;
		height: 2.75rem;
		padding: 0;
		place-items: center;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		box-sizing: border-box;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		display: block !important;
		padding-top: 3.4rem !important;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
		display: flex !important;
		flex-direction: column !important;
		flex-wrap: nowrap !important;
		align-items: stretch !important;
		gap: 0 !important;
		box-sizing: border-box;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item,
	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
		box-sizing: border-box;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
		position: static !important;
		box-sizing: border-box;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 0 0.7rem 1rem !important;
		overflow: visible !important;
		transform: none !important;
	}

	.logniture-primary-navigation .wp-block-navigation__responsive-container.is-menu-open .logniture-nav-family > .wp-block-navigation__submenu-container {
		padding: 0 0 0.65rem 1rem !important;
	}
}

@media (max-width: 27rem) {
	.logniture-brand-lockup {
		gap: 0.4rem;
	}
}

/* Phase 2B editorial visual iteration pending approval */

.logniture-brand-lockup {
	gap: 0.85rem;
}

.logniture-logo-mark {
	width: 3.1rem;
	height: 3.05rem;
	background: transparent !important;
}

.logniture-logo-mark img {
	width: 100% !important;
	height: auto !important;
	max-width: none;
	background: transparent !important;
	transform: translateY(-0.68rem);
}

.logniture-wordmark {
	margin: 0;
}

.logniture-collections {
	padding: clamp(3.75rem, 6vw, 6rem) var(--logniture-page-padding);
}

.logniture-section-intro {
	margin-bottom: clamp(2rem, 3.5vw, 3.4rem) !important;
}

.logniture-category-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: clamp(2.5rem, 4vw, 4.75rem) clamp(1.25rem, 2.4vw, 2.5rem) !important;
	max-width: 92rem;
	padding-bottom: 0;
}

.logniture-values {
	margin: clamp(3.5rem, 6vw, 6rem) auto 0 !important;
}

.logniture-category-card {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	min-width: 0;
	padding: 0.72rem;
	border: 1px solid rgba(55, 48, 41, 0.12);
	border-radius: 0.5rem;
	background: #fbf9f5;
	box-shadow: 0 0.65rem 1.8rem rgba(39, 32, 26, 0.025);
}

.logniture-category-card__link {
	display: flex;
	flex: 1;
	flex-direction: column;
	min-width: 0;
	color: inherit;
	text-decoration: none;
}

.logniture-category-card:focus-within {
	outline: 1px solid rgba(55, 48, 41, 0.42);
	outline-offset: 0.22rem;
}

.logniture-category-card__link:focus-visible {
	outline: none;
}

.logniture-category-card .wp-block-image {
	box-sizing: border-box;
	width: 100%;
	min-width: 0;
	min-height: 0;
	margin: 0 0 1rem;
	padding: 0.625rem;
	border: 1px solid rgba(55, 48, 41, 0.07);
	border-radius: 0.4rem;
	background: #eeebe5;
	aspect-ratio: 3 / 2;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: minmax(0, 1fr);
	place-items: center;
}

.logniture-category-card .wp-block-image > a {
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	min-width: 0;
	min-height: 0;
	padding: 0.625rem;
	border-radius: inherit;
	overflow: hidden;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: minmax(0, 1fr);
	place-items: center;
}

.logniture-category-card .wp-block-image picture {
	display: grid;
	width: 100%;
	height: 100%;
	min-width: 0;
	min-height: 0;
	overflow: hidden;
	border-radius: 0.4rem;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: minmax(0, 1fr);
	place-items: center;
}

.logniture-category-card .wp-block-image img {
	position: static !important;
	top: auto !important;
	left: auto !important;
	display: block;
	width: auto !important;
	height: auto !important;
	min-width: 0 !important;
	min-height: 0 !important;
	max-width: 100% !important;
	max-height: 100% !important;
	border-radius: 0.4rem !important;
	align-self: center;
	justify-self: center;
	object-fit: contain;
	object-position: center;
}

.logniture-category-card:hover .wp-block-image img {
	transform: scale(1.012);
}

.logniture-category-name {
	margin-inline: 0.38rem;
	font-size: 0.74rem;
	letter-spacing: 0.035em;
}

.logniture-category-meta {
	margin: 0.2rem 0.38rem 0;
	font-size: 0.6rem;
}

.logniture-category-arrow {
	display: flex;
	align-items: center;
	gap: 0.42rem;
	width: calc(100% - 0.76rem);
	min-height: 1rem;
	margin: auto 0.38rem 0;
	padding-top: 0.78rem;
	border-top: 1px solid rgba(55, 48, 41, 0.16);
	color: var(--logniture-ink);
	font-family: var(--logniture-sans);
	font-size: 0.6rem;
	font-weight: 500;
	letter-spacing: 0.13em;
	line-height: 1;
	text-transform: uppercase;
	white-space: nowrap;
	transition:
		color 160ms ease,
		opacity 160ms ease;
}

.logniture-category-cta-icon {
	display: inline-block;
	font-size: 0.86rem;
	letter-spacing: 0;
	line-height: 1;
	transition: transform 160ms ease;
}

.logniture-category-card__link:hover .logniture-category-arrow,
.logniture-category-card__link:focus .logniture-category-arrow {
	color: var(--logniture-muted);
	opacity: 0.78;
}

.logniture-category-card__link:hover .logniture-category-cta-icon,
.logniture-category-card__link:focus .logniture-category-cta-icon {
	transform: translateX(0.24rem);
}

@media (prefers-reduced-motion: reduce) {
	.logniture-category-arrow,
	.logniture-category-cta-icon {
		transition: none;
	}

	.logniture-category-card__link:hover .logniture-category-cta-icon,
	.logniture-category-card__link:focus .logniture-category-cta-icon {
		transform: none;
	}
}

.logniture-featured-works {
	padding: clamp(5rem, 8vw, 8rem) var(--logniture-page-padding);
	background: #f0ede7;
}

.logniture-featured-works__header {
	margin-bottom: clamp(2rem, 3.5vw, 3.4rem);
	padding-bottom: 1.35rem;
}

.logniture-featured-works .logniture-product-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1.5rem, 3vw, 3.5rem);
	max-width: 88rem;
}

.logniture-product-card {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	min-width: 0;
	padding: 0.72rem;
	border: 1px solid rgba(55, 48, 41, 0.12);
	border-radius: 0.5rem;
	background: #fbf9f5;
	box-shadow: 0 0.65rem 1.8rem rgba(39, 32, 26, 0.025);
}

.logniture-product-card__media,
.logniture-product-grid--archive .logniture-product-card__media {
	position: relative;
	display: grid;
	box-sizing: border-box;
	width: 100%;
	margin: 0 0 1rem;
	padding: 0.625rem;
	overflow: hidden;
	border: 1px solid rgba(55, 48, 41, 0.07);
	border-radius: 0.4rem;
	background: #eeebe5;
	aspect-ratio: 4 / 3;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: minmax(0, 1fr);
	place-items: center;
}

.logniture-product-card__media > br {
	display: none;
}

.logniture-category-card .wp-block-image picture,
.logniture-product-card__media picture {
	display: grid;
	width: 100%;
	height: 100%;
	min-width: 0;
	min-height: 0;
	overflow: hidden;
	border-radius: 0.4rem;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: minmax(0, 1fr);
	place-items: center;
}

.logniture-product-card__media img {
	position: static !important;
	top: auto !important;
	left: auto !important;
	display: block;
	width: auto !important;
	height: auto !important;
	min-width: 0 !important;
	min-height: 0 !important;
	max-width: 100% !important;
	max-height: 100% !important;
	border-radius: 0.4rem !important;
	align-self: center;
	justify-self: center;
	object-fit: contain;
	object-position: center;
}

.logniture-product-card:hover .logniture-product-card__media img {
	transform: scale(1.008);
}

.logniture-product-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	min-width: 0;
	padding: 0.15rem 0.38rem 0.28rem;
	text-align: left;
}

.logniture-product-card__title {
	margin: 0 0 0.45rem;
	font-size: clamp(1.22rem, 1.55vw, 1.55rem);
	line-height: 1.18;
	text-align: left;
}

.logniture-product-card__price {
	margin: 0 0 0.62rem;
	color: var(--logniture-ink);
	font-size: 0.76rem;
	text-align: left;
}

.logniture-product-card__description {
	display: -webkit-box;
	margin: 0 0 0.75rem;
	overflow: hidden;
	color: var(--logniture-muted);
	font-size: 0.82rem;
	line-height: 1.5;
	text-align: left;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.logniture-product-card__lead-time {
	margin: 0 0 0.75rem;
	font-size: 0.76rem;
	text-align: left;
}

.logniture-product-status {
	top: 1rem;
	right: auto;
	left: 1rem;
	padding: 0.42rem 0.62rem;
	border: 1px solid rgba(55, 48, 41, 0.1);
	border-radius: 999px;
	box-shadow: 0 0.3rem 0.8rem rgba(39, 32, 26, 0.04);
}

.logniture-product-status--available {
	background: rgba(246, 243, 237, 0.96);
}

.logniture-product-card__button {
	justify-content: flex-start;
	width: 100%;
	min-height: 2.5rem;
	margin-top: auto;
	padding: 0.78rem 0 0.2rem;
	border: 0;
	border-top: 1px solid rgba(55, 48, 41, 0.16);
	background: transparent;
	font-size: 0.62rem;
	letter-spacing: 0.09em;
}

.logniture-product-card__button::after {
	margin-left: auto;
	padding-left: 0.5rem;
	content: "→";
	/* Card button text sits at 0.62rem (~10px); at that size in the theme
	   sans-serif, a bare inherited "→" reads as a thin dash rather than a
	   deliberate arrow (confirmed via computed styles, not just visual
	   impression). Sized and weighted independently of the label text
	   instead, rather than raising the whole button's font-size. */
	font-size: 0.95rem;
	font-weight: 500;
	line-height: 1;
	transition: transform 0.2s ease;
}

.logniture-product-card:hover .logniture-product-card__button::after {
	transform: translateX(0.2rem);
}

.logniture-product-card__button:hover {
	background: transparent;
	color: var(--logniture-muted);
}

.logniture-product-card__button[aria-disabled="true"] {
	opacity: 0.58;
}

.logniture-product-grid--archive {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1.25rem, 2.5vw, 2.5rem);
}

@media (max-width: 68rem) {
	.logniture-category-grid {
		grid-auto-columns: auto;
		grid-auto-flow: row;
		width: 100%;
		max-width: 100%;
		overflow-x: visible;
		overscroll-behavior-inline: auto;
		scroll-snap-type: none;
		scrollbar-width: auto;
	}

	.logniture-category-grid,
	.logniture-featured-works .logniture-product-grid,
	.logniture-product-grid--archive {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
}

@media (max-width: 44rem) {
	.logniture-collections {
		padding: 3.5rem var(--logniture-page-padding);
	}

	.logniture-category-grid,
	.logniture-featured-works .logniture-product-grid,
	.logniture-product-grid--archive {
		grid-template-columns: 1fr !important;
		gap: 2.25rem !important;
	}

	.logniture-category-card .wp-block-image {
		aspect-ratio: 3 / 2;
	}
}

@media (max-width: 64rem) {
	.logniture-brand-lockup {
		gap: 0.55rem;
	}

	.logniture-logo-mark {
		width: 2.35rem;
		height: 2.3rem;
	}

	.logniture-logo-mark img {
		transform: translateY(-0.515rem);
	}
}

@media (max-width: 27rem) {
	.logniture-brand-lockup {
		gap: 0.55rem;
	}

	.logniture-logo-mark {
		width: 2.35rem;
		height: 2.3rem;
	}

	.logniture-logo-mark img {
		transform: translateY(-0.515rem);
	}

	.logniture-hero-copy {
		padding: 1.8rem var(--logniture-page-padding) 0.45rem;
	}

	.logniture-eyebrow {
		margin-bottom: 0.58rem;
		font-size: 0.57rem;
	}

	.logniture-hero-title {
		max-width: 7em;
		margin-bottom: 0.58rem;
		font-size: 2.625rem;
		line-height: 0.98;
	}

	.logniture-hero-subtitle {
		max-width: 18rem;
		margin-bottom: 0.8rem;
		font-size: 0.9rem;
		line-height: 1.4;
	}

	.logniture-hero-actions {
		gap: 0.68rem;
	}

	.logniture-hero-button {
		min-height: 3.25rem;
		padding: 0.7rem 1rem;
		font-size: 0.63rem;
	}

	.logniture-hero-media--mobile {
		margin-top: -1.45rem;
	}
}

.logniture-mobile-title-break {
	display: none;
}

.logniture-mobile-subtitle-break {
	display: none;
}

.logniture-header-actions .wp-block-shortcode {
	display: flex;
	margin: 0;
	line-height: 1;
}

.logniture-cart-link {
	position: relative;
}

.logniture-cart-count {
	display: inline-flex;
	align-items: center;
}

.logniture-cart-count__mobile {
	display: none;
}

.logniture-cart-link svg {
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.45;
}

/* Phase 2B: mobile hero hierarchy and a true single-column collections grid. */
@media (max-width: 44rem) {
	.logniture-hero-copy {
		padding: clamp(3rem, 13.3vw, 3.5rem) clamp(1.25rem, 5.6vw, 1.5rem) 0;
	}

	.logniture-eyebrow {
		margin-bottom: 0.5rem;
		font-size: clamp(0.6875rem, 3vw, 0.75rem);
		letter-spacing: 0.18em;
	}

	.logniture-hero-title {
		max-width: 20.625rem;
		margin-bottom: 0.55rem;
		font-size: clamp(2.375rem, 10vw, 2.5rem);
		line-height: 0.99;
	}

	.logniture-mobile-title-break {
		display: block;
	}

	.logniture-mobile-subtitle-break {
		display: block;
	}

	.logniture-hero-subtitle {
		max-width: 20.5rem;
		margin-bottom: 0.85rem;
		font-size: 0.875rem;
		line-height: 1.42;
	}

	.logniture-hero-actions {
		gap: 0.6875rem;
		width: 100%;
	}

	.logniture-hero-button {
		min-height: 3.125rem;
		padding: 0.65rem 1rem;
		font-size: 0.61rem;
	}

	.logniture-hero-media--mobile {
		position: relative;
		width: 100%;
		height: clamp(13.1rem, 58vw, 15.6rem);
		margin: 1.25rem auto 0;
		overflow: hidden;
	}

	.logniture-hero-media--mobile img {
		width: 140%;
		height: auto;
		max-width: none;
		max-height: none;
		display: block;
		object-fit: contain;
		object-position: center;
		transform: translate(-28.25%, -18.25%);
	}

	.logniture-header-actions .wp-block-shortcode {
		width: 2.75rem;
		min-width: 2.75rem;
		height: 2.75rem;
	}

	.logniture-cart-link {
		width: 2.75rem;
		min-width: 2.75rem;
		height: 2.75rem;
		min-height: 2.75rem;
	}

	.logniture-cart-count__desktop {
		display: none;
	}

	.logniture-cart-count__mobile {
		position: absolute;
		top: 0.15rem;
		right: 0.1rem;
		display: grid;
		min-width: 0.9rem;
		height: 0.9rem;
		padding-inline: 0.15rem;
		background: var(--logniture-ink);
		border-radius: 999px;
		color: var(--logniture-paper);
		font-family: var(--logniture-sans);
		font-size: 0.5rem;
		font-weight: 600;
		line-height: 1;
		place-items: center;
	}

	.logniture-collections {
		padding-top: 2.25rem;
	}

	.logniture-collections .logniture-section-intro {
		margin-bottom: 1.5rem !important;
	}

	.logniture-collections .logniture-section-title {
		font-size: clamp(2.125rem, 9vw, 2.25rem);
		line-height: 1;
	}

	.logniture-category-grid {
		grid-auto-columns: auto;
		grid-auto-flow: row;
		grid-template-columns: minmax(0, 1fr) !important;
		width: 100%;
		max-width: 100%;
		margin-inline: auto;
		overflow-x: visible;
		overscroll-behavior-inline: auto;
		scroll-snap-type: none;
		scrollbar-width: auto;
	}

	.logniture-category-card {
		grid-column: auto;
		width: 100%;
		min-width: 0;
		max-width: 100%;
		margin-inline: 0;
		scroll-snap-align: none;
		transform: none;
	}

	.logniture-category-card__link {
		width: 100%;
		max-width: 100%;
	}
}

@media (max-width: 22.5rem) {
	.logniture-header-actions {
		right: 0;
	}
}

/* Phase 2B technical correction: stable tablet breakpoint and empty Cart. */

body.woocommerce-cart .logniture-content-shell {
	box-sizing: border-box;
	width: 100%;
	max-width: 76rem;
	margin-inline: auto;
}

body.woocommerce-cart .wp-site-blocks > main {
	box-sizing: border-box;
	width: 100%;
	max-width: 76rem;
	min-height: 55vh;
	margin-inline: auto;
	padding: clamp(3rem, 7vw, 7rem) var(--logniture-page-padding);
}

body.woocommerce-cart .wp-block-post-title,
body.woocommerce-cart .wp-block-post-content,
body.woocommerce-cart .wp-block-woocommerce-cart.alignwide,
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block {
	box-sizing: border-box;
	width: 100% !important;
	max-width: 100% !important;
	margin-inline: 0 !important;
}

body.woocommerce-cart .wp-block-woocommerce-empty-cart-block {
	padding-block: clamp(1rem, 3vw, 2.5rem);
}

body.woocommerce-cart .wp-block-woocommerce-empty-cart-block
	> .wp-block-heading:not(.wc-block-cart__empty-cart__title),
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block
	> .wp-block-woocommerce-product-new {
	display: none !important;
}

.logniture-empty-cart-cta {
	display: flex;
	justify-content: center;
	margin: 0;
	padding: 0 var(--logniture-page-padding) clamp(2rem, 5vw, 4rem);
}

.logniture-empty-cart-cta__link {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	box-sizing: border-box;
	min-height: 3.125rem;
	padding: 0.8rem 1.2rem;
	border: 1px solid var(--logniture-ink);
	color: var(--logniture-ink);
	font-family: var(--logniture-sans);
	font-size: 0.65rem;
	font-weight: 500;
	letter-spacing: 0.09em;
	text-decoration: none;
	text-transform: uppercase;
	transition: background-color 160ms ease, color 160ms ease;
}

.logniture-empty-cart-cta__link:hover {
	background: var(--logniture-ink);
	color: var(--logniture-paper);
}

@media (max-width: 64rem) {
	.logniture-primary-navigation
		.wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none !important;
	}

	.logniture-primary-navigation
		.wp-block-navigation__responsive-container-open {
		display: flex !important;
	}
}

@media (max-width: 44rem) {
	body.woocommerce-cart .logniture-content-shell {
		padding-inline: var(--logniture-page-padding);
	}

	.logniture-empty-cart-cta {
		padding-inline: 0;
	}

	.logniture-empty-cart-cta__link {
		width: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.logniture-empty-cart-cta__link {
		transition: none;
	}
}

/* Checkout page — same content-shell width as Cart (76rem) so the two-column
   Checkout Block (form + order summary) has room to sit side by side, and so
   Cart and Checkout read as the same width, not two different layouts. */

body.woocommerce-checkout .logniture-content-shell {
	box-sizing: border-box;
	width: 100%;
	max-width: 76rem;
	margin-inline: auto;
}

body.woocommerce-checkout .wp-site-blocks > main {
	box-sizing: border-box;
	width: 100%;
	max-width: 76rem;
	min-height: 55vh;
	margin-inline: auto;
	padding: clamp(3rem, 7vw, 7rem) var(--logniture-page-padding);
}

body.woocommerce-checkout .wp-block-post-title,
body.woocommerce-checkout .wp-block-post-content,
body.woocommerce-checkout .wp-block-woocommerce-checkout.alignwide {
	box-sizing: border-box;
	width: 100% !important;
	max-width: 100% !important;
	margin-inline: 0 !important;
}

@media (max-width: 44rem) {
	body.woocommerce-checkout .logniture-content-shell {
		padding-inline: var(--logniture-page-padding);
	}
}

/* Checkout Blocks — form controls restyled to the theme's own tokens instead
   of the block default's pure white/heavy-black-border look, matching the
   warm beige input convention already established for the Contact form.
   Selectors and current values (white bg, 80%-black border, 4px radius)
   confirmed against the live rendered Checkout page before writing this. */

/* !important is needed here: WooCommerce Blocks' own packages-style.css /
   checkout.css ship compound selectors like
   ".wc-block-components-form .wc-block-components-text-input input[type='email']"
   (specificity 0,3,1), which beats a plain ".wc-block-components-text-input
   input" rule (0,1,1) regardless of stylesheet load order -- confirmed by
   inspecting document.styleSheets on the live Checkout page, where this
   exact rule was present but silently losing the cascade. Scoped to just
   background/border/text color, never layout, so it can't fight future
   Woo Blocks markup changes. */

.wc-block-components-text-input input,
.wc-blocks-components-select__select,
.wc-blocks-components-select__container,
.wc-block-components-checkbox__input,
.wc-block-components-textarea textarea {
	background-color: var(--logniture-canvas) !important;
	border-color: var(--logniture-line) !important;
	color: var(--logniture-ink) !important;
}

.wc-block-components-text-input input:focus,
.wc-blocks-components-select__select:focus,
.wc-block-components-checkbox__input:focus,
.wc-block-components-textarea textarea:focus {
	border-color: var(--logniture-focus) !important;
	outline: 2px solid var(--logniture-focus);
	outline-offset: 1px;
}

/* Browser autofill (Chrome/Safari) paints its own yellow/white background via
   a UA layer CSS can't override directly -- the standard, accessible fix is
   an inset box-shadow large enough to fully cover the field, which browsers
   render underneath the text instead of a flat background-color. */
.wc-block-components-text-input input:-webkit-autofill,
.wc-block-components-text-input input:-webkit-autofill:hover,
.wc-block-components-text-input input:-webkit-autofill:focus {
	-webkit-box-shadow: 0 0 0 1000px var(--logniture-canvas) inset !important;
	-webkit-text-fill-color: var(--logniture-ink) !important;
	caret-color: var(--logniture-ink);
}

/* Contact / About pages */

.logniture-page-hero {
	max-width: 46rem;
	margin: 0 auto !important;
	padding: clamp(3rem, 7vw, 6rem) var(--logniture-page-padding) clamp(1.5rem, 3vw, 2.5rem);
	text-align: center;
}

.logniture-page-title {
	margin: 0 0 1rem;
	font-size: clamp(2.5rem, 5.5vw, 4.5rem);
	font-weight: 400;
	letter-spacing: -0.02em;
	line-height: 1.05;
}

.logniture-page-lead {
	max-width: 34rem;
	margin: 0 auto;
	color: var(--logniture-muted);
	font-size: clamp(1.05rem, 1.6vw, 1.2rem);
	line-height: 1.6;
}

/* Contact -- editorial two-column composition. This is page COMPOSITION
   (max-width, the two-panel split, panel backgrounds, the left-panel
   copy) and stays entirely in the theme; Core's contact-form.css keeps
   owning the <form> element's own controls/states (input/textarea
   sizing, focus states, field errors) so the two files don't fight over
   the same concern. The one exception is .logniture-contact-form's own
   outer field-group rhythm just below -- see the comment there. */

.logniture-contact-wrap {
	padding: clamp(1.5rem, 3vw, 2.5rem) var(--logniture-page-padding) clamp(3rem, 6vw, 5rem);
}

.logniture-contact-composition {
	display: grid !important;
	grid-template-columns: 31% 69%;
	max-width: 77.5rem;
	margin: 0 auto !important;
}

.logniture-contact-panel,
.logniture-contact-panel--form {
	min-width: 0;
	padding: clamp(2.5rem, 4vw, 3.5rem) clamp(1.75rem, 3vw, 2.75rem);
}

.logniture-contact-panel {
	background: var(--logniture-canvas);
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

.logniture-contact-panel--form {
	/* Elsewhere on the site, a content panel that sits directly in normal
	   page flow against the canvas background (not a modal/dialog floated
	   over a dark backdrop, which is the only other place --logniture-paper
	   is used at this scale) uses #fbf9f5 -- see .logniture-family-card and
	   .logniture-category-card. --logniture-paper (#fbfaf7) reads about 2-3
	   RGB units brighter/cooler, which is the "too white / detached" gap
	   reported against the mockup. Matching the established in-flow-panel
	   value here is a ~1% shift, not a new color. */
	background: #fbf9f5;
}

/* Both grid children start at the composition's own top edge. Without
   this, WordPress's flow-layout block-gap rule (a zero-specificity
   :where() selector adding margin-block-start to every non-first child)
   pushes this panel ~24px below the left one, so the two columns no
   longer visually begin as one composition. Scoped to this one child so
   no other use of block-gap spacing anywhere else is affected. */
.logniture-contact-composition > .logniture-contact-panel--form {
	margin-block-start: 0;
}

.logniture-contact-panel__title {
	margin: 0 0 1.1rem;
	font-size: clamp(2.75rem, 4vw, 3.75rem);
	font-weight: 400;
	letter-spacing: -0.02em;
	line-height: 1;
}

.logniture-contact-panel__rule {
	width: 2.75rem;
	height: 1px;
	margin: 0 0 1.5rem;
	background: var(--logniture-ink);
	opacity: 0.35;
}

.logniture-contact-panel__intro {
	max-width: 22rem;
	margin: 0 0 2.5rem;
	color: var(--logniture-ink);
	font-size: 1rem;
	line-height: 1.65;
}

.logniture-withdrawal-steps {
	padding-left: 1.2rem;
}

.logniture-withdrawal-steps li {
	margin: 0 0 .6rem;
}

.logniture-withdrawal-steps li:last-child {
	margin-bottom: 0;
}

.logniture-contact-panel__info {
	/* The panel is stretched to the composition's full height (by CSS
	   Grid's default row-stretch, matching the right panel's much
	   taller form) and is a flex column with justify-content:flex-start,
	   so title/rule/intro stay anchored at the top -- margin-top:auto on
	   this block consumes the remaining flexible space itself, pushing
	   the business-information groups down to fill what was previously
	   dead space at the bottom of the panel. */
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
	margin: auto 0 0;
}

.logniture-contact-panel__info-group {
	padding-top: 1.25rem;
	border-top: 1px solid var(--logniture-line);
}

.logniture-contact-panel__info-label {
	display: block;
	margin-bottom: 0.4rem;
	color: var(--logniture-muted);
	font-family: var(--logniture-sans);
	font-size: 0.7rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.logniture-contact-panel__info-value {
	margin: 0;
	color: var(--logniture-ink);
	font-size: 0.9rem;
	line-height: 1.55;
}

.logniture-contact-panel__info-value a {
	color: var(--logniture-ink);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

.logniture-contact-panel__info-value a:hover {
	color: var(--logniture-warm);
}

/* Contact form -- final presentation, authoritative here. Every property
   that matters for the approved Contact-page mockup (control height,
   label style, grid columns/gaps, the mobile collapse point, submit
   width) is pinned in this one block at higher specificity than Core's
   own contact-form.css defaults, so this page's presentation no longer
   depends on whatever Core currently ships -- Core itself is untouched.
   Every selector is scoped under .logniture-contact-panel--form, so none
   of this can leak into any other future use of the shared form. */

.logniture-contact-panel--form .logniture-contact-form {
	gap: 1.75rem;
}

/* WordPress's wpautop() wraps the Subject/Message/Send-Message run in an
   auto-generated <p> (the same content-filter pass Core 0.8.1 already
   works around for the Name/Email/Phone/Company grid -- those four stay
   protected because they sit inside a <div>, which wpautop recognises as
   a block-level tag; label/button are not on that list, so this trailing
   run has no such wrapper and gets swept into one <p>). That <p> is not
   part of Contact_Form's own markup and carries the browser's default
   paragraph margin, which is what was collapsing Subject/Message/Send
   Message together while adding an oversized gap above Subject. Making
   it `display: contents` removes its box without removing the content,
   so its label/label/button children rejoin this form's own grid as
   direct items and take the same 1.75rem rhythm as every other group. */
.logniture-contact-panel--form .logniture-contact-form > p {
	display: contents;
}

.logniture-contact-panel--form .logniture-contact-form__grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 1.75rem;
	row-gap: 2rem;
}

.logniture-contact-panel--form .logniture-contact-form label {
	gap: 0.55rem;
}

.logniture-contact-panel--form .logniture-contact-form label > span {
	font-family: var(--logniture-serif);
	font-size: 1rem;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
}

.logniture-contact-panel--form .logniture-contact-form label small {
	font-family: var(--logniture-sans);
	font-size: 0.8rem;
	color: var(--logniture-muted);
}

.logniture-contact-panel--form .logniture-contact-form input:not([type="checkbox"]),
.logniture-contact-panel--form .logniture-contact-form select,
.logniture-contact-panel--form .logniture-contact-form textarea {
	width: 100%;
	max-width: none;
	min-height: 58px;
	padding: 1rem 1.15rem;
	border: 1px solid var(--logniture-line);
	border-radius: 2px;
	background: var(--logniture-canvas);
	box-shadow: none;
	color: var(--logniture-ink);
	font-family: inherit;
	font-size: 1rem;
}

.logniture-contact-panel--form .logniture-contact-form textarea {
	min-height: 12rem;
}

/* Native <select> for Country, styled to match the text inputs exactly
   (same height/border/background/type) rather than a custom JS dropdown --
   keeps native keyboard/screen-reader behavior while replacing only the
   browser's own default chrome (the built-in arrow varies wildly across
   browsers) with a plain inline SVG chevron in the same ink color. */
.logniture-contact-panel--form .logniture-contact-form select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	padding-right: 2.75rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23181714' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1.15rem center;
	background-size: 0.65rem;
	cursor: pointer;
}

/* Matches the muted placeholder-like read of the empty "Select country"
   option until a real country is chosen; :invalid is true for a required
   select while its blank-value placeholder option is selected. */
.logniture-contact-panel--form .logniture-contact-form select:invalid {
	color: var(--logniture-muted);
}

.logniture-contact-panel--form .logniture-contact-form__submit {
	justify-self: stretch;
	width: 100%;
	max-width: none;
	min-height: 58px;
	margin-top: 0.5rem;
}

@media (max-width: 48rem) {
	.logniture-contact-composition {
		grid-template-columns: 1fr;
	}

	.logniture-contact-panel,
	.logniture-contact-panel--form {
		padding: clamp(2rem, 6vw, 2.5rem) var(--logniture-page-padding);
	}

	.logniture-contact-panel {
		text-align: left;
	}

	/* Closes the known Core-side 768px gap (Core's own single-column
	   breakpoint is still 544px) without touching Core -- this page's
	   grid now collapses on its own, at the same breakpoint as the
	   composition itself. */
	.logniture-contact-panel--form .logniture-contact-form__grid {
		grid-template-columns: 1fr;
	}
}

/* About */

.logniture-about-sections {
	max-width: 42rem;
	margin: 0 auto !important;
	padding: 0 var(--logniture-page-padding) clamp(2rem, 5vw, 4rem);
}

.logniture-about-section + .logniture-about-section {
	margin-top: clamp(2.5rem, 5vw, 4rem);
}

.logniture-about-section__title {
	margin: 0 0 0.85rem;
	font-size: clamp(1.5rem, 2.5vw, 1.9rem);
	font-weight: 400;
}

.logniture-about-section__copy {
	margin: 0;
	font-size: 1.02rem;
	line-height: 1.7;
}

.logniture-about-cta {
	max-width: 42rem;
	margin: 0 auto !important;
	padding: clamp(2.5rem, 6vw, 5rem) var(--logniture-page-padding) clamp(4rem, 8vw, 7rem);
	border-top: 1px solid var(--logniture-line);
	text-align: center;
}

.logniture-about-cta .logniture-section-title {
	margin: 0 0 1.75rem;
}

.logniture-about-cta__actions {
	display: flex !important;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1rem;
}

.logniture-about-cta__actions .logniture-cta {
	width: auto;
	min-width: 14rem;
	flex: 0 1 auto;
}

.logniture-cta--secondary {
	background: transparent;
	color: var(--logniture-ink);
}

.logniture-cta--secondary:hover,
.logniture-cta--secondary:focus-visible {
	background: var(--logniture-ink);
	border-color: var(--logniture-ink);
	color: var(--logniture-paper);
}

@media (max-width: 27rem) {
	.logniture-page-hero {
		padding-top: 2.5rem;
	}

	.logniture-about-cta__actions {
		flex-direction: column;
		align-items: stretch;
	}

	.logniture-about-cta__actions .logniture-cta {
		width: 100%;
		min-width: 0;
	}
}