/*!
 * Palm Ethos theme stylesheet.
 * Author: The Free Website Guys
 */

/* ==========================================================================
   1. CSS variable fallbacks (Section 6.1) — the same hex values produced by
      theme_hsl_to_hex() in PHP. wp_add_inline_style() re-emits the live
      Customizer values on top of these at runtime.
   ========================================================================== */
:root {
	--background: #f4f0eb;
	--foreground: #2c221c;
	--primary: #4c3a2f;
	--primary-foreground: #f7f3ee;
	--secondary: #eae3dc;
	--accent: #313b2b;
	--accent-foreground: #f7f3ee;
	--border: #d4ccc4;
	--botanical: #0a432e;
	--botanical-foreground: #f8f5f1;
	--dark-background: #191310;
	--dark-foreground: #f8f5f1;
	--dark-secondary: #2a221d;
	--dark-accent: #9aac91;
	--logo-height-lg: 3.3rem;
	--logo-width-lg: 240px;
	--footer-logo-height: 3.05rem;
	--footer-logo-width: 220px;

	--font-display: 'Cormorant Garamond', 'Times New Roman', serif;
	--font-body: 'Jost', system-ui, -apple-system, sans-serif;

	--btn-radius: 999px;
	--btn-height: 3rem;
	--btn-padding: 0 1.75rem;
	--btn-font-size: 15px;
	--btn-font-weight: 500;
	--btn-letter-spacing: normal;
	--btn-text-transform: none;
	--btn-icon-padding: 0;

	--card-radius: 1rem;
	--section-padding: 2rem;
	--checkout-gap: 2rem;
	--header-height: 80px;

	--shadow-soft: 0 6px 24px -12px rgba(44, 34, 28, 0.18);
	--shadow-elevated: 0 24px 60px -24px rgba(44, 34, 28, 0.3);
}

/* Derived / computed tokens — never exposed as Customizer controls. */
:root {
	--muted: color-mix(in srgb, var(--secondary) 70%, var(--foreground) 8%);
	--muted-foreground: color-mix(in srgb, var(--foreground) 55%, transparent);
	--linen: color-mix(in srgb, var(--secondary) 85%, white 15%);
	--bone: var(--secondary);
	--dark-border: color-mix(in srgb, var(--dark-foreground) 14%, transparent);
	--dark-muted: color-mix(in srgb, var(--dark-secondary) 80%, black 10%);
	--dark-muted-foreground: color-mix(in srgb, var(--dark-foreground) 65%, transparent);
}

/* ==========================================================================
   2. Reset & base (Tailwind-preflight-equivalent heading reset, Section 2.2)
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html, body { max-width: 100%; overflow-x: clip; margin: 0; padding: 0; }

body {
	background-color: var(--background);
	color: var(--foreground);
	font-family: var(--font-body);
	-webkit-font-smoothing: antialiased;
	line-height: 1.5;
}

h1, h2, h3, h4, h5, h6, .font-display {
	font-family: var(--font-display);
	font-weight: inherit;
	font-size: inherit;
	letter-spacing: -0.008em;
	margin: 0;
	line-height: 1.15;
}

p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; cursor: pointer; }
img:not(.site-logo-img) { max-width: 100%; height: auto; display: block; }
button, input, textarea, select { font-family: inherit; color: inherit; }
button { cursor: pointer; background: none; border: none; padding: 0; }

/* Pointer cursor on all interactive controls */
a,
button,
[role="button"],
input[type="submit"],
input[type="button"],
input[type="reset"],
label[for],
select,
summary,
.theme-nav-link,
.craft-card,
.shop-tab,
.faq-item__question,
.theme-menu-toggle,
.theme-cart-btn,
.theme-header-cta,
.theme-footer-nav-link,
.theme-footer-collection-link,
.theme-footer-contact-link,
.site-footer__totop,
.single-product__thumb,
.theme-cart-item__image,
.theme-cart-item__name,
.theme-qty-minus,
.theme-qty-plus,
.theme-cart-item__remove,
.theme-product-card__media-link,
.theme-product-card__title-link,
.theme-product-card__quickview {
	cursor: pointer;
}

.italic { font-style: italic; }
.container-wide { width: 100%; max-width: 80rem; margin: 0 auto; padding-left: 1.5rem; padding-right: 1.5rem; min-width: 0; box-sizing: border-box; }
@media (max-width: 479px) {
	.container-wide { padding-left: 1rem; padding-right: 1rem; }
}
@media (min-width: 1024px) { .container-wide { padding-left: 4rem; padding-right: 4rem; } }

/* Layout safety — prevent horizontal overflow on mobile */
.site-main,
.site-main > section,
.site-footer,
.site-header {
	overflow-x: clip;
	max-width: 100%;
}
.site-main > section > .container-wide,
.site-main > section > .container-wide > * {
	min-width: 0;
}
.section-heading,
.hero-section__title,
.hero-section__subtitle,
.about-section__title,
.founder-section__name,
.precontact-section__title,
.single-product__title {
	overflow-wrap: break-word;
	word-break: break-word;
}

a, button, [role="button"] {
	transition: color 300ms cubic-bezier(0.22, 1, 0.36, 1), background-color 300ms cubic-bezier(0.22, 1, 0.36, 1),
		border-color 300ms cubic-bezier(0.22, 1, 0.36, 1), transform 350ms cubic-bezier(0.22, 1, 0.36, 1), opacity 300ms ease;
}

::selection { background: color-mix(in srgb, var(--primary) 85%, transparent); color: var(--primary-foreground); }

/* Cover / full-bleed image exclusion list (Section 15) — every class below
   MUST appear both here and in its own cover ruleset. */
img:not(.cover-img):not(.site-logo-img):not(.hero-section__video):not(.precontact-section__video) {
	max-width: 100%;
	height: auto;
}
.cover-img,
video.cover-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

/* ==========================================================================
   3. Section theme scopes
   ========================================================================== */
.theme-light {
	--section-bg: var(--background);
	--section-fg: var(--foreground);
	--section-primary: var(--primary);
	--section-primary-fg: var(--primary-foreground);
	--section-secondary: var(--secondary);
	--section-accent: var(--accent);
	--section-accent-fg: var(--accent-foreground);
	--section-border: var(--border);
	--section-muted-fg: var(--muted-foreground);
	background-color: var(--section-bg);
	color: var(--section-fg);
}
.theme-dark {
	--section-bg: var(--dark-background);
	--section-fg: var(--dark-foreground);
	--section-primary: var(--dark-foreground);
	--section-primary-fg: var(--dark-background);
	--section-secondary: var(--dark-secondary);
	--section-accent: var(--dark-accent);
	--section-accent-fg: var(--dark-background);
	--section-border: var(--dark-border);
	--section-muted-fg: var(--dark-muted-foreground);
	background-color: var(--section-bg);
	color: var(--section-fg);
}

.eyebrow {
	display: block;
	font-size: 14px;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	color: var(--section-muted-fg);
	font-weight: 500;
	margin-bottom: 1rem;
}
.eyebrow--on-dark { color: rgba(255, 255, 255, 0.7); }

/* ==========================================================================
   4. Animation & motion parity (Section 2.1)
   ========================================================================== */
.reveal-item {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 700ms cubic-bezier(0.22, 1, 0.36, 1), transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
	will-change: opacity, transform;
}
.reveal-item[data-theme-anim="fade"] { transform: none; }
.reveal-item[data-theme-anim="fade-up"] { transform: translateY(28px); }
.reveal-item[data-theme-anim="slide-up"] { transform: translateY(20px); transition-duration: 900ms; }
.reveal-item[data-theme-anim="scale-in"] { transform: scale(0.94); }

.reveal-item.is-visible {
	opacity: 1;
	transform: none;
}

/* Customizer-preview fallback (Section 2.1.5) — never hide content while editing. */
body.is-customizer .reveal-item {
	opacity: 1 !important;
	transform: none !important;
	transition: none !important;
}

@media (prefers-reduced-motion: reduce) {
	.reveal-item { opacity: 1 !important; transform: none !important; transition: none !important; }
	.marquee-track { animation: none !important; }
	* { scroll-behavior: auto !important; }
}

@keyframes theme-marquee-scroll {
	from { transform: translate3d(0, 0, 0); }
	to { transform: translate3d(-50%, 0, 0); }
}
@keyframes theme-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes theme-mobile-nav-in {
	from { opacity: 0; }
	to { opacity: 1; }
}
@keyframes theme-spin { to { transform: rotate(360deg); } }

/* ==========================================================================
   5. Buttons
   ========================================================================== */
.theme-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	height: var(--btn-height);
	padding: var(--btn-padding);
	border-radius: var(--btn-radius);
	font-family: var(--font-body);
	font-size: var(--btn-font-size);
	font-weight: var(--btn-font-weight);
	letter-spacing: var(--btn-letter-spacing);
	text-transform: var(--btn-text-transform);
	white-space: nowrap;
	transition: transform 150ms ease-out, box-shadow 150ms ease-out, background-color 150ms ease-out, border-color 150ms ease-out, color 150ms ease-out, opacity 150ms ease-out;
	border: 1px solid transparent;
}
.theme-btn:hover { transform: scale(1.02); box-shadow: var(--shadow-soft); }
.theme-btn:active { transform: scale(0.97); }
.theme-btn.disabled, .theme-btn[aria-disabled="true"] { opacity: 0.5; cursor: not-allowed; pointer-events: none; transform: none !important; box-shadow: none !important; }

.theme-btn-primary, .single_add_to_cart_button.button, .add_to_cart_button.button, a.single_add_to_cart_button, a.add_to_cart_button {
	background-color: var(--primary) !important;
	color: var(--primary-foreground) !important;
	border-color: var(--primary) !important;
	text-transform: none !important;
}
.theme-btn-primary:hover, .single_add_to_cart_button.button:hover, .add_to_cart_button.button:hover {
	opacity: 0.9;
	background-color: var(--primary) !important;
	color: var(--primary-foreground) !important;
}

.single_add_to_cart_button.button:disabled,
.single_add_to_cart_button.button.disabled,
.add_to_cart_button.button:disabled,
.add_to_cart_button.button.disabled,
.theme-buy-now-button.disabled {
	cursor: not-allowed !important;
	opacity: 0.45 !important;
	pointer-events: none !important;
	transform: none !important;
}
.single_add_to_cart_button.button:disabled:hover,
.single_add_to_cart_button.button.disabled:hover,
.add_to_cart_button.button:disabled:hover,
.add_to_cart_button.button.disabled:hover {
	opacity: 0.45 !important;
	background-color: var(--primary) !important;
}

.theme-btn-outline, .theme-buy-now-button {
	background-color: transparent;
	color: var(--section-fg);
	border-color: color-mix(in srgb, var(--section-fg) 25%, transparent);
}
.theme-btn-outline:hover, .theme-buy-now-button:hover {
	border-color: var(--section-primary);
	color: var(--section-primary);
}

