/* =====================================================================
   Carrie's Crafty Corner — theme.css
   All visual styling lives here (Section 10). No CSS in WooCommerce
   template files, aside from the mandatory overrides required by spec.
   ===================================================================== */

:root {
	/* Fallbacks synced with theme_hsl_to_hex() defaults (overridden by Customizer inline CSS). */
	--background: #f7f1f8;
	--foreground: #30203c;
	--muted-foreground: #63556d;
	--primary: #6e4294;
	--primary-foreground: #f9f5fa;
	--card: #eee4f1;
	--border: #dbcddf;
	--butter: #f0e8f3;
	--rosa: #d897bd;
	--marigold: #ecd693;
	--teal: #6fae97;
	--lilac: #c897d8;
	--nopal: #5e397f;
	--accent: #b969d3;

	/* Unified aliases (identical Lovable tokens → one Customizer control) */
	--indigo: var(--primary);
	--ring: var(--primary);
	--input: var(--border);
	--card-foreground: var(--foreground);
	--accent-foreground: var(--primary-foreground);
	--color-button-text: var(--primary-foreground);
	--hero-foreground: var(--primary-foreground);
	--surface: var(--background);

	--font-display: 'Fraunces', serif;
	--font-body: 'Inter', sans-serif;

	/* Lovable: --radius 0.75rem; rounded-2xl = 1rem */
	--radius: 0.75rem;
	--radius-lg: 1rem;
	--radius-md: calc(0.75rem - 2px);
	--radius-sm: calc(0.75rem - 4px);
	--radius-full: 999px;

	--btn-radius: 999px;
	--btn-height: 3rem;
	--btn-padding: 0 2rem;
	--btn-font-size: 0.75rem;
	--btn-font-weight: 600;
	--btn-letter-spacing: 0.22em;
	--btn-text-transform: uppercase;

	--btn-icon-padding: 0.65rem;
	--header-height: 84px;
	--checkout-gap: 2.5rem;

	--shadow-soft: 0 4px 20px -4px hsl(25 25% 14% / 0.08);
	--shadow-elevated: 0 8px 40px -8px hsl(25 25% 14% / 0.16);
	--transition-smooth: cubic-bezier(0.4, 0, 0.2, 1);
}

/* ---------------------------------------------------------------------
   Reset & base typography — Section 2.2
   ------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html {
	max-width: 100%;
	overflow-x: clip;
	scroll-behavior: auto;
}
body {
	margin: 0;
	max-width: 100%;
	overflow-x: clip;
	background: var(--background);
	color: var(--foreground);
	font-family: var(--font-body);
	-webkit-font-smoothing: antialiased;
	line-height: 1.5;
}
body.mobile-menu-open { overflow: hidden; }
/* Kill page-level sideways scroll from full-bleed / wide children */
main, .site-header, .site-footer, section {
	max-width: 100%;
	min-width: 0;
}
dl, dt, dd { margin: 0; padding: 0; }

/* ---------------------------------------------------------------------
   WordPress admin bar vs sticky header
   Desktop ≥783px: 32px. Tablet/mobile ≤782px: 46px.
   ≤600px: core sets #wpadminbar to absolute (scrolls away) — keep it fixed
   and anchor the header with --wp-admin--admin-bar--height. Do not set
   position:relative on body (classic white-gap / pushed-bar bug).
   ------------------------------------------------------------------- */
.admin-bar .site-header {
	top: var(--wp-admin--admin-bar--height, 32px);
}
@media screen and (max-width: 782px) {
	.admin-bar .site-header {
		top: var(--wp-admin--admin-bar--height, 46px);
	}
}
@media screen and (max-width: 600px) {
	html.admin-bar #wpadminbar {
		position: fixed !important;
	}
	.admin-bar .site-header {
		top: var(--wp-admin--admin-bar--height, 46px);
	}
}
/* Customizer preview iframe (logged-in toolbar / preview chrome). */
.wp-customizer .admin-bar .site-header,
body.customize-partial-edit-shortcuts-shown .site-header {
	top: var(--wp-admin--admin-bar--height, 0px);
}
img:not(.cover-img):not(.hero-bg-img):not(.site-logo-img):not(.site-footer__logo-img),
video:not(.cover-img) {
	max-width: 100%;
	height: auto;
	display: block;
}
iframe, embed, object { max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; background: none; border: none; cursor: pointer; color: inherit; }
input, textarea, select { font-family: inherit; font-size: 1rem; }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-display);
	font-weight: inherit;
	font-size: inherit;
	letter-spacing: -0.015em;
	line-height: 1.15;
	margin: 0;
}

/* Lovable .container-wide: max-w-7xl (80rem) + px-6 lg:px-8 */
.container-wide { width: 100%; max-width: 80rem; margin: 0 auto; padding-left: 1.5rem; padding-right: 1.5rem; }
@media (min-width: 1024px) { .container-wide { padding-left: 2rem; padding-right: 2rem; } }
.container-narrow { width: 100%; max-width: 48rem; margin: 0 auto; padding-left: 1.5rem; padding-right: 1.5rem; }

/* Cover-image exclusion list (Section 15.1). Keep every cover image class
   added anywhere in this file in sync with both lists. */
img:not(.cover-img):not(.hero-bg-img):not(.site-logo-img):not(.site-footer__logo-img),
video:not(.cover-img) {
	max-width: 100%;
	height: auto;
}
.cover-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.scroll-mt { scroll-margin-top: 6rem; }

.icon-xs { width: 0.85rem; height: 0.85rem; }
.icon-sm { width: 1.1rem; height: 1.1rem; }
.icon-lg { width: 2.2rem; height: 2.2rem; }
.icon-inline { width: 1rem; height: 1rem; display: inline; vertical-align: -2px; margin-right: 0.35rem; }

/* ---------------------------------------------------------------------
   Reveal / motion — Section 2.1
   ------------------------------------------------------------------- */
.reveal-item {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.7s var(--transition-smooth), transform 0.7s var(--transition-smooth);
	transition-delay: var(--reveal-delay, 0s);
}
.reveal-item.is-visible { opacity: 1; transform: translateY(0); }
body.is-customizer .reveal-item { opacity: 1 !important; transform: none !important; }

@keyframes theme-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes theme-slide-up { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
@keyframes theme-ken-burns { from { transform: scale(1); } to { transform: scale(1.12); } }
.animate-fade-in { animation: theme-fade-in 0.6s var(--transition-smooth) forwards; }
.animate-slide-up { animation: theme-slide-up 0.6s var(--transition-smooth) forwards; }

@media (prefers-reduced-motion: reduce) {
	.reveal-item { opacity: 1 !important; transform: none !important; transition: none !important; }
	.theme-hero__bg { animation: none !important; }
	* { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}

/* ---------------------------------------------------------------------
   Buttons
   ------------------------------------------------------------------- */
.theme-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	border-radius: var(--btn-radius);
	min-height: var(--btn-height);
	padding: var(--btn-padding);
	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);
	transition: opacity 0.2s ease, background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
	cursor: pointer;
	white-space: nowrap;
}
.theme-btn--primary { background: var(--primary); color: var(--color-button-text); }
.theme-btn--primary:hover { opacity: 0.88; }
.theme-btn--outline { background: transparent; color: var(--nopal); border: 1px solid var(--nopal); }
.theme-btn--outline:hover { background: var(--nopal); color: var(--background); }
.theme-btn--full { width: 100%; }
.theme-btn--hero-primary, .theme-btn--hero-outline { text-transform: uppercase; font-size: 0.6875rem; letter-spacing: 0.28em; min-height: unset; }
.theme-btn--hero-primary { background: color-mix(in srgb, var(--hero-foreground) 95%, transparent); color: var(--foreground); padding: 1rem 2.5rem; }
.theme-btn--hero-primary:hover { background: var(--hero-foreground); }
.theme-btn--hero-outline { background: transparent; color: var(--hero-foreground); border: 1px solid color-mix(in srgb, var(--hero-foreground) 80%, transparent); padding: 1rem 2rem; }
.theme-btn--hero-outline:hover { background: color-mix(in srgb, var(--hero-foreground) 15%, transparent); border-color: var(--hero-foreground); }
.theme-btn--on-accent-solid { background: var(--accent-foreground); color: var(--foreground); border: 1px solid var(--foreground); }
.theme-btn--on-accent-solid:hover { background: var(--foreground); color: var(--accent-foreground); }
.theme-btn--on-accent-outline { background: transparent; color: var(--accent-foreground); border: 1px solid color-mix(in srgb, var(--accent-foreground) 70%, transparent); }
.theme-btn--on-accent-outline:hover { border-color: var(--accent-foreground); background: color-mix(in srgb, var(--accent-foreground) 10%, transparent); }
.theme-link-underline { position: relative; display: inline-block; font-family: var(--font-display); font-size: 0.72rem; letter-spacing: 0.28em; text-transform: uppercase; }
.theme-link-underline::after { content: ''; position: absolute; bottom: -4px; left: 0; width: 100%; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform 0.3s var(--transition-smooth); }
.theme-link-underline:hover::after { transform: scaleX(1); }

/* ---------------------------------------------------------------------
   Announcement bar & header
   ------------------------------------------------------------------- */