.theme-btn-hero-primary { background-color: #fff; color: #2c221c; border-color: #fff; text-transform: none; }
.theme-btn-hero-primary:hover { background-color: rgba(255,255,255,0.9); }
.theme-btn-hero-outline { background-color: transparent; color: #fff; border-color: rgba(255,255,255,0.7); text-transform: none; }
.theme-btn-hero-outline:hover { background-color: #fff; color: #2c221c; }
.theme-btn-precontact { background-color: var(--background); color: var(--foreground); border-color: var(--background); text-transform: none; }
.theme-btn-precontact:hover { background-color: color-mix(in srgb, var(--background) 90%, transparent); }

.theme-btn-founder-cta {
	display: inline-flex;
	align-items: center;
	gap: 0.75rem;
	height: 3rem;
	padding: 0 1.75rem;
	border-radius: 999px;
	background-color: var(--section-accent);
	color: var(--section-accent-fg);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}
.theme-btn-founder-cta:hover { opacity: 0.9; }

.theme-btn-ghost { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; color: var(--section-muted-fg); font-size: 15px; }
.theme-btn-ghost:hover { color: var(--section-fg); }

/* Hide WooCommerce's own "View cart" link injected after AJAX add (Section 11.4.2) */
.woocommerce-page a.added_to_cart.wc-forward,
.single-product a.added_to_cart.wc-forward,
body a.added_to_cart.wc-forward { display: none !important; }

.single-product .single_add_to_cart_button.loading::after,
.ajax_add_to_cart.loading::after { display: none !important; }

.ajax_add_to_cart.theme-btn-loading, .theme-buy-now-button.theme-btn-loading {
	opacity: 0.6 !important;
	pointer-events: none !important;
	cursor: wait !important;
}

/* ==========================================================================
   6. Header
   ========================================================================== */
#theme-scroll-progress { position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 60; pointer-events: none; }
#theme-scroll-progress-bar { height: 100%; background: var(--foreground); transform-origin: left center; transform: scaleX(0); transition: transform 150ms ease-out; }

.skip-link.screen-reader-text {
	position: absolute; left: -9999px; top: auto;
}
.skip-link.screen-reader-text:focus {
	left: 1rem; top: 1rem; z-index: 100; background: #fff; color: #000; padding: 0.5rem 1rem; border-radius: 0.375rem;
}

.site-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 50;
	width: 100%;
	border-bottom: 1px solid transparent;
	background-color: transparent;
	transition: background-color 500ms ease-out, border-color 500ms ease-out, top 200ms ease-out;
}
body.admin-bar .site-header {
	top: 32px;
}
@media screen and (max-width: 782px) {
	body.admin-bar .site-header {
		top: 46px;
	}
}
body.admin-bar #theme-scroll-progress {
	top: 32px;
}
@media screen and (max-width: 782px) {
	body.admin-bar #theme-scroll-progress {
		top: 46px;
	}
}
.site-header.is-solid {
	background-color: color-mix(in srgb, var(--dark-background) 92%, transparent);
	backdrop-filter: blur(10px);
	border-bottom-color: rgba(255, 255, 255, 0.1);
}
.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	width: 100%;
	max-width: 1240px;
	margin: 0 auto;
	height: 5rem;
	padding-left: 1rem;
	padding-right: 1rem;
	box-sizing: border-box;
	min-width: 0;
}
@media (min-width: 640px) {
	.site-header__inner {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
	}
}
@media (min-width: 1024px) {
	.site-header__inner {
		height: 6rem;
		padding-left: 2rem;
		padding-right: 2rem;
	}
	:root { --header-height: 96px; }
}
@media (min-width: 1280px) {
	.site-header__inner {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
		align-items: center;
	}
	.site-header__left { justify-self: start; }
	.site-header__right { justify-self: end; }
}

.site-header__left { display: flex; align-items: center; gap: 0.5rem; min-width: 0; flex: 1 1 auto; }
.site-header__right { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; min-width: 0; }

.theme-menu-toggle {
	display: inline-flex; align-items: center; justify-content: center;
	width: 2.5rem; height: 2.5rem; border-radius: 0.375rem; color: #fff;
	flex-shrink: 0;
}
.theme-menu-toggle:hover { background-color: rgba(255,255,255,0.1); }
.theme-menu-toggle__icon--close { display: none; }
.theme-menu-toggle[aria-expanded="true"] .theme-menu-toggle__icon--open { display: none; }
.theme-menu-toggle[aria-expanded="true"] .theme-menu-toggle__icon--close { display: inline-flex; }
@media (min-width: 1280px) { .theme-menu-toggle { display: none; } }

.site-branding { display: inline-flex; align-items: center; gap: 0.5rem; min-width: 0; flex-shrink: 1; max-width: 100%; }

/* Logo sizing matches Lovable: h-10/w-180 → sm h-12/w-210 → lg h-[3.3rem]/w-240 (header); footer h-[3.05rem]/w-220 */
.site-logo-img {
	display: block;
	flex-shrink: 0;
	object-fit: contain;
	object-position: left center;
	filter: brightness(0) invert(1);
	max-width: none !important;
}

.site-logo-img--header {
	height: calc(var(--logo-height-lg, 3.3rem) * 0.758) !important;
	width: calc(var(--logo-width-lg, 240px) * 0.75) !important;
	transition: transform 500ms ease-out;
	filter: brightness(0) invert(1);
}
.site-header:not(.is-solid) .site-logo-img--header {
	filter: brightness(0) invert(1) drop-shadow(0 2px 12px rgba(0, 0, 0, 0.45));
}
@media (min-width: 640px) {
	.site-logo-img--header {
		height: calc(var(--logo-height-lg, 3.3rem) * 0.909) !important;
		width: calc(var(--logo-width-lg, 240px) * 0.875) !important;
	}
}
@media (min-width: 1024px) {
	.site-logo-img--header {
		height: var(--logo-height-lg, 3.3rem) !important;
		width: var(--logo-width-lg, 240px) !important;
	}
}
@media (max-width: 479px) {
	.site-logo-img--header {
		height: calc(var(--logo-height-lg, 3.3rem) * 0.65) !important;
		width: calc(var(--logo-width-lg, 240px) * 0.65) !important;
	}
}
.site-branding:hover .site-logo-img--header { transform: scale(1.03); }

/* PDP, cart drawer, checkout, and account — WooCommerce img resets must not affect the brand mark */
body.single-product img.site-logo-img,
body.woocommerce-cart img.site-logo-img,
body.woocommerce-checkout img.site-logo-img,
body.woocommerce-account img.site-logo-img,
body.theme-thankyou-page img.site-logo-img,
body.woocommerce-page img.site-logo-img {
	object-fit: contain !important;
	max-width: none !important;
}
.site-logo-text--header { color: #fff; font-family: var(--font-display); font-size: 1.5rem; font-style: italic; }
.site-logo-name { color: #fff; margin-left: 0.5rem; font-size: 0.95rem; }

.site-nav { display: none; }
@media (min-width: 1280px) {
	.site-nav {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.125rem;
		min-width: 0;
		flex: 1 1 auto;
	}
}
@media (min-width: 1280px) {
	.site-nav { gap: 0.5rem; }
}
.theme-nav-list { display: flex; align-items: center; gap: 0.125rem; }
@media (min-width: 1280px) {
	.theme-nav-list { gap: 0.5rem; }
}
.theme-nav-item { position: relative; }
.theme-nav-link {
	position: relative;
	display: inline-block;
	padding: 0.5rem 0.625rem;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.7);
	white-space: nowrap;
	transition: color 300ms ease;
}
@media (min-width: 1280px) {
	.theme-nav-link { padding: 0.5rem 0.875rem; }
}
.site-header:not(.is-solid) .theme-nav-link {
	text-shadow: 0 2px 14px rgba(0, 0, 0, 0.55);
}
.theme-nav-link:hover,
.theme-nav-item.current-menu-item .theme-nav-link,
.theme-nav-item.is-active .theme-nav-link {
	color: #fff;
}
.theme-nav-item.current-menu-item .theme-nav-link::after,
.theme-nav-item.is-active .theme-nav-link::after {
	content: '';
	position: absolute;
	left: 0.625rem;
	right: 0.625rem;
	bottom: -2px;
	height: 2px;
	background: #fff;
}
@media (min-width: 1280px) {
	.theme-nav-item.current-menu-item .theme-nav-link::after,
	.theme-nav-item.is-active .theme-nav-link::after {
		left: 0.875rem;
		right: 0.875rem;
	}
}

.theme-header-cta {
	display: none;
	align-items: center;
	height: 2.5rem;
	padding: 0 1rem;
	border-radius: 999px;
	border: 1px solid rgba(255,255,255,0.4);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	white-space: nowrap;
	max-width: 100%;
}
@media (min-width: 768px) {
	.theme-header-cta {
		display: inline-flex;
		padding: 0 1.25rem;
		font-size: 14px;
		letter-spacing: 0.22em;
	}
}
.theme-header-cta:hover { background-color: #fff; color: var(--dark-background); }

.theme-cart-btn {
	position: relative;
	display: inline-flex; align-items: center; justify-content: center;
	width: 2.5rem; height: 2.5rem; border-radius: 0.375rem; color: #fff;
}
.theme-cart-btn:hover { background-color: rgba(255,255,255,0.1); }
.theme-cart-count {
	position: absolute; top: -2px; right: -2px;
	min-width: 18px; height: 18px; padding: 0 4px;
	border-radius: 999px;
	background: #fff; color: #000;
	font-size: 12px; font-weight: 500;
	display: inline-flex; align-items: center; justify-content: center;
}
.theme-cart-count:empty { display: none; }

.theme-mobile-nav {
	display: none;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	background: hsl(24 24% 8%);
	max-width: 100%;
	overflow-x: clip;
}
.theme-mobile-nav.is-open {
	display: block;
	animation: theme-mobile-nav-in 700ms ease-out both;
}
@media (min-width: 1280px) {
	.theme-mobile-nav,
	.theme-mobile-nav.is-open { display: none !important; }
}
.theme-mobile-nav__inner {
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 1240px;
	margin: 0 auto;
	padding: 0.5rem 1rem;
	box-sizing: border-box;
}
@media (min-width: 640px) {
	.theme-mobile-nav__inner { padding: 0.5rem 1.5rem; }
}
@media (min-width: 1024px) {
	.theme-mobile-nav__inner { padding-left: 2rem; padding-right: 2rem; }
}
.theme-mobile-nav-list {
	display: flex;
	flex-direction: column;
	padding: 0;
	margin: 0;
	list-style: none;
}
.theme-mobile-nav-list li {
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.theme-mobile-nav-link,
.theme-mobile-nav-list a {
	display: block;
	width: 100%;
	padding: 0.75rem 0;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.5;
	text-align: left;
	text-transform: none;
	letter-spacing: normal;
	color: rgba(255, 255, 255, 0.85);
	background: none;
	border: none;
	transition: color 300ms ease;
}
.theme-mobile-nav-link:hover,
.theme-mobile-nav-list a:hover {
	color: #fff;
}
/* Fallback/desktop nav classes must not apply uppercase tracking in the drawer */
.theme-mobile-nav-list .theme-nav-link {
	padding: 0.75rem 0;
	text-transform: none;
	letter-spacing: normal;
	text-shadow: none;
	color: rgba(255, 255, 255, 0.85);
}
.theme-mobile-nav-list .theme-nav-link:hover {
	color: #fff;
}
.theme-mobile-nav-list .theme-nav-link::after,
.theme-mobile-nav-list .theme-nav-item.current-menu-item .theme-nav-link::after,
.theme-mobile-nav-list .theme-nav-item.is-active .theme-nav-link::after {
	display: none;
}
.theme-mobile-nav-faq {
	border-bottom: none;
}

/* ==========================================================================
   7. Hero
   ========================================================================== */
.hero-section {
	position: relative;
	min-height: 100vh;
	width: 100%;
	max-width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	overflow-x: clip;
}
body.theme-no-hero .hero-section { display: none; }
.hero-section__video { z-index: 0; }
.hero-section__scrim {
	position: absolute; inset: 0; z-index: 1; pointer-events: none;
	background: linear-gradient(180deg, rgba(25,19,16,0.62) 0%, rgba(25,19,16,0.55) 45%, rgba(25,19,16,0.82) 100%);
}
.hero-section__content {
	position: relative;
	z-index: 2;
	text-align: center;
	color: #fff;
	padding-top: 8rem;
	padding-bottom: 6rem;
	padding-left: max(1.5rem, env(safe-area-inset-left, 0px));
	padding-right: max(1.5rem, env(safe-area-inset-right, 0px));
}
@media (min-width: 640px) {
	.hero-section__content {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
	}
}
@media (min-width: 1024px) {
	.hero-section__content {
		padding-top: 10rem;
		padding-bottom: 8rem;
		padding-left: 4rem;
		padding-right: 4rem;
	}
}
.hero-section__badge-row { display: flex; justify-content: center; margin-bottom: 2rem; }
.hero-section__badge {
	display: inline-flex; align-items: center; gap: 0.5rem;
	padding: 0.375rem 1rem; border-radius: 999px;
	background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.25);
	font-size: 14px; letter-spacing: 0.32em; text-transform: uppercase; color: rgba(255,255,255,0.85); font-weight: 500;
	backdrop-filter: blur(4px);
}
.hero-section__title {
	font-family: var(--font-display);
	color: #fff;
	line-height: 0.98;
	letter-spacing: -0.015em;
	margin: 0 auto;
	max-width: 64rem;
	font-size: clamp(3rem, 8.5vw, 7rem);
	text-shadow: 0 2px 20px rgba(0,0,0,0.45);
}
.hero-section__subtitle {
	margin: 2rem auto 0;
	max-width: 42rem;
	font-size: 16px;
	color: rgba(255,255,255,0.85);
	line-height: 1.6;
	text-shadow: 0 1px 10px rgba(0,0,0,0.4);
}
@media (min-width: 640px) { .hero-section__subtitle { font-size: 18px; } }
.hero-section__actions { margin-top: 2.5rem; display: flex; flex-direction: column; gap: 0.75rem; justify-content: center; align-items: stretch; width: 100%; max-width: 28rem; margin-left: auto; margin-right: auto; }
@media (min-width: 640px) { .hero-section__actions { flex-direction: row; gap: 1rem; align-items: center; max-width: none; } }
.hero-section__actions .theme-btn { width: 100%; max-width: 100%; }
@media (min-width: 640px) { .hero-section__actions .theme-btn { width: auto; } }

/* ==========================================================================
   8. About
   ========================================================================== */
.about-section { padding: 6rem 0; overflow-x: clip; }
@media (min-width: 768px) { .about-section { padding: 8rem 0; } }
.about-section__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem; align-items: start; }
@media (min-width: 1024px) { .about-section__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 5rem; } }
.about-section__title { font-size: 2.25rem; line-height: 1.05; }
@media (min-width: 768px) { .about-section__title { font-size: 3rem; } }
@media (min-width: 1024px) { .about-section__title { font-size: 3.6rem; } }
.about-section__lede { margin-top: 1.25rem; font-size: 15px; color: var(--section-muted-fg); line-height: 1.6; max-width: 24rem; }
.about-section__quote { margin-top: 3rem; padding-top: 2rem; }
.about-section__quote blockquote { font-family: var(--font-display); font-style: italic; font-size: 1.5rem; line-height: 1.3; color: color-mix(in srgb, var(--section-fg) 90%, transparent); margin: 0; }
@media (min-width: 768px) { .about-section__quote blockquote { font-size: 1.8rem; } }
.about-section__quote figcaption { margin-top: 1.25rem; font-size: 14px; letter-spacing: 0.32em; text-transform: uppercase; color: var(--section-muted-fg); font-weight: 500; }
.about-section__highlight { margin-top: 2.5rem; border-radius: 1rem; border: 1px solid var(--section-border); background: var(--section-secondary); padding: 1.25rem; }
.about-section__highlight-label { font-size: 14px; letter-spacing: 0.32em; text-transform: uppercase; color: var(--section-muted-fg); margin-bottom: 0.5rem; }
.about-section__highlight-text { font-size: 15px; font-weight: 500; }
.about-section__approach-title { font-size: 1.875rem; line-height: 1.15; margin-bottom: 2rem; }
@media (min-width: 768px) { .about-section__approach-title { font-size: 2.25rem; } }
.about-section__body { display: flex; flex-direction: column; gap: 1.5rem; font-size: 15px; line-height: 1.75; color: var(--section-muted-fg); }
@media (min-width: 768px) { .about-section__body { font-size: 16px; } }
.about-section__body-highlight { color: color-mix(in srgb, var(--section-fg) 90%, transparent); font-size: 1.125rem; }
@media (min-width: 768px) { .about-section__body-highlight { font-size: 1.25rem; } }
.about-section__stats { margin-top: 3rem; display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; border-top: 1px solid var(--section-border); padding-top: 2rem; }
@media (min-width: 640px) { .about-section__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.about-section__stat-value { font-size: 1.5rem; }
@media (min-width: 768px) { .about-section__stat-value { font-size: 1.875rem; } }
.about-section__stat-label { margin-top: 0.25rem; font-size: 14px; text-transform: uppercase; letter-spacing: 0.22em; color: var(--section-muted-fg); }
.about-section__stat-rule { margin-top: 0.75rem; display: block; height: 1px; width: 1.5rem; background: color-mix(in srgb, var(--section-fg) 20%, transparent); transition: width 500ms ease-out; }
.about-section__stat:hover .about-section__stat-rule { width: 4rem; background: var(--section-accent); }

/* ==========================================================================
   9. Marquee
   ========================================================================== */
.marquee-section { position: relative; overflow: hidden; overflow-x: clip; padding: 2.25rem 0; }
@media (min-width: 768px) { .marquee-section { padding: 3.15rem 0; } }
.marquee-section__fade { position: absolute; inset-block: 0; width: 6rem; z-index: 10; pointer-events: none; }
@media (min-width: 768px) { .marquee-section__fade { width: 10rem; } }
.marquee-section__fade--left { left: 0; background: linear-gradient(to right, var(--dark-background), transparent); }
.marquee-section__fade--right { right: 0; background: linear-gradient(to left, var(--dark-background), transparent); }
.marquee-track { width: max-content; display: flex; align-items: center; gap: 3rem; white-space: nowrap; animation: theme-marquee-scroll 45s linear infinite; }
@media (min-width: 768px) { .marquee-track { gap: 5rem; } }
.marquee-item { display: flex; align-items: center; gap: 3rem; flex-shrink: 0; }
@media (min-width: 768px) { .marquee-item { gap: 5rem; } }
.marquee-item__text { font-family: var(--font-display); font-style: italic; line-height: 1; color: color-mix(in srgb, var(--dark-foreground) 96%, transparent); font-size: clamp(1.44rem, 3.84vw, 3.2rem); }
.marquee-item__dot { display: inline-block; border-radius: 999px; background: var(--dark-accent); width: clamp(6px, 0.6vw, 10px); height: clamp(6px, 0.6vw, 10px); flex-shrink: 0; }

/* ==========================================================================
   10. Section headings (per-section scales, Section 2.2.5)
   ========================================================================== */
.craft-section__heading, .shop-section__heading, .faq-section__heading, .contact-section__title {
	font-size: 2.25rem;
	line-height: 1.05;
}
@media (min-width: 768px) { .craft-section__heading, .shop-section__heading, .faq-section__heading, .contact-section__title { font-size: 3rem; } }
@media (min-width: 1024px) { .craft-section__heading, .shop-section__heading, .faq-section__heading, .contact-section__title { font-size: 3.4rem; } }

/* ==========================================================================
   11. Craft section
   ========================================================================== */
.craft-section { padding: 6rem 0; overflow-x: clip; }
@media (min-width: 768px) { .craft-section { padding: 8rem 0; } }
.craft-section__intro { max-width: 42rem; margin-bottom: 3.5rem; }
.craft-section__lede { margin-top: 1.25rem; font-size: 15px; color: var(--section-muted-fg); line-height: 1.6; }
.craft-section__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
@media (min-width: 640px) { .craft-section__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; } }
.craft-card {
	display: block; text-align: left; width: 100%;
	overflow: hidden; border-radius: 1rem;
	border: 1px solid var(--section-border);
	background: var(--section-secondary);
	transition: transform 500ms ease-out, border-color 500ms ease-out, box-shadow 500ms ease-out;
}
.craft-card:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--section-accent) 50%, transparent); box-shadow: var(--shadow-elevated); }
.craft-card__image-wrap { position: relative; display: block; height: 14rem; overflow: hidden; }
@media (min-width: 768px) { .craft-card__image-wrap { height: 16rem; } }
.craft-card__image { transition: transform 700ms ease-out; }
.craft-card:hover .craft-card__image { transform: scale(1.05); }
.craft-card__body { display: block; padding: 1.75rem; }
@media (min-width: 768px) { .craft-card__body { padding: 2.25rem; } }
.craft-card__index { display: block; font-size: 14px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--section-accent); font-weight: 500; margin-bottom: 1rem; }
.craft-card__title { display: block; font-family: var(--font-display); font-size: 1.5rem; line-height: 1.2; }
@media (min-width: 768px) { .craft-card__title { font-size: 1.8rem; } }
.craft-card__text { display: block; margin-top: 1rem; font-size: 15px; line-height: 1.75; color: var(--section-muted-fg); }
.craft-card__link { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: 1.5rem; font-size: 14px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--section-muted-fg); }
.craft-card:hover .craft-card__link { color: var(--section-accent); }
.craft-card__link-icon { transition: transform 500ms ease-out; }
.craft-card:hover .craft-card__link-icon { transform: translate(2px, -2px); }