.theme-announcement-bar { position: relative; background: var(--nopal); color: var(--background); overflow: hidden; }
.theme-announcement-inner { padding: 0.5rem 2.5rem; text-align: center; max-width: 100%; }
.theme-announcement-text {
	margin: 0;
	font-size: 0.75rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-family: var(--font-body);
	line-height: 1.4;
	overflow-wrap: anywhere;
	word-break: break-word;
}
@media (min-width: 640px) {
	.theme-announcement-text { font-size: 0.8125rem; letter-spacing: 0.18em; }
}
.theme-announcement-dismiss { position: absolute; right: 0.5rem; top: 50%; transform: translateY(-50%); opacity: 0.7; padding: 0.25rem; }
.theme-announcement-dismiss:hover { opacity: 1; }

.site-header {
	position: sticky; top: 0; left: 0; right: 0; z-index: 50;
	background: var(--background);
	border-top: 2px solid color-mix(in srgb, var(--lilac) 40%, transparent);
	border-bottom: 1px solid transparent;
	transition: background-color 0.3s ease, border-color 0.3s ease;
}
.site-header.is-solid, .site-header.menu-open {
	background: color-mix(in srgb, var(--background) 95%, transparent);
	backdrop-filter: blur(6px);
	border-bottom-color: color-mix(in srgb, var(--border) 60%, transparent);
}
.site-nav {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 5rem;
	gap: 0.5rem;
	min-width: 0;
}
@media (min-width: 768px) { .site-nav { height: 6rem; } }
.site-nav__side {
	display: flex;
	align-items: center;
	flex: 1 1 0;
	min-width: 0;
	gap: 0.5rem;
}
.site-nav__side--left { justify-content: flex-start; }
.site-nav__side--right { justify-content: flex-end; gap: 0.75rem; }
.site-nav__right-links { display: none; align-items: center; gap: 2.5rem; }
.theme-nav-list,
.theme-nav-list--desktop { display: none; align-items: center; gap: 2.5rem; }
@media (min-width: 1024px) {
	.site-nav__side { gap: 2.5rem; }
	.theme-nav-list,
	.theme-nav-list--desktop { display: flex; }
	.site-nav__right-links { display: flex; }
}
.theme-nav-list a, .theme-nav-fallback a {
	font-size: 0.8125rem; font-family: var(--font-body); font-weight: 400;
	color: color-mix(in srgb, var(--foreground) 80%, transparent);
	transition: color 0.2s ease; cursor: pointer; white-space: nowrap;
}
.theme-nav-list a:hover, .theme-nav-fallback a:hover { color: var(--foreground); }
.site-nav__mobile-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.5rem;
	margin-left: -0.5rem;
	z-index: 2;
	color: var(--foreground);
	flex-shrink: 0;
}
.site-nav__mobile-toggle .icon-close[hidden],
.site-nav__mobile-toggle .icon-open[hidden] { display: none !important; }
@media (min-width: 1024px) { .site-nav__mobile-toggle { display: none; } }
.site-logo {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	align-items: center;
	z-index: 1;
	max-width: min(46vw, 12rem);
}
/* Lovable: h-[4.375rem] md:h-[5.25rem] — customizer --logo-height overrides desktop */
.site-logo-img { height: 4.375rem !important; width: auto !important; max-width: 100%; display: block; object-fit: contain; }
@media (min-width: 768px) {
	.site-logo { max-width: none; }
	.site-logo-img { height: var(--logo-height, 5.25rem) !important; }
}
.site-logo-text { font-family: var(--font-display); font-size: 1.5rem; line-height: 1; }
.theme-cart-toggle {
	position: relative; display: inline-flex; align-items: center; justify-content: center;
	width: 2.25rem; height: 2.25rem; border-radius: 50%; border: 1px solid color-mix(in srgb, var(--foreground) 30%, transparent);
	font-size: 0.8125rem; font-family: var(--font-body); color: var(--foreground);
	line-height: 1; transition: border-color 0.2s ease; flex-shrink: 0; z-index: 2;
}
.theme-cart-toggle:hover { border-color: var(--foreground); }
.theme-cart-count {
	display: inline-block;
	font-family: var(--font-body);
	font-size: 0.8125rem;
	font-weight: 400;
	line-height: 1;
	color: var(--foreground);
	min-width: 0.6em;
	text-align: center;
}
.site-nav__mobile-panel {
	border-top: 1px solid color-mix(in srgb, var(--border) 60%, transparent);
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0;
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	visibility: hidden;
	transform: translateY(-0.75rem);
	pointer-events: none;
	transition:
		max-height 0.45s var(--transition-smooth),
		opacity 0.35s var(--transition-smooth),
		transform 0.4s var(--transition-smooth),
		visibility 0.35s,
		padding 0.35s var(--transition-smooth);
}
.site-nav__mobile-panel.is-open {
	max-height: min(70vh, 28rem);
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	pointer-events: auto;
	padding: 1rem 0 1.25rem;
	gap: 0.25rem;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}