/* ==========================================================================
   12. Shop / product grid (shared across archive, home, related)
   ========================================================================== */
.shop-section { padding: 6rem 0; overflow-x: clip; }
@media (min-width: 768px) { .shop-section { padding: 8rem 0; } }
.shop-section__header { display: flex; flex-direction: column; gap: 1.5rem; margin-bottom: 3rem; }
@media (min-width: 1024px) { .shop-section__header { flex-direction: row; align-items: flex-end; justify-content: space-between; } }
.shop-section__intro { max-width: 42rem; }
.shop-section__description { margin-top: 1.25rem; font-size: 15px; color: var(--section-muted-fg); line-height: 1.6; max-width: 36rem; }
.shop-section__search { position: relative; width: 100%; }
@media (min-width: 1024px) { .shop-section__search { width: 20rem; } }
.shop-section__search-icon { position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: var(--section-muted-fg); }
.shop-section__search-input {
	width: 100%; height: 2.75rem; padding: 0 1rem 0 2.75rem; border-radius: 999px;
	background: var(--section-secondary); border: 1px solid var(--section-border);
	font-size: 15px; color: var(--section-fg);
}
.shop-section__search-input::placeholder { color: color-mix(in srgb, var(--section-fg) 45%, transparent); }
.shop-section__search-input:focus { outline: none; border-color: var(--section-accent); }

.shop-section__tabs { display: flex; flex-wrap: wrap; gap: 0.625rem; margin-bottom: 3rem; max-width: 100%; }
.shop-tab {
	height: 2.5rem; padding: 0 1rem; border-radius: 999px; font-size: 14px; font-weight: 500;
	border: 1px solid color-mix(in srgb, var(--section-primary) 25%, transparent);
	background: transparent; color: color-mix(in srgb, var(--section-fg) 70%, transparent);
	max-width: 100%;
	white-space: nowrap;
}
@media (min-width: 640px) {
	.shop-tab { padding: 0 1.25rem; font-size: 15px; }
}
.shop-tab:hover { border-color: var(--section-primary); color: var(--section-primary); }
.shop-tab.is-active { background: var(--section-primary); color: var(--section-primary-fg); border-color: var(--section-primary); }

.shop-section__empty { text-align: center; padding: 5rem 0; color: color-mix(in srgb, var(--section-fg) 55%, transparent); }

.theme-product-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 1.5rem;
	align-items: stretch;
}
@media (min-width: 640px) { .theme-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .theme-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3rem 1.5rem; } }

.theme-shop-grid-item { display: flex; }
.theme-shop-grid-item[hidden] { display: none; }
.theme-shop-grid-item.is-filtered-out { display: none; }

.theme-product-card-wrap { display: flex; flex-direction: column; width: 100%; height: 100%; }
.theme-product-card { display: flex; flex-direction: column; height: 100%; }

.theme-product-card__image-wrapper {
	position: relative;
	aspect-ratio: 1 / 1;
	border-radius: 0.75rem;
	overflow: hidden;
	margin-bottom: 1rem;
	background: var(--linen);
	border: 1px solid color-mix(in srgb, var(--section-primary) 10%, transparent);
	transition: border-color 300ms ease;
}
.theme-product-card__media-link {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: block;
}
.theme-product-card:hover .theme-product-card__image-wrapper { border-color: color-mix(in srgb, var(--section-primary) 40%, transparent); }
.theme-product-card__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
	transition: transform 1400ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
.theme-product-card:hover .theme-product-card__image { transform: scale(1.04); }
.theme-product-card__scrim {
	position: absolute; inset: 0; z-index: 2;
	background: linear-gradient(to top, rgba(0,0,0,0.6), transparent 60%);
	opacity: 0; transition: opacity 500ms ease; pointer-events: none;
}
.theme-product-card:hover .theme-product-card__scrim { opacity: 1; }

.theme-product-card__badge {
	position: absolute; top: 0.75rem; left: 0.75rem; z-index: 4;
	background: var(--botanical); color: var(--botanical-foreground);
	border: 1px solid color-mix(in srgb, var(--botanical-foreground) 25%, transparent);
	font-size: 13px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase;
	padding: 0.25rem 0.625rem; border-radius: 999px;
}

.theme-product-card__quick-actions {
	position: absolute; left: 0.75rem; right: 0.75rem; bottom: 0.75rem; z-index: 4;
	display: flex; align-items: center; gap: 0.5rem;
	opacity: 0; transition: opacity 500ms ease-out;
	pointer-events: none;
}
.theme-product-card:hover .theme-product-card__quick-actions { opacity: 1; }
.theme-product-card__quick-actions > * { pointer-events: auto; }

.theme-product-card__add.add_to_cart_button.ajax_add_to_cart,
.theme-product-card__add.theme-product-card__add--pdp {
	flex: 1; min-height: 2.5rem !important; height: 2.5rem !important; padding: 0 1rem !important;
	display: inline-flex !important; align-items: center; justify-content: center; gap: 0.5rem;
	border-radius: 999px !important; font-size: 15px !important; font-weight: 500 !important;
	background-color: var(--primary) !important; color: var(--primary-foreground) !important;
	border: 1px solid var(--primary) !important;
	text-decoration: none;
	text-transform: none !important;
	cursor: pointer;
}
.theme-product-card__add.theme-product-card__add--pdp:hover {
	opacity: 0.9;
}
.theme-product-card__quickview {
	width: 2.5rem; height: 2.5rem; border-radius: 999px;
	display: inline-flex; align-items: center; justify-content: center;
	background: color-mix(in srgb, var(--background) 90%, transparent);
	color: var(--foreground);
	border: 1px solid color-mix(in srgb, var(--primary) 25%, transparent);
	backdrop-filter: blur(4px);
	text-decoration: none;
}
.theme-product-card__quickview:hover {
	background: var(--primary);
	color: var(--primary-foreground);
	border-color: var(--primary);
}

.theme-product-card__info { padding: 0 0.125rem; min-width: 0; }
.theme-product-card__category { font-size: 15px; text-transform: uppercase; letter-spacing: 0.24em; color: color-mix(in srgb, var(--section-primary) 80%, transparent); margin-bottom: 0.375rem; }
.theme-product-card__title {
	font-family: var(--font-display);
	font-size: 1.2rem; line-height: 1.3;
	overflow-wrap: break-word;
}
.theme-product-card__title-link {
	color: inherit;
	text-decoration: none;
	transition: color 300ms ease;
}
@media (min-width: 768px) { .theme-product-card__title { font-size: 1.35rem; } }
@media (min-width: 1024px) { .theme-product-card__title { font-size: 1.5rem; } }
.theme-product-card:hover .theme-product-card__title-link { color: var(--section-primary); }
.theme-product-card__price { margin-top: 0.375rem; font-size: 15px; font-weight: 500; color: var(--section-primary); }
.theme-price-currency-code { margin-left: 0.15em; }

.shop-section__more { margin-top: 3.5rem; display: flex; justify-content: center; }

/* ==========================================================================
   13. Founder
   ========================================================================== */
.founder-section { padding: 6rem 0; overflow-x: clip; }
@media (min-width: 768px) { .founder-section { padding: 8rem 0; } }
.founder-section__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3.5rem; align-items: stretch; }
@media (min-width: 1024px) { .founder-section__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 5rem; } }
.founder-section__portrait { position: relative; display: flex; flex-direction: column; min-width: 0; overflow: clip; }
.founder-section__deco { position: absolute; border-radius: 1rem; display: none; }
@media (min-width: 640px) { .founder-section__deco { display: block; } }
.founder-section__deco--top { top: -1.25rem; left: -1.25rem; width: 8rem; height: 8rem; background: color-mix(in srgb, var(--botanical) 60%, transparent); }
.founder-section__deco--bottom { bottom: -1.5rem; right: 1.5rem; width: 10rem; height: 10rem; background: color-mix(in srgb, var(--dark-foreground) 10%, transparent); }
.founder-section__image { position: relative; z-index: 10; width: 100%; flex: 1; min-height: 26rem; border-radius: 1rem; object-position: top; box-shadow: var(--shadow-elevated); }
.founder-section__badge {
	position: relative; z-index: 20; margin-top: -2.5rem; margin-left: auto; margin-right: 1rem;
	width: fit-content; border-radius: 0.75rem; background: var(--background); color: var(--foreground);
	padding: 1rem 1.25rem; box-shadow: var(--shadow-elevated);
}
@media (min-width: 640px) { .founder-section__badge { margin-right: 2.5rem; } }
.founder-section__badge-year { font-family: var(--font-display); font-size: 1.5rem; line-height: 1; }
.founder-section__badge-caption { margin-top: 0.25rem; font-size: 14px; color: color-mix(in srgb, var(--foreground) 60%, transparent); }
.founder-section__story { display: flex; flex-direction: column; justify-content: space-between; gap: 2rem; min-width: 0; }
.founder-section__pill {
	display: inline-flex; align-items: center; border-radius: 999px;
	border: 1px solid color-mix(in srgb, var(--section-accent) 40%, transparent);
	background: color-mix(in srgb, var(--section-accent) 10%, transparent);
	padding: 0.375rem 1rem; font-size: 14px; letter-spacing: 0.24em; text-transform: uppercase; color: color-mix(in srgb, var(--section-fg) 75%, transparent);
}
.founder-section__name { margin-top: 1.5rem; font-size: 2.25rem; line-height: 1.05; }
@media (min-width: 768px) { .founder-section__name { font-size: 3rem; } }
@media (min-width: 1024px) { .founder-section__name { font-size: 3.6rem; } }
.founder-section__role { margin-top: 0.75rem; font-family: var(--font-display); font-size: 1.25rem; color: var(--section-accent); }
@media (min-width: 768px) { .founder-section__role { font-size: 1.5rem; } }
.founder-section__bio { margin-top: 1.5rem; font-size: 15px; line-height: 1.75; color: color-mix(in srgb, var(--section-fg) 75%, transparent); }
@media (min-width: 768px) { .founder-section__bio { font-size: 16px; } }
.founder-section__tags { margin-top: 2rem; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.75rem; }
@media (min-width: 640px) { .founder-section__tags { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.founder-tag { display: flex; align-items: center; gap: 0.75rem; border-radius: 0.75rem; border: 1px solid var(--section-border); background: var(--section-secondary); padding: 0.875rem 1rem; min-width: 0; }
.founder-tag__icon { width: 2.25rem; height: 2.25rem; flex-shrink: 0; border-radius: 999px; background: color-mix(in srgb, var(--section-accent) 15%, transparent); display: inline-flex; align-items: center; justify-content: center; color: var(--section-accent); }
.founder-tag__label { font-size: 14px; color: color-mix(in srgb, var(--section-fg) 80%, transparent); line-height: 1.3; min-width: 0; }
.founder-section__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.founder-section__linkedin { display: inline-flex; align-items: center; gap: 0.75rem; font-size: 14px; letter-spacing: 0.24em; text-transform: uppercase; color: color-mix(in srgb, var(--section-fg) 75%, transparent); }
.founder-section__linkedin:hover { color: var(--section-accent); }
.founder-section__linkedin-icon { width: 2.75rem; height: 2.75rem; border-radius: 999px; border: 1px solid var(--section-border); display: inline-flex; align-items: center; justify-content: center; }

/* ==========================================================================
   14. Waitlist
   ========================================================================== */
.waitlist-section { position: relative; padding: 7rem 0; overflow: hidden; background-size: cover; background-position: center; }
@media (min-width: 768px) { .waitlist-section { padding: 10rem 0; } }
.waitlist-section__scrim { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(135deg, rgba(4,20,13,0.7) 0%, rgba(10,26,17,0.52) 45%, rgba(25,19,16,0.72) 100%); }
.waitlist-section__dots { position: absolute; inset: 0; pointer-events: none; opacity: 0.1; background-image: radial-gradient(rgba(248,245,241,0.8) 1px, transparent 1px); background-size: 26px 26px; }
.waitlist-section__grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem; align-items: center; min-height: 32rem; }
@media (min-width: 1024px) { .waitlist-section__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 4rem; } }
.waitlist-section__title { color: #fff; line-height: 1.05; font-family: var(--font-display); font-size: 2.25rem; }
@media (min-width: 768px) { .waitlist-section__title { font-size: 3rem; } }
@media (min-width: 1024px) { .waitlist-section__title { font-size: 3.4rem; } }
.waitlist-section__body { margin-top: 1.5rem; font-size: 15px; line-height: 1.75; color: rgba(255,255,255,0.85); max-width: 28rem; }
@media (min-width: 768px) { .waitlist-section__body { font-size: 16px; } }
.waitlist-section__quote { margin-top: 1.5rem; font-family: var(--font-display); font-size: 1.125rem; color: rgba(255,255,255,0.9); max-width: 28rem; }
.waitlist-section__form-wrap { display: flex; justify-content: center; min-width: 0; width: 100%; }
@media (min-width: 1024px) { .waitlist-section__form-wrap { justify-content: flex-end; } }

.glass-card { background: rgba(255,255,255,0.06); backdrop-filter: blur(18px) saturate(140%); border: 1px solid rgba(255,255,255,0.18); box-shadow: 0 20px 60px -20px rgba(0,0,0,0.55); }
.waitlist-form { width: 100%; max-width: 28rem; min-width: 0; box-sizing: border-box; border-radius: 1rem; padding: 1.75rem; }
@media (min-width: 768px) { .waitlist-form { padding: 2.25rem; } }
.waitlist-form__title { color: #fff; font-family: var(--font-display); font-size: 1.5rem; line-height: 1.2; margin-bottom: 1.5rem; }
@media (min-width: 768px) { .waitlist-form__title { font-size: 1.75rem; } }
.waitlist-form__label { display: block; font-size: 14px; letter-spacing: 0.28em; text-transform: uppercase; color: rgba(255,255,255,0.65); margin-bottom: 0.5rem; }
.waitlist-form__field { position: relative; margin-bottom: 1rem; }
.waitlist-form__field-icon { position: absolute; left: 1rem; top: 50%; transform: translateY(-50%); color: rgba(255,255,255,0.6); }
.glass-input { background: rgba(255,255,255,0.08); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.22); color: #fff; }
.glass-input::placeholder { color: rgba(255,255,255,0.55); }
.glass-input:focus { border-color: rgba(255,255,255,0.55); outline: none; }
.waitlist-form__input { width: 100%; height: 3rem; padding: 0 1rem 0 2.75rem; border-radius: 0.375rem; font-size: 15px; }
.glass-button { background: rgba(255,255,255,0.92); color: #0a0a0a; backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.6); }
.glass-button:hover { background: #fff; }
.waitlist-form__submit { width: 100%; height: 3rem; border-radius: 0.375rem; font-size: 14px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; }
.waitlist-form__success-icon { display: none; }
.waitlist-form.is-success .waitlist-form__submit-icon { display: none; }
.waitlist-form.is-success .waitlist-form__success-icon { display: inline-flex; }
.waitlist-form__footnote { margin-top: 1.25rem; font-size: 14px; letter-spacing: 0.02em; color: rgba(255,255,255,0.55); text-align: center; }

/* ==========================================================================
   15. FAQ
   ========================================================================== */
.faq-section { padding: 6rem 0; overflow-x: clip; }
@media (min-width: 768px) { .faq-section { padding: 8rem 0; } }
.faq-section__intro { max-width: 42rem; margin: 0 auto; text-align: center; }
.faq-section__subtitle { margin-top: 1rem; font-size: 15px; color: var(--section-muted-fg); line-height: 1.6; }
.faq-section__list { margin: 3rem auto 0; max-width: 48rem; display: flex; flex-direction: column; gap: 0.75rem; }
.faq-item { border-radius: 0.75rem; border: 1px solid var(--section-border); background: color-mix(in srgb, var(--section-secondary) 60%, transparent); transition: border-color 300ms ease, background-color 300ms ease; }
.faq-item.is-open { border-color: color-mix(in srgb, var(--section-accent) 40%, transparent); background: var(--section-secondary); }
.faq-item__question { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; text-align: left; padding: 1.25rem 1.5rem; }
.faq-item__question span:first-child { font-family: var(--font-display); font-size: 1.125rem; line-height: 1.3; min-width: 0; overflow-wrap: break-word; }
@media (min-width: 768px) { .faq-item__question span:first-child { font-size: 1.25rem; } }
.faq-item__chevron { flex-shrink: 0; color: var(--section-muted-fg); transition: transform 300ms ease; }
.faq-item.is-open .faq-item__chevron { transform: rotate(180deg); }
.faq-item__answer-wrap { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows 500ms ease-out, opacity 500ms ease-out; }
.faq-item.is-open .faq-item__answer-wrap { grid-template-rows: 1fr; opacity: 1; }
.faq-item__answer-inner { overflow: hidden; }
.faq-item__answer { padding: 0 1.5rem 1.5rem; font-size: 15px; line-height: 1.75; color: var(--section-muted-fg); }

/* ==========================================================================
   16. Pre-contact CTA band
   ========================================================================== */
.precontact-section {
	position: relative;
	overflow: hidden;
	overflow-x: clip;
	max-width: 100%;
	background: var(--foreground);
	color: var(--background);
	display: grid;
}
.precontact-section__video {
	grid-area: 1 / 1;
	width: 100%;
	height: auto;
	min-height: 100%;
	object-fit: cover;
	object-position: center;
	pointer-events: none;
}
.precontact-section__scrim {
	grid-area: 1 / 1;
	width: 100%;
	min-height: 100%;
	background: color-mix(in srgb, hsl(24 24% 8%) 60%, transparent);
	pointer-events: none;
}
.precontact-section__dots {
	grid-area: 1 / 1;
	width: 100%;
	min-height: 100%;
	pointer-events: none;
	opacity: 0.08;
	background-image: radial-gradient(color-mix(in srgb, hsl(34 32% 95%) 60%, transparent) 1px, transparent 1px);
	background-size: 22px 22px;
}
.precontact-section__content {
	grid-area: 1 / 1;
	position: relative;
	z-index: 10;
	width: 100%;
	padding-top: 6rem;
	padding-bottom: 6rem;
	padding-left: max(1.5rem, env(safe-area-inset-left, 0px));
	padding-right: max(1.5rem, env(safe-area-inset-right, 0px));
	text-align: center;
	align-self: center;
	justify-self: stretch;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
	box-sizing: border-box;
}
@media (min-width: 640px) {
	.precontact-section__content {
		padding-left: 1.5rem;
		padding-right: 1.5rem;
	}
}
@media (min-width: 768px) {
	.precontact-section__content {
		padding-top: 9rem;
		padding-bottom: 9rem;
	}
}
@media (min-width: 1024px) {
	.precontact-section__content {
		padding-left: 4rem;
		padding-right: 4rem;
	}
}
.precontact-section__eyebrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	font-size: 14px;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.85);
	margin-bottom: 1.5rem;
	font-weight: 500;
}
.precontact-section__rule {
	height: 1px;
	width: 2rem;
	background: rgba(255, 255, 255, 0.5);
	flex-shrink: 0;
}
.precontact-section__title {
	font-family: var(--font-display);
	color: #fff;
	line-height: 1.05;
	letter-spacing: -0.025em;
	margin: 0 auto;
	max-width: 56rem;
	font-size: clamp(2rem, 5.6vw, 4.2rem);
}
.precontact-section__body {
	margin-top: 1.75rem;
	max-width: 36rem;
	margin-left: auto;
	margin-right: auto;
	font-size: 15px;
	color: rgba(255, 255, 255, 0.85);
	line-height: 1.625;
}
.precontact-section__actions { margin-top: 2.5rem; text-shadow: none; }

/* ==========================================================================
   17. Contact
   ========================================================================== */
.contact-section { padding-top: 6rem; padding-bottom: 4rem; overflow-x: clip; }
@media (min-width: 768px) { .contact-section { padding-top: 8rem; padding-bottom: 5rem; } }
.contact-section__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3rem; align-items: stretch; }
@media (min-width: 1024px) { .contact-section__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 5rem; } }
.contact-section__left { display: flex; flex-direction: column; height: 100%; min-width: 0; }
.contact-section__title { font-size: 2.25rem; }
.contact-section__subtitle { margin-top: 1.5rem; font-size: 15px; color: var(--section-muted-fg); line-height: 1.6; max-width: 28rem; }
.contact-section__touchpoints { margin-top: 2.5rem; display: flex; flex-direction: column; gap: 1.25rem; }
.contact-touchpoint { display: inline-flex; align-items: center; gap: 1rem; color: var(--section-fg); }
.contact-touchpoint:hover { color: var(--section-accent); }
.contact-touchpoint__icon { width: 2.75rem; height: 2.75rem; border-radius: 999px; background: var(--section-secondary); border: 1px solid var(--section-border); display: inline-flex; align-items: center; justify-content: center; }
.contact-touchpoint:hover .contact-touchpoint__icon { border-color: var(--section-accent); }
.contact-touchpoint__text { display: flex; flex-direction: column; text-align: left; }
.contact-touchpoint__label { font-size: 14px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--section-muted-fg); }
.contact-touchpoint__value { font-size: 15px; font-weight: 500; }
.contact-section__quote-card {
	position: relative;
	margin-top: 2.5rem;
	border-radius: 1rem;
	border: 1px solid var(--section-border);
	background: var(--section-secondary);
	padding: 2.5rem 1.5rem;
	text-align: center;
	overflow: hidden;
}
@media (min-width: 1024px) {
	.contact-section__quote-card { margin-top: auto; }
}
@media (min-width: 768px) { .contact-section__quote-card { padding: 3rem 2.5rem; } }
.contact-section__quote-mark { position: absolute; top: 0.75rem; left: 1.25rem; font-family: var(--font-display); font-style: italic; line-height: 1; color: color-mix(in srgb, var(--section-primary) 25%, transparent); font-size: 5rem; user-select: none; }
.contact-section__quote-rule { margin: 0 auto 1.25rem; display: block; height: 1px; width: 2.5rem; background: color-mix(in srgb, var(--section-primary) 40%, transparent); }
.contact-section__quote-card blockquote { font-family: var(--font-display); color: color-mix(in srgb, var(--section-fg) 90%, transparent); line-height: 1.35; font-size: 1.125rem; max-width: 28rem; margin: 0 auto; }
@media (min-width: 768px) { .contact-section__quote-card blockquote { font-size: 1.5rem; } }
.contact-section__quote-card figcaption { margin-top: 1.5rem; font-size: 14px; letter-spacing: 0.32em; text-transform: uppercase; color: var(--section-muted-fg); font-weight: 500; }