.site-nav__mobile-panel[hidden] { display: none !important; }
.theme-nav-mobile-list {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	list-style: none;
	margin: 0;
	padding: 0;
}
.theme-nav-mobile-list li { margin: 0; padding: 0; list-style: none; }
.theme-nav-mobile-list a,
.site-nav__mobile-panel .theme-nav-link {
	padding: 0.7rem 0.25rem;
	font-size: 0.95rem;
	font-family: var(--font-body);
	text-align: left;
	display: block;
	width: 100%;
	color: color-mix(in srgb, var(--foreground) 85%, transparent);
	opacity: 0;
	transform: translateX(-0.75rem);
	transition: opacity 0.35s var(--transition-smooth), transform 0.4s var(--transition-smooth), color 0.2s ease;
}
.site-nav__mobile-panel.is-open .theme-nav-mobile-list a,
.site-nav__mobile-panel.is-open .theme-nav-link {
	opacity: 1;
	transform: translateX(0);
}
.site-nav__mobile-panel.is-open .theme-nav-mobile-list:nth-child(1) a:nth-child(1),
.site-nav__mobile-panel.is-open .theme-nav-mobile-list:nth-child(1) li:nth-child(1) a { transition-delay: 0.05s; }
.site-nav__mobile-panel.is-open .theme-nav-mobile-list:nth-child(1) a:nth-child(2),
.site-nav__mobile-panel.is-open .theme-nav-mobile-list:nth-child(1) li:nth-child(2) a { transition-delay: 0.09s; }
.site-nav__mobile-panel.is-open .theme-nav-mobile-list:nth-child(1) a:nth-child(3),
.site-nav__mobile-panel.is-open .theme-nav-mobile-list:nth-child(1) li:nth-child(3) a { transition-delay: 0.13s; }
.site-nav__mobile-panel.is-open .theme-nav-mobile-list:nth-child(2) a:nth-child(1),
.site-nav__mobile-panel.is-open .theme-nav-mobile-list:nth-child(2) li:nth-child(1) a { transition-delay: 0.17s; }
.site-nav__mobile-panel.is-open .theme-nav-mobile-list:nth-child(2) a:nth-child(2),
.site-nav__mobile-panel.is-open .theme-nav-mobile-list:nth-child(2) li:nth-child(2) a { transition-delay: 0.21s; }
.site-nav__mobile-panel.is-open .theme-nav-mobile-list:nth-child(2) a:nth-child(3),
.site-nav__mobile-panel.is-open .theme-nav-mobile-list:nth-child(2) li:nth-child(3) a { transition-delay: 0.25s; }
@media (min-width: 1024px) {
	.site-nav__mobile-panel { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
	.site-nav__mobile-panel,
	.theme-nav-mobile-list a {
		transition: none !important;
		transform: none !important;
	}
	.site-nav__mobile-panel.is-open .theme-nav-mobile-list a { opacity: 1; }
}

/* ---------------------------------------------------------------------
   Section heading system — per-section scales (Section 2.2 item 5)
   ------------------------------------------------------------------- */
.theme-kicker { display: block; font-size: 0.75rem; letter-spacing: 0.32em; text-transform: uppercase; color: var(--nopal); margin-bottom: 0.75rem; font-weight: 400; font-family: var(--font-body); }
.theme-kicker--teal { color: var(--teal); }
.theme-kicker--semibold { font-weight: 600; }
.theme-kicker--on-accent { color: color-mix(in srgb, var(--accent-foreground) 80%, transparent); font-weight: 600; }
.theme-section-heading { margin-bottom: 2.5rem; }
.theme-featured-products .theme-section-heading { margin-bottom: 3.5rem; }
.theme-services .theme-section-heading { margin-bottom: 4rem; }
@media (min-width: 768px) { .theme-services .theme-section-heading { margin-bottom: 5rem; } }
.theme-section-heading--center { text-align: center; }
.theme-section-desc { color: color-mix(in srgb, var(--foreground) 75%, transparent); max-width: 40rem; margin: 1rem auto 0; font-size: 1rem; }
@media (min-width: 768px) { .theme-section-desc { font-size: 1.125rem; } }
.theme-faq .theme-section-desc { margin: 0; max-width: 42rem; }
.theme-faq .theme-section-heading { margin-bottom: 2.5rem; max-width: 42rem; }
@media (min-width: 768px) { .theme-faq .theme-section-heading { margin-bottom: 3.5rem; } }

.section-heading { font-weight: 400; }
.theme-category-strip .section-heading { font-size: 1.875rem; }
@media (min-width: 768px) { .theme-category-strip .section-heading { font-size: 2.25rem; } }
.theme-featured-products .section-heading,
.theme-portfolio .section-heading,
.theme-faq .section-heading { font-size: 1.875rem; line-height: 1.15; }
@media (min-width: 768px) {
	.theme-featured-products .section-heading,
	.theme-portfolio .section-heading { font-size: 3rem; }
	.theme-faq .section-heading { font-size: 3rem; }
}
@media (min-width: 1024px) {
	.theme-faq .section-heading { font-size: 3.75rem; line-height: 1.05; }
}
.offerings-section.section-heading { font-size: 2.25rem; letter-spacing: -0.02em; line-height: 1.05; }
@media (min-width: 768px) { .offerings-section.section-heading { font-size: 3rem; } }
@media (min-width: 1024px) { .offerings-section.section-heading { font-size: 3.75rem; } }
.about-section.section-heading,
.theme-story__heading.about-section {
	font-family: var(--font-display);
	font-weight: 400;
	font-size: 1.5rem; /* text-2xl */
	line-height: 1.25;
	letter-spacing: -0.015em;
	color: var(--foreground);
}
@media (min-width: 768px) {
	.about-section.section-heading,
	.theme-story__heading.about-section { font-size: 2.25rem; } /* text-4xl */
}
@media (min-width: 1024px) {
	.about-section.section-heading,
	.theme-story__heading.about-section { font-size: 2.5rem; } /* text-[2.5rem] */
}
.shop-heading.section-heading { font-size: 1.875rem; margin-bottom: 2.5rem; }
@media (min-width: 768px) { .shop-heading.section-heading { font-size: 3rem; } }
.cta-band__title.section-heading { font-size: 2.25rem; line-height: 1.15; color: var(--accent-foreground); margin-bottom: 1.5rem; }
@media (min-width: 768px) { .cta-band__title.section-heading { font-size: 3rem; } }
@media (min-width: 1024px) { .cta-band__title.section-heading { font-size: 3.75rem; } }
.theme-owner__copy h2.section-heading { font-size: 2.25rem; line-height: 1.15; margin-bottom: 1.75rem; color: var(--foreground); }
@media (min-width: 768px) { .theme-owner__copy h2.section-heading { font-size: 3rem; } }
@media (min-width: 1024px) { .theme-owner__copy h2.section-heading { font-size: 3.75rem; } }

/* ---------------------------------------------------------------------
   Hero
   ------------------------------------------------------------------- */
.theme-hero { position: relative; height: 92vh; min-height: 520px; overflow: hidden; background: var(--background); max-width: 100%; }
@media (min-width: 768px) { .theme-hero { min-height: 620px; } }
body.theme-no-hero .theme-hero { display: none; }
.theme-hero__media { position: absolute; inset: 0; overflow: hidden; }
.theme-hero__bg { animation: theme-ken-burns 18s ease-in-out infinite alternate; }
video.theme-hero__bg { animation: none; object-fit: cover; }
.theme-hero__scrim {
	position: absolute; inset: 0; pointer-events: none;
	background:
		linear-gradient(to top, rgba(0,0,0,0.5), transparent 33%),
		rgba(0,0,0,0.45);
}
.theme-hero__content {
	position: relative; height: 100%; display: flex; flex-direction: column;
	align-items: center; justify-content: center; text-align: center; color: var(--hero-foreground);
}
.theme-hero__headline {
	font-family: var(--font-display); font-style: italic; font-weight: 400;
	line-height: 0.98; letter-spacing: -0.02em; color: var(--hero-foreground);
	font-size: clamp(2.75rem, 8vw, 6.5rem); max-width: 64rem; padding: 0 0.5rem;
}
.theme-hero__actions { margin-top: 2.5rem; display: flex; flex-direction: column; gap: 1rem; align-items: center; }
@media (min-width: 640px) { .theme-hero__actions { flex-direction: row; } }

/* ---------------------------------------------------------------------
   Category strip
   ------------------------------------------------------------------- */
.theme-category-strip { padding: 4rem 0; background: var(--background); overflow-x: clip; }
@media (min-width: 768px) { .theme-category-strip { padding: 5rem 0; } }
.theme-category-strip .theme-section-heading { margin-bottom: 1rem; }
.theme-scroll-hint {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	margin: 0 0 0.75rem;
	font-family: var(--font-body);
	font-size: 0.6875rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--foreground) 55%, transparent);
}
.theme-shop__pills-hint,
.theme-faq__tabs-hint { margin: 0 0 0.65rem; }
.theme-scroll-hint__arrows {
	display: inline-flex;
	align-items: center;
	gap: 0.15rem;
	opacity: 0.75;
	animation: theme-hint-nudge 1.8s ease-in-out infinite;
}
.theme-scroll-hint__arrows svg {
	width: 0.85rem;
	height: 0.85rem;
}
@keyframes theme-hint-nudge {
	0%, 100% { transform: translateX(0); opacity: 0.55; }
	50% { transform: translateX(0.2rem); opacity: 1; }
}
@media (min-width: 768px) {
	.theme-scroll-hint { display: none; }
	.theme-category-strip .theme-section-heading { margin-bottom: 2.5rem; }
}
@media (prefers-reduced-motion: reduce) {
	.theme-scroll-hint__arrows { animation: none; }
}
.theme-category-tiles {
	display: flex;
	gap: 1.5rem;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	padding: 1.5rem 0 1rem;
	max-width: 100%;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	touch-action: pan-x;
	scroll-snap-type: x mandatory;
}
.theme-category-tiles::-webkit-scrollbar { display: none; }
@media (min-width: 768px) {
	.theme-category-tiles {
		flex-wrap: wrap;
		justify-content: center;
		overflow: visible;
		gap: 2rem 2.5rem;
		touch-action: auto;
		scroll-snap-type: none;
	}
}
.theme-category-tile {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.75rem;
	flex-shrink: 0;
	scroll-snap-align: start;
	max-width: 10rem;
}
@media (min-width: 768px) {
	.theme-category-tile { gap: 1rem; flex: 0 1 auto; }
}
.theme-category-tile__icon {
	width: 6rem; height: 6rem; border-radius: 50%; display: flex; align-items: center; justify-content: center;
	background: color-mix(in srgb, var(--marigold) 80%, transparent);
	transition: transform 0.3s ease;
}
@media (min-width: 640px) { .theme-category-tile__icon { width: 7rem; height: 7rem; } }
.theme-category-tile:hover .theme-category-tile__icon { transform: scale(1.05); }
.theme-category-tile__icon--all { background: color-mix(in srgb, var(--marigold) 80%, transparent); }
.theme-category-tile__icon--glasses { background: color-mix(in srgb, var(--lilac) 80%, transparent); }
.theme-category-tile__icon--package { background: color-mix(in srgb, var(--rosa) 70%, transparent); }
.theme-category-tile__icon--printer { background: color-mix(in srgb, var(--teal) 70%, transparent); }
.theme-category-tile__icon--scissors { background: color-mix(in srgb, var(--accent) 60%, transparent); }
.theme-category-tile__icon--heart { background: color-mix(in srgb, var(--nopal) 60%, transparent); }
.theme-category-tile__icon svg { width: 2rem; height: 2rem; color: color-mix(in srgb, var(--foreground) 80%, transparent); }
@media (min-width: 768px) {
	.theme-category-tile__icon { width: 8rem; height: 8rem; }
	.theme-category-tile__icon svg { width: 2.5rem; height: 2.5rem; }
}
@media (min-width: 1024px) {
	.theme-category-tile__icon { width: 10rem; height: 10rem; }
	.theme-category-tile__icon svg { width: 3rem; height: 3rem; }
}
.theme-category-tile__label {
	font-size: 0.6875rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: color-mix(in srgb, var(--foreground) 85%, transparent);
	text-align: center;
	font-family: var(--font-body);
	line-height: 1.3;
	word-break: break-word;
}
@media (min-width: 768px) { .theme-category-tile__label { font-size: 0.875rem; } }

.theme-featured-products { padding: 4rem 0; background: var(--background); }
@media (min-width: 768px) { .theme-featured-products { padding: 6rem 0; } }
.theme-featured-products__cta { text-align: center; margin-top: 3.5rem; }
.theme-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; align-items: stretch; max-width: 100%; }
@media (min-width: 768px) { .theme-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; } }
@media (min-width: 1024px) { .theme-product-grid { gap: 2.5rem; } }
.theme-product-grid--featured { grid-template-columns: repeat(1, minmax(0, 1fr)); gap: 2rem; }
@media (min-width: 768px) { .theme-product-grid--featured { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .theme-product-grid--featured { gap: 3rem; } }
.theme-product-grid--related { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 1024px) { .theme-product-grid--related { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.theme-product-card-wrap, .theme-shop-item { display: flex; flex-direction: column; height: 100%; min-width: 0; }
.theme-shop-item--hidden-initial { display: none; }
/* Lovable ProductCard: group block → square media + text */
.theme-product-card { display: flex; flex-direction: column; height: 100%; min-width: 0; }

/* relative aspect-square bg-card rounded-2xl overflow-hidden mb-5 */
.theme-product-card__image-wrapper {
	position: relative;
	aspect-ratio: 1 / 1;
	width: 100%;
	overflow: hidden;
	border-radius: 1rem; /* rounded-2xl */
	background: var(--card);
	margin-bottom: 1.25rem; /* mb-5 */
	transition: transform 0.35s cubic-bezier(0.25, 0.4, 0.25, 1);
}
.theme-product-card:hover .theme-product-card__image-wrapper {
	transform: translateY(-3px); /* Lovable whileHover y: -3 */
}
.theme-product-card__image-link {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: block;
}
.theme-product-card__image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.7s cubic-bezier(0.25, 0.4, 0.25, 1);
}
.theme-product-card:hover .theme-product-card__image { transform: scale(1.04); }
.theme-product-card__image-wrapper.is-soldout .theme-product-card__image { opacity: 0.6; }

.theme-badge {
	position: absolute; top: 1rem; right: 1rem; z-index: 3;
	padding: 0.25rem 0.75rem; border-radius: 0.375rem; /* rounded-md */
	font-size: 0.6875rem; font-weight: 500; letter-spacing: 0.02em; font-family: var(--font-body);
}
.theme-badge--soldout { background: var(--foreground); color: var(--background); left: auto; right: 1rem; }

/* Lovable: absolute inset-x-4 bottom-4 py-3 … opacity-0 translate-y-2 group-hover… */
.theme-card-add-btn {
	position: absolute; left: 1rem; right: 1rem; bottom: 1rem; z-index: 4;
	padding: 0.75rem 0; border-radius: var(--radius-full); text-align: center;
	background: var(--teal) !important; color: var(--background) !important; border: 1px solid var(--teal) !important;
	font-size: 0.6875rem; letter-spacing: 0.22em; text-transform: uppercase; font-weight: 600; font-family: var(--font-body);
	min-height: unset !important;
	opacity: 0; transform: translateY(0.5rem);
	transition: opacity 0.3s ease, transform 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}
.theme-product-card:hover .theme-card-add-btn { opacity: 1; transform: translateY(0); }
.theme-card-add-btn:hover {
	background: var(--background) !important;
	color: var(--teal) !important;
}

/* px-1 space-y-1.5 */
.theme-product-card__info {
	flex: 1; display: flex; flex-direction: column; gap: 0.375rem;
	padding: 0 0.25rem; min-width: 0;
}
.theme-product-card__category {
	font-size: 0.75rem; letter-spacing: 0.18em; text-transform: uppercase;
	color: var(--muted-foreground); margin: 0; font-family: var(--font-body);
}
.theme-product-card__title {
	font-family: var(--font-display); font-weight: 500; font-size: 1rem; line-height: 1.375; margin: 0;
	overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.theme-product-card__title a {
	color: var(--foreground);
	transition: color 0.3s ease;
}
@media (min-width: 768px) { .theme-product-card__title { font-size: 1.125rem; } }
.theme-product-card:hover .theme-product-card__title a { color: var(--primary); }
.theme-product-card__price { font-size: 1rem; color: color-mix(in srgb, var(--foreground) 85%, transparent); margin: 0; font-family: var(--font-body); }
.theme-product-card__price .woocommerce-Price-amount { font-family: var(--font-body); }

/* ---------------------------------------------------------------------
   WooCommerce add-to-cart button override — Section 11.4.1
   ------------------------------------------------------------------- */
.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(--color-button-text) !important;
	border: none !important;
	border-radius: var(--btn-radius) !important;
	min-height: var(--btn-height) !important;
	padding: var(--btn-padding) !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-family: var(--font-body) !important;
	font-size: var(--btn-font-size) !important;
	font-weight: var(--btn-font-weight) !important;
	letter-spacing: var(--btn-letter-spacing) !important;
	text-transform: none !important;
	cursor: pointer !important;
	transition: opacity 0.2s ease !important;
}
.single_add_to_cart_button.button:hover,
.add_to_cart_button.button:hover {
	opacity: 0.85 !important;
	background-color: var(--primary) !important;
	color: var(--color-button-text) !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 {
	cursor: not-allowed !important;
	opacity: 0.4 !important;
	pointer-events: 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.4 !important;
	background-color: var(--primary) !important;
}
.single-product .single_add_to_cart_button.button,
.single-product a.single_add_to_cart_button {
	background-color: var(--foreground) !important;
	color: var(--background) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.25em !important;
	font-size: 0.75rem !important;
	font-weight: 500 !important;
	border-radius: var(--radius-full) !important;
	padding: 1rem 2rem !important;
	min-height: unset !important;
	width: 100%;
}
.single-product .single_add_to_cart_button.button:hover {
	opacity: 0.9 !important;
	background-color: var(--foreground) !important;
}

/* Card compact button — overrides global rules for the card variant. */
.theme-product-card .add_to_cart_button.ajax_add_to_cart.theme-card-add-btn {
	background-color: var(--teal) !important;
	color: var(--background) !important;
	min-height: unset !important;
	padding: 0.75rem 0 !important;
	border-radius: var(--radius-full) !important;
	border: 1px solid var(--teal) !important;
	text-transform: uppercase !important;
	width: auto !important;
}
.theme-product-card .add_to_cart_button.ajax_add_to_cart.theme-card-add-btn:hover {
	background-color: var(--background) !important;
	color: var(--teal) !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 { opacity: 0.6 !important; pointer-events: none !important; cursor: wait !important; }

.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; }

/* ---------------------------------------------------------------------
   Notices — scoped visibility, Section 14.1
   ------------------------------------------------------------------- */
.single-product .woocommerce-message, .single-product .woocommerce-info { display: none; }
#theme-cart-drawer .woocommerce-message { display: none; }
.woocommerce-message, .woocommerce-error, .woocommerce-info {
	font-family: var(--font-body); border-radius: var(--radius-md); padding: 1rem 1.5rem;
	background: var(--card); border-top: 3px solid var(--primary); list-style: none;
}

/* ---------------------------------------------------------------------
   Portfolio / albums
   Mobile: panel expands directly under its card.
   Desktop: cards in a row; open panel spans full width below the row.
   ------------------------------------------------------------------- */
.theme-portfolio { padding: 5rem 0 7rem; background: var(--butter); overflow-x: clip; }
.theme-album-grid {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}
.theme-album-unit {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	min-width: 0;
}
.theme-album-card {
	text-align: left; border-radius: 1rem; overflow: hidden; background: var(--background);
	border: 1px solid color-mix(in srgb, var(--foreground) 5%, transparent);
	transition: transform 0.3s ease, box-shadow 0.3s ease; display: flex; flex-direction: column;
	width: 100%;
}
.theme-album-card:hover { transform: translateY(-4px); box-shadow: 0 12px 30px -15px rgba(0,0,0,0.18); }
.theme-album-card__image-wrapper { position: relative; aspect-ratio: 4/3; overflow: hidden; }
.theme-album-card__image-wrapper--lilac { background: color-mix(in srgb, var(--lilac) 30%, transparent); }
.theme-album-card__image-wrapper--teal { background: color-mix(in srgb, var(--teal) 25%, transparent); }
.theme-album-card__image-wrapper--rosa { background: color-mix(in srgb, var(--rosa) 25%, transparent); }
.theme-album-card__image-wrapper img { transition: transform 0.5s ease; }
.theme-album-card:hover .theme-album-card__image-wrapper img { transform: scale(1.03); }
.theme-album-card__body { padding: 1.5rem; }
.theme-album-card__body h3 { font-size: 1.35rem; margin-bottom: 0.25rem; }
.theme-album-card__body p { font-size: 0.875rem; color: color-mix(in srgb, var(--foreground) 70%, transparent); line-height: 1.6; margin: 0 0 0.75rem; }
.theme-album-card__link { font-size: 0.6875rem; letter-spacing: 0.24em; text-transform: uppercase; font-weight: 600; color: var(--nopal); }
.theme-album-panel { margin: 0; padding: 0; }
.theme-album-panel[hidden] { display: none !important; }
.theme-album-panel__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
@media (min-width: 768px) {
	.theme-album-grid {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 2rem;
	}
	.theme-album-unit { display: contents; }
	.theme-album-card { order: var(--album-order, 1); }
	.theme-album-panel {
		order: 100;
		grid-column: 1 / -1;
		margin-top: 0.5rem;
	}
	.theme-album-panel__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
}
@media (min-width: 1024px) {
	.theme-album-panel__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.theme-album-photo {
	position: relative; aspect-ratio: 1/1; overflow: hidden; border-radius: 0.75rem;
	background: var(--background); width: 100%; padding: 0; border: none; cursor: pointer;
}
.theme-album-photo img { transition: transform 0.5s ease; }
.theme-album-photo:hover img { transform: scale(1.05); }

.theme-lightbox {
	position: fixed; inset: 0; z-index: 60; background: rgba(0,0,0,0.85);
	display: flex; align-items: center; justify-content: center; padding: 1rem;
}
.theme-lightbox[hidden] { display: none !important; }
.theme-lightbox img { max-height: 85vh; max-width: 90vw; object-fit: contain; border-radius: 0.5rem; box-shadow: var(--shadow-elevated); }
.theme-lightbox__close { position: absolute; top: 1rem; right: 1rem; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: rgba(255,255,255,0.92); display: flex; align-items: center; justify-content: center; }

/* ---------------------------------------------------------------------
   Story / about
   ------------------------------------------------------------------- */
.theme-story { padding: 6rem 0; background: var(--background); overflow-x: clip; }
@media (min-width: 768px) { .theme-story { padding: 8rem 0; } }
.theme-story__banner {
	position: relative;
	width: 100%;
	max-width: 100%;
	height: 42vh;
	min-height: 280px;
	overflow: hidden;
	margin: 0 0 2.5rem;
}
@media (min-width: 768px) { .theme-story__banner { height: 55vh; } }
.theme-story__content { text-align: center; padding-left: 1.5rem; padding-right: 1.5rem; }
@media (min-width: 768px) { .theme-story__content { padding-left: 3.5rem; padding-right: 3.5rem; } }
@media (min-width: 1024px) { .theme-story__content { padding-left: 5rem; padding-right: 5rem; } }
.theme-story .theme-kicker { margin-bottom: 1.5rem; }
.theme-story__heading { margin: 0 0 2.5rem; }
.theme-story__body { color: color-mix(in srgb, var(--foreground) 75%, transparent); line-height: 1.7; font-size: 1rem; }
@media (min-width: 768px) { .theme-story__body { font-size: 1.125rem; } }
.theme-story .theme-link-underline { margin-top: 2.5rem; font-size: 0.75rem; letter-spacing: 0.28em; font-weight: 500; }

/* ---------------------------------------------------------------------
   Owner / meet the maker
   ------------------------------------------------------------------- */
.theme-owner { background: var(--nopal); color: var(--background); }
.theme-owner__grid { display: grid; grid-template-columns: 1fr; align-items: stretch; }
@media (min-width: 1024px) { .theme-owner__grid { grid-template-columns: 1fr 1fr; } }
.theme-owner__image { position: relative; min-height: 320px; overflow: hidden; }
@media (min-width: 768px) { .theme-owner__image { min-height: 460px; } }
@media (min-width: 1024px) { .theme-owner__image { min-height: 560px; } }
.theme-owner__image::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.4), transparent 60%); }
.theme-owner__image-caption { position: absolute; left: 1.25rem; right: 1.25rem; bottom: 1.5rem; z-index: 2; }
@media (min-width: 768px) {
	.theme-owner__image-caption { left: 2rem; right: 2rem; bottom: 2rem; }
}
.theme-owner__name { font-family: var(--font-display); font-size: 1.75rem; margin: 0; }
.theme-owner__role { font-size: 0.6875rem; letter-spacing: 0.25em; text-transform: uppercase; opacity: 0.9; margin-top: 0.25rem; }
.theme-owner__copy { display: flex; align-items: center; background: var(--background); color: var(--foreground); padding: 4rem 1.5rem; }
@media (min-width: 768px) { .theme-owner__copy { padding: 6rem 3.5rem; } }
.theme-owner__copy-inner { max-width: 34rem; }
.theme-owner__quote { font-family: var(--font-display); font-style: italic; font-size: 1.25rem; line-height: 1.4; margin: 0 0 2rem; color: color-mix(in srgb, var(--foreground) 85%, transparent); }
@media (min-width: 768px) { .theme-owner__quote { font-size: 1.5rem; } }
.theme-owner__bio { color: color-mix(in srgb, var(--foreground) 75%, transparent); line-height: 1.7; margin-bottom: 1.25rem; }
.theme-owner__bio a { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: color-mix(in srgb, var(--foreground) 40%, transparent); }
.theme-owner .theme-kicker { margin-bottom: 1.25rem; }

.theme-services { padding: 5rem 0 7rem; background: var(--butter); overflow-x: clip; }
.theme-services-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; width: 100%; max-width: 80rem; margin: 0 auto; }
@media (min-width: 640px) { .theme-services-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; } }
@media (min-width: 1024px) { .theme-services-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.theme-service-card {
	display: flex; flex-direction: column; align-items: center; text-align: center; min-width: 0;
	background: var(--surface); border-radius: 1rem; padding: 2rem; border: 1px solid color-mix(in srgb, var(--foreground) 5%, transparent);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.theme-service-card:hover { transform: translateY(-4px); box-shadow: 0 12px 30px -15px rgba(0,0,0,0.15); }
.theme-service-card__icon { margin-bottom: 1.5rem; color: var(--teal); }
.theme-service-card__icon--teal { color: var(--teal); }
.theme-service-card__icon--nopal { color: var(--nopal); }
.theme-service-card__icon--lilac { color: var(--lilac); }
.theme-service-card__icon--marigold { color: var(--marigold); }
.theme-service-card h3 { font-size: 0.75rem; letter-spacing: 0.28em; text-transform: uppercase; font-weight: 600; margin-bottom: 0.75rem; font-family: var(--font-body); }
.theme-service-card p { font-size: 0.875rem; color: var(--muted-foreground); line-height: 1.6; margin-bottom: 1.5rem; min-width: 0; }
.theme-service-card__cta { margin-top: auto; font-size: 0.6875rem; letter-spacing: 0.24em; text-transform: uppercase; font-weight: 600; color: var(--nopal); font-family: var(--font-body); }
.theme-service-card__cta:hover { color: var(--foreground); }

/* ---------------------------------------------------------------------
   Shop section
   ------------------------------------------------------------------- */
.theme-shop { padding: 4rem 0 6rem; background: var(--background); overflow-x: clip; }
.theme-shop__search { position: relative; max-width: 26rem; margin: 0 auto 2rem; display: flex; align-items: center; gap: 0.5rem; width: 100%; }
.theme-shop__search svg { position: absolute; left: 0; color: color-mix(in srgb, var(--foreground) 55%, transparent); }
.theme-shop__search input {
	width: 100%; max-width: 100%; padding: 0.5rem 0 0.5rem 1.75rem; background: transparent; border: none; border-bottom: 1px solid var(--border);
	outline: none; transition: border-color 0.2s ease;
}
.theme-shop__search input:focus { border-color: var(--foreground); }
.theme-shop__pills {
	display: flex;
	gap: 0.5rem;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	margin: 0 0 1rem;
	padding-bottom: 0.25rem;
	justify-content: flex-start;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	max-width: 100%;
}
.theme-shop__pills::-webkit-scrollbar { display: none; }
@media (min-width: 768px) {
	.theme-shop__pills { justify-content: center; flex-wrap: wrap; overflow: visible; }
}
.theme-shop-pill {
	flex-shrink: 0; padding: 0.5rem 1.25rem; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase;
	border-radius: var(--radius-full); border: 1px solid var(--border); background: transparent; transition: all 0.3s ease;
}
.theme-shop-pill:hover { border-color: var(--lilac); color: var(--lilac); }
.theme-shop-pill.is-active { background: var(--teal); color: var(--background); border-color: var(--teal); }
.theme-shop__price-filter { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; }
.theme-shop__price-toggle { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 1rem; font-size: 0.75rem; letter-spacing: 0.2em; text-transform: uppercase; color: color-mix(in srgb, var(--foreground) 65%, transparent); }
.theme-shop__price-toggle:hover { color: var(--foreground); }
.theme-shop__price-toggle svg { transition: transform 0.3s ease; }
.theme-shop__price-toggle.is-open svg { transform: rotate(180deg); }
.theme-shop__price-panel { width: 100%; max-width: 22rem; padding-top: 0.5rem; }
.theme-shop__price-labels { display: flex; justify-content: space-between; font-size: 0.875rem; color: color-mix(in srgb, var(--foreground) 65%, transparent); margin-top: 0.75rem; }

/* Dual-handle range — Section 31.4 */
.price-range-wrapper { position: relative; height: 1.5rem; }
.range-track-bg, .range-track-fill { position: absolute; height: 4px; top: 50%; transform: translateY(-50%); pointer-events: none; border-radius: 999px; }
.range-track-bg { left: 0; right: 0; background: var(--border); }
.range-track-fill { background: var(--primary); }
.range-input { position: absolute; left: 0; top: 0; width: 100%; height: 100%; margin: 0; -webkit-appearance: none; appearance: none; background: transparent; pointer-events: none; }
.range-input::-webkit-slider-thumb { -webkit-appearance: none; pointer-events: auto; width: 18px; height: 18px; border-radius: 50%; background: var(--background); border: 2px solid var(--primary); cursor: pointer; }
.range-input::-moz-range-thumb { pointer-events: auto; width: 18px; height: 18px; border-radius: 50%; background: var(--background); border: 2px solid var(--primary); cursor: pointer; }
.range-input--max { z-index: 3; }
.range-input--min { z-index: 4; }

.theme-shop__show-more { text-align: center; margin-top: 3rem; }
.theme-shop__show-more .theme-btn--outline {
	border-color: var(--teal); color: var(--teal);
}
.theme-shop__show-more .theme-btn--outline:hover {
	background: var(--teal); color: var(--background); border-color: var(--teal);
}
.theme-shop__empty { text-align: center; padding: 5rem 0; color: var(--muted-foreground); }

/* ---------------------------------------------------------------------
   FAQ
   ------------------------------------------------------------------- */
.theme-faq { padding: 5rem 0 7rem; background: var(--background); }
.theme-faq__tabs {
	display: flex;
	gap: 0.625rem;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	margin-bottom: 2.5rem;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	max-width: 100%;
	padding-bottom: 0.25rem;
}
.theme-faq__tabs::-webkit-scrollbar { display: none; }
@media (min-width: 768px) { .theme-faq__tabs { flex-wrap: wrap; overflow: visible; } }
.theme-faq__tab {
	flex-shrink: 0; padding: 0.65rem 1.25rem; border-radius: var(--radius-full); border: 1px solid var(--border);
	font-size: 0.75rem; letter-spacing: 0.22em; text-transform: uppercase; font-weight: 600; transition: all 0.2s ease;
	font-family: var(--font-body); background: transparent; color: var(--foreground);
}
.theme-faq__tab[data-faq-color="teal"] { border-color: var(--teal); }
.theme-faq__tab[data-faq-color="nopal"] { border-color: var(--nopal); }
.theme-faq__tab[data-faq-color="lilac"] { border-color: var(--lilac); }
.theme-faq__tab[data-faq-color="marigold"] { border-color: var(--marigold); }
.theme-faq__tab[data-faq-color="rosa"] { border-color: var(--rosa); }
.theme-faq__tab[data-faq-color="teal"]:hover { background: color-mix(in srgb, var(--teal) 10%, transparent); }
.theme-faq__tab[data-faq-color="nopal"]:hover { background: color-mix(in srgb, var(--nopal) 10%, transparent); }
.theme-faq__tab[data-faq-color="lilac"]:hover { background: color-mix(in srgb, var(--lilac) 25%, transparent); }
.theme-faq__tab[data-faq-color="marigold"]:hover { background: color-mix(in srgb, var(--marigold) 25%, transparent); }
.theme-faq__tab[data-faq-color="rosa"]:hover { background: color-mix(in srgb, var(--rosa) 20%, transparent); }
.theme-faq__tab[data-faq-color="teal"].is-active { background: var(--teal); color: var(--background); border-color: var(--teal); }
.theme-faq__tab[data-faq-color="nopal"].is-active { background: var(--nopal); color: var(--background); border-color: var(--nopal); }
.theme-faq__tab[data-faq-color="lilac"].is-active { background: var(--lilac); color: var(--foreground); border-color: var(--lilac); }
.theme-faq__tab[data-faq-color="marigold"].is-active { background: var(--marigold); color: var(--foreground); border-color: var(--marigold); }
.theme-faq__tab[data-faq-color="rosa"].is-active { background: var(--rosa); color: var(--foreground); border-color: var(--rosa); }
.theme-faq__panels { border-top: 1px solid color-mix(in srgb, var(--foreground) 15%, transparent); }
.theme-faq-item { border-bottom: 1px solid color-mix(in srgb, var(--foreground) 15%, transparent); }
.theme-faq-item__q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; padding: 1.25rem 0; text-align: left; }
@media (min-width: 768px) { .theme-faq-item__q { padding: 1.5rem 0; } }
.theme-faq-item__q span:first-child { font-family: var(--font-display); font-size: 1.125rem; line-height: 1.35; }
@media (min-width: 768px) { .theme-faq-item__q span:first-child { font-size: 1.25rem; } }
.theme-faq-item__icon { flex-shrink: 0; width: 2.25rem; height: 2.25rem; border-radius: 50%; border: 1px solid var(--nopal); display: flex; align-items: center; justify-content: center; color: var(--nopal); transition: all 0.2s ease; }
.theme-faq-item__q[aria-expanded="true"] .theme-faq-item__icon { background: var(--nopal); color: var(--background); transform: rotate(180deg); }
.theme-faq-item__a { padding-bottom: 1.5rem; padding-right: 0; max-width: 48rem; }
@media (min-width: 640px) {
	.theme-faq-item__a { padding-right: 3rem; }
}
.theme-faq-item__a p { color: color-mix(in srgb, var(--foreground) 75%, transparent); line-height: 1.7; margin: 0; font-size: 1rem; }
@media (min-width: 768px) { .theme-faq-item__a p { font-size: 1.0625rem; } }

/* ---------------------------------------------------------------------
   Final CTA band
   ------------------------------------------------------------------- */
.theme-cta-band { display: grid; grid-template-columns: 1fr; min-height: 420px; overflow: hidden; }
@media (min-width: 1024px) { .theme-cta-band { grid-template-columns: 1fr 1fr; } }
.theme-cta-band__media { position: relative; min-height: 280px; overflow: hidden; }
@media (min-width: 1024px) { .theme-cta-band__media { min-height: 480px; } }
.theme-cta-band__panel { position: relative; background: var(--accent); color: var(--accent-foreground); display: flex; align-items: center; justify-content: center; padding: 4rem 1.5rem; min-width: 0; }
@media (min-width: 768px) { .theme-cta-band__panel { padding: 6rem 4rem; } }
.theme-cta-band__inner { max-width: 28rem; width: 100%; text-align: center; min-width: 0; }
.theme-cta-band__inner p { color: color-mix(in srgb, var(--accent-foreground) 90%, transparent); line-height: 1.7; margin: 1.5rem 0 2.5rem; }
.theme-cta-band__actions { display: flex; flex-direction: column; gap: 1rem; align-items: center; }
@media (min-width: 640px) { .theme-cta-band__actions { flex-direction: row; justify-content: center; } }

/* ---------------------------------------------------------------------
   Footer — parity with Lovable: container-wide py-16 lg:py-20
   ------------------------------------------------------------------- */
.site-footer { border-top: 1px solid var(--border); background: var(--butter); }
.site-footer__inner { padding-top: 4rem; padding-bottom: 4rem; }
@media (min-width: 1024px) {
	.site-footer__inner { padding-top: 5rem; padding-bottom: 5rem; }
}
/* Brand: gap-6 mb-12 pb-10 */
.site-footer__brand {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	margin-bottom: 3rem;
	padding-bottom: 2.5rem;
	border-bottom: 1px solid var(--border);
}
@media (min-width: 640px) {
	.site-footer__brand {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}
}
.site-footer__logo { flex-shrink: 0; }
.site-footer__logo-img { height: 7rem; width: auto; object-fit: contain; }
@media (min-width: 640px) { .site-footer__logo-img { height: 8rem; } }
.site-footer__tagline { max-width: 36rem; }
@media (min-width: 640px) { .site-footer__tagline { text-align: right; } }
.site-footer__tagline p {
	font-size: 0.875rem;
	color: color-mix(in srgb, var(--foreground) 70%, transparent);
	line-height: 1.625;
	margin: 0;
	font-family: var(--font-body);
}
.site-footer__contact-line { margin-top: 0.75rem; }
.site-footer__contact-line a {
	color: color-mix(in srgb, var(--foreground) 70%, transparent);
	transition: color 0.2s ease;
}
.site-footer__contact-line a:hover { color: var(--foreground); }
.site-footer__contact-line .dot { margin: 0 0.5rem; color: color-mix(in srgb, var(--foreground) 40%, transparent); }
/* Columns: grid-cols-2 md:grid-cols-4 gap-10 lg:gap-12 */
.site-footer__columns {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2.5rem;
}
@media (min-width: 768px) {
	.site-footer__columns { grid-template-columns: repeat(4, 1fr); }
}
@media (min-width: 1024px) {
	.site-footer__columns { gap: 3rem; }
}
.site-footer__col--reach { grid-column: span 2; }
@media (min-width: 768px) { .site-footer__col--reach { grid-column: span 1; } }
.site-footer__col h3 {
	font-family: var(--font-display);
	font-weight: 400;
	font-size: 1.5rem;
	line-height: 1.25;
	color: var(--foreground);
	margin: 0 0 1.25rem;
}
.site-footer__col ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.site-footer__col a,
.site-footer__col li {
	font-size: 0.875rem;
	font-family: var(--font-body);
	color: color-mix(in srgb, var(--foreground) 70%, transparent);
	line-height: 1.5;
}
.site-footer__col a {
	display: inline-block;
	text-align: left;
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	transition: color 0.2s ease;
}
.site-footer__col a:hover { color: var(--foreground); }
.site-footer__col--reach li {
	color: color-mix(in srgb, var(--foreground) 70%, transparent);
}
.site-footer__col--reach li a {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: color-mix(in srgb, var(--foreground) 80%, transparent);
}
.site-footer__col--reach li span {
	color: var(--foreground);
}
.site-footer__col p {
	font-size: 0.875rem;
	font-family: var(--font-body);
	color: color-mix(in srgb, var(--foreground) 70%, transparent);
	margin: 0 0 1.25rem;
	line-height: 1.625;
}
/* Bottom: mt-14 pt-6 gap-3 */
.site-footer__bottom {
	margin-top: 3.5rem;
	padding-top: 1.5rem;
	border-top: 1px solid var(--border);
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	align-items: center;
	text-align: center;
}
@media (min-width: 640px) {
	.site-footer__bottom {
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		text-align: left;
	}
}
.site-footer__quote {
	font-size: 0.75rem;
	color: var(--nopal);
	font-family: var(--font-display);
	font-style: italic;
	letter-spacing: 0.025em;
	margin: 0;
}
.site-footer__credit {
	font-size: 0.75rem;
	font-family: var(--font-body);
	color: var(--muted-foreground);
	letter-spacing: 0.025em;
	margin: 0;
}
.site-footer__credit a {
	text-decoration: underline;
	color: inherit;
	transition: color 0.2s ease;
}
.site-footer__credit a:hover { color: var(--foreground); }

/* ---------------------------------------------------------------------
   Cart drawer & overlay — Section 12
   ------------------------------------------------------------------- */
#theme-cart-overlay { position: fixed; inset: 0; z-index: 55; background: color-mix(in srgb, var(--foreground) 20%, transparent); opacity: 0; pointer-events: none; transition: opacity 0.3s ease; }
body.cart-open #theme-cart-overlay { opacity: 1; pointer-events: auto; }
#theme-cart-drawer {
	position: fixed; right: 0; top: 0; height: 100%; width: 100%; max-width: 26rem;
	background: var(--background); z-index: 56; box-shadow: var(--shadow-elevated);
	display: flex; flex-direction: column; transform: translateX(100%); transition: transform 0.35s var(--transition-smooth);
}
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__header h2 { font-size: 1.15rem; }
.theme-cart-drawer__close:hover { opacity: 0.6; }
.theme-cart-drawer__empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 1.5rem; text-align: center; gap: 1rem; }
.theme-cart-drawer__empty svg { color: color-mix(in srgb, var(--foreground) 45%, transparent); }
.theme-cart-drawer__items { flex: 1; overflow-y: auto; padding: 1.5rem; display: flex; flex-direction: column; gap: 1.5rem; }
.theme-cart-item { display: flex; gap: 1rem; }
.theme-cart-item__image { width: 5rem; height: 6rem; flex-shrink: 0; overflow: hidden; border-radius: 0.5rem; background: var(--card); }
.theme-cart-item__image img { width: 100%; height: 100%; object-fit: cover; }
.theme-cart-item__info { flex: 1; min-width: 0; }
.theme-cart-item__name { font-size: 0.875rem; font-weight: 500; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.theme-cart-item__price { font-size: 0.875rem; color: color-mix(in srgb, var(--foreground) 65%, transparent); margin: 0.15rem 0 0; }
.theme-cart-item__variation { font-size: 0.75rem; color: color-mix(in srgb, var(--foreground) 55%, transparent); margin-top: 0.25rem; }
.theme-cart-item__controls { display: flex; align-items: center; gap: 0.6rem; margin-top: 0.75rem; }
.theme-cart-item__controls .theme-qty-minus, .theme-cart-item__controls .theme-qty-plus { padding: 0.25rem; border-radius: 0.25rem; }
.theme-cart-item__controls .theme-qty-minus:hover, .theme-cart-item__controls .theme-qty-plus:hover { background: var(--card); }
.theme-cart-item__qty { font-size: 0.875rem; width: 1.5rem; text-align: center; }
.theme-cart-item__remove { margin-left: auto; font-size: 0.8125rem; color: color-mix(in srgb, var(--foreground) 60%, transparent); }
.theme-cart-item__remove:hover { color: var(--foreground); }
.theme-cart-drawer__footer { padding: 1.5rem; border-top: 1px solid var(--border); display: flex; flex-direction: column; gap: 1rem; }
.theme-cart-drawer__subtotal { display: flex; justify-content: space-between; font-size: 0.875rem; }
.theme-cart-drawer__subtotal span:last-child { font-weight: 600; }
.theme-cart-drawer__note { font-size: 0.8125rem; color: color-mix(in srgb, var(--foreground) 60%, transparent); margin: 0; }

/* ---------------------------------------------------------------------
   Contact modal — Section 9
   ------------------------------------------------------------------- */
#theme-contact-overlay { position: fixed; inset: 0; z-index: 65; background: rgba(0,0,0,0.8); opacity: 0; pointer-events: none; transition: opacity 0.3s ease; }
#theme-contact-overlay.is-visible { opacity: 1; pointer-events: auto; }
#theme-contact-modal { position: fixed; inset: 0; z-index: 66; display: flex; align-items: center; justify-content: center; padding: 1rem; box-sizing: border-box; }
@media (min-width: 480px) {
	#theme-contact-modal { padding: 1.5rem; }
}
#theme-contact-modal[hidden] { display: none !important; }
body.contact-modal-open { overflow: hidden; }
.theme-contact-modal__panel {
	position: relative;
	width: 100%;
	max-width: 32rem;
	max-height: 90vh;
	overflow-y: auto;
	background: var(--background);
	border-radius: 1rem;
	padding: 1.5rem;
	box-shadow: var(--shadow-elevated);
	box-sizing: border-box;
}
@media (min-width: 480px) {
	.theme-contact-modal__panel { padding: 2.5rem; }
}
.theme-contact-modal__close { position: absolute; top: 1.25rem; right: 1.25rem; padding: 0.4rem; }
.theme-contact-modal__title { font-size: 1.5rem; margin-bottom: 0.5rem; }
.theme-contact-modal__desc { color: color-mix(in srgb, var(--foreground) 65%, transparent); font-size: 0.9375rem; line-height: 1.6; margin: 0 0 1.25rem; }
.theme-contact-modal__reach { display: flex; flex-wrap: wrap; gap: 1rem; font-size: 0.875rem; color: color-mix(in srgb, var(--foreground) 65%, transparent); margin-bottom: 1.5rem; }
.theme-contact-modal__reach a:hover { color: var(--foreground); }
.theme-contact-form__row { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 480px) { .theme-contact-form__row { grid-template-columns: 1fr 1fr; } }
.theme-contact-form__field { margin-bottom: 1rem; }
.theme-contact-form__field label { display: block; font-size: 0.875rem; font-weight: 500; margin-bottom: 0.4rem; }
.theme-contact-form__field input, .theme-contact-form__field textarea {
	width: 100%; padding: 0.65rem 0.75rem; background: var(--background); border: 1px solid var(--border); border-radius: var(--radius-md);
	outline: none; transition: box-shadow 0.2s ease;
}
.theme-contact-form__field textarea { resize: none; }
.theme-contact-form__field input:focus, .theme-contact-form__field textarea:focus { box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 40%, transparent); }
.theme-contact-form__actions { display: flex; justify-content: flex-end; }
.theme-contact-form__success { text-align: center; padding: 2rem 0; }
.theme-contact-form__success-icon { width: 3.5rem; height: 3.5rem; background: var(--primary); color: var(--primary-foreground); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 1rem; }