.contact-form { background: var(--section-secondary); border: 1px solid var(--section-border); border-radius: 1rem; padding: 1.5rem; display: flex; flex-direction: column; height: 100%; box-shadow: var(--shadow-soft); gap: 1rem; min-width: 0; max-width: 100%; box-sizing: border-box; }
@media (min-width: 768px) { .contact-form { padding: 2rem; } }
.contact-form__fields { flex: 1; display: flex; flex-direction: column; gap: 1rem; }
.contact-form__row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; }
@media (min-width: 640px) { .contact-form__row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.contact-form__field label { display: block; font-size: 14px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--section-muted-fg); margin-bottom: 0.5rem; }
.contact-form__field input,
.contact-form__field select,
.contact-form__field textarea {
	width: 100%; height: 3rem; padding: 0 1rem;
	background: var(--background); border: 1px solid var(--border);
	border-radius: 0.375rem; font-size: 15px; color: var(--foreground);
}
.contact-form__field textarea { height: auto; padding-top: 0.75rem; resize: none; }
.contact-form__field input::placeholder, .contact-form__field textarea::placeholder { color: color-mix(in srgb, var(--foreground) 45%, transparent); }
.contact-form__field input:focus, .contact-form__field select:focus, .contact-form__field textarea:focus { outline: none; border-color: var(--accent); }
.contact-form__select-wrap { position: relative; }
.contact-form__select-wrap select { appearance: none; padding-right: 2.5rem; }
.contact-form__select-icon { position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--section-muted-fg); }
.contact-form__actions { display: flex; flex-direction: column; gap: 0.75rem; padding-top: 0.5rem; }
.contact-form__submit { width: 100%; }
.contact-form__footnote { font-size: 14px; text-align: center; color: var(--section-muted-fg); }

/* ==========================================================================
   18. Footer
   ========================================================================== */
.site-footer { border-top: 1px solid var(--dark-border); }
.site-footer__inner {
	padding-top: 3.5rem;
	padding-bottom: 3.5rem;
}
@media (min-width: 1024px) {
	.site-footer__inner {
		padding-top: 5rem;
		padding-bottom: 5rem;
	}
}
.site-footer__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.5rem; }
@media (min-width: 640px) { .site-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .site-footer__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3rem; } }
.site-branding--footer { display: inline-flex; flex-shrink: 0; }
.site-logo-img--footer {
	height: var(--footer-logo-height, 3.05rem) !important;
	width: var(--footer-logo-width, 220px) !important;
}
.site-logo-text--footer { color: #fff; font-family: var(--font-display); font-style: italic; font-size: 1.5rem; }
.site-footer__tagline { margin-top: 1rem; font-size: 13px; color: rgba(248,245,241,0.65); line-height: 1.6; max-width: 20rem; }
.site-footer__quote { margin-top: 1rem; font-size: 13px; font-family: var(--font-display); font-style: italic; color: rgba(248,245,241,0.7); line-height: 1.6; max-width: 20rem; }
.site-footer__heading { font-family: var(--font-display); font-style: italic; font-size: 1.125rem; color: var(--dark-foreground); margin-bottom: 1rem; }
.theme-footer-nav-list, .theme-footer-collection-list, .theme-footer-contact-list { display: flex; flex-direction: column; gap: 0.625rem; }
.theme-footer-nav-link, .theme-footer-collection-link { font-size: 13px; color: rgba(248,245,241,0.65); }
.theme-footer-nav-link:hover, .theme-footer-collection-link:hover { color: var(--dark-foreground); }
.theme-footer-collection-note { font-size: 13px; color: rgba(248,245,241,0.5); padding-top: 0.25rem; }
.theme-footer-contact-link { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 13px; color: rgba(248,245,241,0.75); }
.theme-footer-contact-link:hover { color: var(--dark-foreground); }
.site-footer__bottom { margin-top: 3.5rem; padding-top: 1.5rem; border-top: 1px solid var(--dark-border); display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; align-items: center; text-align: center; }
@media (min-width: 640px) { .site-footer__bottom { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.site-footer__copyright { font-size: 13px; color: rgba(248,245,241,0.6); }
@media (min-width: 640px) { .site-footer__copyright { text-align: left; } }
.site-footer__totop { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 13px; color: rgba(248,245,241,0.7); justify-self: center; }
.site-footer__totop:hover { color: var(--dark-foreground); }
.site-footer__totop-icon { width: 2rem; height: 2rem; border-radius: 999px; border: 1px solid var(--dark-border); display: inline-flex; align-items: center; justify-content: center; }
.site-footer__totop:hover .site-footer__totop-icon { border-color: var(--dark-foreground); }
.site-footer__credit { font-size: 13px; color: rgba(248,245,241,0.6); }
@media (min-width: 640px) { .site-footer__credit { text-align: right; } }
.site-footer__credit a { text-decoration: underline; text-underline-offset: 4px; }
.site-footer__credit a:hover { color: var(--dark-foreground); }

/* ==========================================================================
   19. Side cart drawer
   ========================================================================== */
#theme-cart-overlay {
	position: fixed; inset: 0; z-index: 90;
	background: color-mix(in srgb, var(--foreground) 30%, transparent);
	opacity: 0; visibility: hidden;
	transition: opacity 300ms ease;
}
body.cart-open #theme-cart-overlay { opacity: 1; visibility: visible; }

#theme-cart-drawer {
	position: fixed; top: 0; right: 0; height: 100%; width: 100%; max-width: 28rem;
	background: var(--background); z-index: 91;
	box-shadow: var(--shadow-elevated);
	display: flex; flex-direction: column;
	transform: translateX(100%);
	transition: transform 400ms cubic-bezier(0.22, 1, 0.36, 1);
}
body.cart-open { overflow-x: clip; }
body.cart-open #theme-cart-drawer { transform: translateX(0); }
#theme-cart-drawer.is-updating { opacity: 0.6; pointer-events: none; }

.theme-cart-drawer__header { display: flex; align-items: center; justify-content: space-between; padding: 1.5rem; border-bottom: 1px solid var(--border); }
.theme-cart-drawer__title { font-family: var(--font-display); font-size: 1.5rem; }
.theme-cart-drawer__close { padding: 0.375rem; border-radius: 999px; }
.theme-cart-drawer__close:hover { background: color-mix(in srgb, var(--foreground) 6%, transparent); }
.theme-cart-drawer__empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1.5rem; text-align: center; }
.theme-cart-drawer__empty-icon { color: color-mix(in srgb, var(--foreground) 30%, transparent); margin-bottom: 1rem; }
.theme-cart-drawer__empty-text { color: color-mix(in srgb, var(--foreground) 65%, transparent); margin-bottom: 1.5rem; font-size: 15px; }
.theme-cart-drawer__items { flex: 1; overflow: auto; padding: 1.5rem; display: flex; flex-direction: column; gap: 1.25rem; }
.theme-cart-item { display: flex; gap: 1rem; }
.theme-cart-item__image { width: 5rem; height: 6rem; flex-shrink: 0; border-radius: 0.375rem; overflow: hidden; background: var(--bone); display: block; }
.theme-cart-item__image img { width: 100%; height: 100%; object-fit: cover; }
.theme-cart-item__info { flex: 1; min-width: 0; text-align: left; }
.theme-cart-item__name { display: block; font-size: 15px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.theme-cart-item__name:hover { color: var(--primary); }
.theme-cart-item__price { font-size: 15px; color: color-mix(in srgb, var(--foreground) 60%, transparent); margin-top: 0.125rem; }
.theme-cart-item__variation {
	font-size: 13px;
	color: color-mix(in srgb, var(--foreground) 55%, transparent);
	margin-top: 0.25rem;
	text-align: left;
	width: 100%;
}
.theme-cart-item__variation dl.variation {
	margin: 0;
	padding: 0;
	text-align: left;
	width: 100%;
}
.theme-cart-item__variation dl.variation dt,
.theme-cart-item__variation dl.variation dd {
	display: inline;
	margin: 0;
	padding: 0;
	float: none;
	clear: none;
	text-align: left;
	vertical-align: baseline;
}
.theme-cart-item__variation dl.variation dd p {
	margin: 0;
	display: inline;
}
.theme-cart-item__controls { display: flex; align-items: center; gap: 0.75rem; margin-top: 0.75rem; }
.theme-cart-item__qty-btn { padding: 0.25rem; border-radius: 0.25rem; }
.theme-cart-item__qty-btn:hover { background: var(--bone); }
.theme-cart-item__qty { font-size: 15px; width: 1.5rem; text-align: center; }
.theme-cart-item__remove { margin-left: auto; font-size: 15px; color: color-mix(in srgb, var(--foreground) 55%, transparent); }
.theme-cart-item__remove:hover { color: var(--destructive, #b3392b); }
.theme-cart-drawer__footer { padding: 1.5rem; border-top: 1px solid var(--border); background: color-mix(in srgb, var(--linen) 40%, transparent); display: flex; flex-direction: column; gap: 1rem; }
.theme-cart-drawer__subtotal { display: flex; justify-content: space-between; font-size: 15px; }
.theme-cart-drawer__subtotal span:last-child { font-weight: 500; }
.theme-cart-drawer__note { font-size: 15px; color: color-mix(in srgb, var(--foreground) 55%, transparent); }
.theme-cart-drawer__checkout { width: 100%; }
.theme-cart-drawer__empty-btn { width: 100%; justify-content: center; padding: 0.5rem; }

/* ==========================================================================
   20. Single product (Lovable ProductDetail parity)
   ========================================================================== */
.single-product.site-main {
	background-color: var(--background);
	padding-top: 6rem;
	padding-bottom: 0;
}
@media (min-width: 1024px) {
	.single-product.site-main { padding-top: 7rem; }
}

.single-product__breadcrumb {
	padding: 1.5rem 0;
	font-size: 15px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--foreground) 55%, transparent);
}
.single-product__breadcrumb a:hover { color: var(--primary); }
.single-product__breadcrumb-sep { margin: 0 0.5rem; opacity: 0.5; }
.single-product__breadcrumb-current { color: var(--foreground); }

.single-product__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.5rem;
	padding-bottom: 5rem;
	align-items: start;
	min-width: 0;
}
@media (min-width: 1024px) {
	.single-product__grid {
		grid-template-columns: 7fr 5fr;
		gap: 4rem;
	}
}
.theme-product-gallery, .theme-product-info { min-width: 0; max-width: 100%; }
.single-product__gallery { position: sticky; top: 7rem; align-self: start; }
@media (max-width: 1023px) { .single-product__gallery { position: static; } }
.single-product__main-image-wrap {
	position: relative;
	aspect-ratio: 1 / 1;
	width: 100%;
	background: var(--linen);
	border-radius: 0.75rem;
	overflow: hidden;
	margin-bottom: 1rem;
}
.single-product__main-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.theme-product-thumbnails { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0.625rem; max-width: 100%; }
.single-product__thumb {
	aspect-ratio: 1 / 1;
	background: var(--linen);
	border-radius: 0.375rem;
	overflow: hidden;
	border: 2px solid transparent;
	position: relative;
	padding: 0;
}
.single-product__thumb.is-active { border-color: var(--primary); }
.single-product__thumb:not(.is-active):hover { border-color: color-mix(in srgb, var(--foreground) 20%, transparent); }
.single-product__thumb img { width: 100%; height: 100%; object-fit: cover; }