/* ---------------------------------------------------------------------
   Single product page — Section 11, 11.13
   ------------------------------------------------------------------- */
.single-product-main { padding: 1.5rem 0 6rem; }
.theme-breadcrumb { padding: 1.5rem 0; font-size: 0.8125rem; letter-spacing: 0.2em; text-transform: uppercase; color: color-mix(in srgb, var(--foreground) 60%, transparent); }
.theme-breadcrumb a:hover { color: var(--foreground); }
.theme-breadcrumb__sep { margin: 0 0.5rem; opacity: 0.5; }
.theme-breadcrumb__current { color: var(--foreground); }

.theme-product-layout { display: grid; grid-template-columns: 1fr; gap: 2.5rem; align-items: start; min-width: 0; }
@media (min-width: 1024px) { .theme-product-layout { grid-template-columns: 7fr 5fr; gap: 4rem; } }
.theme-product-gallery, .theme-product-info { min-width: 0; max-width: 100%; }

.theme-product-gallery__mobile { display: block; }
@media (min-width: 1024px) { .theme-product-gallery__mobile { display: none; } }
.theme-product-main-image-wrap { position: relative; aspect-ratio: 1/1; overflow: hidden; border-radius: var(--radius-lg); background: var(--card); margin-bottom: 1rem; }
.theme-product-thumbnails { display: flex; flex-wrap: wrap; gap: 0.75rem; max-width: 100%; overflow-x: auto; }
@media (min-width: 1024px) { .theme-product-thumbnails--stack { flex-direction: column; } }
.theme-product-thumb { position: relative; width: 5rem; height: 5rem; flex-shrink: 0; overflow: hidden; border-radius: 0.6rem; background: var(--card); opacity: 0.65; transition: opacity 0.2s ease; }
@media (min-width: 1024px) { .theme-product-thumb { width: 100%; height: auto; aspect-ratio: 1/1; opacity: 1; } }
.theme-product-thumb.is-active { opacity: 1; box-shadow: 0 0 0 2px var(--foreground); }
@media (min-width: 1024px) { .theme-product-thumb:not(.is-active) { display: none; } }

.theme-product-info__category { font-size: 0.8125rem; letter-spacing: 0.25em; text-transform: uppercase; color: var(--muted-foreground); font-family: var(--font-body); }
.product-title {
	font-family: var(--font-display); font-weight: 400; font-size: 1.875rem; line-height: 1.1;
	margin: 0.75rem 0 1.25rem; letter-spacing: -0.015em;
}
@media (min-width: 768px) { .product-title { font-size: 2.25rem; } }
@media (min-width: 1024px) { .product-title { font-size: 2.75rem; } }
.theme-product-info__price { font-size: 1.25rem; margin-bottom: 1.5rem; font-family: var(--font-body); }
.theme-stock-indicator--out { font-size: 0.875rem; color: var(--rosa); font-weight: 600; margin-bottom: 1.5rem; }

.theme-quantity-wrapper { display: inline-flex; align-items: center; border: 1px solid var(--border); border-radius: var(--radius-full); margin-bottom: 1rem; }
.theme-qty-minus, .theme-qty-plus { padding: 0.6rem 0.9rem; transition: background-color 0.2s ease; }
.theme-qty-minus:hover, .theme-qty-plus:hover { background: var(--card); }
.theme-qty-input { width: 3rem; text-align: center; border: none; background: transparent; padding: 0.6rem 0; -moz-appearance: textfield; }
.theme-qty-input::-webkit-outer-spin-button, .theme-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