.single-product__category {
	font-size: 15px;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--primary);
	font-weight: 500;
	margin-bottom: 0.75rem;
}
.single-product__title,
.single-product .product-title.single-product__title {
	font-family: var(--font-display);
	font-weight: 400;
	font-size: 1.875rem;
	line-height: 1.05;
	margin-bottom: 1rem;
	color: var(--foreground);
}
@media (min-width: 768px) {
	.single-product__title,
	.single-product .product-title.single-product__title { font-size: 2.25rem; }
}
@media (min-width: 1024px) {
	.single-product__title,
	.single-product .product-title.single-product__title { font-size: 2.6rem; }
}
.single-product__price {
	font-size: 20px;
	font-weight: 500;
	color: color-mix(in srgb, var(--foreground) 90%, transparent);
	margin-bottom: 1.75rem;
}
.single-product__description {
	font-size: 15px;
	line-height: 1.625;
	color: color-mix(in srgb, var(--foreground) 75%, transparent);
	margin-bottom: 2rem;
	overflow-wrap: break-word;
	word-break: break-word;
}
.single-product__description p { margin-bottom: 1em; }
.single-product__description p:last-child { margin-bottom: 0; }

.single-product__sizes-label,
.single-product__quantity-label {
	font-size: 14px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--foreground) 55%, transparent);
	margin-bottom: 0.625rem;
}
.single-product__details-label {
	font-size: 15px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--foreground) 55%, transparent);
	margin-bottom: 1rem;
}
.single-product__sizes { margin-bottom: 1.5rem; }
.single-product__sizes-list { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.single-product__size-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 48px;
	height: 2.5rem;
	padding: 0 0.875rem;
	border-radius: 999px;
	border: 1px solid color-mix(in srgb, var(--foreground) 18%, transparent);
	background: color-mix(in srgb, var(--secondary) 45%, transparent);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.04em;
	color: color-mix(in srgb, var(--foreground) 78%, transparent);
	box-shadow: inset 0 1px 0 color-mix(in srgb, white 35%, transparent);
}

.single-product__quantity-row { margin-bottom: 1.5rem; }
.single-product__purchase .single-product__quantity-row { margin-bottom: 1.5rem; }
.theme-quantity-wrapper {
	display: inline-flex;
	align-items: center;
	border: 1px solid color-mix(in srgb, var(--foreground) 20%, transparent);
	border-radius: 999px;
}
.theme-qty-minus,
.theme-qty-plus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.625rem 1rem;
	background: none;
	border: none;
	color: inherit;
	line-height: 1;
}
.theme-qty-minus:hover,
.theme-qty-plus:hover { color: var(--accent); }
.theme-qty-input {
	width: auto;
	min-width: 2.75rem;
	text-align: center;
	padding: 0.625rem 1rem;
	font-size: 15px;
	font-weight: 500;
	background: transparent;
	border: none;
	-moz-appearance: textfield;
	color: var(--foreground);
}
.theme-qty-input::-webkit-outer-spin-button,
.theme-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Actions: flex-col mobile, row sm+ — matches Lovable Button size="lg" row */
.theme-add-to-cart-area.single-product__actions {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0.75rem;
	margin-bottom: 0;
}
@media (min-width: 640px) {
	.theme-add-to-cart-area.single-product__actions { flex-direction: row; }
}
.theme-add-to-cart-area .single_add_to_cart_button,
.theme-add-to-cart-area .theme-buy-now-button {
	flex: 1 1 0%;
	width: 100%;
	min-width: 0;
	height: 3rem !important;
	min-height: 3rem !important;
	padding: 0 1.75rem !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	line-height: 1.2 !important;
	border-radius: 999px !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	text-transform: none !important;
	white-space: nowrap;
}
.single-product .theme-add-to-cart-area .single_add_to_cart_button {
	background-color: var(--primary) !important;
	color: var(--primary-foreground) !important;
	border: 1px solid var(--primary) !important;
}
.single-product .theme-add-to-cart-area .single_add_to_cart_button:hover {
	opacity: 0.9;
	background-color: var(--primary) !important;
	color: var(--primary-foreground) !important;
}
.single-product .theme-add-to-cart-area .theme-buy-now-button {
	background-color: transparent !important;
	color: var(--foreground) !important;
	border: 1px solid color-mix(in srgb, var(--foreground) 25%, transparent) !important;
}
.single-product .theme-add-to-cart-area .theme-buy-now-button:hover {
	border-color: var(--primary) !important;
	color: var(--primary) !important;
	background-color: transparent !important;
	opacity: 1;
}

.single-product__preorder-note {
	font-size: 14px;
	line-height: 1.625;
	color: color-mix(in srgb, var(--foreground) 60%, transparent);
	margin-top: 1rem;
	margin-bottom: 0;
}

.single-product__details { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); }
.single-product__details-list ul { display: flex; flex-direction: column; gap: 0.625rem; }
.single-product__details-list li { font-size: 15px; color: color-mix(in srgb, var(--foreground) 75%, transparent); display: flex; align-items: flex-start; overflow-wrap: break-word; word-break: break-word; }
.single-product__details-list li::before { content: ''; width: 4px; height: 4px; background: var(--primary); border-radius: 999px; margin-top: 0.55rem; margin-right: 0.75rem; flex-shrink: 0; }

.single-product__features { margin-top: 2rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.75rem; padding-top: 1.5rem; border-top: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); }
.single-product__feature { text-align: center; }
.single-product__feature svg { margin: 0 auto 0.5rem; color: var(--primary); }
.single-product__feature p { font-size: 14px; letter-spacing: 0.15em; text-transform: uppercase; color: color-mix(in srgb, var(--foreground) 60%, transparent); }

.single-product__related { padding: 5rem 0; border-top: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent); }
.single-product__related-header { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 2.5rem; gap: 1rem; }
.single-product__related-heading {
	font-family: var(--font-display);
	font-weight: 400;
	font-size: 1.875rem;
	color: var(--foreground);
}
@media (min-width: 768px) { .single-product__related-heading { font-size: 2.25rem; } }
.single-product__related-viewall { display: none; align-items: center; gap: 0.375rem; font-size: 15px; font-weight: 500; color: color-mix(in srgb, var(--foreground) 70%, transparent); }
.single-product__related-viewall:hover { color: var(--accent); }
@media (min-width: 640px) { .single-product__related-viewall { display: inline-flex; } }
.single-product__related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 1024px) { .single-product__related-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* Variation attributes / swatches — Section 11.5.1 */
.single-product .variations {
	margin: 0 0 1.5rem;
	border: none;
	width: 100%;
	border-collapse: collapse;
}
.single-product .variations.shop_attributes tbody,
.single-product .variations tbody tr,
.single-product .variations tbody td { display: block; width: 100%; }
.single-product .variations tbody tr { margin-bottom: 1.25rem; }
.single-product .variations tbody tr:last-child { margin-bottom: 0; }
.single-product .variations tbody td.label { padding: 0; padding-bottom: 0; }
.single-product .variations tbody td.value { padding: 0; padding-top: 0; }

.single-product .variations tbody td.label label {
	display: block;
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--foreground) 55%, transparent);
	margin-bottom: 0.625rem;
}

/* Native select fallback — pill dropdown when swatch buttons are not rendered */
.single-product .variations td.value:not(:has(.theme-attr-swatches)) {
	position: relative;
}
.single-product .variations td.value:not(:has(.theme-attr-swatches))::after {
	content: '';
	position: absolute;
	right: 1.125rem;
	top: 50%;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 5px solid color-mix(in srgb, var(--foreground) 45%, transparent);
	pointer-events: none;
}
.single-product .variations select {
	appearance: none;
	width: 100%;
	min-height: 2.5rem;
	padding: 0.625rem 2.75rem 0.625rem 1rem;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.02em;
	color: color-mix(in srgb, var(--foreground) 85%, transparent);
	background-color: color-mix(in srgb, var(--secondary) 40%, transparent);
	border: 1px solid color-mix(in srgb, var(--foreground) 18%, transparent);
	border-radius: 999px;
	cursor: pointer;
	box-shadow: inset 0 1px 0 color-mix(in srgb, white 35%, transparent);
	transition: border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.single-product .variations select:hover {
	border-color: color-mix(in srgb, var(--foreground) 32%, transparent);
	color: var(--foreground);
}
.single-product .variations select:focus {
	outline: none;
	border-color: var(--accent);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 18%, transparent);
}

.theme-attr-select-hidden { display: none !important; }