.single-product .theme-add-to-cart-area, .theme-add-to-cart-area {
	display: flex; align-items: stretch; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 1rem;
}
.single-product .single_add_to_cart_button { flex: 1 1 auto; min-width: 160px; }

.theme-product-accordions { margin-top: 2rem; border-top: 1px solid var(--border); }
.theme-accordion { border-bottom: 1px solid var(--border); }
.theme-accordion__trigger { width: 100%; display: flex; align-items: center; justify-content: space-between; padding: 1.15rem 0; text-align: left; font-size: 0.8125rem; letter-spacing: 0.22em; text-transform: uppercase; }
.theme-accordion__chevron { transition: transform 0.2s ease; }
.theme-accordion.is-open .theme-accordion__chevron { transform: rotate(180deg); }
.theme-accordion__panel { display: none; padding-bottom: 1.5rem; color: color-mix(in srgb, var(--foreground) 70%, transparent); font-size: 0.9375rem; line-height: 1.7; }
.theme-accordion.is-open .theme-accordion__panel { display: block; }
.single-product .woocommerce-product-details__short-description,
.single-product .woocommerce-variation-description,
.single-product .posted_in { overflow-wrap: break-word; word-break: break-word; }

/* Variations table layout */
.single-product .variations.shop_attributes tbody,
.single-product .variations tbody tr,
.single-product .variations tbody td { display: block; width: 100%; }
.single-product .variations tbody td.label { padding-bottom: 0.25rem; font-weight: 600; }
.single-product .variations tbody td.value { padding-top: 0; }
.theme-attr-select-hidden { display: none !important; }
.theme-variation-pills { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.theme-variation-pills button { padding: 0.5rem 1rem; border: 1px solid var(--border); border-radius: var(--radius-full); font-size: 0.8125rem; }
.theme-variation-pills button.is-selected { border-color: var(--foreground); background: color-mix(in srgb, var(--foreground) 6%, transparent); }

.theme-related-products { padding: 5rem 0 0; border-top: 1px solid var(--border); margin-top: 5rem; }
.theme-related-products .reveal-item { opacity: 1 !important; transform: none !important; }
.theme-related-products__heading { text-align: center; margin-bottom: 3rem; }
.theme-related-products__kicker { font-family: var(--font-display); font-style: italic; font-size: 1rem; color: var(--muted-foreground); margin-bottom: 0.5rem; display: block; }
.theme-related-products__heading h2 { font-family: var(--font-display); font-weight: 400; font-size: 1.875rem; }
@media (min-width: 768px) { .theme-related-products__heading h2 { font-size: 2.25rem; } }

/* ---------------------------------------------------------------------
   Checkout Block — Section 13
   Frontend parity for WooCommerce Checkout block (not editor chrome).
   ------------------------------------------------------------------- */
body.woocommerce-checkout .site-main,
body.woocommerce-checkout .page-generic,
body.woocommerce-checkout .page-generic--checkout,
body.woocommerce-checkout .entry-content,
body.woocommerce-checkout .entry-content--checkout,
body.woocommerce-checkout article,
body.woocommerce-checkout #page-content {
	max-width: none !important;
	width: 100%;
	box-sizing: border-box;
}