/* Attribute swatch buttons — pill / color chips */
.theme-attr-swatches {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
}
.theme-attr-swatch {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 48px;
	min-height: 2.5rem;
	padding: 0 0.875rem;
	margin: 0;
	border-radius: 999px;
	border: 1px solid color-mix(in srgb, var(--foreground) 18%, transparent);
	background: color-mix(in srgb, var(--secondary) 40%, transparent);
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.04em;
	line-height: 1.2;
	color: color-mix(in srgb, var(--foreground) 78%, transparent);
	cursor: pointer;
	box-shadow: inset 0 1px 0 color-mix(in srgb, white 35%, transparent);
	transition:
		border-color 0.15s ease,
		color 0.15s ease,
		background-color 0.15s ease,
		transform 0.15s ease,
		box-shadow 0.15s ease;
}
.theme-attr-swatch:hover:not(.is-disabled):not(:disabled):not(.is-selected) {
	border-color: color-mix(in srgb, var(--foreground) 32%, transparent);
	color: var(--foreground);
	transform: translateY(-1px);
	box-shadow: var(--shadow-soft);
}
.theme-attr-swatch:focus-visible {
	outline: none;
	border-color: var(--accent);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 18%, transparent);
}
.theme-attr-swatch.is-selected,
.theme-attr-swatch[aria-pressed="true"] {
	border-color: var(--primary);
	background-color: var(--primary);
	color: var(--primary-foreground);
	box-shadow: none;
	transform: none;
}
.theme-attr-swatch.is-disabled,
.theme-attr-swatch:disabled {
	opacity: 0.38;
	cursor: not-allowed;
	pointer-events: none;
	filter: grayscale(0.15);
}

/* Color attribute chips */
.theme-attr-swatch--color,
.theme-attr-swatch[data-attribute-type="color"] {
	min-width: 2.5rem;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	border-radius: 999px;
	border-width: 2px;
	border-color: color-mix(in srgb, var(--foreground) 14%, transparent);
	box-shadow: inset 0 1px 0 color-mix(in srgb, white 25%, transparent);
}
.theme-attr-swatch--color.is-selected,
.theme-attr-swatch--color[aria-pressed="true"],
.theme-attr-swatch[data-attribute-type="color"].is-selected,
.theme-attr-swatch[data-attribute-type="color"][aria-pressed="true"] {
	border-color: var(--primary);
	box-shadow:
		0 0 0 2px var(--background),
		0 0 0 3px var(--primary);
	background-color: var(--swatch-color, var(--secondary));
	color: transparent;
}
.theme-attr-swatch--color .theme-attr-swatch__label,
.theme-attr-swatch[data-attribute-type="color"] .theme-attr-swatch__label {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* WooCommerce variation swatches plugins (visual-only compatibility) */
.single-product .variable-items-wrapper,
.single-product ul.variable-items-wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.single-product .variable-items-wrapper .variable-item,
.single-product ul.variable-items-wrapper .variable-item {
	margin: 0;
}
.single-product .variable-items-wrapper .variable-item .variable-item-span,
.single-product .variable-items-wrapper .variable-item .variable-item-span-color,
.single-product .variable-items-wrapper .variable-item .variable-item-span-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 48px;
	min-height: 2.5rem;
	padding: 0 0.875rem;
	border-radius: 999px;
	border: 1px solid color-mix(in srgb, var(--foreground) 18%, transparent);
	background: color-mix(in srgb, var(--secondary) 40%, transparent);
	font-family: var(--font-body);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.04em;
	color: color-mix(in srgb, var(--foreground) 78%, transparent);
	box-shadow: inset 0 1px 0 color-mix(in srgb, white 35%, transparent);
	transition:
		border-color 0.15s ease,
		color 0.15s ease,
		background-color 0.15s ease,
		transform 0.15s ease,
		box-shadow 0.15s ease;
}
.single-product .variable-items-wrapper .variable-item .variable-item-span-color {
	min-width: 2.5rem;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	border-radius: 999px;
	border-width: 2px;
}
.single-product .variable-items-wrapper .variable-item.selected .variable-item-span,
.single-product .variable-items-wrapper .variable-item.selected .variable-item-span-color,
.single-product .variable-items-wrapper .variable-item.selected .variable-item-span-button {
	border-color: var(--primary);
	background-color: var(--primary);
	color: var(--primary-foreground);
	box-shadow: none;
	transform: none;
}
.single-product .variable-items-wrapper .variable-item:not(.selected) .variable-item-span:hover,
.single-product .variable-items-wrapper .variable-item:not(.selected) .variable-item-span-button:hover {
	border-color: color-mix(in srgb, var(--foreground) 32%, transparent);
	color: var(--foreground);
	transform: translateY(-1px);
	box-shadow: var(--shadow-soft);
}
.single-product .variable-items-wrapper .variable-item.selected .variable-item-span-color {
	background-color: inherit;
	color: transparent;
	box-shadow:
		0 0 0 2px var(--background),
		0 0 0 3px var(--primary);
}

/* ==========================================================================
   21. WooCommerce archive
   ========================================================================== */
.woocommerce-archive .site-main { padding-top: 7rem; padding-bottom: 5rem; }
.woocommerce-archive__header { margin-bottom: 2rem; }
.woocommerce-archive__title { font-size: 2.5rem; }
.woocommerce-archive__empty { text-align: center; padding: 4rem 0; color: color-mix(in srgb, var(--foreground) 55%, transparent); }

/* WooCommerce notices — scoped hiding only where the drawer already provides feedback (Section 14.1) */
.single-product .woocommerce-message,
.single-product .woocommerce-info,
#theme-cart-drawer .woocommerce-message { display: none; }
.woocommerce-message, .woocommerce-info, .woocommerce-error {
	border-radius: 0.5rem; padding: 1rem 1.5rem; font-size: 15px; font-family: var(--font-body);
	background: var(--secondary); border: 1px solid var(--border); list-style: none; margin-bottom: 1.5rem;
}
.woocommerce-error { border-color: color-mix(in srgb, var(--destructive, #b3392b) 40%, transparent); }

/* ==========================================================================
   22. Checkout (WooCommerce Blocks) — Section 13
   ========================================================================== */
body.woocommerce-checkout .site-main,
body.woocommerce-cart .site-main,
body.woocommerce-account .site-main,
body.theme-thankyou-page .site-main {
	padding-top: var(--header-height, 80px);
	padding-bottom: 4rem;
}
body.woocommerce-checkout .theme-page-content,
body.woocommerce-cart .theme-page-content,
body.woocommerce-account .theme-page-content {
	max-width: 84rem;
}
body.woocommerce-checkout .page-title,
body.woocommerce-cart .page-title,
body.woocommerce-account .page-title {
	font-size: 2.5rem;
	margin-bottom: 2rem;
}

body.woocommerce-checkout .wc-block-checkout { display: block; }

@media (min-width: 768px) {
	body.woocommerce-checkout .wc-block-components-sidebar-layout.wc-block-checkout.is-large {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: var(--checkout-gap, 2rem);
		align-items: start;
	}
}

body.woocommerce-checkout .wc-block-checkout__main,
body.woocommerce-checkout .wc-block-checkout__sidebar {
	min-width: 0;
	width: 100%;
	max-width: none;
}

body.woocommerce-checkout .wc-block-components-text-input input,
body.woocommerce-checkout .wc-block-components-select select,
body.woocommerce-checkout .wc-block-components-textarea textarea {
	width: 100% !important;
	max-width: none !important;
	border-radius: 0.375rem;
	border-color: var(--border);
	font-family: var(--font-body);
	color: var(--foreground);
	padding: revert;
}
body.woocommerce-checkout .wc-block-components-text-input input:focus,
body.woocommerce-checkout .wc-block-components-select select:focus,
body.woocommerce-checkout .wc-block-components-textarea textarea:focus {
	border-color: var(--accent);
}
body.woocommerce-checkout .wc-block-components-text-input input::placeholder {
	color: color-mix(in srgb, var(--foreground) 45%, transparent);
}

body.woocommerce-checkout .wc-block-components-checkout-place-order-button {
	background-color: var(--primary) !important;
	color: var(--primary-foreground) !important;
	border-radius: var(--btn-radius) !important;
	text-transform: none !important;
	font-family: var(--font-body) !important;
}
body.woocommerce-checkout .wc-block-components-checkout-place-order-button:hover {
	opacity: 0.9;
}

body.woocommerce-checkout .wc-block-components-notice-banner {
	border-radius: 0.5rem;
	font-family: var(--font-body);
}

body.woocommerce-checkout .wc-block-checkout__sidebar,
body.woocommerce-cart .wc-block-cart__totals-title,
body.woocommerce-checkout .wc-block-cart-items {
	background-color: var(--secondary);
	border-radius: var(--card-radius);
	padding: var(--section-padding, 2rem);
}

.woocommerce-checkout .form-row .input-text,
.woocommerce-checkout .form-row select {
	font-family: var(--font-body);
	border-color: var(--border);
	border-radius: 0.375rem;
}

/* ==========================================================================
   23. Thank you page
   ========================================================================== */
body.theme-thankyou-page { overflow-x: hidden; }
body.theme-thankyou-page .woocommerce-order h2,
body.theme-thankyou-page .woocommerce-order-details__title { padding: 0 0 1rem 0; font-size: 1.75rem; }
body.theme-thankyou-page .woocommerce-order-overview { display: flex; flex-wrap: wrap; gap: 1rem 2rem; list-style: none; padding: 0; margin-bottom: 2rem; }
body.theme-thankyou-page .woocommerce-order-overview li { font-size: 15px; }
body.theme-thankyou-page .woocommerce-order-details table { width: 100%; table-layout: fixed; margin-bottom: 2rem; }
body.theme-thankyou-page .woocommerce-order-details tfoot th { text-align: left; }
body.theme-thankyou-page .woocommerce-order-details tfoot td { text-align: right; }
@media (min-width: 768px) {
	body.theme-thankyou-page .woocommerce-customer-details {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 2rem;
		align-items: start;
	}
}
body.theme-thankyou-page .woocommerce-customer-details address { min-width: 0; overflow-wrap: break-word; }

/* ==========================================================================
   24. 404
   ========================================================================== */
.theme-404 { min-height: 70vh; display: flex; align-items: center; }
.theme-404__inner { text-align: center; padding: 6rem 0; }
.theme-404__title { font-size: 2.5rem; margin-bottom: 1rem; }
.theme-404__message { color: color-mix(in srgb, var(--foreground) 65%, transparent); margin-bottom: 2rem; }

/* ==========================================================================
   25. Generic page content
   ========================================================================== */
.theme-page-content, .theme-generic-content { padding-top: 7rem; padding-bottom: 5rem; }
.theme-page-content .page-title, .theme-generic-content .page-title { font-size: 2.5rem; margin-bottom: 1.5rem; }