body.woocommerce-checkout .site-main.page-generic--checkout {
	padding: 4rem 0 5rem;
}

body.woocommerce-checkout .page-title--checkout {
	max-width: 1280px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1.5rem;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	box-sizing: border-box;
}

/* Checkout container: desired width, centered */
body.woocommerce-checkout .wp-block-woocommerce-checkout,
body.woocommerce-checkout .wc-block-checkout,
.entry-content .wp-block-woocommerce-checkout,
.entry-content .wc-block-checkout {
	max-width: 1280px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	box-sizing: border-box;
}

/* Notices: same width/alignment as main checkout content */
body.woocommerce-checkout .wc-block-components-notices,
body.woocommerce-checkout .wp-block-woocommerce-checkout .wc-block-components-notices,
.entry-content .wc-block-checkout .wc-block-components-notices {
	max-width: 1280px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
}

/* Real 2-col layout: sidebar-layout wrappers (not only .wc-block-checkout) */
body.woocommerce-checkout .wc-block-components-sidebar-layout,
body.woocommerce-checkout .wc-block-checkout-sidebar-layout,
body.woocommerce-checkout .wc-block-components-sidebar-layout.wc-block-checkout,
.entry-content .wc-block-checkout .wc-block-components-sidebar-layout,
.entry-content .wc-block-checkout .wc-block-checkout-sidebar-layout {
	display: grid !important;
	grid-template-columns: 1fr !important;
	gap: 1.5rem !important;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	align-items: start;
}

body.woocommerce-checkout .wc-block-components-sidebar-layout > *,
body.woocommerce-checkout .wc-block-checkout-sidebar-layout > *,
.entry-content .wc-block-checkout .wc-block-components-sidebar-layout > *,
.entry-content .wc-block-checkout .wc-block-checkout-sidebar-layout > * {
	width: 100% !important;
	min-width: 0 !important;
	max-width: 100% !important;
	box-sizing: border-box;
	margin: 0 !important;
	flex: none !important;
}

/* First child (notices) spans full width */
body.woocommerce-checkout .wc-block-components-sidebar-layout > .wc-block-components-notices,
body.woocommerce-checkout .wc-block-checkout-sidebar-layout > .wc-block-components-notices,
body.woocommerce-checkout .wc-block-components-sidebar-layout > *:first-child,
body.woocommerce-checkout .wc-block-checkout-sidebar-layout > *:first-child,
.entry-content .wc-block-checkout .wc-block-components-sidebar-layout > .wc-block-components-notices,
.entry-content .wc-block-checkout .wc-block-checkout-sidebar-layout > .wc-block-components-notices,
.entry-content .wc-block-checkout .wc-block-components-sidebar-layout > *:first-child,
.entry-content .wc-block-checkout .wc-block-checkout-sidebar-layout > *:first-child {
	grid-column: 1 / -1;
	order: 1;
}

body.woocommerce-checkout .wc-block-checkout__main,
body.woocommerce-checkout .wc-block-components-main,
.entry-content .wc-block-checkout .wc-block-checkout__main,
.entry-content .wc-block-checkout .wc-block-components-main {
	order: 2;
	min-width: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box;
}

body.woocommerce-checkout .wc-block-checkout__sidebar,
body.woocommerce-checkout .wc-block-components-sidebar,
.entry-content .wc-block-checkout .wc-block-checkout__sidebar,
.entry-content .wc-block-checkout .wc-block-components-sidebar {
	order: 3;
	min-width: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box;
}

body.woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block,
.entry-content .wc-block-checkout .wp-block-woocommerce-checkout-order-summary-block {
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box;
}

@media (min-width: 782px) {
	body.woocommerce-checkout .wc-block-components-sidebar-layout,
	body.woocommerce-checkout .wc-block-checkout-sidebar-layout,
	body.woocommerce-checkout .wc-block-components-sidebar-layout.wc-block-checkout,
	.entry-content .wc-block-checkout .wc-block-components-sidebar-layout,
	.entry-content .wc-block-checkout .wc-block-checkout-sidebar-layout {
		grid-template-columns: 1fr minmax(360px, 400px) !important;
		gap: 1.5rem !important;
	}

	body.woocommerce-checkout .wc-block-checkout__sidebar,
	body.woocommerce-checkout .wc-block-components-sidebar,
	.entry-content .wc-block-checkout .wc-block-checkout__sidebar,
	.entry-content .wc-block-checkout .wc-block-components-sidebar {
		min-width: 360px !important;
	}
}

body.woocommerce-checkout .wc-block-components-text-input input,
body.woocommerce-checkout .wc-block-components-select select {
	width: 100% !important;
	max-width: none !important;
	border: 1px solid var(--border);
	border-radius: var(--radius-md);
	font-family: var(--font-body);
}
body.woocommerce-checkout .wc-block-components-text-input input:focus,
body.woocommerce-checkout .wc-block-components-select select:focus {
	outline: none;
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 40%, transparent);
}
body.woocommerce-checkout .wc-block-components-checkout-place-order-button {
	background: var(--primary) !important;
	color: var(--primary-foreground) !important;
	border-radius: var(--btn-radius) !important;
	border: none !important;
}
body.woocommerce-checkout .wc-block-components-notice-banner {
	border-radius: var(--radius-md);
}
body.woocommerce-checkout .wc-block-checkout__sidebar,
body.woocommerce-checkout .wc-block-components-sidebar {
	background-color: var(--card);
	border-radius: var(--radius-lg);
	padding: 2rem;
}

/* ---------------------------------------------------------------------
   Thank you / order-received — Section 22.8
   ------------------------------------------------------------------- */
body.theme-thankyou-page { overflow-x: hidden; }
body.theme-thankyou-page .site-main { padding-top: 3rem; padding-bottom: 5rem; }
body.theme-thankyou-page .woocommerce-order-details table { width: 100%; table-layout: fixed; }
body.theme-thankyou-page .woocommerce-order h2,
body.theme-thankyou-page .woocommerce-order-details__title { font-size: 1.5rem; padding: 0 0 1rem 0; }
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; border: 1px solid var(--border); border-radius: var(--radius-md); padding: 1.25rem; }

/* ---------------------------------------------------------------------
   404
   ------------------------------------------------------------------- */
.theme-404 { background: color-mix(in srgb, var(--border) 55%, var(--background)); }
.theme-404__inner { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 1rem; padding: 4rem 0; }
.theme-404__inner h1 { font-size: 2.25rem; font-weight: 700; font-family: var(--font-body); margin-bottom: 0; }
.theme-404__inner p { font-size: 1.25rem; color: var(--muted-foreground); margin: 0 0 1rem; }
.theme-404__inner a { color: var(--primary); text-decoration: underline; }
.theme-404__inner a:hover { opacity: 0.9; }

/* ---------------------------------------------------------------------
   Generic pages
   ------------------------------------------------------------------- */
.page-generic { padding: 4rem 0 5rem; }
.page-title { font-size: 2rem; margin-bottom: 1.5rem; }
.entry-content { line-height: 1.75; }